From: Michael Jumper Date: Sun, 8 Apr 2012 22:56:11 +0000 (-0700) Subject: Implement touch-specific menu. X-Git-Url: http://git.alex.org.uk Implement touch-specific menu. --- diff --git a/src/main/webapp/client.xhtml b/src/main/webapp/client.xhtml index 2ac8a7a..ce52831 100644 --- a/src/main/webapp/client.xhtml +++ b/src/main/webapp/client.xhtml @@ -84,6 +84,19 @@ + +
+
+ +
+ + + +
+ +
+
+ diff --git a/src/main/webapp/images/menu-icons/tango/edit-paste.png b/src/main/webapp/images/menu-icons/tango/edit-paste.png new file mode 100644 index 0000000..28dc0fe Binary files /dev/null and b/src/main/webapp/images/menu-icons/tango/edit-paste.png differ diff --git a/src/main/webapp/images/menu-icons/tango/input-keyboard.png b/src/main/webapp/images/menu-icons/tango/input-keyboard.png new file mode 100644 index 0000000..e1c28b9 Binary files /dev/null and b/src/main/webapp/images/menu-icons/tango/input-keyboard.png differ diff --git a/src/main/webapp/images/menu-icons/tango/system-log-out.png b/src/main/webapp/images/menu-icons/tango/system-log-out.png new file mode 100644 index 0000000..c2117a3 Binary files /dev/null and b/src/main/webapp/images/menu-icons/tango/system-log-out.png differ diff --git a/src/main/webapp/scripts/interface.js b/src/main/webapp/scripts/interface.js index e7ad4c3..ee0f497 100644 --- a/src/main/webapp/scripts/interface.js +++ b/src/main/webapp/scripts/interface.js @@ -37,7 +37,11 @@ var GuacamoleUI = { "showKeyboard" : document.getElementById("showKeyboard"), "ctrlAltDelete": document.getElementById("ctrlAltDelete"), "reconnect" : document.getElementById("reconnect"), - "logout" : document.getElementById("logout") + "logout" : document.getElementById("logout"), + + "touchShowClipboard" : document.getElementById("touchShowClipboard"), + "touchShowKeyboard" : document.getElementById("touchShowKeyboard"), + "touchLogout" : document.getElementById("touchLogout") }, @@ -133,6 +137,14 @@ var GuacamoleUI = { GuacamoleUI.display.style.opacity = "0.1"; }; + GuacamoleUI.hideTouchMenu = function() { + GuacamoleUI.touchMenu.style.visibility = "hidden"; + }; + + GuacamoleUI.showTouchMenu = function() { + GuacamoleUI.touchMenu.style.visibility = "visible"; + }; + GuacamoleUI.shadeMenu = function() { if (!menu_shaded) { @@ -212,8 +224,10 @@ var GuacamoleUI = { }; - // Assume no native OSK by default - GuacamoleUI.oskMode = GuacamoleUI.OSK_MODE_GUAC; + GuacamoleUI.buttons.touchShowClipboard.onclick = function() { + // FIXME: Implement + alert("Not yet implemented... Sorry."); + }; // Show/Hide keyboard var keyboardResizeInterval = null; @@ -228,22 +242,9 @@ var GuacamoleUI = { window.onresize = null; window.clearInterval(keyboardResizeInterval); } - - // If not shown ... action depends on OSK mode. - else { - - // If we think the platform has a native OSK, use the event target to - // cause it to display. - if (GuacamoleUI.oskMode == GuacamoleUI.OSK_MODE_NATIVE) { - - // ...but use the Guac OSK if clicked again - GuacamoleUI.oskMode = GuacamoleUI.OSK_MODE_GUAC; - // Try to show native OSK by focusing eventTarget. - GuacamoleUI.eventTarget.focus(); - return; - - } + // Otherwise, show it + else { // Ensure event target is NOT focused if we are using the Guac OSK. GuacamoleUI.eventTarget.blur(); @@ -253,18 +254,30 @@ var GuacamoleUI = { // Automatically update size window.onresize = updateKeyboardSize; - keyboardResizeInterval = window.setInterval(updateKeyboardSize, GuacamoleUI.KEYBOARD_AUTO_RESIZE_INTERVAL); + keyboardResizeInterval = window.setInterval(updateKeyboardSize, + GuacamoleUI.KEYBOARD_AUTO_RESIZE_INTERVAL); updateKeyboardSize(); + } - }; + // Touch-specific keyboard show + GuacamoleUI.buttons.touchShowKeyboard.ontouchstart = + GuacamoleUI.buttons.touchShowKeyboard.onclick = + function(e) { + GuacamoleUI.eventTarget.focus(); + GuacamoleUI.hideTouchMenu(); + e.preventDefault(); + }; + // Logout - GuacamoleUI.buttons.logout.onclick = function() { - window.location.href = "logout"; - }; + GuacamoleUI.buttons.logout.onclick = + GuacamoleUI.buttons.touchLogout.onclick = + function() { + window.location.href = "logout"; + }; // Timeouts for detecting if users wants menu to open or close var detectMenuOpenTimeout = null; @@ -350,7 +363,7 @@ var GuacamoleUI = { // Assume native OSK if menu shown via long-press GuacamoleUI.oskMode = GuacamoleUI.OSK_MODE_NATIVE; - GuacamoleUI.showMenu(); + GuacamoleUI.showTouchMenu(); }, GuacamoleUI.LONG_PRESS_DETECT_TIMEOUT); @@ -367,6 +380,7 @@ var GuacamoleUI = { // Close menu if shown GuacamoleUI.shadeMenu(); + GuacamoleUI.hideTouchMenu(); // Record touch location if (e.touches.length == 1) { diff --git a/src/main/webapp/styles/client.css b/src/main/webapp/styles/client.css index 9765833..ebed759 100644 --- a/src/main/webapp/styles/client.css +++ b/src/main/webapp/styles/client.css @@ -255,4 +255,14 @@ textarea#eventTarget { opacity: 0; overflow: hidden; +} + +/* Touch-specific menu */ + +div#touchMenu { + display: inline-block; + background: black; + border: 1px solid silver; + padding: 1em; + opacity: 0.8; } \ No newline at end of file