diff --git a/guacamole/src/main/webapp/client.xhtml b/guacamole/src/main/webapp/client.xhtml
index be2250951..ee9cd21cf 100644
--- a/guacamole/src/main/webapp/client.xhtml
+++ b/guacamole/src/main/webapp/client.xhtml
@@ -56,10 +56,14 @@
+
diff --git a/guacamole/src/main/webapp/scripts/interface.js b/guacamole/src/main/webapp/scripts/interface.js
index c2d5a5d09..4d24b9279 100644
--- a/guacamole/src/main/webapp/scripts/interface.js
+++ b/guacamole/src/main/webapp/scripts/interface.js
@@ -2,10 +2,11 @@
// UI Definition
var GuacamoleUI = {
- "display": document.getElementById("display"),
- "menu" : document.getElementById("menu"),
- "logo" : document.getElementById("status-logo"),
- "state" : document.getElementById("state"),
+ "display" : document.getElementById("display"),
+ "menu" : document.getElementById("menu"),
+ "menuControl" : document.getElementById("menuControl"),
+ "logo" : document.getElementById("status-logo"),
+ "state" : document.getElementById("state"),
"buttons": {
@@ -137,13 +138,84 @@ var GuacamoleUI = {
window.location.href = "logout";
};
- GuacamoleUI.display.onmouseout = function() {
- GuacamoleUI.showMenu();
- };
+ var detectMenuOpenTimeout = null;
+ var detectMenuCloseTimeout = null;
+
+ GuacamoleUI.menu.addEventListener('mouseover', function() {
+
+ // If we were waiting for menu close, we're not anymore
+ if (detectMenuCloseTimeout != null) {
+ window.clearTimeout(detectMenuCloseTimeout);
+ detectMenuCloseTimeout = null;
+ }
+
+ }, true);
+
+ GuacamoleUI.menu.addEventListener('mouseout', function(e) {
+
+ // Get parent of the element the mouse pointer is leaving
+ if (!e) e = window.event;
+ var target = e.relatedTarget || e.toElement;
+
+ // Ensure target is not menu nor child of menu
+ var targetParent = target;
+ while (targetParent != null) {
+ if (targetParent == GuacamoleUI.menu) return;
+ targetParent = targetParent.parentNode;
+ }
+
+ // If not already waiting, start detection of mouse leave
+ if (detectMenuCloseTimeout == null) {
+ detectMenuCloseTimeout = window.setTimeout(function() {
+ GuacamoleUI.shadeMenu();
+ detectMenuCloseTimeout = null;
+ }, 750);
+ }
+
+ }, true);
+
+ // When mouse hovers over top of screen, start detection of mouse hover
+ GuacamoleUI.menuControl.addEventListener('mousemove', function() {
+
+ // 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) {
+ window.clearTimeout(detectMenuOpenTimeout);
+ detectMenuOpenTimeout = null;
+ }
+
+ // If not alread waiting, wait for 250ms before showing menu
+ detectMenuOpenTimeout = window.setTimeout(function() {
+ GuacamoleUI.showMenu();
+ detectMenuOpenTimeout = null;
+ }, 250);
+
+ }, true);
+
+ // When mouse leaves top of screen, cancel showing the menu
+ GuacamoleUI.menuControl.addEventListener('mouseout', function() {
+
+ // If we were waiting for menu open, we're not anymore
+ if (detectMenuOpenTimeout != null) {
+ window.clearTimeout(detectMenuOpenTimeout);
+ detectMenuCloseTimeout = null;
+ }
+
+ // If not already waiting, start detection of mouse leave
+ if (detectMenuCloseTimeout == null) {
+ detectMenuCloseTimeout = window.setTimeout(function() {
+ GuacamoleUI.shadeMenu();
+ detectMenuCloseTimeout = null;
+ }, 750);
+ }
+
+ }, true);
- GuacamoleUI.display.onmouseover = function() {
- GuacamoleUI.shadeMenu();
- };
// Reconnect button
GuacamoleUI.buttons.reconnect.onclick = function() {
@@ -163,10 +235,6 @@ GuacamoleUI.attach = function(guac) {
var mouse = new Guacamole.Mouse(GuacamoleUI.display);
mouse.onmousedown = mouse.onmouseup = mouse.onmousemove =
function(mouseState) {
-
- if (mouseState.y <= 5)
- GuacamoleUI.showMenu();
-
guac.sendMouseState(mouseState);
};
diff --git a/guacamole/src/main/webapp/styles/client.css b/guacamole/src/main/webapp/styles/client.css
index 3dfe2bf6a..4b4099106 100644
--- a/guacamole/src/main/webapp/styles/client.css
+++ b/guacamole/src/main/webapp/styles/client.css
@@ -73,17 +73,14 @@ div.errorDialog p {
#menu {
- margin-left: auto;
- margin-right: auto;
- margin-bottom: 1em;
- font-size: 0.8em;
- background: #FEA;
- border: 1px solid black;
position: fixed;
left: 0;
top: 0;
width: 100%;
- z-index: 1;
+ z-index: 4;
+ background: #FEA;
+ border-bottom: 1px solid black;
+ font-size: 0.8em;
}
#menu.error {
@@ -127,11 +124,7 @@ div#clipboardDiv {
border: 1px solid black;
width: 50em;
- opacity: 0.5;
-}
-
-#menu:hover div#clipboardDiv {
- opacity: 1;
+ z-index: 2;
}
div#clipboardDiv h2 {
@@ -161,3 +154,14 @@ div#clipboardDiv textarea {
cursor: url('../images/mouse/dot.gif'),url('../images/mouse/blank.cur'),default;
}
+div#menuControl {
+ position: fixed;
+ top: 0;
+ left: 0;
+
+ width: 100%;
+ height: 1.5em;
+ background: none;
+
+ z-index: 3;
+}