[Laszlo-checkins] r9460 - openlaszlo/trunk/WEB-INF/lps/lfc/kernel/dhtml

max@openlaszlo.org max at openlaszlo.org
Wed Jun 4 19:04:22 PDT 2008


Author: max
Date: 2008-06-04 19:04:17 -0700 (Wed, 04 Jun 2008)
New Revision: 9460

Modified:
   openlaszlo/trunk/WEB-INF/lps/lfc/kernel/dhtml/LzScreenKernel.js
   openlaszlo/trunk/WEB-INF/lps/lfc/kernel/dhtml/LzSprite.js
Log:
Change 20080604-maxcarlson-R by maxcarlson at Roboto on 2008-06-04 15:26:55 PDT
    in /Users/maxcarlson/openlaszlo/trunk-clean
    for http://svn.openlaszlo.org/openlaszlo/trunk

Summary: Fix embedding inside iframes for IE

Bugs Fixed: LPP-5365 - IE7 DHTML iframe embed doesn't respect dimensions; canvas sized to browser window instead

Technical Reviewer: promanik
QA Reviewer: hminsky
Doc Reviewer: (pending)

Details: LzSprite.js - Clean up tests for width/height in root sprite initialization.  Add document_size_compute_correct_height quirk for IE 6.

LzScreenKernel.js - Look in window instead of window.top for sizing.  Support document_size_compute_correct_height quirk.  Remove cruft.

Tests: Download the attached testcase from the bug report.  lpp-5365-ie-iframe-embed/main.jsp should show 100px for both embedded apps.  lpp-5365-ie-iframe-embed/main.lzx?lzr=dhtml  lpp-5365-ie-iframe-embed/main.lzx?lzr=dhtml&lzt=html show the same size across IE 6/7 Safari and Firefox.  my-apps/lpp-5365-ie-iframe-embed/main.lzx?lzr=dhtml&debug=true may show a slightly different size due to scrollbars, but the red line is always at the bottom of the viewport across IE 6/7 Safari and Firefox.



Modified: openlaszlo/trunk/WEB-INF/lps/lfc/kernel/dhtml/LzScreenKernel.js
===================================================================
--- openlaszlo/trunk/WEB-INF/lps/lfc/kernel/dhtml/LzScreenKernel.js	2008-06-04 23:39:02 UTC (rev 9459)
+++ openlaszlo/trunk/WEB-INF/lps/lfc/kernel/dhtml/LzScreenKernel.js	2008-06-05 02:04:17 UTC (rev 9460)
@@ -15,42 +15,37 @@
     ,height: null
     ,__resizeEvent: function() {
         // thanks quirksmode!  http://www.quirksmode.org/viewport/compatibility.html
-
-        var sc = window.top.document.body;
-        if (LzSprite.prototype.quirks.document_size_use_offsetheight) {
-            sc = window.document.body;
-            LzScreenKernel.width = sc.offsetWidth; 
-            LzScreenKernel.height = sc.offsetHeight; 
-        } else if (window.top.innerHeight) {
-            // all except Explorer
-            sc = window;
-            LzScreenKernel.width = sc.innerWidth;
-            LzScreenKernel.height = sc.innerHeight;
-        } else if (window.top.document.documentElement && window.top.document.documentElement.clientHeight) {
-            // Explorer 6 Strict Mode
-            sc = window.top.document.documentElement;
-            LzScreenKernel.width = sc.clientWidth;
-            LzScreenKernel.height = sc.clientHeight;
-        } else if (sc) {
-            // other Explorers
-            LzScreenKernel.width = sc.clientWidth;
-            LzScreenKernel.height = sc.clientHeight;
+        // Also see http://www.howtocreate.co.uk/tutorials/javascript/browserwindow
+        var q = LzSprite.prototype.quirks;
+        if (q.document_size_use_offsetheight) {
+            var scope = window.document.body;
+            LzScreenKernel.width = scope.offsetWidth; 
+            LzScreenKernel.height = scope.offsetHeight; 
+        } else if (window.innerHeight) {
+            // all except Explorer in strict mode
+            var scope = window;
+            LzScreenKernel.width = scope.innerWidth;
+            LzScreenKernel.height = scope.innerHeight;
+        } else if (document.documentElement && document.documentElement.clientWidth) {
+            // IE 6+ Strict Mode
+            var scope = document.documentElement;
+            if (q.document_size_compute_correct_height && window.top != window) {
+                var topscope = window.top.document.documentElement;
+                // IE 6 doesn't report the correct clientHeight for embedded iframes with scrollbars.  Measure the difference between this window and the parents, allowing 24px of slop.
+                if (Math.abs(topscope.clientWidth - scope.clientWidth) < 24 
+                    || Math.abs(topscope.clientHeight - scope.clientHeight) < 24) {
+                    scope = topscope;
+                }
+            }
+            LzScreenKernel.width = scope.clientWidth;
+            LzScreenKernel.height = scope.clientHeight;
+        } else if (window.document.body) {
+            var scope = window.document.body;
+            // IE 4
+            LzScreenKernel.width = scope.clientWidth;
+            LzScreenKernel.height = scope.clientHeight;
         }
 
-        /*
-        var test1 = window.top.document.body.scrollHeight;
-        var test2 = window.top.document.body.offsetHeight
-        if (test1 > test2) { 
-            // all but Explorer Mac
-            LzScreenKernel.width = window.top.document.body.scrollWidth;
-            LzScreenKernel.height = window.top.document.body.scrollHeight;
-        } else { 
-            // Explorer Mac;
-            //would also work in Explorer 6 Strict, Mozilla and Safari
-            LzScreenKernel.width = window.top.document.body.offsetWidth;
-            LzScreenKernel.height = window.top.document.body.offsetHeight;
-        }*/
-
         if (LzScreenKernel.__callback) LzScreenKernel.__scope[LzScreenKernel.__callback]({width: LzScreenKernel.width, height: LzScreenKernel.height});
         //Debug.write('LzScreenKernel event', {width: LzScreenKernel.width, height: LzScreenKernel.height});
     }

Modified: openlaszlo/trunk/WEB-INF/lps/lfc/kernel/dhtml/LzSprite.js
===================================================================
--- openlaszlo/trunk/WEB-INF/lps/lfc/kernel/dhtml/LzSprite.js	2008-06-04 23:39:02 UTC (rev 9459)
+++ openlaszlo/trunk/WEB-INF/lps/lfc/kernel/dhtml/LzSprite.js	2008-06-05 02:04:17 UTC (rev 9460)
@@ -27,17 +27,21 @@
             div.style.backgroundColor = p.bgcolor; 
             this.bgcolor = p.bgcolor; 
         }
