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

[hqm@openlaszlo.org]

Author: hqm
Date: 2009-06-10 12:38:23 -0700 (Wed, 10 Jun 2009)
New Revision: 14109

Modified:
   openlaszlo/trunk/WEB-INF/lps/lfc/kernel/dhtml/LzInputTextSprite.js
   openlaszlo/trunk/WEB-INF/lps/lfc/kernel/dhtml/LzSprite.js
Log:
Change 20090610-hqm-6 by hqm at badtzmaru.home on 2009-06-10 15:36:44 EDT
    in /Users/hqm/openlaszlo/trunk-diamond
    for http://svn.openlaszlo.org/openlaszlo/trunk

Summary: fix for "Windows DHTML edittext selection doesn't change background color of text"

New Features:

Bugs Fixed: LPP-8121

Technical Reviewer: max
QA Reviewer: (pending)
Doc Reviewer: (pending)

Documentation:

Release Notes:

Details:

+ See comment in LzInputTextSprite.js

Added a quirk to create a (zero sized) container div with background color of white,
which inputtext gets put in, to force the highlight color in Firefox/IE to dark blue




       // TODO [hqm 2009-06-09] LPP-8121 I discovered that if an
       // input field is contained within a div which has a white
       // background color, then it selected text will highlight with
       // a dark blue color. The div can have zero width,
       // Windows/Firefox only seems to look at the bgcolor of the
       // containing div when deciding what color to use for input
       // text highlight. So this adds an extra div, with zero width,
       // in which the actual clickable/selectable input text element
       // is placed.


Tests:

test case

+ in the lzmail app login window, if you type some text into the username field,
and then select it, it should highlight in dark blue. In the app itself, any input
field should also highlight as dark blue.

+ Selected text should highlight with dark blue, in Windows/Firefox3.
If it highlights with a light or white color, that is a bug.

<canvas width="100%" height="80%" bgcolor="#898989">
   <inputtext id="e1">ABCDEFGHIJKLMNOPQRSTIVWYXZ 1234567890</inputtext>
</canvas>




Modified: openlaszlo/trunk/WEB-INF/lps/lfc/kernel/dhtml/LzInputTextSprite.js
===================================================================
--- openlaszlo/trunk/WEB-INF/lps/lfc/kernel/dhtml/LzInputTextSprite.js	2009-06-10 18:59:09 UTC (rev 14108)
+++ openlaszlo/trunk/WEB-INF/lps/lfc/kernel/dhtml/LzInputTextSprite.js	2009-06-10 19:38:23 UTC (rev 14109)
@@ -80,8 +80,28 @@
         } else {
             this.__LZinputclickdiv.onmouseover = this.__handlemouse; 
         }
+
+    if (this.quirks.input_highlight_bug) {
+        // TODO [hqm 2009-06-09] LPP-8121 I discovered that if an
+        // input field is contained within a div which has a white
+        // background color, then it selected text will highlight with
+        // a dark blue color. The div can have zero width,
+        // Windows/Firefox only seems to look at the bgcolor of the
+        // containing div when deciding what color to use for input
+        // text highlight. So this adds an extra div, with zero width,
+        // in which the actual clickable/selectable input text element
+        // is placed.
+        var ffoxdiv = document.createElement('div');
+        ffoxdiv.style.backgroundColor = 'white';
+        ffoxdiv.style.width = '0px';
+        this.__LZclickcontainerdiv.appendChild(ffoxdiv);        
+        ffoxdiv.appendChild(this.__LZinputclickdiv);
+    } else {
         this.__LZclickcontainerdiv.appendChild(this.__LZinputclickdiv);
+    }
+
     }    
+
     this.__LZdiv.appendChild(this.__LzInputDiv);
 
     //Debug.write(this.__LzInputDiv.style);

Modified: openlaszlo/trunk/WEB-INF/lps/lfc/kernel/dhtml/LzSprite.js
===================================================================
--- openlaszlo/trunk/WEB-INF/lps/lfc/kernel/dhtml/LzSprite.js	2009-06-10 18:59:09 UTC (rev 14108)
+++ openlaszlo/trunk/WEB-INF/lps/lfc/kernel/dhtml/LzSprite.js	2009-06-10 19:38:23 UTC (rev 14109)
@@ -509,6 +509,8 @@
     ,clipped_scrollbar_causes_display_turd: false
     ,detectstuckkeys: false
     ,textgrabsinputtextfocus: false
+    ,input_highlight_bug: false
+
 }
 
 LzSprite.prototype.capabilities = {
@@ -688,6 +690,8 @@
             // overflow:scroll flicker when scrolling
             if (browser.OS == 'Windows') {
                 quirks['clipped_scrollbar_causes_display_turd'] = true;
+                // LPP-8121 inputtext selection highlight color depends on underlying div bgcolor
+                quirks['input_highlight_bug'] = true;
             }
             if (browser.version < 2) {
                 // see http://groups.google.ca/group/netscape.public.mozilla.dom/browse_thread/thread/821271ca11a1bdbf/46c87b49c026246f?lnk=st&q=+focus+nsIAutoCompletePopup+selectedIndex&rnum=1