ZenBrowserMirrors/components
1
0
Fork 0
mirror of https://github.com/zen-browser/components.git synced 2025-07-08 13:49:59 +02:00
Code Issues Projects Releases Packages Wiki Activity Actions

Fix possible flicker when mouse overshoot hover is applied.

Browse source
This commit is contained in:
brahim 2024-09-25 14:39:19 +02:00
parent b48e947798
commit 2a205e258f
1 changed files with 5 additions and 2 deletions
Download patch file Download diff file Expand all files Collapse all files

7
src/ZenCompactMode.mjs
View file

@ -11,6 +11,7 @@ XPCOMUtils.defineLazyPreferenceGetter(
var gZenCompactModeManager = { var gZenCompactModeManager = {
_flashTimeouts: {}, _flashTimeouts: {},
_evenListeners: [], _evenListeners: [],
_removeHoverFrames: {},
init() { init() {
Services.prefs.addObserver('zen.view.compact', this._updateEvent.bind(this)); Services.prefs.addObserver('zen.view.compact', this._updateEvent.bind(this));
@ -175,14 +176,14 @@ var gZenCompactModeManager = {
let target = this.hoverableElements[i].element; let target = this.hoverableElements[i].element;
target.addEventListener('mouseenter', (event) => { target.addEventListener('mouseenter', (event) => {
this.clearFlashTimeout('has-hover' + target.id); this.clearFlashTimeout('has-hover' + target.id);
target.setAttribute('zen-has-hover', 'true'); window.requestAnimationFrame(() => target.setAttribute('zen-has-hover', 'true'));
}); });
target.addEventListener('mouseleave', (event) => { target.addEventListener('mouseleave', (event) => {
if (this.hoverableElements[i].keepHoverDuration) { if (this.hoverableElements[i].keepHoverDuration) {
this.flashElement(target, keepHoverDuration, "has-hover" + target.id, 'zen-has-hover'); this.flashElement(target, keepHoverDuration, "has-hover" + target.id, 'zen-has-hover');
} else { } else {
target.removeAttribute('zen-has-hover'); this._removeHoverFrames[target.id] = window.requestAnimationFrame(() => target.removeAttribute('zen-has-hover'));
} }
}); });
} }
@ -197,6 +198,8 @@ var gZenCompactModeManager = {
if (!this._positionInBounds(boundAxis, target, event.pageX, event.pageY, 7)) { if (!this._positionInBounds(boundAxis, target, event.pageX, event.pageY, 7)) {
continue; continue;
} }
window.cancelAnimationFrame(this._removeHoverFrames[target.id]);
this.flashElement(target, this.hideAfterHoverDuration, "has-hover" + target.id, 'zen-has-hover'); this.flashElement(target, this.hideAfterHoverDuration, "has-hover" + target.id, 'zen-has-hover');
document.addEventListener('mousemove', () => { document.addEventListener('mousemove', () => {
if (target.matches(':hover')) return; if (target.matches(':hover')) return;