/**
 * @file volume-level-tooltip.js
 * /
importiere Komponente von '../../komponente';
import * as Dom from '../../utils/dom.js';
import * as Fn from '../../utils/fn.js';

/**
 * Lautstärke-Symbole zeigen eine Lautstärke über oder neben der Lautstärkeleiste an.
 *
 * @erweitert Komponente
 * /
class VolumeLevelTooltip extends Component {

  /**
   * Erzeugt eine Instanz dieser Klasse.
   *
   * @param {Player} Spieler
   *        Der {@link Player}, dem diese Klasse zugeordnet werden soll.
   *
   * @param {Object} [Optionen]
   *        Der Schlüssel/Wertspeicher der Playeroptionen.
   * /
  constructor(spieler, optionen) {
    super(Spieler, Optionen);
    this.update = Fn.throttle(Fn.bind(this, this.update), Fn.UPDATE_REFRESH_INTERVAL);
  }

  /**
   * Erstellen Sie das DOM-Element "Volume Tooltip
   *
   * @return {Element}
   *         Das Element, das erstellt wurde.
   * /
  createEl() {
    return super.createEl('div', {
      className: 'vjs-volume-tooltip'
    }, {
      aria-hidden": "true
    });
  }

  /**
   * Aktualisiert die Position des Tooltips relativ zum `VolumeBar` und
   * seinen Inhaltstext.
   *
   * @param {Object} rangeBarRect
   *        Das `ClientRect` für das Element {@link VolumeBar}.
   *
   * @param {Zahl} rangeBarPoint
   *        Eine Zahl von 0 bis 1, die einen horizontalen/vertikalen Referenzpunkt darstellt
   *        vom linken Rand des {@link VolumeBar}
   *
   * @param {boolean} vertikal
   *        Schiedsrichter in die Position der Lautstärkekontrolle
   *        in der Kontrollleiste{@link VolumeControl}
   *
   * /
  update(rangeBarRect, rangeBarPoint, vertical, content) {
    if (!vertikal) {
      const tooltipRect = Dom.getBoundingClientRect(this.el_);
      const playerRect = Dom.getBoundingClientRect(this.player_.el());
      const volumeBarPointPx = rangeBarRect.width * rangeBarPoint;

      if (!playerRect || !tooltipRect) {
        rückkehr;
      }

      const spaceLeftOfPoint = (rangeBarRect.left - playerRect.left) + volumeBarPointPx;
      const spaceRightOfPoint = (rangeBarRect.width - volumeBarPointPx) +
        (playerRect.right - rangeBarRect.right);
      let pullTooltipBy = tooltipRect.width / 2;

      if (spaceLeftOfPoint < pullTooltipBy) {
        pullTooltipBy += pullTooltipBy - spaceLeftOfPoint;
      } else if (spaceRightOfPoint < pullTooltipBy) {
        pullTooltipBy = spaceRightOfPoint;
      }

      wenn (pullTooltipBy < 0) {
        pullTooltipBy = 0;
      } else if (pullTooltipBy > tooltipRect.width) {
        pullTooltipBy = tooltipRect.width;
      }

      this.el_.style.right = `-${pullTooltipBy}px`;
    }
    this.write(`${Inhalt}%`);
  }

  /**
   * Schreiben Sie die Lautstärke in das Tooltip-DOM-Element.
   *
   * @param {string} Inhalt
   *        Das formatierte Volumen für den Tooltip.
   * /
  write(content) {
    Dom.textInhalt(this.el_, Inhalt);
  }

  /**
   * Aktualisiert die Position des Lautstärke-Tooltips relativ zum `Volumenbalken`.
   *
   * @param {Object} rangeBarRect
   *        Das `ClientRect` für das Element {@link VolumeBar}.
   *
   * @param {Zahl} rangeBarPoint
   *        Eine Zahl von 0 bis 1, die einen horizontalen/vertikalen Referenzpunkt darstellt
   *        vom linken Rand des {@link VolumeBar}
   *
   * @param {boolean} vertikal
   *        Schiedsrichter in die Position der Lautstärkekontrolle
   *        in der Kontrollleiste{@link VolumeControl}
   *
   * @param {Anzahl} Volumen
   *        Der Lautstärkepegel, auf den der Tooltip aktualisiert werden soll
   *
   * @param {Funktion} cb
   *        Eine Funktion, die während der Anforderung eines Animationsrahmens aufgerufen wird
   *        für Tooltips, die zusätzliche Animationen zum Standard benötigen
   * /
  updateVolume(rangeBarRect, rangeBarPoint, vertical, volume, cb) {
    this.requestNamedAnimationFrame('VolumeLevelTooltip#updateVolume', () => {
      this.update(rangeBarRect, rangeBarPoint, vertical, volume.toFixed(0));
      wenn (cb) {
        cb();
      }
    });
  }
}

Component.registerComponent('VolumeLevelTooltip', VolumeLevelTooltip);
standard VolumeLevelTooltip exportieren;