/**
* @file 텍스트-트랙-메뉴-item.js
*/
'../../menu/menu-item.js'에서 MenuItem 가져오기;
'../../component.js'에서 컴포넌트 가져오기;
'글로벌/창'에서 창 가져오기;
'글로벌/문서'에서 문서 가져오기;
/**
* 텍스트 트랙 종류 내에서 언어를 선택하기 위한 특정 메뉴 항목 유형
*
* @extends 메뉴 항목
*/
클래스 TextTrackMenuItem은 MenuItem {를 확장합니다.
/**
* 이 클래스의 인스턴스를 만듭니다.
*
* @param {플레이어} 플레이어
* 이 클래스가 연결되어야 하는 `Player`.
*
* @param {객체} [옵션]
* 플레이어 옵션의 키/값 저장소.
*/
생성자(플레이어, 옵션) {
const track = options.track;
const 트랙 = player.textTracks();
// 상위 MenuItem 클래스의 init에 대한 옵션을 수정합니다.
options.label = track.label || 트랙.언어 || '알려지지 않은';
options.selected = track.mode === '표시';
super(플레이어, 옵션);
this.track = 트랙;
// 이 구성 요소 및 필터에 대한 관련 트랙 종류를 결정합니다.
// 빈 종류를 출력합니다.
this.kinds = (options.kinds || [options.kind || this.track.kind]).filter(Boolean);
const changeHandler = (...인수) => {
this.handleTracksChange.apply(this, args);
};
const selectedLanguageChangeHandler = (...인수) => {
this.handleSelectedLanguageChange.apply(this, args);
};
player.on(['loadstart', 'texttrackchange'], changeHandler);
tracks.addEventListener('변경', changeHandler);
tracks.addEventListener('selectedlanguagechange', selectedLanguageChangeHandler);
this.on('처리', function() {
player.off(['loadstart', 'texttrackchange'], changeHandler);
tracks.removeEventListener('변경', changeHandler);
tracks.removeEventListener('selectedlanguagechange', selectedLanguageChangeHandler);
});
// iOS7은 변경 이벤트를 TextTrackLists에 전달하지 않습니다.
// 연결된 트랙의 모드가 변경됩니다. 같은 것 없이
// Object.observe()(iOS7에도 없음),
// mode 속성 및 polyfill에 대한 변경 사항 감지 가능
// 변경 이벤트. 불량품 대체품으로 수동 발송합니다.
// 컨트롤이 모드를 수정할 때마다 이벤트를 변경합니다.
if (tracks.onchange === 정의되지 않음) {
이벤트하자;
this.on(['탭', '클릭'], function() {
if (window.Event 유형 !== '개체') {
// Android 2.3은 window.Event에 대해 Illegal Constructor 오류를 발생시킵니다.
{
event = new window.Event('변경');
} 잡기(오류) {
// 에러와 상관없이 계속
}
}
경우 (! 이벤트) {
event = document.createEvent('이벤트');
event.initEvent('변경', 참, 참);
}
tracks.dispatchEvent(이벤트);
});
}
// 현재 트랙을 기반으로 기본 상태를 설정합니다.
this.handleTracksChange();
}
/**
* 이것은 `TextTrackMenuItem`이 "클릭"될 때 호출됩니다. 보다
* {@link ClickableComponent}에서 클릭이 무엇인지 자세히 알아보세요.
*
* @param {EventTarget~Event} 이벤트
* 이 함수를 실행하게 만든 `keydown`, `tap` 또는 `click` 이벤트
* 라고 불리는.
*
* @listens 탭
* @듣기 클릭
*/
handleClick(이벤트) {
const referenceTrack = this.track;
const 트랙 = this.player_.textTracks();
super.handleClick(event);
if (!트랙) {
반품;
}
에 대한 (하자 i = 0; i < 트랙.길이; i++) {
const 트랙 = 트랙[i];
// 텍스트 트랙 목록의 트랙이 올바른 종류가 아닌 경우
// 그냥 넘어가. 호환되지 않는 종류의 트랙에 영향을 미치고 싶지 않습니다.
if (this.kinds.indexOf(track.kind) === -1) {
계속하다;
}
// 이 텍스트 트랙이 구성 요소의 트랙이고 표시되지 않는 경우
// 표시되도록 설정합니다.
if (트랙 === referenceTrack) {
if (track.mode !== '표시') {
track.mode = '표시';
}
// 이 텍스트 트랙이 컴포넌트의 트랙이 아니고
// 비활성화, 비활성화로 설정합니다.
} 그렇지 않으면 (track.mode !== '비활성화됨') {
track.mode = '비활성화됨';
}
}
}
/**
* 텍스트 트랙 목록 변경 처리
*
* @param {EventTarget~Event} 이벤트
* 이 함수를 호출한 `change` 이벤트.
*
* @listens TextTrackList#change
*/
handleTracksChange(이벤트) {
const shouldBeSelected = this.track.mode === '표시';
// 불필요한 selected() 호출을 방지합니다.
// 추가된 제어 텍스트를 불필요하게 읽는 스크린 리더
if (shouldBeSelected !== this.isSelected_) {
this.selected(shouldBeSelected);
}
}
handleSelectedLanguageChange(이벤트) {
if (this.track.mode === '표시') {
const selectedLanguage = this.player_.cache_.selectedLanguage;
// 동일한 언어에서 트랙의 종류를 교체하지 마십시오.
if (선택된 언어 && selectedLanguage.enabled &&
selectedLanguage.language === this.track.language &&
selectedLanguage.kind !== this.track.kind) {
반품;
}
this.player_.cache_.selectedLanguage = {
활성화: 참,
언어: this.track.language,
종류: this.track.kind
};
}
}
폐기() {
// 처분할 때 추적 객체에 대한 참조를 제거합니다.
this.track = null;
super.dispose();
}
}
Component.registerComponent('TextTrackMenuItem', TextTrackMenuItem);
기본 TextTrackMenuItem 내보내기;