Re: Type Selector Approximation (was Re: [DISCUSS] Explanation of the changes)

[Peter Ent]

I know I am late to this very, very long discussion, but after wading through 
(and even skipping over some of the more “complex” emails), I think this is 
become overly complicated. My understanding has been that RadioButton (for 
example) in basic.css would provide the beads while .RadioButton (the same 
thing, except with a defining namespace) in the theme.css would give it color, 
font, and so forth. 

You can use namespaces to qualify the CSS to make it less confusing. Further, 
developers using className should find their selector name appended to the 
class list:  where they specified 
 The default.css would supply the beads, 
the theme.css would supply the common style, and the user’s style would add or 
replace styles.

While building that Simple package, I went through dozens of tests. The browser 
and CSS engine are fine at putting things together. The technique I used is 
this:

addClassName(s:String) - appends the class selector to the class selector 
string chain.
removeClassName(s:String) - removes the class selector from the chain (useful 
for doing selection highlighting)
setClassName(s:String) - replaces the chain and resets it.

The most basic class used setClassName to establish the initial class selector. 
Sub-classes, if they wanted to build a chain, used addClassName, which appended 
their name to the list (eg, class=“Group List”). If a subclass was so special 
that it did not want the chain and wanted to the first, then it would use 
setClassName (eg, class=“List”).

The className property ALWAYS became the last in the chain. The setClassName 
had no effect on it, className was always appended before the HTML was 
generated. This technique gave me complete control over how things styles were 
applied.  would be class=“Group List MyList” or if 
List did setClassName(“List”) to wipe out what its superclass(es) did, then you 
would get class=“List MyList”.

HTH,
Peter

> On May 18, 2018, at 7:50 PM, Alex Harui  wrote:
> 
> 
> 
> On 5/18/18, 2:50 AM, "Harbs"  wrote:
>And basic.css has:
>RadioButton
>{
>   font-size: 12px;
>   font-family: sans-serif;
>}
> 
>RadioButton is a Royale Type Selector as it should be. No discussion on 
> that front (with the exception that the styling should be removed from the 
> defaults.css).
> 
>Te whole question is what happens in MyApp.css which is compiled standard 
> HTML CSS.
> 
>Currently we get:
> 
>.RadioButton {
>font-family: sans-serif;
>font-size: 12px;
>}
> 
>This CSS comes from the Type Selector in basic.css. This seems to be 
> included in the app.css even if RadioButton is not included. But putting that 
> point aside at the moment, the question is what the class selector (in 
> app.css) should be *produced* from the type selector.
> 
> It is not obvious why RadioButton is in the app.css.  This might be a new bug 
> from the theme handling I did recently.  I will investigate more.
> 
>I think we agree that “.RadioButton" is not right because there can be 
> RadioButton from more than one component set.
> 
>One option is to fully qualify the *compiled* class selector so it’s named 
> “.org_apache_royale_html_RadioButton”. I’m pretty sure this is what you are 
> proposing. The primary objection to that is that it’s a rather long string 
> and kind of “ugly”.
> 
> You can choose other string transformations, but the key point is that they 
> should be derived from the unique QName.  Any other scheme just means that 
> the developer has to solve the unique name problem twice which increases the 
> chance of collision.
> 
>Another option is “.basic.Button”. The advantage of this approach is 
> mostly aesthetics. It also has the advantage of being theoretically more 
> flexible because CSS can be applied to “basic" and “Button” separately. Of 
> course that goes both ways and if there’s css applied to “.Button” by 
> mistake, it can effect the “basic” Button where it’s not supposed to.
> 
> I'm not clear how the compiler or the ValuesManager (at runtime) can 
> efficiently associate .basic.Button with org.apache.royale.basic.Button.  
> Metadata lookups can be expensive.
> 
> 
>> If one problem is with Type Selectors in Royale inheriting styles from Base 
>> Classes, we should discuss ways to manage that.  Metadata is possible, but 
>> metadata is expensive at runtime.
> 
>Good point about extra code from meta tags. Maybe the compiler could strip 
> these out?
> 
> My point is that ValuesManager will need this information at runtime.
> 
>My suggestion with meta-data was a way to enable the second option. It 
> does not need to be specifically meta-tags. It could be something like this 
> as well:
> 
>/**
>* royaleclassselector RadioButton
>* royaleclassprefix basic
>* royaleinheritsbaseselector
>*/
> 
> These ASDoc directives are definitely not available at runtime.
> 
> 
>> There are 

Re: How to setup Jewel Theme in a project(Was Re: 0.9.3 Release)

[Piotr Zarzycki]

Definitely ant build for all themes is broken. There is absolutely no swcs.
However I did small experiment - I build specific theme by Maven and it
produces for me:

*/themes/Jewel-Light-NoFlat-Primary-Blue-Theme/target/Jewel-Light-NoFlat-Primary-Blue-Theme-0.9.4-SNAPSHOT-js.swc*

I have added in Moonshine in project Settings Additional compiler options:

