Page History
...
응용 웹 콘텐츠 요소 기본 구조
Stylesheet class screen 
- ContentApi: LFD 콘텐츠 내 페이지(page)와 페이지의 이미지, 텍스트 및 비디오 요소 속성을 변경하거나 가져올 수 있습니다.
- LocalApi: 응용 웹 콘텐츠 요소가 실행되는 로컬(Local)환경의 정보를 가져올 수 있습니다.
- DeviceApi: W Player, Tizen 등 기기(Device) 관련 정보를 가져올 수 있습니다.
- UtilityApi: 응용 웹 콘텐츠 요소 개발용 유틸리티들을 사용할 수 있습니다.
- Event CallBack: 응용 웹 콘텐츠 요소의 수명 주기 이벤트, 데이터링크(datalink) 및 외부 소스로부터 전달되는 데이터를 수신하는 콜백(Callback) 함수를 제공합니다.
응용 웹 콘텐츠 요소 수명 주기
응용 웹 콘텐츠 요소는 다음 수명 주기를 가지며 각 상태 진입 시점을 callback으로 전달받을 수 있습니다. Ready와 Play 상태를 활용하면 원활하게 재생할 수 있습니다.
Stylesheet class screen 
Ready: 페이지(Page) 내의 모든 요소를 모두 로드(Load)하면 응용 웹 콘텐츠 요소가 W Player API를 사용할 수 있는 시점을 전달합니다. 응용 웹 콘텐츠 요소는 iframe 형태로 로드(Load)하며 화면에 표시하기 전 상태(Back Page Layer, 현재 화면에는 이전 콘텐츠를 재생하고 있는 상태)입니다. 화면에 나타나기 전에 필요한 초기화를 진행할 수 있습니다.
Play: 응용 웹 콘텐츠 요소가 화면에 표시되는 시점(Front Page layer)을 전달합니다.
- Page Changed: 재생 중 페이지가 전환되는 시점을 전달합니다. (단, 웹 콘텐츠가 공통 페이지에 속해 있을 경우에만 동작합니다.)
- Stop: 응용 웹 콘텐츠 요소가 종료되기 전 시점을 전달합니다. 응용 웹 콘텐츠 요소 내에 사용된 리소스를 반환할 수 있습니다. (예: clearInterval, clearTimeout, $wp = null)
Warning title 주의 정상적으로 반환되지 않은 리소스에서 메모리 누수가 발생하면, W Player 재생이 영향을 받을 수 있습니다.
- Web Author에서 저작 시 ‘Sync Timeline’ 옵션 설정을 통해 화면 표시 시점(Play 상태)에 load와 play를 순차적으로 실행할 수 있고 화면 표시 이후에는 Ready, Play 및 Stop 상태가 전달됩니다.(다만, 로드 수행 시 깜박임이 발생할 수 있습니다.)
Tutorials
...
시작하기
Step 1 = Set Up
라이브러리 다운로드
W Player API lib를 다운로드하세요.
Web Author에서 웹 콘텐츠 속성 설정하기
W Player API 사용을 위해 필요한 웹 콘텐츠 요소에 대한 설정을 수행하세요.
Step 2 = Code 작성
제공되는 W Player API로 다양한 응용 웹 콘텐츠 요소 구현용 code를 작성하세요.
Step 3 = 업로드 및 미리 보기(Preview) (UDP 시뮬레이션 포함)
Step 4 = 스케줄 배포(로그 수집)
W Player API Reference
...
$wp
$wp는 W Player API의 모든 인터페이스 (content, device, local, utility, callback)를 포함하는 네임스페이스(Namespace)입니다.
setDefaultCallback()
- 설명: W Player로부터 이벤트(Event)를 전달받는 리스너(Listener)를 추가할 수 있습니다. Life cycle에 대한 상태 이벤트를 수신하기 위해서는 초기 생성 단계에 추가가 필요합니다.
- 구문: function setDefaultCallback (myFunction(object));
- 파라미터: myFunction(object): 이벤트(Event)는 콜백(Callback)을 통해 다음과 같은 객체(Object) 형태로 전달합니다.
...
반환값
Type: void
코드 예제
$wp.setDefaultCallback(object);
기타
주요 기능 ▶ State event 전달 받기를 참조 하세요.
...
$wp.content
이 인터페이스(Interface)는 W Player에서 현재 로드(Load)된 페이지(Page) 및 요소(Element)를 사용하기 위한 API들을 제공합니다.getPage()
설명
페이지 객체를 리턴(return)합니다.
State 이벤트에서 전달한 id를 W Player API 개발자 가이드로 입력하여 현재 자신이 속해 있는 페이지(Page) 객체를 전달 받습니다.
getElement() 함수를 통해 페이지에 로드된 element를 선택할 수 있습니다.
구문: function getPage(‘pageId’);
파라미터
pageId: State 에서 전달된 id 값
반환값
성공: Page 객체, 실패: 항상 성공
제한 사항
id 값을 입력하지 않거나 잘못된 값이 입력되면, 현재 화면에 재생되는 page 객체가 전달됩니다.
코드 예제
$wp.content.getPage(‘pageId’);
기타
$wp.content.getPage(); (id 값을 입력하지 않으면 현재 화면에 재생되는 page 객체가 전달됩니다.)