/**
 * @file 靜音切換.js
 */
從“../按鈕”導入按鈕;
從 '../component' 導入組件;
import * as Dom from '../utils/dom.js';
從 './volume-control/check-mute-support' 導入 checkMuteSupport;
從 '../utils/browser.js' 導入 * 作為瀏覽器;

/**
 * 用於靜音的按鈕組件。
 *
 * @extends 按鈕
 */
類 MuteToggle 擴展按鈕 {

  /**
   * 創建此類的一個實例。
   *
   * @param {Player} 播放器
   * 此類應附加到的 `Player`。
   *
   * @param {對象} [選項]
   * 播放器選項的鍵/值存儲。
   */
  構造函數(播放器,選項){
    超級(播放器,選項);

    // 如果缺少音量支持,則隱藏此控件
    檢查靜音支持(這個,播放器);

    this.on(player, ['loadstart', 'volumechange'], (e) => this.update(e));
  }

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

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

    如果(卷=== 0){
      常量卷集 = 最後一卷 <  0.1?0.1:最後一個音量;

      this.player_.volume(volumeToSet);
      this.player_.muted(false);
    }其他{
      這個播放器 _ 靜音(這個 .player_.muted()?假:真);
    }
  }

  /**
   * 根據 `volume` 和 `muted` 的狀態更新 `MuteToggle` 按鈕
   * 在播放器上。
   *
   * @param {EventTarget~Event} [事件]
   * {@link Player#loadstart} 事件,如果這個函數被調用
   * 通過一個事件。
   *
   * @listens Player#loadstart
   * @listens Player#volumechange
   */
  更新(事件){
    這個.updateIcon_();
    this.updateControlText_();
  }

  /**
   * 更新 `MuteToggle` 圖標的外觀。
   *
   * 可能的狀態(給定下面的 `level` 變量):
   * - 0:劃掉
   * - 1: 零條交易量
   * - 2: 一格音量
   * - 3: 兩個柱形的音量
   *
   * @私人的
   */
  updateIcon_() {
    const vol = this.player_.volume();
    讓水平= 3;

    // 在 iOS 中,當播放器加載了 muted 屬性時
    // 並使用本機靜音按鈕更改音量
    // 我們要確保更新靜音狀態
    如果(瀏覽器.IS_IOS && this.player_.tech_ && this.player_.tech_.el_){
      this.player_.muted(this.player_.tech_.el_.muted);
    }

    如果 (vol === 0 || this.player_.muted()) {
      水平= 0;
    } 否則,如果(第 <  0.33 卷){
      水平= 1;
    } 否則,如果(第 <  0.67 卷){
      水平= 2;
    }

    // TODO 改進靜音圖標類
    對於(讓我 = 0; 我 <  4; 我 ++){
      Dom.removeClass(this.el_, `vjs-vol-${i}`);
    }
    Dom.addClass(this.el_, `vjs-vol-${level}`);
  }

  /**
   * 如果播放器上的 `muted` 發生變化,更新控製文本
   * (`vjs-mute-control` 元素的 `title` 屬性和內容
   * `vjs-control-text` 元素)。
   *
   * @私人的
   */
  updateControlText_() {
    const soundOff = this.player_.muted() ||這個.player_.volume() === 0;
    常量文本 = 聲音?“取消靜音”:'沉默的';

    如果(this.controlText()!==文本){
      this.controlText(文本);
    }
  }

}

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

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