비디오 기본 가이드

이 화면은 비디오 컴포넌트에 대한 샘플 화면이다.

오디오 컴포넌트는 HTML5 video 태그를 이용한 컴포넌트이다.

관련 속성으로 show_controls, source, default_source_usage, volumn, muted, auto_play, source, click_setfocus, alt가 있다.

관련 API로 play, pause, stop, getautoplay, setautoplay, getautoreplay, setautoreplay, requestfullscreen, getvolume, setvolume, getsource, setsource,

getduration, getplaybackrate, setplaybackrate가 있다.

관련 이벤트로 on_click, on_dblclick, on_play, on_ended, on_pause, on_timeupdate, on_loadeddata가 있다.

템플릿 위치: /HTML5/COMPONENT/VIDEO/video_basic

템플릿 파일

• video_basic.xml
• video_basic.js
• 새창으로 실행

// 화면 로드 이벤트
function screen_on_load()
{
	// 소리 크기 프로그래스바 위치 설정
	this.pbVolume.setpos(this.video.getvolume());

	// 재생 위치 프로그래스바 위치 설정
	this.pbProgress.setpos(0);

	// 비디오 파일 URL 표시
	this.fld_source.settext(this.video.getsource());
}

/////////////////////////////////////////////////////////////////////////////
// 비디오 컴포넌트 이벤트 시작
/////////////////////////////////////////////////////////////////////////////
// 비디오 재생 시작 이벤트
function video_on_play(objInst)
{
	this.txtPlayStatus.settext("재생");
}

// 비디오 재생 완료 이벤트
function video_on_ended(objInst)
{
	this.txtPlayStatus.settext("종료");
	this.pbProgress.setpos(100, false);
}

// 비디오 재생 멈춤 이벤트
function video_on_pause(objInst)
{
	this.txtPlayStatus.settext("멈춤");
}

// 비디오 재생 시간 갱신 이벤트
function video_on_timeupdate(objInst, current_time)
{
	var duration;

	duration = this.fld_duration.gettext();

	this.pbProgress.setpos(Math.round(current_time / duration * 100), false);
}

// 비디오 데이터 로드 완료 이벤트
function video_on_loadeddata(objInst)
{
	this.fld_duration.settext(this.video.getduration());
	this.txtPlayStatus.settext("재생 준비 완료");
}

// 비디오 클릭 이벤트
function video_on_click(objInst)
{
	screen.alert("video_on_click");
}

// 비디오 더블클릭 이벤트
function video_on_dblclick(objInst)
{
	screen.alert("video_on_dblclick");
}
/////////////////////////////////////////////////////////////////////////////
// 비디오 컴포넌트 이벤트 끝
/////////////////////////////////////////////////////////////////////////////

// 재생 버튼 이벤트
function btnPlay_on_mouseup(objInst)
{
	this.video.play();
}

// 멈춤 버튼 이벤트
function btnPause_on_mouseup(objInst)
{
	this.video.pause();
}

// 중지 버튼 이벤트
function btnStop_on_mouseup(objInst)
{
	this.video.stop();
}

//
function btnSetAutoPlay_on_mouseup(objInst)
{
	this.video.setautoplay(true);
}

function btnSetAutoPlayFalse_on_mouseup(objInst)
{
	this.video.setautoplay(false);
}

function btnGetAutoPlay_on_mouseup(objInst)
{
	alert(this.video.getautoplay());
}

function btnSetAutoReplay_on_mouseup(objInst)
{
	this.video.setautoreplay(true);
}

function btnSetAutoReplayFalse_on_mouseup(objInst)
{
	this.video.setautoreplay(false);
}

function btnGetAutoReplay_on_mouseup(objInst)
{
	alert(this.video.getautoreplay(true));
}

// 소리 줄임 버튼 이벤트
function btnTurnDown_on_mouseup(objInst)
{
	var audio_volume;
	audio_volume = this.audio.getvolume() - 10;
	this.pbVolume.setpos(audio_volume);
	this.video.setvolume(audio_volume);
}

// 소리 키움 버튼 이벤트
function btnTurnUp_on_mouseup(objInst)
{
	var audio_volume;
	audio_volume = this.audio.getvolume() + 10;
	this.pbVolume.setpos(audio_volume);
	this.video.setvolume(audio_volume);
}

// 전체 화면 재생 버튼 이벤트
function btnRequestFullScreen_on_mouseup(objInst)
{
	this.video.requestfullscreen();
}

// "0.5X" 버튼 이벤트
function btnPlayRate0_on_click(objInst)
{
	this.video.setplaybackrate(0.5);
}

// "1.0X" 버튼 이벤트
function btnPlayRate1_on_click(objInst)
{
	this.video.setplaybackrate(1);
}

// "2.0X" 버튼 이벤트
function btnPlayRate2_on_click(objInst)
{
	this.video.setplaybackrate(2);
}