Automatically reposition event target on focus in case browser automatically centers...

[guacamole.git] / src / main / webapp / scripts / interface.js

diff --git a/src/main/webapp/scripts/interface.js b/src/main/webapp/scripts/interface.js
index e010272..67640ed 100644 (file)
--- a/src/main/webapp/scripts/interface.js
+++ b/src/main/webapp/scripts/interface.js
@@ -279,6 +279,15 @@ var GuacamoleUI = {
     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();
@@ -447,6 +456,12 @@ var GuacamoleUI = {
     GuacamoleUI.eventTarget.setAttribute("autocorrect", "off");
     GuacamoleUI.eventTarget.setAttribute("autocapitalize", "off");
 
+    // Automatically reposition event target on scroll
+    window.addEventListener("scroll", function() {
+        GuacamoleUI.eventTarget.style.left = window.pageXOffset + "px";
+        GuacamoleUI.eventTarget.style.top = window.pageYOffset + "px";
+    });
+
 })();
 
 // Tie UI events / behavior to a specific Guacamole client