/**
* @file fullscreen-toggle.js
*/
'../button.js'에서 버튼 가져오기;
'../component.js'에서 컴포넌트 가져오기;
'글로벌/문서'에서 문서 가져오기;
/**
* 전체 화면 비디오 전환
*
* @extends 버튼
*/
클래스 FullscreenToggle 확장 버튼 {
/**
* 이 클래스의 인스턴스를 만듭니다.
*
* @param {플레이어} 플레이어
* 이 클래스가 연결되어야 하는 `Player`.
*
* @param {객체} [옵션]
* 플레이어 옵션의 키/값 저장소.
*/
생성자(플레이어, 옵션) {
super(플레이어, 옵션);
this.on(플레이어, '전체 화면 변경', (e) => this.handleFullscreenChange(e));
if (문서[player.fsApi_.fullscreenEnabled] === 거짓) {
this.disable();
}
}
/**
* 기본 DOM `className`을 빌드합니다.
*
* @return {문자열}
* 이 개체의 DOM `className`입니다.
*/
buildCSSClass() {
`vjs-fullscreen-control ${super.buildCSSClass()}` 반환;
}
/**
* 플레이어에서 전체 화면 변경을 처리하고 이에 따라 제어 텍스트를 변경합니다.
*
* @param {이벤트대상~이벤트} [이벤트]
* 이 기능을 발생시킨 {@link Player#fullscreenchange} 이벤트
* 라고 불리는.
*
* @listens Player#fullscreenchange
*/
handleFullscreenChange(이벤트) {
if (this.player_.isFullscreen()) {
this.controlText('전체화면 아님');
} else {
this.controlText('전체화면');
}
}
/**
* `FullscreenToggle`이 "클릭"될 때 호출됩니다. 보다
* {@link ClickableComponent}에서 클릭이 무엇인지 자세히 알아보세요.
*
* @param {이벤트대상~이벤트} [이벤트]
* 이 함수를 실행하게 만든 `keydown`, `tap` 또는 `click` 이벤트
* 라고 불리는.
*
* @listens 탭
* @듣기 클릭
*/
handleClick(이벤트) {
if (!this.player_.isFullscreen()) {
this.player_.requestFullscreen();
} else {
this.player_.exitFullscreen();
}
}
}
/**
* `FullscreenToggle` 컨트롤 위에 표시되어야 하는 텍스트입니다. 현지화를 위해 추가되었습니다.
*
* @유형 {문자열}
* @사적인
*/
FullscreenToggle.prototype.controlText_ = '전체 화면';
Component.registerComponent('FullscreenToggle', FullscreenToggle);
기본 FullscreenToggle 내보내기;