rowan/multi-account-containers
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Merge pull request #193 from jonathanKingston/hover-timeout

Browse source 
Adding new tab button hover timeout. Fixes #111
This commit is contained in:
luke crouch 2017-02-16 15:19:21 -06:00 • committed by GitHub
commit 64f28249c0
1 changed files with 30 additions and 17 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

47
index.js
View file

@ -5,6 +5,7 @@
const XUL_NS = "http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"; const XUL_NS = "http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul";
const DEFAULT_TAB = "about:newtab"; const DEFAULT_TAB = "about:newtab";
const SHOW_MENU_TIMEOUT = 100;
const HIDE_MENU_TIMEOUT = 300; const HIDE_MENU_TIMEOUT = 300;
const IDENTITY_COLORS = [ const IDENTITY_COLORS = [
@ -864,7 +865,7 @@ ContainerWindow.prototype = {
_window: null, _window: null,
_style: null, _style: null,
_panelElement: null, _panelElement: null,
_timeoutId: 0, _timeoutStore: new Map(),
_elementCache: new Map(), _elementCache: new Map(),
_tooltipCache: new Map(), _tooltipCache: new Map(),
_plusButton: null, _plusButton: null,
@ -894,7 +895,9 @@ ContainerWindow.prototype = {
let el = e.target; let el = e.target;
switch (e.type) { switch (e.type) {
case "mouseover": case "mouseover":
this.showPopup(el); this._createTimeout("show", () => {
this.showPopup(el);
}, SHOW_MENU_TIMEOUT);
break; break;
case "click": case "click":
this.hidePanel(); this.hidePanel();
@ -904,7 +907,11 @@ ContainerWindow.prototype = {
if (el === this._panelElement || if (el === this._panelElement ||
el === this._plusButton || el === this._plusButton ||
el === this._overflowPlusButton) { el === this._overflowPlusButton) {
this._createTimeout(); // Clear show timeout so we don't hide and reshow
this._cleanTimeout("show");
this._createTimeout("hidden", () => {
this.hidePanel();
}, HIDE_MENU_TIMEOUT);
return; return;
} }
el = el.parentElement; el = el.parentElement;
@ -914,7 +921,7 @@ ContainerWindow.prototype = {
}, },
showPopup(buttonElement) { showPopup(buttonElement) {
this._cleanTimeout(); this._cleanAllTimeouts();
this._panelElement.openPopup(buttonElement); this._panelElement.openPopup(buttonElement);
}, },
@ -953,7 +960,7 @@ ContainerWindow.prototype = {
this._panelElement.addEventListener("mouseout", this); this._panelElement.addEventListener("mouseout", this);
this._panelElement.addEventListener("mouseover", () => { this._panelElement.addEventListener("mouseover", () => {
this._cleanTimeout(); this._cleanAllTimeouts();
}); });
return ContainerService.queryIdentities().then(identities => { return ContainerService.queryIdentities().then(identities => {
@ -975,7 +982,7 @@ ContainerWindow.prototype = {
}); });
menuItemElement.addEventListener("mouseover", () => { menuItemElement.addEventListener("mouseover", () => {
this._cleanTimeout(); this._cleanAllTimeouts();
}); });
menuItemElement.addEventListener("mouseout", this); menuItemElement.addEventListener("mouseout", this);
@ -1090,23 +1097,29 @@ ContainerWindow.prototype = {
// This timer is used to hide the panel auto-magically if it's not used in // This timer is used to hide the panel auto-magically if it's not used in
// the following X seconds. This is need to avoid the leaking of the panel // the following X seconds. This is need to avoid the leaking of the panel
// when the mouse goes out of of the 'plus' button. // when the mouse goes out of of the 'plus' button.
_createTimeout() { _createTimeout(key, callback, timeoutTime) {
this._cleanTimeout(); this._cleanTimeout(key);
this._timeoutId = this._window.setTimeout(() => { this._timeoutStore.set(key, this._window.setTimeout(() => {
this.hidePanel(); callback();
this._timeoutId = 0; this._timeoutStore.delete(key);
}, HIDE_MENU_TIMEOUT); }, timeoutTime));
}, },
_cleanTimeout() { _cleanAllTimeouts() {
if (this._timeoutId) { for (let key of this._timeoutStore.keys()) { // eslint-disable-line prefer-const
this._window.clearTimeout(this._timeoutId); this._cleanTimeout(key);
this._timeoutId = 0; }
},
_cleanTimeout(key) {
if (this._timeoutStore.has(key)) {
this._window.clearTimeout(this._timeoutStore.get(key));
this._timeoutStore.delete(key);
} }
}, },
hidePanel() { hidePanel() {
this._cleanTimeout(); this._cleanAllTimeouts();
this._panelElement.hidePopup(); this._panelElement.hidePopup();
}, },