프로그램 개발서

[JWPlayer] 구간 반복에 사용한 이벤트 순서 본문

Web

[JWPlayer] 구간 반복에 사용한 이벤트 순서

rairen 2017. 9. 17. 04:36

안녕하세요

라이렌입니다.


지난번 게시글에서 JW Player로 구간 반복을 만드는 스크립트를 구성해보았습니다.

이번 시간에는 구간반복 떄 사용한 이벤트를 설명할 것입니다.


우선 첫 번쨰로 setup입니다.

player.setup({});안에 플레이어를 로딩할 때 옵션을 설정할 수 있습니다.


옵션으로는 file, image, mute 등이 있습니다.


file 은 플레이어로 재생시킬 파일이 있을 경우 경로를 지정해주시면 됩니다.

image는 동영상 재생전 미리보기 이미지 설정하는 부분입니다.

mute는 음소거 설정입니다. false면 음소거 안하겠다는 겁니다.

autostart는 자동 재생 시작 옵션.

repeat은 파일 반복 실행입니다. 파일 재생이 끝나면 다시 재생하도록 하는 옵션이지요.

aspectratio는 영상 가로세로 비율입니다.

with와 height로 고정크기를 줄 수 있습니다.

playbackRateControl은 재생속도 설정입니다.

title은 영상 제목을 설정하는데, 재생시작하면 안보입니다. play이벤트로 다시 디스플레이 온시켜주셔야 재생시작후에도 볼 수 있습니다.



두번째 이벤트는 on('time')입니다.

재생시간정보를 얻을 수 있는 이벤트로

console.log롤 함수 내용을 보면 초마다 값을 주는 것을 볼 수 있습니다.

function(e)를 추가하여 e.position으로 재생 위치를 알 수 있습니다.

구간 반복은 여기 함수 안에서 만들어주면 되는 것이죠.

e.position이 일정 시간을 지났을 때 시작지점에서 다시 재생시켜주면됩니다.



여기서 세번째 이벤트가 사용되죠

바로 seek입니다.

player.seek()에 시간을 적어주면 해당 위치에서 영상이 재생됩니다.

단위는 초단위로 보시면 되구요.


네번쨰 이벤트 player.getPostion()입니다.

함수 실행 시 영상재생위치의 시간을 반환합니다.


이것으로 시작지점, 끝지점을 구할 수 있게 되지요


간단하죠?



JW Player API 이벤트 4개면 플레이어 구간반복을 반들 수 있게됩니다.

한번 해보시는 것도 괜찮을 것같습니다.

반응형