/**
 * @file chapters-button.js
 * /
importar TextTrackButton desde './text-track-button.js';
importar componente desde '../../component.js';
importar ChaptersTrackMenuItem desde './chapters-track-menu-item.js';
importar {toTitleCase} desde '../../utils/string-cases.js';

/**
 * El componente de botón para alternar y seleccionar capítulos
 * Los capítulos actúan de manera muy diferente a otras pistas de texto
 * Las señales son navegación frente a otras pistas de idiomas alternativos
 *
 * @extiende TextTrackButton
 * /
class ChaptersButton extiende TextTrackButton {

  /**
   * 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.
   *
   * @param {Componente~ReadyCallback} [listo]
   * La función a llamar cuando esta función está lista.
   * /
  constructor(jugador, opciones, listo) {
    super(jugador, opciones, listo);

    this.selectCurrentItem_ = () => {
      this.items.forEach(item => {
        item.selected(this.track_.activeCues[0] === item.cue);
      });
    };
  }

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

  buildWrapperCSSClass() {
    return `vjs-chapters-button ${super.buildWrapperCSSClass()}`;
  }

  /**
   * Actualice el menú según el estado actual de sus elementos.
   *
   * @param {Objetivo de evento~Evento} [evento]
   * Un evento que activó la ejecución de esta función.
   *
   * @escucha TextTrackList#addtrack
   * @escucha TextTrackList#removetrack
   * @escucha TextTrackList#cambio
   * /
  actualizar (evento) {
    si (evento && evento.pista && event.track.kind !== 'capítulos') {
      devolver;
    }

    const track = this.findChaptersTrack();

    if (pista !== esta.pista_) {
      this.setTrack(pista);
      super.update();
    } else if (!this.items || (pista && pista.cues && track.cues.length !== this.items.length)) {
      // Actualizar el menú inicialmente o si el número de cues ha cambiado desde que se estableció
      super.update();
    }
  }

  /**
   * Establecer la pista actualmente seleccionada para el botón de capítulos.
   *
   * @param {TextTrack} pista
   * La nueva pista para seleccionar. Nada cambiará si este es el seleccionado actualmente
   * pista.
   * /
  setTrack(pista) {
    if (esta.pista_ === pista) {
      devolver;
    }

    if (!this.updateHandler_) {
      this.updateHandler_ = this.update.bind(this);
    }

    // aquí this.track_ se refiere a la instancia de pista anterior
    si (esta.pista_) {
      const remoteTextTrackEl = this.player_.remoteTextTrackEls().getTrackElementByTrack_(this.track_);

      if (remoteTextTrackEl) {
        remoteTextTrackEl.removeEventListener('load', this.updateHandler_);
      }

      this.track_.removeEventListener('cambio de señal', this.selectCurrentItem_);

      this.track_ = null;
    }

    this.track_ = pista;

    // aquí this.track_ se refiere a la nueva instancia de pista
    si (esta.pista_) {
      this.track_.mode = 'oculto';

      const remoteTextTrackEl = this.player_.remoteTextTrackEls().getTrackElementByTrack_(this.track_);

      if (remoteTextTrackEl) {
        remoteTextTrackEl.addEventListener('load', this.updateHandler_);
      }

      this.track_.addEventListener('cuechange', this.selectCurrentItem_);
    }
  }

  /**
   * Encuentre el objeto de pista que está actualmente en uso por este ChaptersButton
   *
   * @return {TextTrack|indefinido}
   * La pista actual o indefinida si no se encontró ninguna.
   * /
  buscarPistaDeCapítulos() {
    const pistas = this.player_.textTracks() || [];

    for (sea i = pistas.longitud - 1; i > = 0; i--) {
      // Siempre elegiremos la última pista como nuestra pista de capítulos
      const pista = pistas[i];

      if (pista.tipo === este.tipo_) {
        pista de retorno;
      }
    }
  }

  /**
   * Obtener el título del botón de capítulos en función de la etiqueta de la pista. Esto también
   * usar el tipo localizado de las pistas actuales como respaldo si no existe una etiqueta.
   *
   * @return {cadena}
   * La etiqueta actual de las pistas o el tipo de pista localizada.
   * /
  getMenuCaption() {
    si (esta.pista_ && esta.pista_.etiqueta) {
      devuelve this.track_.label;
    }
    return this.localize(toTitleCase(this.kind_));
  }

  /**
   * Crear menú a partir de la pista del capítulo
   *
   * @return {Menú}
   * Nuevo menú para los botones de capítulo
   * /
  crearMenu() {
    this.options_.title = this.getMenuCaption();
    volver super.createMenu();
  }

  /**
   * Crear un elemento de menú para cada pista de texto
   *
   * @return {TextTrackMenuItem[]}
   * Matriz de elementos de menú
   * /
  crear elementos () {
    elementos constantes = [];

    if (!esta.pista_) {
      devolver los artículos;
    }

    const señales = this.track_.cues;

    si (! señales) {
      devolver los artículos;
    }

    for (sea i = 0, l = cues.length; i < yo; i++) {
      const señal = señal[i];
      const mi = new ChaptersTrackMenuItem(this.player_, { track: this.track_, cue });

      elementos.push(mi);
    }

    devolver los artículos;
  }

}

/**
 * `tipo` de TextTrack a buscar para asociarlo a este menú.
 *
 * @tipo {cadena}
 * @privado
 * /
ChaptersButton.prototype.kind_ = 'capítulos';

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

Component.registerComponent('ChaptersButton', ChaptersButton);
exportar el botón de capítulos predeterminado;