/**
* @file mouse-time-display.js
*/
import Component from '../../component.js' ;
import * as Fn from '../../utils/fn.js' ;
import './time-tooltip' ;
/**
* Le composant {@link MouseTimeDisplay} suit le mouvement de la souris sur la page d'accueil
* {@link ProgressControl}. Il affiche un indicateur et une {@link TimeTooltip}
* indiquant le temps représenté par un point donné de l'image
* {@link ProgressControl}.
*
* @extends Component
*/
class MouseTimeDisplay extends Component {
/**
* Crée une instance de cette classe.
*
* @param {Player} player
* Le {@link Player} auquel cette classe doit être attachée.
*
* @param {Objet} [options]
* La mémoire clé/valeur des options du lecteur.
*/
constructor(player, options) {
super(player, options) ;
this.update = Fn.throttle(Fn.bind(this, this.update), Fn.UPDATE_REFRESH_INTERVAL) ;
}
/**
* Crée l'élément DOM pour cette classe.
*
* @return {Element}
* L'élément qui a été créé.
*/
createEl() {
return super.createEl('div', {
className : 'vjs-mouse-display'
}) ;
}
/**
* Enqueues updates to its own DOM as well as the DOM of its
* {@link TimeTooltip} child.
*
* @param {Object} seekBarRect
* Le `ClientRect` de l'élément {@link SeekBar}.
*
* @param {number} seekBarPoint
* Un nombre compris entre 0 et 1, représentant un point de référence horizontal
* à partir du bord gauche de la {@link SeekBar}
*/
update(seekBarRect, seekBarPoint) {
const time = seekBarPoint * this.player_.duration() ;
this.getChild('timeTooltip').updateTime(seekBarRect, seekBarPoint, time, () => {
this.el_.style.left = `${seekBarRect.width * seekBarPoint}px` ;
}) ;
}
}
/**
* Options par défaut pour `MouseTimeDisplay` (affichage de l'heure de la souris)
*
* @type {Objet}
* @private
*/
MouseTimeDisplay.prototype.options_ = {
enfants : [
'timeTooltip'
]
};
Component.registerComponent('MouseTimeDisplay', MouseTimeDisplay) ;
export default MouseTimeDisplay ;