[Laszlo-dev] LPP-8477, font changes when switching from single line to multiline in IE7

[P T Withington]

I added this to

http://jira.openlaszlo.org/jira/browse/LPP-8556

which is pretty relevant.  (I just created this to track the  
conversation Max and I have been having about adding default CSS style  
properties to <view>, so that people can easily use CSS without  
writing a lot of $style constraints.  In that conversation, we worried  
about how to handle CSS font specs, and I think this optimization will  
be an important part of that solution).

On 2009-10-14, at 10:11, Henry Minsky wrote:

> It sounds like a good optimization, maybe we should file an  
> improvement task
> for it..
> I suppose we'd need to check that IE7 didn't have some bug with  
> parsing the
> style
> text, like it has with reading it out...
>
>
> On Wed, Oct 14, 2009 at 10:09 AM, P T Withington <ptw at laszlosystems.com 
> >wrote:
>
>> My idea is that we'd keep the classes around, so if I create a div  
>> that
>> uses 15pt monospace, there would be a class for that.  I'd only  
>> create it
>> the first time around, after that, I'd look up the class name and  
>> just jam
>> it in:
>>
>> var fontclass = findClassForFont(style, variant, weight, size,  
>> lineHeight,
>> family);
>> div.className = 'lzswftext ' + fontclass;
>>
>> And when switching from single to multiline I would be able to just  
>> reuse
>> the "type style" class, doing something like:
>>
>> newdiv.className = olddiv.className.replace('lzswftext',
>> 'lzswftextmultiline');  // leave the type style class alone.
>>
>>
>>
>> On 2009-10-14, at 09:59, Henry Minsky wrote:
>>
>> What would be the advantage? making it cleaner to apply and remove  
>> these
>>> properties as a group? I don't think it would help with speed  
>>> because it
>>> would cost you as much time and space to cons up the new class as  
>>> to frob
>>> the properties directly on the div...
>>>
>>> On Wed, Oct 14, 2009 at 9:55 AM, P T Withington <ptw at laszlosystems.com
>>>> wrote:
>>>
>>> Ok, here's another idea, maybe too whacky:
>>>>
>>>> Instead of smacking styles into divs, what if we dynamically  
>>>> created a
>>>> CSS
>>>> class style rule for each case?  We already have some of this  
>>>> mechanism
>>>> in
>>>> the measurement cache.  At least for the various text attributes  
>>>> we could
>>>> do
>>>> something like, accumulate all the text style properties, build a  
>>>> CSS
>>>> rule,
>>>> assign it to a (generated) class name, and add that class name to  
>>>> the
>>>> div's
>>>> class (you can have multiple classes apply to a div, they are  
>>>> separated
>>>> by
>>>> spaces).
>>>>
>>>> We'd still use individual styles for position/overflow/width/ 
>>>> height/clip,
>>>> but for the styles that affect text, bundle them into a class.
>>>>
>>>>
>>>> On 2009-10-14, at 09:37, Henry Minsky wrote:
>>>>
>>>> In Firefox, asking for cssText gives you this
>>>>
>>>>>
>>>>> lzx> foo.sprite.__LzInputDiv.style.cssText
>>>>> 'overflow: scroll; font-family: monospace; width: 415px; height:  
>>>>> 115px;'
>>>>> lzx>
>>>>>
>>>>> But in IE7 you get no font info
>>>>> lzx> foo.sprite.__LzInputDiv.style.cssText
>>>>> 'OVERFLOW: scroll; WIDTH: 417px; CLIP: rect(auto auto auto auto);
>>>>> HEIGHT:
>>>>> 117px'
>>>>> lzx>
>>>>>
>>>>>
>>>>> On Wed, Oct 14, 2009 at 9:29 AM, Henry Minsky <henry.minsky at gmail.com
>>>>>
>>>>>> wrote:
>>>>>>
>>>>>
>>>>> That apparently does not work in IE7 for some reason...
>>>>>
>>>>>>
>>>>>> On Wed, Oct 14, 2009 at 9:25 AM, P T Withington <ptw at laszlosystems.com
>>>>>>
>>>>>>> wrote:
>>>>>>>
>>>>>>
>>>>>> I don't follow.  setMultiline copies _all_ of the div styles  
>>>>>> over:
>>>>>>
>>>>>>>
>>>>>>>   lz.embed.__setAttr(newdiv, 'style', olddiv.style.cssText);
>>>>>>>
>>>>>>> (in addition to the scroll position).  So, something else is  
>>>>>>> going
>>>>>>> wrong...
>>>>>>>
>>>>>>>
>>>>>>> On 2009-10-14, at 08:22, Max Carlson wrote:
>>>>>>>
>>>>>>> Yes, I think it needs to copy the necessary fontstyles over.   
>>>>>>> Right
>>>>>>> now
>>>>>>>
>>>>>>> LzInputTextSprite#setMultiline() only preserves the text  
>>>>>>> contents,
>>>>>>>> scrollLeft and scrollTop.  The necessary styles should be  
>>>>>>>> preserved
>>>>>>>> in:
>>>>>>>> LzInputTextSprite.prototype.__fontStyle = 'normal';
>>>>>>>> LzInputTextSprite.prototype.__fontWeight = 'normal';
>>>>>>>> LzInputTextSprite.prototype.__fontSize = '11px';
>>>>>>>> LzInputTextSprite.prototype.__fontFamily = 'Verdana,Vera,sans- 
>>>>>>>> serif';
>>>>>>>>
>>>>>>>> I'd avoid copying the entire CSS style - that's pretty risky.
>>>>>>>>
>>>>>>>> Henry Minsky wrote:
>>>>>>>>
>>>>>>>> I'm trying to figure out why the font is changing back to the  
>>>>>>>> default
>>>>>>>>
>>>>>>>>> font when an input field
>>>>>>>>> is set to multiline in IE7/DHTML.
>>>>>>>>> The code in LzInputTextSprite.setMultiline does create a new  
>>>>>>>>> div,
>>>>>>>>> with
>>>>>>>>> _createInputDiv, does that need to
>>>>>>>>> copy the font styles over?
>>>>>>>>> <canvas>
>>>>>>>>> <inputtext id="foo" width="400" x="14" name="foo"   
>>>>>>>>> font="monospace"
>>>>>>>>> fontsize="11" fontstyle="plain"
>>>>>>>>>       multiline="false"
>>>>>>>>>       text="${canvas.runtime}"
>>>>>>>>>       bgcolor="#ccffcc"
>>>>>>>>>       onclick="   setAttribute('multiline', true);
>>>>>>>>> this.setAttribute('height', 100); "/>
>>>>>>>>> </canvas>
>>>>>>>>> --
>>>>>>>>> Henry Minsky
>>>>>>>>> Software Architect
>>>>>>>>> hminsky at laszlosystems.com <mailto:hminsky at laszlosystems.com>
>>>>>>>>>
>>>>>>>>>
>>>>>>>>> --
>>>>>>>> Regards,
>>>>>>>> Max Carlson
>>>>>>>> OpenLaszlo.org
>>>>>>>>
>>>>>>>>
>>>>>>>>
>>>>>>>
>>>>>>>
>>>>>> --
>>>>>> Henry Minsky
>>>>>> Software Architect
>>>>>> hminsky at laszlosystems.com
>>>>>>
>>>>>>
>>>>>>
>>>>>>
>>>>>>
>>>>> --
>>>>> Henry Minsky
>>>>> Software Architect
>>>>> hminsky at laszlosystems.com
>>>>>
>>>>>
>>>>
>>>>
>>>
>>> --
>>> Henry Minsky
>>> Software Architect
>>> hminsky at laszlosystems.com
>>>
>>
>>
>
>
> -- 
> Henry Minsky
> Software Architect
> hminsky at laszlosystems.com