--- loncom/interface/loncommon.pm	2007/09/26 12:34:19	1.589
+++ loncom/interface/loncommon.pm	2007/09/27 15:36:23	1.590
@@ -1,7 +1,7 @@
 # The LearningOnline Network with CAPA
 # a pile of common routines
 #
-# $Id: loncommon.pm,v 1.589 2007/09/26 12:34:19 raeburn Exp $
+# $Id: loncommon.pm,v 1.590 2007/09/27 15:36:23 raeburn Exp $
 #
 # Copyright Michigan State University Board of Trustees
 #
@@ -1074,48 +1074,95 @@ sub changable_area {
 
 =pod
 
-=item * resize_textarea_js
-
-emits the needed javascript to resize a textarea to be as big as possible
-
-creates a function resize_textrea that takes two IDs first should be
-the id of the element to resize, second should be the id of a div that
-surrounds everything that comes after the textarea, this routine needs
-to be attached to the <body> for the onload and onresize events.
+=item * viewport_geometry_js {
 
+Provides javascript object (Geometry) which can provide information about the viewport geometry for the client browser.
 
 =cut
 
-sub resize_textarea_js {
-    return <<"RESIZE";
-    <script type="text/javascript">
+
+sub viewport_geometry_js { 
+    return <<"GEOMETRY";
 var Geometry = {};
 function init_geometry() {
     if (Geometry.init) { return };
     Geometry.init=1;
     if (window.innerHeight) {
-	Geometry.getViewportHeight   = function() { return window.innerHeight; };
-	Geometry.getHorizontalScroll = function() { return window.pageXOffset; };
-	Geometry.getVerticalScroll   = function() { return window.pageYOffset; };
+        Geometry.getViewportHeight   = function() { return window.innerHeight; };
+        Geometry.getViewportWidth   = function() { return window.innerWidth; };
+        Geometry.getHorizontalScroll = function() { return window.pageXOffset; };
+        Geometry.getVerticalScroll   = function() { return window.pageYOffset; };
     }
     else if (document.documentElement && document.documentElement.clientHeight) {
-	Geometry.getViewportHeight = 
-	    function() { return document.documentElement.clientHeight; };
-	Geometry.getHorizontalScroll = 
-	    function() { return document.documentElement.scrollLeft; };
-	Geometry.getVerticalScroll = 
-	    function() { return document.documentElement.scrollTop; };
+        Geometry.getViewportHeight =
+            function() { return document.documentElement.clientHeight; };
+        Geometry.getViewportWidth =
+            function() { return document.documentElement.clientWidth; };
+
+        Geometry.getHorizontalScroll =
+            function() { return document.documentElement.scrollLeft; };
+        Geometry.getVerticalScroll =
+            function() { return document.documentElement.scrollTop; };
     }
     else if (document.body.clientHeight) {
-	Geometry.getViewportHeight = 
-	    function() { return document.body.clientHeight; };
-	Geometry.getHorizontalScroll = 
-	    function() { return document.body.scrollLeft; };
-	Geometry.getVerticalScroll = 
-	    function() { return document.body.scrollTop; };
+        Geometry.getViewportHeight =
+            function() { return document.body.clientHeight; };
+        Geometry.getViewportWidth =
+            function() { return document.body.clientWidth; };
+        Geometry.getHorizontalScroll =
+            function() { return document.body.scrollLeft; };
+        Geometry.getVerticalScroll =
+            function() { return document.body.scrollTop; };
     }
 }
 
+GEOMETRY
+}
+
+=pod
+
+=item * viewport_size_js {
+
+Provides a javascript function to set values of two form elements - width and height (elements are passed in as arguments to the javascript function) to the dimensions of the user's browser window. 
+
+=cut
+
+sub viewport_size_js {
+    my $geometry = &viewport_geometry_js();
+    return <<"DIMS";
+
+$geometry
+
+function getViewportDims(width,height) {
+    init_geometry();
+    width.value = Geometry.getViewportWidth();
+    height.value = Geometry.getViewportHeight();
+    return;
+}
+
+DIMS
+}
+
+=pod
+
+=item * resize_textarea_js
+
+emits the needed javascript to resize a textarea to be as big as possible
+
+creates a function resize_textrea that takes two IDs first should be
+the id of the element to resize, second should be the id of a div that
+surrounds everything that comes after the textarea, this routine needs
+to be attached to the <body> for the onload and onresize events.
+
+
+=cut
+
+sub resize_textarea_js {
+    my $geometry = &viewport_geometry_js();
+    return <<"RESIZE";
+    <script type="text/javascript">
+$geometry
+
 function getX(element) {
     var x = 0;
     while (element) {
@@ -4921,7 +4968,7 @@ table.LC_double_column {
 }
 
 table.LC_double_column tr td.LC_left_col {
-  top: 2x;
+  top: 2px;
   left: 2px;
   width: 47%;
   vertical-align: top;
