Hi Carlos,

classList was not used earlier because Arrays are cumbersome in MXML.

In MXML, folks can add more than one class using space delimited list of
strings:

<js:Label id="myLabel" className="BigFont SuperScript" label="some Big
SuperScript" />

In AS, folks can delete classnames via:

myLabel.className="SmallFont";

I don't believe your proposal takes these scenarios into account.

Thanks,
-Alex

On 3/12/18, 4:04 PM, "carlos.rov...@gmail.com on behalf of Carlos Rovira"
<carlos.rov...@gmail.com on behalf of carlosrov...@apache.org> wrote:

>Hi,
>
>I made a branch from jewel branch to try UIBase for you to check
>(feature/uibase-classlist).
>
>My thinking is that classList simplifies all a lot since is a managed list
>with steroids that is made for you to use.
>I suppose that when FlexJS was started this API was not known or known but
>can't be used due to IE limittations.
>
>To make the experiment I copied UIBase to Jewel library *as is* and make
>the changes.
>
>For me the change is as simple as this:
>
>private var _className:String;
>
>/**
>* The classname. Often used for CSS
>* class selector lookups.
>*
>* @langversion 3.0
>* @playerversion Flash 10.2
>* @playerversion AIR 2.6
>* @productversion Royale 0.0
>*/
>public function get className():String
>        {
>            return _className;
>        }
>
>/**
>* @private
>*/
>public function set className(value:String):void
>{
>if (_className !== value)
>{
>_className = value;
>
>COMPILE::JS
>{
>setClassName(_className);
>}
>dispatchEvent(new Event("classNameChanged"));
>}
>}
>
>COMPILE::JS
>protected function setClassName(value:String):void
>{
>element.classList.add(value);
>}
>
>this is a first iteration, maybe things can be do better, even simpler.
>no more tricky complex things with typenames and classnames
>
>
>you simply add to classlist, or if want to remove call directly
>"element.classList.remove", or toggle, or contains.
>
>I have it working my example in that branch and code simplifies greatly.
>
>(only buttons, since the rest of controls are still without changes)
>
>this even made what Alex want with "typeNames" since, If I added a class
>"Button", when I extend, it remains without do nothing
>
>to add "primary" or remove, I only need one line of code:
>
>element.classList.toggle("primary", value);
>
>So, what do you think? I know this can be a huge change in Royale, but is
>something cumbersome in the actual state, or I had to fight with it in
>MDL,
>now Harbs, Piotr and all people going that is having trouble and wasting
>time.
>
>Maybe it could be better to just make this change and make Royale more
>easy
>to change styles without not much hassle.
>
>All I see are benefits:
>
>* API is in the browser build-in, so I think it will be performant
>* removes lots of inefficient code that is cumbersome
>* makes API more easy
>* removes the need to have typeNames and classNames since we have
>persistent class just out-of-the-box
>* we get all the api without the need to add it
>(add/remove/contains/toggle)
>* it's supported in all browsers we target
>* is totaly PAYG
>
>Please, let me know what do you think. I'll read it tomorrow since I'm
>closing for today
>
>Thanks
>
>
>-- 
>Carlos Rovira
>https://na01.safelinks.protection.outlook.com/?url=http%3A%2F%2Fabout.me%2
>Fcarlosrovira&data=02%7C01%7Caharui%40adobe.com%7C3c0a0cd0210e45ecbae208d5
>886dacbc%7Cfa7b1b5a7b34438794aed2c178decee1%7C0%7C0%7C636564926990512873&s
>data=4sznARhAbaYEIF60rTmfSOsj9gSU1BZhYE18cUgIELU%3D&reserved=0

Reply via email to