Determine size of viewport using element stretched to fit view.
authorMichael Jumper <zhangmaike@users.sourceforge.net>
Wed, 25 Jan 2012 05:05:01 +0000 (21:05 -0800)
committerMichael Jumper <zhangmaike@users.sourceforge.net>
Wed, 25 Jan 2012 05:05:01 +0000 (21:05 -0800)
src/main/webapp/client.xhtml
src/main/webapp/scripts/interface.js
src/main/webapp/styles/client.css

index 1f43296..21a837f 100644 (file)
@@ -65,6 +65,9 @@
         <!-- On-screen keyboard -->
         <div id="keyboardContainer"></div>
 
+        <!-- Dimensional clone of viewport -->
+        <div id="viewportClone"/>
+
         <!-- Dialogs -->
         <div class="dialogOuter">
             <div class="dialogMiddle">
index c42f39a..527fd77 100644 (file)
@@ -2,6 +2,7 @@
 // UI Definition
 var GuacamoleUI = {
 
+    "viewport"    : document.getElementById("viewportClone"),
     "display"     : document.getElementById("display"),
     "menu"        : document.getElementById("menu"),
     "menuControl" : document.getElementById("menuControl"),
@@ -303,8 +304,9 @@ GuacamoleUI.attach = function(guac) {
             var mouse_view_x = mouseState.x + GuacamoleUI.display.offsetLeft - window.pageXOffset;
             var mouse_view_y = mouseState.y + GuacamoleUI.display.offsetTop - window.pageYOffset;
 
-            var view_width = document.body.clientWidth;
-            var view_height = document.body.clientHeight;
+            // Determine viewport dimensioins
+            var view_width = GuacamoleUI.viewport.offsetWidth;
+            var view_height = GuacamoleUI.viewport.offsetHeight;
 
             // Determine scroll amounts based on mouse position relative to document
 
@@ -323,7 +325,7 @@ GuacamoleUI.attach = function(guac) {
                 scroll_amount_y = mouse_view_y;
             else
                 scroll_amount_y = 0;
-       
+
             // Scroll (if necessary) to keep mouse on screen.
             window.scrollBy(scroll_amount_x, scroll_amount_y);
        
index 9d5025e..b3693ae 100644 (file)
@@ -171,3 +171,16 @@ div#menuControl {
 
     z-index: 3;
 }
+
+/* Viewport Clone */
+
+div#viewportClone {
+    display: table;
+    height: 100%;
+    width: 100%;
+    position: fixed;
+    left: 0;
+    top: 0;
+
+    visibility: hidden;
+}