Cleaned up menu shading code.

This commit is contained in:
Michael Jumper
2011-12-19 17:01:41 -08:00
parent 5048d171d5
commit 6e3ff98b5a

View File

@@ -138,34 +138,33 @@ var GuacamoleUI = {
window.location.href = "logout"; window.location.href = "logout";
}; };
// Timeouts for detecting if users wants menu to open or close
var detectMenuOpenTimeout = null; var detectMenuOpenTimeout = null;
var detectMenuCloseTimeout = null; var detectMenuCloseTimeout = null;
GuacamoleUI.menu.addEventListener('mouseover', function() { // Clear detection timeouts
function resetMenuDetect() {
// If we were waiting for menu close, we're not anymore
if (detectMenuCloseTimeout != null) {
window.clearTimeout(detectMenuCloseTimeout);
detectMenuCloseTimeout = null;
}
}, true);
function menuShowHandler() {
// If we were waiting for menu close, we're not anymore
if (detectMenuCloseTimeout != null) {
window.clearTimeout(detectMenuCloseTimeout);
detectMenuCloseTimeout = null;
}
// Clear old timeout if mouse moved while we were waiting
if (detectMenuOpenTimeout != null) { if (detectMenuOpenTimeout != null) {
window.clearTimeout(detectMenuOpenTimeout); window.clearTimeout(detectMenuOpenTimeout);
detectMenuOpenTimeout = null; detectMenuOpenTimeout = null;
} }
// If not alread waiting, wait before showing menu if (detectMenuCloseTimeout != null) {
window.clearTimeout(detectMenuCloseTimeout);
detectMenuCloseTimeout = null;
}
}
// Initiate detection of menu open action. If not canceled through some
// user event, menu will open.
function startMenuOpenDetect() {
// Clear detection state
resetMenuDetect();
// Wait and then show menu
detectMenuOpenTimeout = window.setTimeout(function() { detectMenuOpenTimeout = window.setTimeout(function() {
GuacamoleUI.showMenu(); GuacamoleUI.showMenu();
detectMenuOpenTimeout = null; detectMenuOpenTimeout = null;
@@ -173,46 +172,52 @@ var GuacamoleUI = {
} }
// Show menu of mouseover any part of menu // Initiate detection of menu close action. If not canceled through some
// user event, menu will close.
function startMenuCloseDetect() {
// Clear detection state
resetMenuDetect();
// Wait and then shade menu
detectMenuCloseTimeout = window.setTimeout(function() {
GuacamoleUI.shadeMenu();
detectMenuCloseTimeout = null;
}, 500);
}
// Show menu if mouseover any part of menu
GuacamoleUI.menu.addEventListener('mouseover', GuacamoleUI.showMenu, true); GuacamoleUI.menu.addEventListener('mouseover', GuacamoleUI.showMenu, true);
// When mouse hovers over top of screen, start detection of mouse hover // Stop detecting menu state change intents if mouse is over menu
GuacamoleUI.menuControl.addEventListener('mousemove', menuShowHandler, true); GuacamoleUI.menu.addEventListener('mouseover', resetMenuDetect, true);
// When mouse hovers over top of screen, start detection of intent to open menu
GuacamoleUI.menuControl.addEventListener('mousemove', startMenuOpenDetect, true);
// When mouse enters display, start detection of intent to close menu
GuacamoleUI.display.addEventListener('mouseover', startMenuCloseDetect, true);
// Show menu if mouse leaves document
document.addEventListener('mouseout', function(e) { document.addEventListener('mouseout', function(e) {
// Get parent of the element the mouse pointer is leaving // Get parent of the element the mouse pointer is leaving
if (!e) e = window.event; if (!e) e = window.event;
var target = e.relatedTarget || e.toElement; var target = e.relatedTarget || e.toElement;
// Ensure target is not menu nor child of menu // Ensure target is not document nor child of document
var targetParent = target; var targetParent = target;
while (targetParent != null) { while (targetParent != null) {
if (targetParent == document) return; if (targetParent == document) return;
targetParent = targetParent.parentNode; targetParent = targetParent.parentNode;
} }
menuShowHandler(); // Start detection of intent to open menu
startMenuOpenDetect();
}, true); }, true);
GuacamoleUI.display.addEventListener('mouseover', function() {
// If we were detecting menu open, stop it
if (detectMenuOpenTimeout != null) {
window.clearTimeout(detectMenuOpenTimeout);
detectMenuOpenTimeout = null;
}
// If not already waiting, start detection of mouse leave
if (detectMenuCloseTimeout == null) {
detectMenuCloseTimeout = window.setTimeout(function() {
GuacamoleUI.shadeMenu();
detectMenuCloseTimeout = null;
}, 500);
}
}, true);
// Reconnect button // Reconnect button
GuacamoleUI.buttons.reconnect.onclick = function() { GuacamoleUI.buttons.reconnect.onclick = function() {
window.location.reload(); window.location.reload();