*-theme=${royalelib}/themes/Jewel-Light-NoFlat-Primary-Blue-Theme/target/Jewel-Light-NoFlat-Primary-Blue-Theme-0.9.4-SNAPSHOT-js.swc*

And Example: "
*BE0006_Binding_the_text_property_of_a_Jewel_Textinput_to_update_a_text_label*"
successfully loaded theme. We definitely have solution for the path problem!

Many Thanks Josh.

The only thing which have to be fix is ANT build.

Thanks,
Piotr


2018-05-19 12:18 GMT+02:00 Piotr Zarzycki :

> Carlos,
>
> If when I checked distribution package of Royale [1] I don't see there
> Jewel-Dark-NoFlat-Emphasized-Blue-Theme.swc. The only things which I'm
> seeing is folder frameworks/themes/ Jewel-Dark-NoFlat-Emphasized-
> Blue-Theme.
>
> Where those swcs are ? Have you make them build by ANT ?
>
> [1] http://apacheroyaleci.westus2.cloudapp.azure.com:8080/job/royale-asjs/
>
> Thanks,
> Piotr
>
>
> 2018-05-19 7:08 GMT+02:00 Carlos Rovira :
>
>> Great Josh!, this sounds like a solution! Hope Harbs or Piotr can try this
>> and report if is working! :)
>>
>> 2018-05-19 0:38 GMT+02:00 Josh Tynjala :
>>
>> > Please forgive me if I'm missing some context because I'm just skimming
>> > through here. However, I think I may be able to offer a suggestion.
>> >
>> > Is the absolute path a location inside the the Royale SDK? If so, then
>> you
>> > can use the ${royalelib} token to refer to the path relative to the
>> SDK's
>> > *frameworks* directory. The Royale compiler knows how to resolve a path
>> > based on this token.
>> >
>> > For other SDKs, there's a similar ${flexlib} token. For the example
>> themes
>> > included with the Feathers SDK, I've successfully used ${flexlib} to
>> add a
>> > SWC to my project in *asconfig.json* without needing an absolute path:
>> >
>> > "library-path": ["${flexlib}/themes/MetalWorksDesktopTheme/
>> > MetalWorksDesktopTheme.swc"]
>> >
>> > A while back, I made sure that the ${royalelib} and ${flexlib} tokens
>> both
>> > work in VSCode.
>> >
>> > - Josh
>> >
>> > On 2018/05/18 13:05:34, Harbs  wrote:
>> > > No. Specifying the themes seems to be a major problem.
>> > >
>> > > It’s possible to specify a theme using additional compiler options in
>> > asconfig, but I’m not prepared to specify an absolute path. This needs a
>> > solution…
>> > >
>> > > Harbs
>> > >
>> > > > On May 18, 2018, at 3:56 PM, Piotr Zarzycki <
>> piotrzarzyck...@gmail.com>
>> > wrote:
>> > > >
>> > > > Hi Harbs,
>> > > >
>> > > > Were you able to setup project in IDE ?
>> > > >
>> > > > Thanks,
>> > > > Piotr
>> > > >
>> > > > 2018-05-17 15:13 GMT+02:00 Carlos Rovira :
>> > > >
>> > > >> Look foro "Inject a Font"
>> > > >>
>> > > >> 2018-05-17 15:12 GMT+02:00 Harbs :
>> > > >>
>> > > >>> What was the subject?
>> > > >>>
>> > >  On May 17, 2018, at 4:08 PM, Carlos Rovira <
>> carlosrov...@apache.org
>> > >
>> > > >>> wrote:
>> > > 
>> > >  Hi,
>> > > 
>> > >  I think seems something valid, maybe we should think more about
>> > > >> possible
>> > >  colateral issue of that method. You should look as well at a
>> thread
>> > > >> where
>> > >  Alex proposed as well some valid options
>> > > 
>> > >  2018-05-17 15:04 GMT+02:00 Harbs :
>> > > 
>> > > > I just had another thought which might be even more flexible:
>> > > >
>> > > > Maybe the compile could parse @includes from CSS and insert
>> them as
>> > > >>> links
>> > > > in the header HTML automatically.
>> > > >
>> > > > Thanks,
>> > > > Harbs
>> > > >
>> > > >> On May 17, 2018, at 3:52 PM, Carlos Rovira <
>> > carlosrov...@apache.org>
>> > > > wrote:
>> > > >>
>> > > >>>
>> > > >>> Another angle on this problem might be to allow adding links
>> via
>> > the
>> > > >>> compiler automatically. Not sure exactly what form that might
>> > take
>> > > > though.
>> > > >>>
>> > > >>>
>> > > >> This was something Alex propose, something in the line of
>> @media
>> > > >> -royale-swf, but with fonts, I think that is the right way.
>> > > >> For now we can stick with the html template but that should be
>> > > >>> temporal.
>> > > >
>> > > >
>> > > 
>> > > 
>> > >  --
>> > >  Carlos Rovira
>> > >  http://about.me/carlosrovira
>> > > >>>
>> > > >>>
>> > > >>
>> > > >>
>> > > >> --
>> > > >> Carlos Rovira
>> > > >> http://about.me/carlosrovira
>> > > >>
>> > > >
>> > > >
>> > > >
>> > > > --
>> > > >
>> > > > Piotr Zarzycki
>> > > >
>> > > > Patreon: 

Re: How to setup Jewel Theme in a project(Was Re: 0.9.3 Release)

[Piotr Zarzycki]

Carlos,

If when I checked distribution package of Royale [1] I don't see there
Jewel-Dark-NoFlat-Emphasized-Blue-Theme.swc. The only things which I'm
seeing is folder frameworks/themes/ Jewel-Dark-NoFlat-Emphasized-Blue-Theme.

Where those swcs are ? Have you make them build by ANT ?

[1] http://apacheroyaleci.westus2.cloudapp.azure.com:8080/job/royale-asjs/

Thanks,
Piotr


2018-05-19 7:08 GMT+02:00 Carlos Rovira :

> Great Josh!, this sounds like a solution! Hope Harbs or Piotr can try this
> and report if is working! :)
>
> 2018-05-19 0:38 GMT+02:00 Josh Tynjala :
>
> > Please forgive me if I'm missing some context because I'm just skimming
> > through here. However, I think I may be able to offer a suggestion.
> >
> > Is the absolute path a location inside the the Royale SDK? If so, then
> you
> > can use the ${royalelib} token to refer to the path relative to the SDK's
> > *frameworks* directory. The Royale compiler knows how to resolve a path
> > based on this token.
> >
> > For other SDKs, there's a similar ${flexlib} token. For the example
> themes
> > included with the Feathers SDK, I've successfully used ${flexlib} to add
> a
> > SWC to my project in *asconfig.json* without needing an absolute path:
> >
> > "library-path": ["${flexlib}/themes/MetalWorksDesktopTheme/
> > MetalWorksDesktopTheme.swc"]
> >
> > A while back, I made sure that the ${royalelib} and ${flexlib} tokens
> both
> > work in VSCode.
> >
> > - Josh
> >
> > On 2018/05/18 13:05:34, Harbs  wrote:
> > > No. Specifying the themes seems to be a major problem.
> > >
> > > It’s possible to specify a theme using additional compiler options in
> > asconfig, but I’m not prepared to specify an absolute path. This needs a
> > solution…
> > >
> > > Harbs
> > >
> > > > On May 18, 2018, at 3:56 PM, Piotr Zarzycki <
> piotrzarzyck...@gmail.com>
> > wrote:
> > > >
> > > > Hi Harbs,
> > > >
> > > > Were you able to setup project in IDE ?
> > > >
> > > > Thanks,
> > > > Piotr
> > > >
> > > > 2018-05-17 15:13 GMT+02:00 Carlos Rovira :
> > > >
> > > >> Look foro "Inject a Font"
> > > >>
> > > >> 2018-05-17 15:12 GMT+02:00 Harbs :
> > > >>
> > > >>> What was the subject?
> > > >>>
> > >  On May 17, 2018, at 4:08 PM, Carlos Rovira <
> carlosrov...@apache.org
> > >
> > > >>> wrote:
> > > 
> > >  Hi,
> > > 
> > >  I think seems something valid, maybe we should think more about
> > > >> possible
> > >  colateral issue of that method. You should look as well at a
> thread
> > > >> where
> > >  Alex proposed as well some valid options
> > > 
> > >  2018-05-17 15:04 GMT+02:00 Harbs :
> > > 
> > > > I just had another thought which might be even more flexible:
> > > >
> > > > Maybe the compile could parse @includes from CSS and insert them
> as
> > > >>> links
> > > > in the header HTML automatically.
> > > >
> > > > Thanks,
> > > > Harbs
> > > >
> > > >> On May 17, 2018, at 3:52 PM, Carlos Rovira <
> > carlosrov...@apache.org>
> > > > wrote:
> > > >>
> > > >>>
> > > >>> Another angle on this problem might be to allow adding links
> via
> > the
> > > >>> compiler automatically. Not sure exactly what form that might
> > take
> > > > though.
> > > >>>
> > > >>>
> > > >> This was something Alex propose, something in the line of @media
> > > >> -royale-swf, but with fonts, I think that is the right way.
> > > >> For now we can stick with the html template but that should be
> > > >>> temporal.
> > > >
> > > >
> > > 
> > > 
> > >  --
> > >  Carlos Rovira
> > >  http://about.me/carlosrovira
> > > >>>
> > > >>>
> > > >>
> > > >>
> > > >> --
> > > >> Carlos Rovira
> > > >> http://about.me/carlosrovira
> > > >>
> > > >
> > > >
> > > >
> > > > --
> > > >
> > > > Piotr Zarzycki
> > > >
> > > > Patreon: *https://www.patreon.com/piotrzarzycki
> > > > *
> > >
> > >
> >
>
>
>
> --
> Carlos Rovira
> http://about.me/carlosrovira
>



-- 

Piotr Zarzycki

Patreon: *https://www.patreon.com/piotrzarzycki
*