You are viewing a plain text version of this content. The canonical link for it is here.
Posted to users@royale.apache.org by doug777 <do...@gmail.com> on 2018/03/07 03:35:39 UTC
Last few problems converting browser project to JS
I have almost finished converting my old Flex browser app to FlexJS (js
only), but I have 4 problems left that I can't find a way to convert. Can
anyone help to suggest a way to go with these items?
1. Application.parameters - I need to pass variables into the app on
creation.
2. container.stage.stageWidth/stageHeight - I need to find the browser
window's size.
3. [Embed(systemFont ... etc)]
4. This one I'm sure is straightforward but I can't work out how to do it -
Convert a skin for ButtonBar. I assume I need to create a renderer for the
firstButton, middleButton and lastButton that are specified in the existing
skin. But how do I connect the renderers to the individual buttons in the js
ButtonBar?
Doug
--
Sent from: http://apache-royale-users.20374.n8.nabble.com/
Re: Last few problems converting browser project to JS
Posted by Piotr Zarzycki <pi...@gmail.com>.
Justin,
Yes it supported through maven. You are using: <htmlTemplate>${basedir}
/src/resources/mdl-js-index-template.html</htmlTemplate>
2018-03-07 7:58 GMT+01:00 Justin Mclean <ju...@classsoftware.com>:
> Hi,
>
> > It will work, but IMO it is a bit of a hack. No real need to add a class
> > to your app just to inject HTML in your app.
>
> It reads well in the application I think which counts for something, I’m
> sure there are many other ways of doing the same thing.
>
> > That's why we have the -html-template compiler option. Normally
> inject_html is used to inject
> > HTML needed to operate the rest of the code in the class.
> >
> > Not sure it makes sense to subclass BeadViewBase either since it isn't a
> > View.
>
> That code was written in the FLexJS days so there may be a better way to
> do it. I recall playing with the html-template compiler option but I
> couldn't get it to do what I wanted but can’t recall why. Is it supported
> in maven?
>
> Thanks,
> Justin
--
Piotr Zarzycki
Patreon: *https://www.patreon.com/piotrzarzycki
<https://www.patreon.com/piotrzarzycki>*
Re: Last few problems converting browser project to JS
Posted by Justin Mclean <ju...@classsoftware.com>.
Hi,
> It will work, but IMO it is a bit of a hack. No real need to add a class
> to your app just to inject HTML in your app.
It reads well in the application I think which counts for something, I’m sure there are many other ways of doing the same thing.
> That's why we have the -html-template compiler option. Normally inject_html is used to inject
> HTML needed to operate the rest of the code in the class.
>
> Not sure it makes sense to subclass BeadViewBase either since it isn't a
> View.
That code was written in the FLexJS days so there may be a better way to do it. I recall playing with the html-template compiler option but I couldn't get it to do what I wanted but can’t recall why. Is it supported in maven?
Thanks,
Justin
Re: Last few problems converting browser project to JS
Posted by Alex Harui <ah...@adobe.com>.
It will work, but IMO it is a bit of a hack. No real need to add a class
to your app just to inject HTML in your app. That's why we have the
-html-template compiler option. Normally inject_html is used to inject
HTML needed to operate the rest of the code in the class.
Not sure it makes sense to subclass BeadViewBase either since it isn't a
View.
My 2 cents,
-Alex
On 3/6/18, 9:54 PM, "doug777" <do...@gmail.com> wrote:
>I'll certainly give that a try. Thanks very much Justin.
>
>Doug
>
>
>
>--
>Sent from:
>https://na01.safelinks.protection.outlook.com/?url=http%3A%2F%2Fapache-roy
>ale-users.20374.n8.nabble.com%2F&data=02%7C01%7Caharui%40adobe.com%7C4bca0
>15eb65d43b9edac08d583efee63%7Cfa7b1b5a7b34438794aed2c178decee1%7C0%7C0%7C6
>36559988881213108&sdata=Twjb06WPYmUxcYX65TUFQGvyoZtXUOXrUeGWO5vzaUA%3D&res
>erved=0
Re: Last few problems converting browser project to JS
Posted by doug777 <do...@gmail.com>.
I'll certainly give that a try. Thanks very much Justin.
Doug
--
Sent from: http://apache-royale-users.20374.n8.nabble.com/
Re: Last few problems converting browser project to JS
Posted by Justin Mclean <ju...@classsoftware.com>.
Hi,
Sorry this bounced, so my emails will be out of order, trying again.
> Re EmbedFont : Actually it's not that important. We use it to get special
> characters
In that case something like this may work:
<js:Application ... xmlns:fonts="fonts.*”>
<js:valuesImpl>
<js:SimpleCSSValuesImpl id="vi" />
</js:valuesImpl>
<js:beads>
<fonts:Catamaran />
</js:beads>
...
In fonts/Catamara.as
package fonts {
import org.apache.flex.core.BeadViewBase;
public class Catamaran extends BeadViewBase {
/**
* <inject_html>
* <link rel="stylesheet" type="text/css" href="https://fonts.googleapis.com/css?family=Catamaran:400,500,600,700">
* </inject_html>
*/
public function Catamaran() {
super();
}
}
}
Thanks,
Justin
Re: Last few problems converting browser project to JS
Posted by Piotr Zarzycki <pi...@gmail.com>.
Cool! I just wanted to have clarification. Maybe Royale JS only ;) Not
sure. I'm really happy that you were able to goes so far and you are using
Moonshine. :)
Thanks, Piotr
2018-03-07 7:10 GMT+01:00 doug777 <do...@gmail.com>:
> Piotr
>
> I guarantee everything is Royale - I just wanted to indicate that it's a
> js
> only project. Should I say Royale JS?
>
> Doug
>
>
>
> --
> Sent from: http://apache-royale-users.20374.n8.nabble.com/
>
--
Piotr Zarzycki
Patreon: *https://www.patreon.com/piotrzarzycki
<https://www.patreon.com/piotrzarzycki>*
Re: Last few problems converting browser project to JS
Posted by doug777 <do...@gmail.com>.
Piotr
I guarantee everything is Royale - I just wanted to indicate that it's a js
only project. Should I say Royale JS?
Doug
--
Sent from: http://apache-royale-users.20374.n8.nabble.com/
Re: Last few problems converting browser project to JS
Posted by Piotr Zarzycki <pi...@gmail.com>.
Doug,
We are open for improvements in case of Moonshine! Shoot us anything what
you have on GitHub :) Just one more thing, because you have mentioned in
your first email in that chain FlexJS, so are you not using Royale but
older FlexJS ?
Thanks a lot!,
Piotr
2018-03-07 7:02 GMT+01:00 doug777 <do...@gmail.com>:
> Hi Piotr,
>
> I hope I can do that but I think I'm still some way from finishing.
> Although
> I've been testing snippets as I've gone along, I'm pretty sure there will
> still be lots of problems once it all has to work together. But I can't
> test
> that till I can get the whole thing to compile.
>
> But having got this far I am very confident that it will all work
> eventually. I'm really keen to see how close it will be in looks and
> functions to the original Flex project.
>
> And I have to say how much I'm enjoying doing it all in Moonshine. It's
> still a little bit buggy, but I love using it and it keeps getting better
> and better. Really hope to see version 1.10 soon!!
>
> Doug
>
>
>
>
>
> --
> Sent from: http://apache-royale-users.20374.n8.nabble.com/
>
--
Piotr Zarzycki
Patreon: *https://www.patreon.com/piotrzarzycki
<https://www.patreon.com/piotrzarzycki>*
Re: Last few problems converting browser project to JS
Posted by doug777 <do...@gmail.com>.
Hi Piotr,
I hope I can do that but I think I'm still some way from finishing. Although
I've been testing snippets as I've gone along, I'm pretty sure there will
still be lots of problems once it all has to work together. But I can't test
that till I can get the whole thing to compile.
But having got this far I am very confident that it will all work
eventually. I'm really keen to see how close it will be in looks and
functions to the original Flex project.
And I have to say how much I'm enjoying doing it all in Moonshine. It's
still a little bit buggy, but I love using it and it keeps getting better
and better. Really hope to see version 1.10 soon!!
Doug
--
Sent from: http://apache-royale-users.20374.n8.nabble.com/
Re: Last few problems converting browser project to JS
Posted by Piotr Zarzycki <pi...@gmail.com>.
Hi Doug,
Great to hear that! Once you finished and if it will be possible share with
us link, screens etc. Maybe we can place it somewhere as a great news. :)
Thanks,
Piotr
On Wed, Mar 7, 2018, 05:47 doug777 <do...@gmail.com> wrote:
> Ok that is all very helpful.
>
> Thanks so much, Alex. Much appreciated.
>
> Doug
>
>
>
> --
> Sent from: http://apache-royale-users.20374.n8.nabble.com/
>
Re: Last few problems converting browser project to JS
Posted by doug777 <do...@gmail.com>.
Ok that is all very helpful.
Thanks so much, Alex. Much appreciated.
Doug
--
Sent from: http://apache-royale-users.20374.n8.nabble.com/
Re: Last few problems converting browser project to JS
Posted by Alex Harui <ah...@adobe.com>.
For problems like these, the first question is: How do you do it in the
browser at all (without Royale)?
I think the answer is @font-face. If that's true, the way we handle this
right now is to have you use a custom html template. The ASDoc example is
using one.
HTH,
-Alex
On 3/6/18, 8:30 PM, "doug777" <do...@gmail.com> wrote:
>OK I'll take a look as suggested.
>
>Re EmbedFont : Actually it's not that important. We use it to get special
>characters e.g.
>
>[Embed(systemFont="Arial", fontName="currencyFont",
>mimeType="application/x-font", fontFamily="Arial Regular",
>unicodeRange="U+20A1-20B9", embedAsCFF="false")]
>
>And some similar things from foreign language fonts.
>
>All the characters can be replaced with a standard letter equivalent. Not
>quite as nice, but no big deal.
>
>Doug
>
>
>
>--
>Sent from:
>https://na01.safelinks.protection.outlook.com/?url=http%3A%2F%2Fapache-roy
>ale-users.20374.n8.nabble.com%2F&data=02%7C01%7Caharui%40adobe.com%7Cbed36
>cf0ce554a46467f08d583e41e22%7Cfa7b1b5a7b34438794aed2c178decee1%7C0%7C0%7C6
>36559938135665620&sdata=G7mOf1z0IFJYo7l82yLHagUhMbL7H7Yxe7U%2FtZFIaCo%3D&r
>eserved=0
Re: Last few problems converting browser project to JS
Posted by doug777 <do...@gmail.com>.
OK I'll take a look as suggested.
Re EmbedFont : Actually it's not that important. We use it to get special
characters e.g.
[Embed(systemFont="Arial", fontName="currencyFont",
mimeType="application/x-font", fontFamily="Arial Regular",
unicodeRange="U+20A1-20B9", embedAsCFF="false")]
And some similar things from foreign language fonts.
All the characters can be replaced with a standard letter equivalent. Not
quite as nice, but no big deal.
Doug
--
Sent from: http://apache-royale-users.20374.n8.nabble.com/
Re: Last few problems converting browser project to JS
Posted by Alex Harui <ah...@adobe.com>.
Hi Doug,
Great to hear about your progress. My responses in-line.
On 3/6/18, 7:35 PM, "doug777" <do...@gmail.com> wrote:
>I have almost finished converting my old Flex browser app to FlexJS (js
>only), but I have 4 problems left that I can't find a way to convert. Can
>anyone help to suggest a way to go with these items?
>
>1. Application.parameters - I need to pass variables into the app on
>creation.
I don't think we have a generic bead for this, but ASDoc is using the
EscapedFragmentBead because it is looking for a particular pattern in the
parameters. You can probably copy it and tune it for your needs and even
contribute the results back to the framework.
>
>2. container.stage.stageWidth/stageHeight - I need to find the browser
>window's size.
I think you can use BrowserResizeListener.
>
>3. [Embed(systemFont ... etc)]
What is your goal with embedding the font for JS? What benefit did it
give you in Flex?
>
>4. This one I'm sure is straightforward but I can't work out how to do it
>-
> Convert a skin for ButtonBar. I assume I need to create a renderer for
>the
>firstButton, middleButton and lastButton that are specified in the
>existing
>skin. But how do I connect the renderers to the individual buttons in the
>js
>ButtonBar?
We haven't created a Factory for having a different renderer for first and
last items. ButtonBar is a List. Lists use a DataItemRendererFactory*
class depending on the data type. The DataItemRendererFactory classes
currently only take one itemRendererFactory. I suggest copying the one you
want, adding two more itemRendererFactories and modifying the code inside
that to create the right renderer at the right time. That would also be a
great thing to contribute back to the framework.
Let us know if you need help or have questions.
HTH,
-Alex
>
>
>--
>Sent from:
>https://na01.safelinks.protection.outlook.com/?url=http%3A%2F%2Fapache-roy
>ale-users.20374.n8.nabble.com%2F&data=02%7C01%7Caharui%40adobe.com%7Cccd8f
>ffc20a440ff7f4908d583dc8555%7Cfa7b1b5a7b34438794aed2c178decee1%7C0%7C0%7C6
>36559905520366798&sdata=RWf%2FRdzo1uguwXOFjt102DcXJj9Oi6iPUC2MXmaX8O8%3D&r
>eserved=0
Re: Last few problems converting browser project to JS
Posted by Harbs <ha...@gmail.com>.
Good idea.
I’ll try to do that…
> On Mar 8, 2018, at 9:04 PM, Alex Harui <ah...@adobe.com> wrote:
>
> It would be great to identify a bead from this pattern so others can just
> drop a bead in their code instead of having to add a parameter and use
> bracket access.
>
> I forgot that EscapedFragmentBead extends URLParameterBead. The
> URLParameter bead currently just returns the entire query string, but some
> other API could have it generate a ValueObject which would prevent naming
> problems or have a query API like getParameter that would force you to use
> string IDs that wouldn't be renamed.
>
> We want to try to package just about any solution as a bead so others
> don't have to repeat the same set of steps.
>
> My 2 cents,
> -Alex
>
> On 3/8/18, 1:50 AM, "Harbs" <harbs.lists@gmail.com <ma...@gmail.com>> wrote:
>
>> Just add the following to your main class:
>>
>> public var parameters:Object;
>>
>> Also: Make sure you use bracket access (i.e. this.parameters[“anything”]
>> instead of this.parameters.anything) to the parameters var to prevent
>> renaming problems when it’s minified.
>>
>> HTH,
>> Harbs
>>
>>> On Mar 8, 2018, at 3:48 AM, doug777 <do...@gmail.com> wrote:
>>>
>>> Hi Harbs,
>>>
>>> I don't understand how to access these parameters in the app's main file
>>> since Application.parameters.anything won't compile.
>>>
>>> Doug
>>>
>>>
>>>
>>> --
>>> Sent from:
>>> https://na01.safelinks.protection.outlook.com/?url=http%3A%2F%2Fapache-ro <https://na01.safelinks.protection.outlook.com/?url=http%3A%2F%2Fapache-ro>
>>> yale-users.20374.n8.nabble.com <http://yale-users.20374.n8.nabble.com/>%2F&data=02%7C01%7Caharui%40adobe.com <http://40adobe.com/>%7C13c
>>> a54a2853147d8382808d584d9fe48%7Cfa7b1b5a7b34438794aed2c178decee1%7C0%7C0%
>>> 7C636560994180269800&sdata=3XoMuxOTZ60XBW85rNwRklOqyspeMbKjhntwyW7O3v0%3D
>>> &reserved=0
Re: Last few problems converting browser project to JS
Posted by Alex Harui <ah...@adobe.com>.
It would be great to identify a bead from this pattern so others can just
drop a bead in their code instead of having to add a parameter and use
bracket access.
I forgot that EscapedFragmentBead extends URLParameterBead. The
URLParameter bead currently just returns the entire query string, but some
other API could have it generate a ValueObject which would prevent naming
problems or have a query API like getParameter that would force you to use
string IDs that wouldn't be renamed.
We want to try to package just about any solution as a bead so others
don't have to repeat the same set of steps.
My 2 cents,
-Alex
On 3/8/18, 1:50 AM, "Harbs" <ha...@gmail.com> wrote:
>Just add the following to your main class:
>
>public var parameters:Object;
>
>Also: Make sure you use bracket access (i.e. this.parameters[“anything”]
>instead of this.parameters.anything) to the parameters var to prevent
>renaming problems when it’s minified.
>
>HTH,
>Harbs
>
>> On Mar 8, 2018, at 3:48 AM, doug777 <do...@gmail.com> wrote:
>>
>> Hi Harbs,
>>
>> I don't understand how to access these parameters in the app's main file
>> since Application.parameters.anything won't compile.
>>
>> Doug
>>
>>
>>
>> --
>> Sent from:
>>https://na01.safelinks.protection.outlook.com/?url=http%3A%2F%2Fapache-ro
>>yale-users.20374.n8.nabble.com%2F&data=02%7C01%7Caharui%40adobe.com%7C13c
>>a54a2853147d8382808d584d9fe48%7Cfa7b1b5a7b34438794aed2c178decee1%7C0%7C0%
>>7C636560994180269800&sdata=3XoMuxOTZ60XBW85rNwRklOqyspeMbKjhntwyW7O3v0%3D
>>&reserved=0
>
Re: Last few problems converting browser project to JS
Posted by doug777 <do...@gmail.com>.
Oh yes of course, silly me. I've actually used this method to replace missing
parameters like 'data' in lots of other places in the app.
Many thanks for all your help.
Doug
--
Sent from: http://apache-royale-users.20374.n8.nabble.com/
Re: Last few problems converting browser project to JS
Posted by Harbs <ha...@gmail.com>.
Just add the following to your main class:
public var parameters:Object;
Also: Make sure you use bracket access (i.e. this.parameters[“anything”] instead of this.parameters.anything) to the parameters var to prevent renaming problems when it’s minified.
HTH,
Harbs
> On Mar 8, 2018, at 3:48 AM, doug777 <do...@gmail.com> wrote:
>
> Hi Harbs,
>
> I don't understand how to access these parameters in the app's main file
> since Application.parameters.anything won't compile.
>
> Doug
>
>
>
> --
> Sent from: http://apache-royale-users.20374.n8.nabble.com/
Re: Last few problems converting browser project to JS
Posted by doug777 <do...@gmail.com>.
Hi Harbs,
I don't understand how to access these parameters in the app's main file
since Application.parameters.anything won't compile.
Doug
--
Sent from: http://apache-royale-users.20374.n8.nabble.com/
Re: Last few problems converting browser project to JS
Posted by doug777 <do...@gmail.com>.
That's brilliant almost the same as the old flex way.
Thanks so much for that.
Doug
--
Sent from: http://apache-royale-users.20374.n8.nabble.com/
Re: Last few problems converting browser project to JS
Posted by Harbs <ha...@gmail.com>.
> On Mar 7, 2018, at 5:35 AM, doug777 <do...@gmail.com> wrote:
>
> I have almost finished converting my old Flex browser app to FlexJS (js
> only), but I have 4 problems left that I can't find a way to convert. Can
> anyone help to suggest a way to go with these items?
>
> 1. Application.parameters - I need to pass variables into the app on
> creation.
Here’s how I do it:
I have the following markup in the html template I’m using for my app:
My main application class has a parameter setter which does the “right” thing with the parameters (very similar to how it works in Flex).
<body>
<script type="text/javascript">
function queryURL() {
// This function is anonymous, is executed immediately and
// the return value is assigned to QueryString!
var query_string = {};
var query = window.location.search.substring(1);
if(!query){return {};}
var vars = query.split("&");
for (var i=0;i<vars.length;i++) {
var pair = vars[i].split("=");
// If first entry with this name
query_string[pair[0]] = decodeURIComponent(pair[1]);
}
return query_string;
}
var app = new MyRoyaleApp();
app.parameters = queryURL();
app.start();
</script>
</body>