/**
 * @file play-toggle.js
 */
'../button.js'에서 버튼 가져오기;
'../component.js'에서 컴포넌트 가져오기;
'../utils/promise'에서 {silencePromise} 가져오기;

/**
 * 재생과 일시정지를 전환하는 버튼입니다.
 *
 * @extends 버튼
 */
클래스 PlayToggle 확장 버튼 {

  /**
   * 이 클래스의 인스턴스를 만듭니다.
   *
   * @param {플레이어} 플레이어
   * 이 클래스가 연결되어야 하는 `Player`.
   *
   * @param {객체} [옵션={}]
   * 플레이어 옵션의 키/값 저장소.
   */
  생성자(플레이어, 옵션 = {}) {
    super(플레이어, 옵션);

    // 재생 아이콘 표시 또는 숨기기
    options.replay = options.replay === 정의되지 않음 || 옵션.재생;

    this.on(플레이어, '플레이', (e) => this.handlePlay(e));
    this.on(플레이어, '일시중지', (e) => this.handlePause(e));

    if (옵션.재생) {
      this.on(플레이어, '종료', (e) => this.handleEnded(e));
    }
  }

  /**
   * 기본 DOM `className`을 빌드합니다.
   *
   * @return {문자열}
   * 이 개체의 DOM `className`입니다.
   */
  buildCSSClass() {
    `vjs-play-control ${super.buildCSSClass()}` 반환;
  }

  /**
   * 이것은 `PlayToggle`이 "클릭"될 때 호출됩니다. 보다
   * {@link ClickableComponent}에서 클릭이 무엇인지 자세히 알아보세요.
   *
   * @param {이벤트대상~이벤트} [이벤트]
   * 이 함수를 실행하게 만든 `keydown`, `tap` 또는 `click` 이벤트
   * 라고 불리는.
   *
   * @listens 탭
   * @듣기 클릭
   */
  handleClick(이벤트) {
    if (this.player_.paused()) {
      침묵 약속(this.player_.play());
    } else {
      this.player_.pause();
    }
  }

  /**
   * 동영상이 종료되고 사용자가 검색한 후 한 번 호출됩니다.
   * 재생 버튼을 다시 재생 버튼으로 변경할 수 있습니다.
   *
   * @param {이벤트대상~이벤트} [이벤트]
   * 이 기능을 실행하게 만든 이벤트.
   *
   * @listens Player#seeked
   */
  handleSeeked(이벤트) {
    this.removeClass('vjs-ended');

    if (this.player_.paused()) {
      this.handlePause(이벤트);
    } else {
      this.handlePlay(이벤트);
    }
  }

  /**
   * 모양을 변경할 수 있도록 요소에 vjs-playing 클래스를 추가합니다.
   *
   * @param {이벤트대상~이벤트} [이벤트]
   * 이 기능을 실행하게 만든 이벤트.
   *
   * @listens 플레이어#플레이
   */
  handlePlay(이벤트) {
    this.removeClass('vjs-ended');
    this.removeClass('vjs-paused');
    this.addClass('vjs-playing');
    // 버튼 텍스트를 "일시 중지"로 변경
    this.controlText('일시중지');
  }

  /**
   * 모양을 변경할 수 있도록 요소에 vjs-paused 클래스를 추가합니다.
   *
   * @param {이벤트대상~이벤트} [이벤트]
   * 이 기능을 실행하게 만든 이벤트.
   *
   * @listens Player#pause
   */
  handlePause(이벤트) {
    this.removeClass('vjs-playing');
    this.addClass('vjs-paused');
    // 버튼 텍스트를 "재생"으로 변경
    this.controlText('플레이');
  }

  /**
   * 모양을 변경할 수 있도록 요소에 vjs-ended 클래스를 추가합니다.
   *
   * @param {이벤트대상~이벤트} [이벤트]
   * 이 기능을 실행하게 만든 이벤트.
   *
   * @listens Player#ended
   */
  handleEnded(이벤트) {
    this.removeClass('vjs-playing');
    this.addClass('vjs-ended');
    // 버튼 텍스트를 "Replay"로 변경
    this.controlText('재생');

    // 다음 검색에서 재생 버튼을 제거합니다.
    this.one(this.player_, '탐색', (e) => this.handleSeeked(e));
  }
}

/**
 * `PlayToggle` 컨트롤 위에 표시되어야 하는 텍스트입니다. 현지화를 위해 추가되었습니다.
 *
 * @유형 {문자열}
 * @사적인
 */
PlayToggle.prototype.controlText_ = '재생';

Component.registerComponent('PlayToggle', PlayToggle);
기본 PlayToggle 내보내기;