-        if (p.width) {
-            root.style.width = p.width; 
-            div.style.width = p.width; 
-            var w = p.width.indexOf('%') != -1 ? p.width : parseInt(p.width);
+        var width = p.width;
+        if (width) {
+            root.style.width = width; 
+            div.style.width = width; 
+            var widthispercentage = width.indexOf('%') != -1;
+            var w = widthispercentage ? width : parseInt(width);
             this._w = w;
             this.width = w;
         }
-        if (p.height) {
-            root.style.height = p.height; 
-            div.style.height = p.height; 
-            var h = p.height.indexOf('%') != -1 ? p.height : parseInt(p.height);
+        var height = p.height;
+        if (height) {
+            root.style.height = height; 
+            div.style.height = height; 
+            var heightispercentage = height.indexOf('%') != -1;
+            var h = heightispercentage ? height : parseInt(height);
             this._h = h;
             this.height = h;
         }
@@ -54,7 +58,7 @@
         if (p.resourceroot) {
             lz.embed.options.resourceroot = p.resourceroot;
         }
-        if (this.quirks.canvas_div_cannot_be_clipped  == false && p.width && p.width.indexOf('%') == -1 && p.height && p.height.indexOf('%') == -1 ) {
+        if (! this.quirks.canvas_div_cannot_be_clipped && width && widthispercentage && height && heightispercentage) {
             div.style.clip = 'rect(0px ' + this._w + ' ' + this._h + ' 0px)';
             div.style.overflow = 'hidden';
         }
@@ -275,6 +279,7 @@
     ,keypress_function_keys: true
     ,ie_timer_closure: false
     ,keyboardlistentotop: false
+    ,document_size_compute_correct_height: false
 }
 
 LzSprite.prototype.capabilities = {
@@ -309,6 +314,8 @@
             if (lz.embed.browser.version < 7) {
                 // Provide IE PNG/opacity support
                 quirks['ie_alpha_image_loader'] = true;
+                // IE 6 reports incorrect clientHeight for embedded iframes with scrollbars
+                quirks['document_size_compute_correct_height'] = true;
             } else {
                 quirks['invisible_parent_image_sizing_fix'] = true;
             }
@@ -1342,7 +1349,7 @@
   * @access private
   */
 LzSprite.prototype.__updateClip = function() {
-    if (this.isroot && this.capabilities.canvas_div_cannot_be_clipped == true) return;
+    if (this.isroot && this.capabilities.canvas_div_cannot_be_clipped) return;
     if (this.clip && this.width != null && this.width >= 0 && this.height != null && this.height >= 0) {
         var s = 'rect(0px ' + this._w + ' ' + this._h + ' 0px)';
         this.__LZdiv.style.clip = s



More information about the Laszlo-checkins mailing list