/**
 * @file playback-rate-menu-button.js
 * /
importar MenuButton desde '../../menu/menu-button.js';
importar PlaybackRateMenuItem desde './playback-rate-menu-item.js';
importar componente desde '../../component.js';
importar * como Dom desde '../../utils/dom.js';

/**
 * El componente para controlar la tasa de reproducción.
 *
 * @extiende el botón de menú
 * /
class PlaybackRateMenuButton extiende MenuButton {

  /**
   * Crea una instancia de esta clase.
   *
   * @param {Jugador} jugador
   * El `Jugador` al que se debe adjuntar esta clase.
   *
   * @param {Objeto} [opciones]
   * El almacén de clave/valor de las opciones del jugador.
   * /
  constructor(jugador, opciones) {
    super(jugador, opciones);

    this.menuButton_.el_.setAttribute('aria-descrito por', this.labelElId_);

    this.updateVisibility();
    this.updateLabel();

    this.on(jugador, 'loadstart', (e) => this.updateVisibility(e));
    this.on(player, 'ratechange', (e) => esta.updateLabel(e));
    this.on(player, 'playbackrateschange', (e) => this.handlePlaybackRateschange(e));
  }

  /**
   * Crear el elemento DOM del 'Componente'
   *
   * @return {Elemento}
   * El elemento que se creó.
   * /
  crearEl() {
    const el = super.createEl();

    this.labelElId_ = 'vjs-playback-rate-value-label-' + this.id_;

    this.labelEl_ = Dom.createEl('div', {
      className: 'vjs-reproducción-tasa-valor',
      id: this.labelElId_,
      contenido del texto: '1x'
    });

    el.appendChild(this.labelEl_);

    volver el;
  }

  disponer () {
    this.labelEl_ = null;

    super.dispose();
  }

  /**
   * Construye el DOM predeterminado `className`.
   *
   * @return {cadena}
   * El DOM `className` para este objeto.
   * /
  construirClaseCSS() {
    devuelve `vjs-playback-rate ${super.buildCSSClass()}`;
  }

  buildWrapperCSSClass() {
    devuelve `vjs-playback-rate ${super.buildWrapperCSSClass()}`;
  }

  /**
   * Crear la lista de elementos del menú. Específico para cada subclase.
   *
   * /
  crear elementos () {
    tasas constantes = this.playbackRates();
    elementos constantes = [];

    for (sea i = tasas.longitud - 1; i > = 0; i--) {
      items.push(new PlaybackRateMenuItem(this.player(), {rate: rates[i] + 'x'}));
    }

    devolver los artículos;
  }

  /**
   * Actualiza los atributos de accesibilidad de ARIA
   * /
  Actualizar Atributos ARIA () {
    // Tasa de reproducción actual
    this.el().setAttribute('aria-valuenow', this.player().playbackRate());
  }

  /**
   * Esto se llama cuando se "hace clic" en `PlaybackRateMenuButton`. Ver
   * {@link ClickableComponent} para obtener información más detallada sobre lo que puede ser un clic.
   *
   * @param {Objetivo de evento~Evento} [evento]
   * El evento `keydown`, `top` o `click` que hizo que esta función se desactivara
   * llamado.
   *
   * @escucha toca
   * @escucha clic
   * /
  handleClick(evento) {
    // seleccione la siguiente opción de tarifa
    const tasaActual = this.player().playbackRate();
    tasas constantes = this.playbackRates();
    const índiceActual = tasas.indexOf(tasaActual);
    // esto obtiene la siguiente tarifa y seleccionará la primera si es la última actualmente seleccionada
    const newIndex = (currentIndex + 1) % tasas.longitud;

    this.player().playbackRate(rates[newIndex]);
  }

  /**
   * Al cambiar las tasas de reproducción, actualice el menú para tener en cuenta los nuevos elementos.
   *
   * @escucha Player#playbackrateschange
   * /
  handlePlaybackRateschange(evento) {
    esta.actualización();
  }

  /**
   * Obtener tasas de reproducción posibles
   *
   * @return {Array}
   * Todas las tasas de reproducción posibles
   * /
  tasas de reproducción() {
    const jugador = este.jugador();

    volver (player.playbackRates && player.playbackRates()) || [];
  }

  /**
   * Obtener si las velocidades de reproducción son compatibles con la tecnología
   * y existe una variedad de tasas de reproducción
   *
   * @return {booleano}
   * Si se admite cambiar la velocidad de reproducción
   * /
  tasa de reproducción admitida () {
    devuelve este.jugador().tech_ &&
      this.player().tech_.featuresRate de reproducción &&
      this.playbackRates() &&
      this.playbackRates().longitud > 0
    ;
  }

  /**
   * Oculte los controles de frecuencia de reproducción cuando no hay opciones de frecuencia de reproducción para seleccionar
   *
   * @param {Objetivo de evento~Evento} [evento]
   * El evento que provocó la ejecución de esta función.
   *
   * @escucha Player#loadstart
   * /
  actualizarVisibilidad(evento) {
    if (this.playbackRateSupported()) {
      this.removeClass('vjs-hidden');
    } else {
      this.addClass('vjs-hidden');
    }
  }

  /**
   * Actualizar la etiqueta del botón cuando cambia la tarifa
   *
   * @param {Objetivo de evento~Evento} [evento]
   * El evento que provocó la ejecución de esta función.
   *
   * @escucha Player#ratechange
   * /
  actualizarEtiqueta(evento) {
    if (this.playbackRateSupported()) {
      this.labelEl_.textContent = this.player().playbackRate() + 'x';
    }
  }

}

/**
 * El texto que debería mostrarse sobre los controles `FullscreenToggle`s. Añadido para la localización.
 *
 * @tipo {cadena}
 * @privado
 * /
PlaybackRateMenuButton.prototype.controlText_ = 'Frecuencia de reproducción';

Component.registerComponent('ReproducciónRateMenuButton', PlaybackRateMenuButton);
exportar el botón de menú de velocidad de reproducción predeterminado;