/**
 * @file picture-in-picture-toggle.js
 */
'../button.js'에서 버튼 가져오기;
'../component.js'에서 컴포넌트 가져오기;
'글로벌/문서'에서 문서 가져오기;

/**
 * PIP 모드 전환
 *
 * @extends 버튼
 */
클래스 PictureInPictureToggle 확장 버튼 {

  /**
   * 이 클래스의 인스턴스를 만듭니다.
   *
   * @param {플레이어} 플레이어
   * 이 클래스가 연결되어야 하는 `Player`.
   *
   * @param {객체} [옵션]
   * 플레이어 옵션의 키/값 저장소.
   *
   * @listens Player#enterpictureinpicture
   * @listens Player#leavepictureinpicture
   */
  생성자(플레이어, 옵션) {
    super(플레이어, 옵션);
    this.on(플레이어, ['enterpictureinpicture', 'leavepictureinpicture'], (e) => this.handlePictureInPictureChange(e));
    this.on(player, ['disablepictureinpicturechanged', 'loadedmetadata'], (e) => this.handlePictureInPictureEnabledChange(e));

    this.on(플레이어, ['loadedmetadata', 'audioonlymodechange', 'audiopostermodechange'], () => {
      // 이 오디오 감지는 HLS 또는 DASH 오디오 전용 스트림을 감지할 수 있는 신뢰할 수 있는 방법이 당시에 없었기 때문에 감지하지 않습니다.
      const isSourceAudio = player.currentType().substring(0, 5) === '오디오';

      if (isSourceAudio || player.audioPosterMode() || player.audioOnlyMode()) {
        if (player.isInPictureInPicture()) {
          player.exitPictureInPicture();
        }
        this.hide();
      } else {
        this.show();
      }

    });

    // 할 것: 플레이어가 비운 이벤트에서 버튼을 비활성화합니다.
    this.disable();
  }

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

  /**
   * document.pictureInPictureEnabled 속성 값에 따라 버튼을 활성화하거나 비활성화합니다.
   * 또는 player.disablePictureInPicture() 메서드에 의해 반환된 값.
   */
  handlePictureInPictureEnabledChange() {
    if (문서.pictureInPictureEnabled && this.player_.disablePictureInPicture() === false) {
      this.enable();
    } else {
      this.disable();
    }
  }

  /**
   * 플레이어에서 enterpictureinpicture 및 leavepictureinpicture를 처리하고 그에 따라 제어 텍스트를 변경합니다.
   *
   * @param {이벤트대상~이벤트} [이벤트]
   * 이 기능을 발생시킨 {@link Player#enterpictureinpicture} 또는 {@link Player#leavepictureinpicture} 이벤트
   * 라고 불리는.
   *
   * @listens Player#enterpictureinpicture
   * @listens Player#leavepictureinpicture
   */
  handlePictureInPictureChange(이벤트) {
    if (this.player_.isInPictureInPicture()) {
      this.controlText('Picture-in-Picture 종료');
    } else {
      this.controlText('Picture-in-Picture');
    }
    this.handlePictureInPictureEnabledChange();
  }

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

}

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

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