Clipboard which can be activated/used from within the touch menu.
[guacamole.git] / src / main / webapp / scripts / interface.js
index 3ad73fb..e12f4df 100644 (file)
@@ -2,6 +2,9 @@
 // UI Definition
 var GuacamoleUI = {
 
+    "LOGOUT_PROMPT" :   "Logging out will disconnect all of your active "
+                      + "Guacamole sessions. Are you sure you wish to log out?",
+
     /* Detection Constants */
     
     "LONG_PRESS_DETECT_TIMEOUT"     : 800, /* milliseconds */
@@ -46,13 +49,15 @@ var GuacamoleUI = {
     },
 
     "containers": {
-        "state"    : document.getElementById("statusDialog"),
-        "clipboard": document.getElementById("clipboardDiv"),
-        "keyboard" : document.getElementById("keyboardContainer")
+        "state"         : document.getElementById("statusDialog"),
+        "clipboard"     : document.getElementById("clipboardDiv"),
+        "touchClipboard": document.getElementById("touchClipboardDiv"),
+        "keyboard"      : document.getElementById("keyboardContainer")
     },
     
-    "state"     : document.getElementById("statusText"),
-    "clipboard" : document.getElementById("clipboard")
+    "state"          : document.getElementById("statusText"),
+    "clipboard"      : document.getElementById("clipboard"),
+    "touchClipboard" : document.getElementById("touchClipboard")
 
 };
 
@@ -140,21 +145,31 @@ var GuacamoleUI = {
     GuacamoleUI.hideTouchMenu = function() {
         GuacamoleUI.touchMenu.style.visibility = "hidden";
     };
-    
-    GuacamoleUI.showTouchMenu = function() {
-        
-        GuacamoleUI.touchMenu.style.left =
-            ((GuacamoleUI.viewport.offsetWidth - GuacamoleUI.touchMenu.offsetWidth) / 2
+
+    function positionCentered(element) {
+        element.style.left =
+            ((GuacamoleUI.viewport.offsetWidth - element.offsetWidth) / 2
             + window.pageXOffset)
             + "px";
 
-        GuacamoleUI.touchMenu.style.top =
-            ((GuacamoleUI.viewport.offsetHeight - GuacamoleUI.touchMenu.offsetHeight) / 2
+        element.style.top =
+            ((GuacamoleUI.viewport.offsetHeight - element.offsetHeight) / 2
             + window.pageYOffset)
             + "px";
+    }
 
+    GuacamoleUI.showTouchMenu = function() {
+        positionCentered(GuacamoleUI.touchMenu);
         GuacamoleUI.touchMenu.style.visibility = "visible";
-        
+    };
+
+    GuacamoleUI.hideTouchClipboard = function() {
+        GuacamoleUI.containers.touchClipboard.style.visibility = "hidden";
+    };
+
+    GuacamoleUI.showTouchClipboard = function() {
+        positionCentered(GuacamoleUI.containers.touchClipboard);
+        GuacamoleUI.containers.touchClipboard.style.visibility = "visible";
     };
 
     GuacamoleUI.shadeMenu = function() {
@@ -237,8 +252,8 @@ var GuacamoleUI = {
     };
 
     GuacamoleUI.buttons.touchShowClipboard.onclick = function() {
-        // FIXME: Implement
-        alert("Not yet implemented... Sorry.");
+        GuacamoleUI.hideTouchMenu();
+        GuacamoleUI.showTouchClipboard();
     };
 
     // Show/Hide keyboard
@@ -276,19 +291,33 @@ var GuacamoleUI = {
     };
 
     // Touch-specific keyboard show
-    GuacamoleUI.buttons.touchShowKeyboard.ontouchstart = 
     GuacamoleUI.buttons.touchShowKeyboard.onclick = 
         function(e) {
+
+            // Center event target in case browser automatically centers
+            // input fields on focus.
+            GuacamoleUI.eventTarget.style.left =
+                (window.pageXOffset + GuacamoleUI.viewport.offsetWidth / 2) + "px";
+
+            GuacamoleUI.eventTarget.style.top =
+                (window.pageYOffset + GuacamoleUI.viewport.offsetHeight / 2) + "px";
+
             GuacamoleUI.eventTarget.focus();
             GuacamoleUI.hideTouchMenu();
-            e.preventDefault();
+
         };
 
     // Logout
     GuacamoleUI.buttons.logout.onclick =
     GuacamoleUI.buttons.touchLogout.onclick =
         function() {
-            window.location.href = "logout";
+
+            // Logout after warning user about session disconnect
+            if (confirm(GuacamoleUI.LOGOUT_PROMPT)) {
+                window.location.href = "logout";
+                GuacamoleUI.hideTouchMenu();
+            }
+            
         };
 
     // Timeouts for detecting if users wants menu to open or close
@@ -393,6 +422,7 @@ var GuacamoleUI = {
         // Close menu if shown
         GuacamoleUI.shadeMenu();
         GuacamoleUI.hideTouchMenu();
+        GuacamoleUI.hideTouchClipboard();
         
         // Record touch location
         if (e.touches.length == 1) {
@@ -693,23 +723,35 @@ GuacamoleUI.attach = function(guac) {
     GuacamoleUI.clipboard.onchange = function() {
 
         var text = GuacamoleUI.clipboard.value;
+        GuacamoleUI.touchClipboard.value = text;
+        guac.setClipboard(text);
+
+    };
+
+    GuacamoleUI.touchClipboard.onchange = function() {
+
+        var text = GuacamoleUI.touchClipboard.value;
+        GuacamoleUI.clipboard.value = text;
         guac.setClipboard(text);
 
     };
 
     // Ignore keypresses when clipboard is focused
-    GuacamoleUI.clipboard.onfocus = function() {
+    GuacamoleUI.clipboard.onfocus =
+    GuacamoleUI.touchClipboard.onfocus = function() {
         disableKeyboard();
     };
 
     // Capture keypresses when clipboard is not focused
-    GuacamoleUI.clipboard.onblur = function() {
+    GuacamoleUI.clipboard.onblur =
+    GuacamoleUI.touchClipboard.onblur = function() {
         enableKeyboard();
     };
 
     // Server copy handler
     guac.onclipboard = function(data) {
         GuacamoleUI.clipboard.value = data;
+        GuacamoleUI.touchClipboard.value = data;
     };
 
     GuacamoleUI.keyboard.onkeydown = function(keysym) {
@@ -735,4 +777,4 @@ GuacamoleUI.attach = function(guac) {
         guac.sendKeyEvent(0, KEYSYM_CTRL);
     };
 
-};
\ No newline at end of file
+};