/**
* @file 남은 시간-display.js
*/
'./time-display'에서 TimeDisplay 가져오기;
'../../component.js'에서 컴포넌트 가져오기;
import * as Dom from '../../utils/dom.js';
/**
* 영상에 남은 시간 표시
*
* @extends 컴포넌트
*/
RemainingTimeDisplay 클래스는 TimeDisplay {를 확장합니다.
/**
* 이 클래스의 인스턴스를 만듭니다.
*
* @param {플레이어} 플레이어
* 이 클래스가 연결되어야 하는 `Player`.
*
* @param {객체} [옵션]
* 플레이어 옵션의 키/값 저장소.
*/
생성자(플레이어, 옵션) {
super(플레이어, 옵션);
this.on(플레이어, '기간 변경', (e) => this.updateContent(e));
}
/**
* 기본 DOM `className`을 빌드합니다.
*
* @return {문자열}
* 이 개체의 DOM `className`입니다.
*/
buildCSSClass() {
'vjs-남은 시간'을 반환합니다.
}
/**
* 시간 앞에 "마이너스" 문자가 추가된 `Component`의 DOM 요소를 생성합니다.
*
* @return {요소}
* 생성된 요소입니다.
*/
createEl() {
const el = super.createEl();
if (this.options_.displayNegative !== false) {
el.insertBefore(Dom.createEl('span', {}, {'aria-hidden': true}, '-'), this.contentEl_);
}
반환 엘;
}
/**
* 남은 시간 표시를 업데이트합니다.
*
* @param {이벤트대상~이벤트} [이벤트]
* 실행을 유발한 `timeupdate` 또는 `durationchange` 이벤트.
*
* @listens Player#timeupdate
* @listens Player#durationchange
*/
업데이트 콘텐츠(이벤트) {
if (typeof this.player_.duration() !== '숫자') {
반품;
}
시간을 보자;
// @deprecated RemainingTimeDisplay만 사용해야 합니다.
// video.js 7부터
if (this.player_.ended()) {
시간 = 0;
} 그렇지 않으면 (this.player_.remainingTimeDisplay) {
시간 = this.player_.remainingTimeDisplay();
} else {
시간 = this.player_.remainingTime();
}
this.updateTextNode_(시간);
}
}
/**
* 스크린 리더 사용자를 위해 'RemainingTimeDisplay'에 추가되는 텍스트입니다.
*
* @유형 {문자열}
* @사적인
*/
RemainingTimeDisplay.prototype.labelText_ = '남은 시간';
/**
* `RemainingTimeDisplay` 컨트롤 위에 표시되어야 하는 텍스트입니다. 현지화를 위해 추가되었습니다.
*
* @유형 {문자열}
* @사적인
*
* @v7에서는 더 이상 사용되지 않습니다. controlText_는 비활성 디스플레이 구성 요소에서 사용되지 않습니다.
*/
RemainingTimeDisplay.prototype.controlText_ = '남은 시간';
Component.registerComponent('RemainingTimeDisplay', RemainingTimeDisplay);
기본 RemainingTimeDisplay 내보내기;