From 936e47911af0153d111b22473450fca0a7757d8c Mon Sep 17 00:00:00 2001
From: Michael Jumper <zhangmaike@users.sourceforge.net>
Date: Fri, 6 Apr 2012 11:53:32 -0700
Subject: [PATCH] Alter viewportClone into actual scrollable viewport, where
 all previously fixed elements are now absolute. Fixes issues on iPad and
 other tablets where reflowing of page did not reflow touch areas. Fixes issue
 where typing via native OSK automatically scrolled up to the top of the view.

---
 guacamole/src/main/webapp/client.xhtml         | 16 ++++++++--------
 guacamole/src/main/webapp/scripts/interface.js | 15 ++++++++++-----
 2 files changed, 18 insertions(+), 13 deletions(-)

diff --git a/guacamole/src/main/webapp/client.xhtml b/guacamole/src/main/webapp/client.xhtml
index 2ac8a7a15..58c41af69 100644
--- a/guacamole/src/main/webapp/client.xhtml
+++ b/guacamole/src/main/webapp/client.xhtml
@@ -57,20 +57,20 @@
         <!-- Keyboard event target for platforms with native OSKs -->
         <textarea id="eventTarget"></textarea>
 
-        <!-- Display -->
-        <div id="display">
-            
-            <!-- Menu trigger -->
-            <div id="menuControl"></div>
+        <!-- Menu trigger -->
+        <div id="menuControl"></div>
+
+        <!-- Scrollable viewport -->
+        <div id="viewport">
+
+            <!-- Display -->
+            <div id="display"></div>
 
         </div>
 
         <!-- On-screen keyboard -->
         <div id="keyboardContainer"></div>
 
-        <!-- Dimensional clone of viewport -->
-        <div id="viewportClone"/>
-
         <!-- Dialogs -->
         <div class="dialogOuter">
             <div class="dialogMiddle">
diff --git a/guacamole/src/main/webapp/scripts/interface.js b/guacamole/src/main/webapp/scripts/interface.js
index e7ad4c349..c5c4e6506 100644
--- a/guacamole/src/main/webapp/scripts/interface.js
+++ b/guacamole/src/main/webapp/scripts/interface.js
@@ -23,7 +23,7 @@ var GuacamoleUI = {
 
     /* UI Elements */
 
-    "viewport"    : document.getElementById("viewportClone"),
+    "viewport"    : document.getElementById("viewport"),
     "display"     : document.getElementById("display"),
     "menu"        : document.getElementById("menu"),
     "menuControl" : document.getElementById("menuControl"),
@@ -463,10 +463,14 @@ GuacamoleUI.attach = function(guac) {
     var mouse = new Guacamole.Mouse(guac_display);
     mouse.onmousedown = mouse.onmouseup = mouse.onmousemove =
         function(mouseState) {
-       
+      
+            // Get current viewport scroll
+            var scroll_x = GuacamoleUI.viewport.scrollLeft;
+            var scroll_y = GuacamoleUI.viewport.scrollTop;
+      
             // Determine mouse position within view
-            var mouse_view_x = mouseState.x + guac_display.offsetLeft - window.pageXOffset;
-            var mouse_view_y = mouseState.y + guac_display.offsetTop  - window.pageYOffset;
+            var mouse_view_x = mouseState.x + guac_display.offsetLeft - scroll_x;
+            var mouse_view_y = mouseState.y + guac_display.offsetTop  - scroll_y;
 
             // Determine viewport dimensioins
             var view_width  = GuacamoleUI.viewport.offsetWidth;
@@ -491,7 +495,8 @@ GuacamoleUI.attach = function(guac) {
                 scroll_amount_y = 0;
 
             // Scroll (if necessary) to keep mouse on screen.
-            window.scrollBy(scroll_amount_x, scroll_amount_y);
+            GuacamoleUI.viewport.scrollLeft += scroll_amount_x;
+            GuacamoleUI.viewport.scrollTop  += scroll_amount_y;
        
             // Send mouse event
             guac.sendMouseState(mouseState);