auto-hide-controller.js [plain text]
const AutoHideDelayMS = 4000;
class AutoHideController
{
constructor(mediaControls)
{
this._mediaControls = mediaControls;
this._pointerIdentifiersPreventingAutoHide = new Set;
this._pointerIdentifiersPreventingAutoHideForHover = new Set;
if (GestureRecognizer.SupportsTouches)
this._tapGestureRecognizer = new TapGestureRecognizer(this._mediaControls.element, this);
this.autoHideDelay = AutoHideDelayMS;
}
get fadesWhileIdle()
{
return this._fadesWhileIdle;
}
set fadesWhileIdle(flag)
{
if (this._fadesWhileIdle == flag)
return;
this._fadesWhileIdle = flag;
if (flag) {
this._mediaControls.element.addEventListener("pointermove", this);
this._mediaControls.element.addEventListener("pointerdown", this);
this._mediaControls.element.addEventListener("pointerup", this);
this._mediaControls.element.addEventListener("pointerleave", this);
this._mediaControls.element.addEventListener("pointerout", this);
} else {
this._mediaControls.element.removeEventListener("pointermove", this);
this._mediaControls.element.removeEventListener("pointerdown", this);
this._mediaControls.element.removeEventListener("pointerup", this);
this._mediaControls.element.removeEventListener("pointerleave", this);
this._mediaControls.element.removeEventListener("pointerout", this);
}
if (flag && !this._mediaControls.faded)
this._resetAutoHideTimer(false);
else if (!flag)
this._mediaControls.faded = false;
}
handleEvent(event)
{
if (event.currentTarget !== this._mediaControls.element)
return;
if (event.type === "pointermove") {
this._mediaControls.faded = false;
this._resetAutoHideTimer(true);
if (this._mediaControls.isPointInControls(new DOMPoint(event.clientX, event.clientY))) {
this._pointerIdentifiersPreventingAutoHideForHover.add(event.pointerId);
this._cancelNonEnforcedAutoHideTimer();
} else {
this._pointerIdentifiersPreventingAutoHideForHover.delete(event.pointerId);
this._resetAutoHideTimer(true);
}
} else if (event.type === "pointerleave" && this._fadesWhileIdle && !this.hasSecondaryUIAttached && !this._enforceAutoHideTimer) {
this._pointerIdentifiersPreventingAutoHide.delete(event.pointerId);
this._pointerIdentifiersPreventingAutoHideForHover.delete(event.pointerId);
if (event.pointerType == "mouse")
this._autoHideTimerFired();
this._resetAutoHideTimer(true);
}
if (event.type === "pointerdown") {
this._nextTapCanFadeControls = !this._mediaControls.faded;
this._pointerIdentifiersPreventingAutoHide.add(event.pointerId);
this._mediaControls.faded = false;
this._cancelNonEnforcedAutoHideTimer();
} else if (event.type === "pointerup") {
this._pointerIdentifiersPreventingAutoHide.delete(event.pointerId);
this._resetAutoHideTimer(true);
}
}
gestureRecognizerStateDidChange(recognizer)
{
if (this._tapGestureRecognizer !== recognizer || recognizer.state !== GestureRecognizer.States.Recognized)
return;
this._mediaControls.faded = this._nextTapCanFadeControls && !this._mediaControls.isPointInControls(recognizer.locationInClient());
delete this._nextTapCanFadeControls;
}
mediaControlsFadedStateDidChange()
{
if (this._mediaControls.faded)
delete this._enforceAutoHideTimer;
else
this._resetAutoHideTimer(true);
}
mediaControlsBecameInvisible()
{
this._cancelNonEnforcedAutoHideTimer();
}
_cancelNonEnforcedAutoHideTimer()
{
if (!this._enforceAutoHideTimer)
this._cancelAutoHideTimer();
}
_cancelAutoHideTimer()
{
window.clearTimeout(this._autoHideTimer);
delete this._autoHideTimer;
}
_resetAutoHideTimer(cancelable)
{
if (cancelable && this._enforceAutoHideTimer)
return;
this._cancelAutoHideTimer();
if (cancelable)
delete this._enforceAutoHideTimer;
else
this._enforceAutoHideTimer = true;
this._autoHideTimer = window.setTimeout(this._autoHideTimerFired.bind(this), this.autoHideDelay);
}
_autoHideTimerFired()
{
const disableAutoHiding = this._pointerIdentifiersPreventingAutoHide.size || this._pointerIdentifiersPreventingAutoHideForHover.size;
delete this._enforceAutoHideTimer;
if (disableAutoHiding)
return;
this._cancelAutoHideTimer();
this._mediaControls.faded = this._fadesWhileIdle && !this.hasSecondaryUIAttached;
}
}