Hi Harbs,

if once typenames and classnames are set, if UIBase changes the way it
manages className to use element.classList, things will be more easy and a
matter of use add/remove/toggle methods in element.classList. right?
if people changes className directly will be bad, unless he/she wants to
override it completely (and if they want to do that since they needed, why
not?)

2018-03-12 17:51 GMT+01:00 Harbs <harbs.li...@gmail.com>:

> Right, but Carlos is using: element.classList.toggle("primary", value);
> (and similar)
>
> That will be overwritten if someone sets myButton.className = “foo_class”;
> (where myButton is some kind of UIBase)
>
> You cannot even do something like this: myButton.className =
> myButton.className +  “ foo_class”; because the properties such as
> “primary” are not being included in the typeNames or classNames.
>
> Harbs
>
> > On Mar 12, 2018, at 6:42 PM, Alex Harui <aha...@adobe.com.INVALID>
> wrote:
> >
> > Well, it isn't fair if someone writes to element.className, but we
> control
> > what happens when someone writes to UIBase.className.  I just want it to
> > be as simple as possible and PAYG.
> >
> > -Alex
> >
> > On 3/12/18, 9:21 AM, "Harbs" <harbs.li...@gmail.com <mailto:
> harbs.li...@gmail.com>> wrote:
> >
> >> I’m pretty sure your solution will only work if the user doesn’t set a
> >> className of their own. Setting className overwrites the entire
> classList.
> >>
> >>> On Mar 12, 2018, at 5:45 PM, Carlos Rovira <carlosrov...@apache.org>
> >>> wrote:
> >>>
> >>> Hi
> >>>
> >>> I made some simplification that works ok in Jewel:
> >>>
> >>> 1.- remove CSSClassList and use element.classList since is native and
> >>> supported in all browsers we target, this simplifies code, and removes
> >>> classes from core.
> >>> 2.- I still need to use some additional code that can be simplified.
> I'm
> >>> doing:
> >>>
> >>> element.classList.toggle("primary", value);
> >>> setClassName(computeFinalClassNames());
> >>> classList has its own toggle function that makes super easy to manage
> >>> adds
> >>> and removes, so no need to have a custom function in royale
> >>>
> >>> that uses:
> >>>
> >>> COMPILE::JS
> >>> override protected function computeFinalClassNames():String
> >>> {
> >>> return super.computeFinalClassNames() + " " + element.classList;
> >>> }
> >>>
> >>> I'd like to remove that and change the "setClassName" call to nothing,
> >>> if
> >>> we change UIBase to simple use classList
> >>>
> >>> My guess is that we can have "typenames" and "classNames" but once all
> >>> set,
> >>> all can be managed with classList to add/remove since this is native
> and
> >>> manages all itself
> >>>
> >>> thoughts?
> >>>
> >>>
> >>>
> >>>
> >>>
> >>> 2018-03-12 14:01 GMT+01:00 Carlos Rovira <carlosrov...@apache.org>:
> >>>
> >>>> Hi,
> >>>>
> >>>> long thread and very useful read here. Since Jewel is very similar to
> >>>> MDL
> >>>> in adding/removing classes I want to comment here some things:
> >>>>
> >>>> 1.- I just changed jewel typenames to the constructor and things works
> >>>> ok,
> >>>> I could remove the createElement override
> >>>> 2.- I have into account the use of typenames as something inmutable
> (as
> >>>> part of definition of a component) and classNames as things that are
> >>>> put by
> >>>> developer, or change at runtime due to some user operation
> >>>>
> >>>> Then:
> >>>>
> >>>> 3.- Why not use classList [1] instead of create our own CSSClassList ?
> >>>> is
> >>>> well supported in the browsers we are targeting
> >>>>
> >>>> Something more "light" :)
> >>>>
> >>>> 4.- I know that order in html classes are not relevant, in the
> >>>> execution.
> >>>> And most of people here doesn't mind if typenames are before or after
> >>>> classNames. So hope this doesn't make any problem to anyone here:
> >>>> Can I change the code to put typeNames before classNames in
> >>>> computeFinalClassNames? I think this not affects anyone since is a
> >>>> small
> >>>> change and helps me to get organized classnames and identify things. I
> >>>> think is better to see in final html typeNames first then classNames
> so
> >>>> "inheritance" (to call it some way), could be easy detected by the eye
> >>>>
> >>>> Thanks
> >>>>
> >>>> Carlos
> >>>>
> >>>>
> >>>> [1]
> >>>> https://na01.safelinks.protection.outlook.com/?url=
> https%3A%2F%2Fwww.w3s <https://na01.safelinks.protection.outlook.com/?url=
> https%3A%2F%2Fwww.w3s>
> >>>> chools.com <http://chools.com/>%2FJsref%2Fprop_element_classlist.asp&
> data=02%7C01%7Caharui%40
> >>>> adobe.com <http://adobe.com/>%7C8ce390a012154f8f2a8a08d588354aa0%
> 7Cfa7b1b5a7b34438794aed2c17
> >>>> 8decee1%7C0%7C0%7C636564684909764090&sdata=
> OOh4TK5LKB75CGn6U4%2BeaVC%2Fi
> >>>> V%2BHgGzDj8fqrBB%2BCcs%3D&reserved=0
> >>>>
> >>>>
> >>>>
> >>>>
> >>>>
> >>>>
> >>>> --
> >>>> Carlos Rovira
> >>>>
> >>>> https://na01.safelinks.protection.outlook.com/?url=
> http%3A%2F%2Fabout.me <https://na01.safelinks.protection.outlook.com/?url=
> http%3A%2F%2Fabout.me>
> >>>> %2Fcarlosrovira&data=02%7C01%7Caharui%40adobe.com <
> http://40adobe.com/>%7C8ce390a012154f8f2a8a
> >>>> 08d588354aa0%7Cfa7b1b5a7b34438794aed2c178de
> cee1%7C0%7C0%7C63656468490976
> >>>> 4090&sdata=HDNJQ8VZuNS5lhOBU2ZsRrGQAgG5qOxiIQJKkOaTZV4%3D&reserved=0
> >>>>
> >>>>
> >>>
> >>>
> >>> --
> >>> Carlos Rovira
> >>>
> >>> https://na01.safelinks.protection.outlook.com/?url=
> http%3A%2F%2Fabout.me% <https://na01.safelinks.
> protection.outlook.com/?url=http%3A%2F%2Fabout.me%>
> >>> 2Fcarlosrovira&data=02%7C01%7Caharui%40adobe.com <http://40adobe.com/
> >%7C8ce390a012154f8f2a8a08
> >>> d588354aa0%7Cfa7b1b5a7b34438794aed2c178decee1%7C0%7C0%
> 7C63656468490976409
> >>> 0&sdata=HDNJQ8VZuNS5lhOBU2ZsRrGQAgG5qOxiIQJKkOaTZV4%3D&reserved=0
>
>


-- 
Carlos Rovira
http://about.me/carlosrovira

Reply via email to