Carlos,
I don't see in your examples things which I've asked you in the previous
thread. Let me ask you once again. Please test with your code following
example.
1) Create custom style.
.myCustomStyle
{
fontSize: 12px;
/// some style whatever
}
2. Set in your example
<j:TextButton text="PRIMARY" className="myCustomStyle" primary="true"/>
Compile and check whether custom class is setup, along with typeNames and
primary in output html. Let me know. Thanks, Piotr
2018-03-13 0:04 GMT+01:00 Carlos Rovira <[email protected]>:
> 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
> http://about.me/carlosrovira
>
--
Piotr Zarzycki
Patreon: *https://www.patreon.com/piotrzarzycki
<https://www.patreon.com/piotrzarzycki>*
