/**
 * @文件畫中畫切換.js
 */
從 '../button.js' 導入按鈕;
從 '../component.js' 導入組件;
從“全局/文檔”導入文檔;

/**
 * 切換畫中畫模式
 *
 * @extends 按鈕
 */
類 PictureInPictureToggle 擴展按鈕 {

  /**
   * 創建此類的一個實例。
   *
   * @param {Player} 播放器
   * 此類應附加到的 `Player`。
   *
   * @param {對象} [選項]
   * 播放器選項的鍵/值存儲。
   *
   * @listens Player#enterpictureinpicture
   * @listens Player#leavepictureinpicture
   */
  構造函數(播放器,選項){
    超級(播放器,選項);
    this.on(player, ['enterpictureinpicture', 'leavepictureinpicture'], (e) => this.handlePictureInPictureChange(e));
    this.on(player, ['disablepictureinpicturechanged', 'loadedmetadata'], (e) => this.handlePictureInPictureEnabledChange(e));

    this.on(player, ['loadedmetadata', 'audioonlymodechange', 'audiopostermodechange'], () => {
      // 此音頻檢測不會檢測 HLS 或 DASH 純音頻流,因為當時沒有可靠的方法檢測它們
      const isSourceAudio = player.currentType().substring(0, 5) === '音頻';

      如果(isSourceAudio || player.audioPosterMode()|| player.audioOnlyMode()){
        如果 (player.isInPictureInPicture()) {
          player.exitPictureInPicture();
        }
        這個。隱藏();
      }其他{
        這個。顯示();
      }

    });

    // 去做:播放器清空事件上的停用按鈕。
    這個。禁用();
  }

  /**
   * 構建默認的 DOM `className`。
   *
   * @return {字符串}
   * 此對象的 DOM `className`。
   */
  buildCSSClass() {
    返回`vjs-畫中畫-控制 ${super.buildCSSClass()}`;
  }

  /**
   * 根據 document.pictureInPictureEnabled 屬性值啟用或禁用按鈕
   * 或 player.disablePictureInPicture() 方法返回的值。
   */
  handlePictureInPictureEnabledChange() {
    如果 (document.pictureInPictureEnabled && this.player_.disablePictureInPicture() === false) {
      這個。啟用();
    }其他{
      這個。禁用();
    }
  }

  /**
   * 在播放器上處理進入畫中畫和留下畫中畫並相應地更改控製文本。
   *
   * @param {EventTarget~Event} [事件]
   * {@link Player#enterpictureinpicture} 或 {@link Player#leavepictureinpicture} 事件導致此功能被
   * 打電話。
   *
   * @listens Player#enterpictureinpicture
   * @listens Player#leavepictureinpicture
   */
  handlePictureInPictureChange(事件){
    如果 (this.player_.isInPictureInPicture()) {
      this.controlText('退出畫中畫');
    }其他{
      this.controlText('畫中畫');
    }
    this.handlePictureInPictureEnabledChange();
  }

  /**
   * 當 `PictureInPictureToggle` 被“點擊”時調用。看
   * {@link ClickableComponent} 以獲取有關點擊的更多詳細信息。
   *
   * @param {EventTarget~Event} [事件]
   * 導致此功能被執行的 `keydown`、`tap` 或 `click` 事件
   * 打電話。
   *
   * @listens 水龍頭
   * @listens 點擊
   */
  handleClick(事件){
    如果(!this.player_.isInPictureInPicture()){
      this.player_.requestPictureInPicture();
    }其他{
      this.player_.exitPictureInPicture();
    }
  }

}

/**
 * 應顯示在 `PictureInPictureToggle` 控件上的文本。添加本地化。
 *
 * @type {字符串}
 * @私人的
 */
PictureInPictureToggle.prototype.controlText_ = '畫中畫';

Component.registerComponent('PictureInPictureToggle', PictureInPictureToggle);
導出默認 PictureInPictureToggle;