You are viewing a plain text version of this content. The canonical link for it is here.
Posted to users@royale.apache.org by Roman Isitua <ro...@gmail.com> on 2022/03/12 09:53:24 UTC
Royale support for progressive web apps (pwa)
I just stumbled on a tutorial on how to create a pwa app using plain html,
javascript and css (i.e. no framework).
I am now forced to ask the question. How can i do this in royale ?
Here is the link
https://www.google.com/amp/s/www.freecodecamp.org/news/build-a-pwa-from-scratch-with-html-css-and-javascript/amp/
How can I register all the generated javascript files ?
Is modifying the main entry point js file in my royale project allowed ?
From the tutorial this file will need to be modified to register the
service worker.
Has someone created a pwa in royale before ?
Pwa's are rapidly being adopted it will be nice if I can package my
responsive web application to be a pwa with little effort.
Regards,
Re: Royale support for progressive web apps (pwa)
Posted by Harbs <ha...@gmail.com>.
IFAIK, the only thing that needs enhancing might be to make sure there’s typedef support for the worker APIs.
> On Mar 13, 2022, at 9:56 PM, Andrew Wetmore <co...@gmail.com> wrote:
>
> Is it worth enhancing Royale to support that out of the box?
>
> On Sun, Mar 13, 2022 at 4:20 PM Harbs <harbs.lists@gmail.com <ma...@gmail.com>> wrote:
>> What is the gain of adding the .json file and all that?
>
>
> 1. You can make a web app look like a native mobile app.
> 2. It can work while your mobile device is off line (as long as you cache all the necessary data).
>
>> On Mar 13, 2022, at 9:18 PM, Andrew Wetmore <cottage14@gmail.com <ma...@gmail.com>> wrote:
>>
>> What is the gain of adding the .json file and all that? Doesn't a Royale app compiled for use with JS files run just fine without further modification on a web page?
>>
>> On Sun, Mar 13, 2022 at 3:26 PM Roman Isitua <romanisitua@gmail.com <ma...@gmail.com>> wrote:
>> From the below link
>>
>> https://www.google.com/amp/s/www.freecodecamp.org/news/build-a-pwa-from-scratch-with-html-css-and-javascript/amp/ <https://www.google.com/amp/s/www.freecodecamp.org/news/build-a-pwa-from-scratch-with-html-css-and-javascript/amp/>
>>
>>
>> The following steps are to be done to convert an app to pwa
>> 1. Create a manifest.json file.
>>
>> 2. Modify the index.html file to reference the manifest.json.
>>
>> 3. Implement a ServiceWorker.js file. This will be in the same root folder as the generated main entry point js file.
>>
>> 4. Register the ServiceWorker.js file by modifying for the generated entry point js file.
>>
>>
>> If I am coding my web app using plain html, css and javascript it will not be a problem doing the above 4 tasks. But as I am using royale task three and four look challenging. I think the royale sdk and compiler might need to be tweaked to support those tasks.
>>
>> On Sun, 13 Mar 2022, 19:04 Harbs, <harbs.lists@gmail.com <ma...@gmail.com>> wrote:
>> No. Why would you need to modify the js file?
>>
>>> On Mar 13, 2022, at 7:47 PM, Roman Isitua <romanisitua@gmail.com <ma...@gmail.com>> wrote:
>>>
>>> So I am free to modify the generated entry point js file as well ?
>>>
>>> This does not really look like an ideal solution because each time I recompile the project the generated js file will be overwritten. An ideal solution will be to add support for it in royale sdk.
>>>
>>>
>>>
>>> On Sun, 13 Mar 2022, 18:36 Harbs, <harbs.lists@gmail.com <ma...@gmail.com>> wrote:
>>> It shouldn’t be any different than a regular web app.
>>>
>>> You can add whatever you want to the template index.html file.
>>>
>>>> On Mar 12, 2022, at 11:53 AM, Roman Isitua <romanisitua@gmail.com <ma...@gmail.com>> wrote:
>>>>
>>>> I just stumbled on a tutorial on how to create a pwa app using plain html, javascript and css (i.e. no framework).
>>>>
>>>> I am now forced to ask the question. How can i do this in royale ?
>>>>
>>>> Here is the link
>>>>
>>>> https://www.google.com/amp/s/www.freecodecamp.org/news/build-a-pwa-from-scratch-with-html-css-and-javascript/amp/ <https://www.google.com/amp/s/www.freecodecamp.org/news/build-a-pwa-from-scratch-with-html-css-and-javascript/amp/>
>>>>
>>>>
>>>> How can I register all the generated javascript files ?
>>>>
>>>> Is modifying the main entry point js file in my royale project allowed ? From the tutorial this file will need to be modified to register the service worker.
>>>>
>>>>
>>>> Has someone created a pwa in royale before ?
>>>>
>>>>
>>>> Pwa's are rapidly being adopted it will be nice if I can package my responsive web application to be a pwa with little effort.
>>>>
>>>>
>>>> Regards,
>>>>
>>>>
>>>
>>
>>
>>
>> --
>> Andrew Wetmore
>>
>> Editor, Moose House Publications <https://moosehousepress.com/>
>> Editor-Writer, The Apache Software Foundation <https://apache.org/>
>>
>>
>>
>>
>
>
>
> --
> Andrew Wetmore
>
> Editor, Moose House Publications <https://moosehousepress.com/>
> Editor-Writer, The Apache Software Foundation <https://apache.org/>
>
>
>
>
Re: Royale support for progressive web apps (pwa)
Posted by Roman Isitua <ro...@gmail.com>.
I think it is worth it. Lot of big software houses are adopting pwa's. E.g
ms outlook is now a pwa app.
On Sun, 13 Mar 2022, 20:56 Andrew Wetmore, <co...@gmail.com> wrote:
> Is it worth enhancing Royale to support that out of the box?
>
> On Sun, Mar 13, 2022 at 4:20 PM Harbs <ha...@gmail.com> wrote:
>
>> What is the gain of adding the .json file and all that?
>>
>>
>> 1. You can make a web app look like a native mobile app.
>> 2. It can work while your mobile device is off line (as long as you cache
>> all the necessary data).
>>
>> On Mar 13, 2022, at 9:18 PM, Andrew Wetmore <co...@gmail.com> wrote:
>>
>> What is the gain of adding the .json file and all that? Doesn't a Royale
>> app compiled for use with JS files run just fine without further
>> modification on a web page?
>>
>> On Sun, Mar 13, 2022 at 3:26 PM Roman Isitua <ro...@gmail.com>
>> wrote:
>>
>>> From the below link
>>>
>>>
>>> https://www.google.com/amp/s/www.freecodecamp.org/news/build-a-pwa-from-scratch-with-html-css-and-javascript/amp/
>>>
>>>
>>> The following steps are to be done to convert an app to pwa
>>> 1. Create a manifest.json file.
>>>
>>> 2. Modify the index.html file to reference the manifest.json.
>>>
>>> 3. Implement a ServiceWorker.js file. This will be in the same root
>>> folder as the generated main entry point js file.
>>>
>>> 4. Register the ServiceWorker.js file by modifying for the generated
>>> entry point js file.
>>>
>>>
>>> If I am coding my web app using plain html, css and javascript it will
>>> not be a problem doing the above 4 tasks. But as I am using royale task
>>> three and four look challenging. I think the royale sdk and compiler might
>>> need to be tweaked to support those tasks.
>>>
>>> On Sun, 13 Mar 2022, 19:04 Harbs, <ha...@gmail.com> wrote:
>>>
>>>> No. Why would you need to modify the js file?
>>>>
>>>> On Mar 13, 2022, at 7:47 PM, Roman Isitua <ro...@gmail.com>
>>>> wrote:
>>>>
>>>> So I am free to modify the generated entry point js file as well ?
>>>>
>>>> This does not really look like an ideal solution because each time I
>>>> recompile the project the generated js file will be overwritten. An ideal
>>>> solution will be to add support for it in royale sdk.
>>>>
>>>>
>>>>
>>>> On Sun, 13 Mar 2022, 18:36 Harbs, <ha...@gmail.com> wrote:
>>>>
>>>>> It shouldn’t be any different than a regular web app.
>>>>>
>>>>> You can add whatever you want to the template index.html file.
>>>>>
>>>>> On Mar 12, 2022, at 11:53 AM, Roman Isitua <ro...@gmail.com>
>>>>> wrote:
>>>>>
>>>>> I just stumbled on a tutorial on how to create a pwa app using plain
>>>>> html, javascript and css (i.e. no framework).
>>>>>
>>>>> I am now forced to ask the question. How can i do this in royale ?
>>>>>
>>>>> Here is the link
>>>>>
>>>>>
>>>>> https://www.google.com/amp/s/www.freecodecamp.org/news/build-a-pwa-from-scratch-with-html-css-and-javascript/amp/
>>>>>
>>>>>
>>>>> How can I register all the generated javascript files ?
>>>>>
>>>>> Is modifying the main entry point js file in my royale project allowed
>>>>> ? From the tutorial this file will need to be modified to register the
>>>>> service worker.
>>>>>
>>>>>
>>>>> Has someone created a pwa in royale before ?
>>>>>
>>>>>
>>>>> Pwa's are rapidly being adopted it will be nice if I can package my
>>>>> responsive web application to be a pwa with little effort.
>>>>>
>>>>>
>>>>> Regards,
>>>>>
>>>>>
>>>>>
>>>>>
>>>>
>>
>> --
>> Andrew Wetmore
>>
>> Editor, Moose House Publications <https://moosehousepress.com/>
>> Editor-Writer, The Apache Software Foundation <https://apache.org/>
>>
>>
>>
>>
>>
>>
>
> --
> Andrew Wetmore
>
> Editor, Moose House Publications <https://moosehousepress.com/>
> Editor-Writer, The Apache Software Foundation <https://apache.org/>
>
>
>
>
>
Re: Royale support for progressive web apps (pwa)
Posted by Andrew Wetmore <co...@gmail.com>.
Is it worth enhancing Royale to support that out of the box?
On Sun, Mar 13, 2022 at 4:20 PM Harbs <ha...@gmail.com> wrote:
> What is the gain of adding the .json file and all that?
>
>
> 1. You can make a web app look like a native mobile app.
> 2. It can work while your mobile device is off line (as long as you cache
> all the necessary data).
>
> On Mar 13, 2022, at 9:18 PM, Andrew Wetmore <co...@gmail.com> wrote:
>
> What is the gain of adding the .json file and all that? Doesn't a Royale
> app compiled for use with JS files run just fine without further
> modification on a web page?
>
> On Sun, Mar 13, 2022 at 3:26 PM Roman Isitua <ro...@gmail.com>
> wrote:
>
>> From the below link
>>
>>
>> https://www.google.com/amp/s/www.freecodecamp.org/news/build-a-pwa-from-scratch-with-html-css-and-javascript/amp/
>>
>>
>> The following steps are to be done to convert an app to pwa
>> 1. Create a manifest.json file.
>>
>> 2. Modify the index.html file to reference the manifest.json.
>>
>> 3. Implement a ServiceWorker.js file. This will be in the same root
>> folder as the generated main entry point js file.
>>
>> 4. Register the ServiceWorker.js file by modifying for the generated
>> entry point js file.
>>
>>
>> If I am coding my web app using plain html, css and javascript it will
>> not be a problem doing the above 4 tasks. But as I am using royale task
>> three and four look challenging. I think the royale sdk and compiler might
>> need to be tweaked to support those tasks.
>>
>> On Sun, 13 Mar 2022, 19:04 Harbs, <ha...@gmail.com> wrote:
>>
>>> No. Why would you need to modify the js file?
>>>
>>> On Mar 13, 2022, at 7:47 PM, Roman Isitua <ro...@gmail.com> wrote:
>>>
>>> So I am free to modify the generated entry point js file as well ?
>>>
>>> This does not really look like an ideal solution because each time I
>>> recompile the project the generated js file will be overwritten. An ideal
>>> solution will be to add support for it in royale sdk.
>>>
>>>
>>>
>>> On Sun, 13 Mar 2022, 18:36 Harbs, <ha...@gmail.com> wrote:
>>>
>>>> It shouldn’t be any different than a regular web app.
>>>>
>>>> You can add whatever you want to the template index.html file.
>>>>
>>>> On Mar 12, 2022, at 11:53 AM, Roman Isitua <ro...@gmail.com>
>>>> wrote:
>>>>
>>>> I just stumbled on a tutorial on how to create a pwa app using plain
>>>> html, javascript and css (i.e. no framework).
>>>>
>>>> I am now forced to ask the question. How can i do this in royale ?
>>>>
>>>> Here is the link
>>>>
>>>>
>>>> https://www.google.com/amp/s/www.freecodecamp.org/news/build-a-pwa-from-scratch-with-html-css-and-javascript/amp/
>>>>
>>>>
>>>> How can I register all the generated javascript files ?
>>>>
>>>> Is modifying the main entry point js file in my royale project allowed
>>>> ? From the tutorial this file will need to be modified to register the
>>>> service worker.
>>>>
>>>>
>>>> Has someone created a pwa in royale before ?
>>>>
>>>>
>>>> Pwa's are rapidly being adopted it will be nice if I can package my
>>>> responsive web application to be a pwa with little effort.
>>>>
>>>>
>>>> Regards,
>>>>
>>>>
>>>>
>>>>
>>>
>
> --
> Andrew Wetmore
>
> Editor, Moose House Publications <https://moosehousepress.com/>
> Editor-Writer, The Apache Software Foundation <https://apache.org/>
>
>
>
>
>
>
--
Andrew Wetmore
Editor, Moose House Publications <https://moosehousepress.com/>
Editor-Writer, The Apache Software Foundation <https://apache.org/>
Re: Royale support for progressive web apps (pwa)
Posted by Harbs <ha...@gmail.com>.
> What is the gain of adding the .json file and all that?
1. You can make a web app look like a native mobile app.
2. It can work while your mobile device is off line (as long as you cache all the necessary data).
> On Mar 13, 2022, at 9:18 PM, Andrew Wetmore <co...@gmail.com> wrote:
>
> What is the gain of adding the .json file and all that? Doesn't a Royale app compiled for use with JS files run just fine without further modification on a web page?
>
> On Sun, Mar 13, 2022 at 3:26 PM Roman Isitua <romanisitua@gmail.com <ma...@gmail.com>> wrote:
> From the below link
>
> https://www.google.com/amp/s/www.freecodecamp.org/news/build-a-pwa-from-scratch-with-html-css-and-javascript/amp/ <https://www.google.com/amp/s/www.freecodecamp.org/news/build-a-pwa-from-scratch-with-html-css-and-javascript/amp/>
>
>
> The following steps are to be done to convert an app to pwa
> 1. Create a manifest.json file.
>
> 2. Modify the index.html file to reference the manifest.json.
>
> 3. Implement a ServiceWorker.js file. This will be in the same root folder as the generated main entry point js file.
>
> 4. Register the ServiceWorker.js file by modifying for the generated entry point js file.
>
>
> If I am coding my web app using plain html, css and javascript it will not be a problem doing the above 4 tasks. But as I am using royale task three and four look challenging. I think the royale sdk and compiler might need to be tweaked to support those tasks.
>
> On Sun, 13 Mar 2022, 19:04 Harbs, <harbs.lists@gmail.com <ma...@gmail.com>> wrote:
> No. Why would you need to modify the js file?
>
>> On Mar 13, 2022, at 7:47 PM, Roman Isitua <romanisitua@gmail.com <ma...@gmail.com>> wrote:
>>
>> So I am free to modify the generated entry point js file as well ?
>>
>> This does not really look like an ideal solution because each time I recompile the project the generated js file will be overwritten. An ideal solution will be to add support for it in royale sdk.
>>
>>
>>
>> On Sun, 13 Mar 2022, 18:36 Harbs, <harbs.lists@gmail.com <ma...@gmail.com>> wrote:
>> It shouldn’t be any different than a regular web app.
>>
>> You can add whatever you want to the template index.html file.
>>
>>> On Mar 12, 2022, at 11:53 AM, Roman Isitua <romanisitua@gmail.com <ma...@gmail.com>> wrote:
>>>
>>> I just stumbled on a tutorial on how to create a pwa app using plain html, javascript and css (i.e. no framework).
>>>
>>> I am now forced to ask the question. How can i do this in royale ?
>>>
>>> Here is the link
>>>
>>> https://www.google.com/amp/s/www.freecodecamp.org/news/build-a-pwa-from-scratch-with-html-css-and-javascript/amp/ <https://www.google.com/amp/s/www.freecodecamp.org/news/build-a-pwa-from-scratch-with-html-css-and-javascript/amp/>
>>>
>>>
>>> How can I register all the generated javascript files ?
>>>
>>> Is modifying the main entry point js file in my royale project allowed ? From the tutorial this file will need to be modified to register the service worker.
>>>
>>>
>>> Has someone created a pwa in royale before ?
>>>
>>>
>>> Pwa's are rapidly being adopted it will be nice if I can package my responsive web application to be a pwa with little effort.
>>>
>>>
>>> Regards,
>>>
>>>
>>
>
>
>
> --
> Andrew Wetmore
>
> Editor, Moose House Publications <https://moosehousepress.com/>
> Editor-Writer, The Apache Software Foundation <https://apache.org/>
>
>
>
>
Re: Royale support for progressive web apps (pwa)
Posted by Andrew Wetmore <co...@gmail.com>.
What is the gain of adding the .json file and all that? Doesn't a Royale
app compiled for use with JS files run just fine without further
modification on a web page?
On Sun, Mar 13, 2022 at 3:26 PM Roman Isitua <ro...@gmail.com> wrote:
> From the below link
>
>
> https://www.google.com/amp/s/www.freecodecamp.org/news/build-a-pwa-from-scratch-with-html-css-and-javascript/amp/
>
>
> The following steps are to be done to convert an app to pwa
> 1. Create a manifest.json file.
>
> 2. Modify the index.html file to reference the manifest.json.
>
> 3. Implement a ServiceWorker.js file. This will be in the same root folder
> as the generated main entry point js file.
>
> 4. Register the ServiceWorker.js file by modifying for the generated entry
> point js file.
>
>
> If I am coding my web app using plain html, css and javascript it will not
> be a problem doing the above 4 tasks. But as I am using royale task three
> and four look challenging. I think the royale sdk and compiler might need
> to be tweaked to support those tasks.
>
> On Sun, 13 Mar 2022, 19:04 Harbs, <ha...@gmail.com> wrote:
>
>> No. Why would you need to modify the js file?
>>
>> On Mar 13, 2022, at 7:47 PM, Roman Isitua <ro...@gmail.com> wrote:
>>
>> So I am free to modify the generated entry point js file as well ?
>>
>> This does not really look like an ideal solution because each time I
>> recompile the project the generated js file will be overwritten. An ideal
>> solution will be to add support for it in royale sdk.
>>
>>
>>
>> On Sun, 13 Mar 2022, 18:36 Harbs, <ha...@gmail.com> wrote:
>>
>>> It shouldn’t be any different than a regular web app.
>>>
>>> You can add whatever you want to the template index.html file.
>>>
>>> On Mar 12, 2022, at 11:53 AM, Roman Isitua <ro...@gmail.com>
>>> wrote:
>>>
>>> I just stumbled on a tutorial on how to create a pwa app using plain
>>> html, javascript and css (i.e. no framework).
>>>
>>> I am now forced to ask the question. How can i do this in royale ?
>>>
>>> Here is the link
>>>
>>>
>>> https://www.google.com/amp/s/www.freecodecamp.org/news/build-a-pwa-from-scratch-with-html-css-and-javascript/amp/
>>>
>>>
>>> How can I register all the generated javascript files ?
>>>
>>> Is modifying the main entry point js file in my royale project allowed ?
>>> From the tutorial this file will need to be modified to register the
>>> service worker.
>>>
>>>
>>> Has someone created a pwa in royale before ?
>>>
>>>
>>> Pwa's are rapidly being adopted it will be nice if I can package my
>>> responsive web application to be a pwa with little effort.
>>>
>>>
>>> Regards,
>>>
>>>
>>>
>>>
>>
--
Andrew Wetmore
Editor, Moose House Publications <https://moosehousepress.com/>
Editor-Writer, The Apache Software Foundation <https://apache.org/>
Re: Royale support for progressive web apps (pwa)
Posted by Roman Isitua <ro...@gmail.com>.
It works. Thanks Harbs.
The following steps are to be done to convert an app to pwa
1. Create a manifest.json file. Place it in the root folder in
src/main/resources where the index template html file is.
2. Modify the index template html file to reference the manifest.json.
3. Implement a serviceWorker.js file. This will be in the same root folder
in src/main/resources
4. In the main mxml file of the project create an init method then add the
below snippets
if ("serviceWorker" in window.navigator) {
window.navigator.serviceWorker
.register("/serviceWorker.js")
.then(function(res):void{trace("service worker registered")})
.catch(function(err):void{trace("service worker not registered: "+
err)})
}
Then compile the project and deploy to the web server. Once you launch the
url the web browser will ask you if want to install it as an app. If you
click yes, it will install the app locally and put an icon for launching it.
On Mon, 14 Mar 2022, 12:51 Harbs, <ha...@gmail.com> wrote:
> I’d add it to the init stage of the application.
>
> Actually, in ActionScript, you can get rid of the “load” event listener:
>
> if ("serviceWorker" in window.navigator) {
> window.navigator.serviceWorker
> .register("/serviceWorker.js")
> .then(function(res):void{trace("service worker registered")})
> .catch(function(err):void{trace("service worker not registered: "+
> err)})
> }
>
>
>
> On Mar 14, 2022, at 1:14 PM, Roman Isitua <ro...@gmail.com> wrote:
>
> One question.
>
> At which point in the code should the below actionscript code be added.
> Is it in the sp:Application (assuming I am using spectrum) area ? I.e In
> the fx script portion of the mxml ?
>
> On Mon, 14 Mar 2022, 08:45 Roman Isitua, <ro...@gmail.com> wrote:
>
>> Wow ! I will definitely try this and provide an update on the outcome.
>>
>> On Mon, 14 Mar 2022, 08:42 Harbs, <ha...@gmail.com> wrote:
>>
>>> Yes.
>>>
>>> You can put that in a script tag in the html.
>>>
>>> Here’s an ActionScript equivalent of that code:
>>>
>>> if ("serviceWorker" in window.navigator) {
>>> window.addEventListener("load", function():void {
>>> window.navigator.serviceWorker
>>> .register("/serviceWorker.js")
>>> .then(function(res):void{trace("service worker registered")})
>>> .catch(function(err):void{trace("service worker not registered: "+
>>> err)})
>>> })
>>> }
>>>
>>> If there’s no typedef support for serviceWorker you might need to use:
>>> window.navigator[“serviceWorker”]
>>>
>>> On Mar 14, 2022, at 1:00 AM, Roman Isitua <ro...@gmail.com> wrote:
>>>
>>> From the tutorial the code to register the service worker is as follows:
>>>
>>>
>>>
>>> if ("serviceWorker" in navigator) {
>>> window.addEventListener("load", function() {
>>> navigator.serviceWorker
>>> .register("/serviceWorker.js")
>>> .then(res => console.log("service worker registered"))
>>> .catch(err => console.log("service worker not registered", err))
>>> })
>>> }
>>>
>>> To implement the main entry point js file was modified.
>>>
>>> So your saying it possible to do same in the index.html or actionscript
>>> ?
>>>
>>> If yes my next question is how ?
>>>
>>> On Sun, 13 Mar 2022, 20:19 Harbs, <ha...@gmail.com> wrote:
>>>
>>>> If you want it to work offline with Cache, you will need a service
>>>> worker, but that is a _SEPARATE_ js file. You don’t need to modify the main
>>>> JS file.
>>>>
>>>> You do need to register the service worker, but that can be done either
>>>> in the index html file, or in your ActionScript code.
>>>>
>>>> On Mar 13, 2022, at 8:24 PM, Roman Isitua <ro...@gmail.com>
>>>> wrote:
>>>>
>>>> From the below link
>>>>
>>>>
>>>> https://www.google.com/amp/s/www.freecodecamp.org/news/build-a-pwa-from-scratch-with-html-css-and-javascript/amp/
>>>>
>>>>
>>>> The following steps are to be done to convert an app to pwa
>>>> 1. Create a manifest.json file.
>>>>
>>>> 2. Modify the index.html file to reference the manifest.json.
>>>>
>>>> 3. Implement a ServiceWorker.js file. This will be in the same root
>>>> folder as the generated main entry point js file.
>>>>
>>>> 4. Register the ServiceWorker.js file by modifying for the generated
>>>> entry point js file.
>>>>
>>>>
>>>> If I am coding my web app using plain html, css and javascript it will
>>>> not be a problem doing the above 4 tasks. But as I am using royale task
>>>> three and four look challenging. I think the royale sdk and compiler might
>>>> need to be tweaked to support those tasks.
>>>>
>>>> On Sun, 13 Mar 2022, 19:04 Harbs, <ha...@gmail.com> wrote:
>>>>
>>>>> No. Why would you need to modify the js file?
>>>>>
>>>>> On Mar 13, 2022, at 7:47 PM, Roman Isitua <ro...@gmail.com>
>>>>> wrote:
>>>>>
>>>>> So I am free to modify the generated entry point js file as well ?
>>>>>
>>>>> This does not really look like an ideal solution because each time I
>>>>> recompile the project the generated js file will be overwritten. An ideal
>>>>> solution will be to add support for it in royale sdk.
>>>>>
>>>>>
>>>>>
>>>>> On Sun, 13 Mar 2022, 18:36 Harbs, <ha...@gmail.com> wrote:
>>>>>
>>>>>> It shouldn’t be any different than a regular web app.
>>>>>>
>>>>>> You can add whatever you want to the template index.html file.
>>>>>>
>>>>>> On Mar 12, 2022, at 11:53 AM, Roman Isitua <ro...@gmail.com>
>>>>>> wrote:
>>>>>>
>>>>>> I just stumbled on a tutorial on how to create a pwa app using plain
>>>>>> html, javascript and css (i.e. no framework).
>>>>>>
>>>>>> I am now forced to ask the question. How can i do this in royale ?
>>>>>>
>>>>>> Here is the link
>>>>>>
>>>>>>
>>>>>> https://www.google.com/amp/s/www.freecodecamp.org/news/build-a-pwa-from-scratch-with-html-css-and-javascript/amp/
>>>>>>
>>>>>>
>>>>>> How can I register all the generated javascript files ?
>>>>>>
>>>>>> Is modifying the main entry point js file in my royale project
>>>>>> allowed ? From the tutorial this file will need to be modified to register
>>>>>> the service worker.
>>>>>>
>>>>>>
>>>>>> Has someone created a pwa in royale before ?
>>>>>>
>>>>>>
>>>>>> Pwa's are rapidly being adopted it will be nice if I can package my
>>>>>> responsive web application to be a pwa with little effort.
>>>>>>
>>>>>>
>>>>>> Regards,
>>>>>>
>>>>>>
>>>>>>
>>>>>>
>>>>>
>>>>
>>>
>
Re: Royale support for progressive web apps (pwa)
Posted by Harbs <ha...@gmail.com>.
I’d add it to the init stage of the application.
Actually, in ActionScript, you can get rid of the “load” event listener:
if ("serviceWorker" in window.navigator) {
window.navigator.serviceWorker
.register("/serviceWorker.js")
.then(function(res):void{trace("service worker registered")})
.catch(function(err):void{trace("service worker not registered: "+ err)})
}
> On Mar 14, 2022, at 1:14 PM, Roman Isitua <ro...@gmail.com> wrote:
>
> One question.
>
> At which point in the code should the below actionscript code be added. Is it in the sp:Application (assuming I am using spectrum) area ? I.e In the fx script portion of the mxml ?
>
> On Mon, 14 Mar 2022, 08:45 Roman Isitua, <romanisitua@gmail.com <ma...@gmail.com>> wrote:
> Wow ! I will definitely try this and provide an update on the outcome.
>
> On Mon, 14 Mar 2022, 08:42 Harbs, <harbs.lists@gmail.com <ma...@gmail.com>> wrote:
> Yes.
>
> You can put that in a script tag in the html.
>
> Here’s an ActionScript equivalent of that code:
>
> if ("serviceWorker" in window.navigator) {
> window.addEventListener("load", function():void {
> window.navigator.serviceWorker
> .register("/serviceWorker.js")
> .then(function(res):void{trace("service worker registered")})
> .catch(function(err):void{trace("service worker not registered: "+ err)})
> })
> }
>
> If there’s no typedef support for serviceWorker you might need to use: window.navigator[“serviceWorker”]
>
>> On Mar 14, 2022, at 1:00 AM, Roman Isitua <romanisitua@gmail.com <ma...@gmail.com>> wrote:
>>
>> From the tutorial the code to register the service worker is as follows:
>>
>>
>>
>> if ("serviceWorker" in navigator) {
>> window.addEventListener("load", function() {
>> navigator.serviceWorker
>> .register("/serviceWorker.js")
>> .then(res => console.log("service worker registered"))
>> .catch(err => console.log("service worker not registered", err))
>> })
>> }
>> To implement the main entry point js file was modified.
>>
>> So your saying it possible to do same in the index.html or actionscript ?
>>
>> If yes my next question is how ?
>>
>> On Sun, 13 Mar 2022, 20:19 Harbs, <harbs.lists@gmail.com <ma...@gmail.com>> wrote:
>> If you want it to work offline with Cache, you will need a service worker, but that is a _SEPARATE_ js file. You don’t need to modify the main JS file.
>>
>> You do need to register the service worker, but that can be done either in the index html file, or in your ActionScript code.
>>
>>> On Mar 13, 2022, at 8:24 PM, Roman Isitua <romanisitua@gmail.com <ma...@gmail.com>> wrote:
>>>
>>> From the below link
>>>
>>> https://www.google.com/amp/s/www.freecodecamp.org/news/build-a-pwa-from-scratch-with-html-css-and-javascript/amp/ <https://www.google.com/amp/s/www.freecodecamp.org/news/build-a-pwa-from-scratch-with-html-css-and-javascript/amp/>
>>>
>>>
>>> The following steps are to be done to convert an app to pwa
>>> 1. Create a manifest.json file.
>>>
>>> 2. Modify the index.html file to reference the manifest.json.
>>>
>>> 3. Implement a ServiceWorker.js file. This will be in the same root folder as the generated main entry point js file.
>>>
>>> 4. Register the ServiceWorker.js file by modifying for the generated entry point js file.
>>>
>>>
>>> If I am coding my web app using plain html, css and javascript it will not be a problem doing the above 4 tasks. But as I am using royale task three and four look challenging. I think the royale sdk and compiler might need to be tweaked to support those tasks.
>>>
>>> On Sun, 13 Mar 2022, 19:04 Harbs, <harbs.lists@gmail.com <ma...@gmail.com>> wrote:
>>> No. Why would you need to modify the js file?
>>>
>>>> On Mar 13, 2022, at 7:47 PM, Roman Isitua <romanisitua@gmail.com <ma...@gmail.com>> wrote:
>>>>
>>>> So I am free to modify the generated entry point js file as well ?
>>>>
>>>> This does not really look like an ideal solution because each time I recompile the project the generated js file will be overwritten. An ideal solution will be to add support for it in royale sdk.
>>>>
>>>>
>>>>
>>>> On Sun, 13 Mar 2022, 18:36 Harbs, <harbs.lists@gmail.com <ma...@gmail.com>> wrote:
>>>> It shouldn’t be any different than a regular web app.
>>>>
>>>> You can add whatever you want to the template index.html file.
>>>>
>>>>> On Mar 12, 2022, at 11:53 AM, Roman Isitua <romanisitua@gmail.com <ma...@gmail.com>> wrote:
>>>>>
>>>>> I just stumbled on a tutorial on how to create a pwa app using plain html, javascript and css (i.e. no framework).
>>>>>
>>>>> I am now forced to ask the question. How can i do this in royale ?
>>>>>
>>>>> Here is the link
>>>>>
>>>>> https://www.google.com/amp/s/www.freecodecamp.org/news/build-a-pwa-from-scratch-with-html-css-and-javascript/amp/ <https://www.google.com/amp/s/www.freecodecamp.org/news/build-a-pwa-from-scratch-with-html-css-and-javascript/amp/>
>>>>>
>>>>>
>>>>> How can I register all the generated javascript files ?
>>>>>
>>>>> Is modifying the main entry point js file in my royale project allowed ? From the tutorial this file will need to be modified to register the service worker.
>>>>>
>>>>>
>>>>> Has someone created a pwa in royale before ?
>>>>>
>>>>>
>>>>> Pwa's are rapidly being adopted it will be nice if I can package my responsive web application to be a pwa with little effort.
>>>>>
>>>>>
>>>>> Regards,
>>>>>
>>>>>
>>>>
>>>
>>
>
Re: Royale support for progressive web apps (pwa)
Posted by Harbs <ha...@gmail.com>.
I’d create issues for any HTML APIs you come across that are not recognized by Royale so we can add them to typedefs.
> On Mar 22, 2022, at 12:15 PM, Roman Isitua <ro...@gmail.com> wrote:
>
>
> I will be interested in accessing features like camera (to take pictures) or even geolocation via the html5 (javascript) api.
>
> https://dzone.com/refcardz/html5-new-standards-web-interactivity <https://dzone.com/refcardz/html5-new-standards-web-interactivity>
>
>
> The below is a list of what is supported today in android phones. IOS supports a smaller subset.
>
> https://whatwebcando.today/ <https://whatwebcando.today/>
>
>
> In absence of documentation for the "full" integration, I can look at the existing examples you listed (JQuery, MDL). For the "none" integration, I stumbled on this example below
>
> https://royale.apache.org/using-external-javascript-libraries-in-apache-royale/ <https://royale.apache.org/using-external-javascript-libraries-in-apache-royale/>
>
> Is this what you mean by "none" integration ?
>
>
> On Mon, Mar 21, 2022 at 5:34 PM Alex Harui <aharui@adobe.com <ma...@adobe.com>> wrote:
> Responses inline…
>
>
>
> From: Roman Isitua <romanisitua@gmail.com <ma...@gmail.com>>
> Reply-To: "users@royale.apache.org <ma...@royale.apache.org>" <users@royale.apache.org <ma...@royale.apache.org>>
> Date: Saturday, March 19, 2022 at 9:07 PM
> To: "users@royale.apache.org <ma...@royale.apache.org>" <users@royale.apache.org <ma...@royale.apache.org>>
> Subject: Re: Royale support for progressive web apps (pwa)
>
>
>
> Actually the goal is to be able to leverage the new browser api's.
>
>
>
> AJH: OK, but in what way? That’s why I’m asking about the 3 levels of integration. One way to think of it is as a spectrum where on the “none” end, the goal is to re-use as much example code from MDN and other JS sources as possible. Then their recipes for how to install and setup and their “Getting Started” examples have a better chance of working, but yoo don’t get to use MXML or type-checking. At the “full” end, you’ll probably end up writing a “Getting Started” for Royale that leverages MXML. Which should reduce the steps and amount of typing to get the example up and running.
>
> Is there online Documentation about the three levels of integration that you just listed ?
>
>
>
> AJH: There is a need for documentation in many areas, including this
>
>
>
> Or at least if you can point to some simple examples in the royale sdk that use the three ways of integration that will be helpful. I can study the source code and learn how it is done.
>
>
>
> AJH: . Most of the SWCs for 3rd party libraries in frameworks/libs, like CreateJS, JQuery, Material, are full integration SWCs because the goal was to use MXML as much as possible. ACE might be the middle. There won’t be frameworks/libs SWCs for “none” integration as then you would code directly against the typedefs SWCs and not use MXML at all.
>
>
>
>
> Last question, (since you mentioned air.) Does royale support deploying to adobe air for mobile devices ? If yes. How can I leverage air mobile sdk functionality in a royale app.
>
>
> AJH: Theoretcially, Royale can output running SWF code, and we have one automated test that proves that some basic functionality works, but I don’t think most components currently work as well on SWF. AIR supposedly has a JS engine, but I haven’t tried it. And then there are desktop runtimes for JS that are similar to AIR like Electron and I think some Cordova-related options ,and I think someone recently got Royale working in Electron.
>
> HTH,
>
> -Alex
>
>
>
> On Sun, 20 Mar 2022, 00:23 Alex Harui, <aharui@adobe.com <ma...@adobe.com>> wrote:
>
> (If you read my thoughts in the “Implementing JS Renderer” thread, you can skip the next 6 paragraphs)
>
>
>
> AFAIK, there is no current "Royale way" of creating PWAs. However, the whole point of Royale is to improve developer productivity for common patterns. New patterns become popular every day and it is "just" a matter of identifying what parts of those patterns can be made easier via declarative syntax (MXML) or strong typing (AS) and updating Royale accordingly.
>
>
>
> And while the Basic and especially MXRoyale and SparkRoyale libraries are intended to emulate Flex patterns. There is no requirement for all SWCs to emulate Flex patterns. New patterns might require more compiler changes, but are possible.
>
>
>
> Also, IMO, there are 3 "levels" of Royale integration for external libraries: Full, partial, and none. Full integration generally involves wrapping external in AS classes. Most of the current SWCs do that. An AS Class is instantiated and its APIs do things to some JS library. That generally provides the most developer productivity because the library supports MXML (no constructor parameters, more get/set APIs instead of functions/methods) and AS (strong typing). However, that means more code runs since you are essentially wrapping a library in a library.
>
>
>
> Partial integration involves creating a few AS classes to talk to the JS library. I think the ACE SWC does is an example of partial integration.
>
>
>
> And "none" means that you are writing code that pretty much calls the typedefs directly.
>
>
>
> As you can hopefully see, there is a tradeoff between how much work you put into wrapping up external libraries and how easy it is to then write code against it. If you only need to do something once, then it might be easier to just hack something to talk to the typedefs.
>
>
>
> Specific to PWAs, I am definitely not an expert on PWAs, but IMO, the link posted was for an example of some of the related PWA APIs but didn’t really produce anything Progressive. Reading the MDN articles on PWAs was a bit more informative, especially about the two places where the word “Progressive” showed up, which was 1) providing progressively more functionality based on device capability, and 2) progressively loading the application.
>
>
>
> I could argue that Flex and Royale already provide a way of creating PWAs, but don’t use the new browser APIs. AIR-based apps, for example, provide offline capabilities. Proper use of view states provide a different way of managing what UI is presented to the users. And modules provide a way to progressively load your app. What is missing might be capability detection, although some of that may already be available by detecting OS or via some Cordova libraries.
>
>
>
> But if the goal is to leverage these new browser APIs in Royale, then it comes down to picking the level of integration and creating any wrapping code if desired. It would be interesting to see if Royale view states and MXML would make it much more efficient to create PWAs. However, I don’t have the time to work on that these days.
>
>
>
> My 2 cents,
>
> -Alex
>
>
>
> From: Roman Isitua <romanisitua@gmail.com <ma...@gmail.com>>
> Reply-To: "users@royale.apache.org <ma...@royale.apache.org>" <users@royale.apache.org <ma...@royale.apache.org>>
> Date: Monday, March 14, 2022 at 11:17 AM
> To: "users@royale.apache.org <ma...@royale.apache.org>" <users@royale.apache.org <ma...@royale.apache.org>>
> Subject: Re: Royale support for progressive web apps (pwa)
>
>
>
> Yes. It should be in a similar section to where cordova is.
>
>
>
> On Mon, 14 Mar 2022, 12:23 Andrew Wetmore, <cottage14@gmail.com <ma...@gmail.com>> wrote:
>
> Roman, when you get this sorted out, let's figure out where in the documentation we should explain how to use Royale to create progressive web apps. I presume it would go alongside explaining how to prepare a Royale app for use with Cordova to achieve a similar goal.
>
>
>
> a
>
>
>
> On Mon, Mar 14, 2022 at 8:16 AM Roman Isitua <romanisitua@gmail.com <ma...@gmail.com>> wrote:
>
> One question.
>
>
>
> At which point in the code should the below actionscript code be added. Is it in the sp:Application (assuming I am using spectrum) area ? I.e In the fx script portion of the mxml ?
>
>
>
> On Mon, 14 Mar 2022, 08:45 Roman Isitua, <romanisitua@gmail.com <ma...@gmail.com>> wrote:
>
> Wow ! I will definitely try this and provide an update on the outcome.
>
>
>
> On Mon, 14 Mar 2022, 08:42 Harbs, <harbs.lists@gmail.com <ma...@gmail.com>> wrote:
>
> Yes.
>
>
>
> You can put that in a script tag in the html.
>
>
>
> Here’s an ActionScript equivalent of that code:
>
>
>
> if ("serviceWorker" in window.navigator) {
>
> window.addEventListener("load", function():void {
>
> window.navigator.serviceWorker
>
> .register("/serviceWorker.js")
>
> .then(function(res):void{trace("service worker registered")})
>
> .catch(function(err):void{trace("service worker not registered: "+ err)})
>
> })
>
> }
>
>
>
> If there’s no typedef support for serviceWorker you might need to use: window.navigator[“serviceWorker”]
>
>
>
> On Mar 14, 2022, at 1:00 AM, Roman Isitua <romanisitua@gmail.com <ma...@gmail.com>> wrote:
>
>
>
> From the tutorial the code to register the service worker is as follows:
>
>
>
>
>
>
>
> if ("serviceWorker" in navigator) {
> window.addEventListener("load", function() {
> navigator.serviceWorker
> .register("/serviceWorker.js")
> .then(res => console.log("service worker registered"))
> .catch(err => console.log("service worker not registered", err))
> })
> }
> To implement the main entry point js file was modified.
>
>
>
> So your saying it possible to do same in the index.html or actionscript ?
>
>
>
> If yes my next question is how ?
>
>
>
> On Sun, 13 Mar 2022, 20:19 Harbs, <harbs.lists@gmail.com <ma...@gmail.com>> wrote:
>
> If you want it to work offline with Cache, you will need a service worker, but that is a _SEPARATE_ js file. You don’t need to modify the main JS file.
>
>
>
> You do need to register the service worker, but that can be done either in the index html file, or in your ActionScript code.
>
>
>
> On Mar 13, 2022, at 8:24 PM, Roman Isitua <romanisitua@gmail.com <ma...@gmail.com>> wrote:
>
>
>
> From the below link
>
>
>
> https://www.google.com/amp/s/www.freecodecamp.org/news/build-a-pwa-from-scratch-with-html-css-and-javascript/amp/ <https://nam04.safelinks.protection.outlook.com/?url=https%3A%2F%2Fwww.google.com%2Famp%2Fs%2Fwww.freecodecamp.org%2Fnews%2Fbuild-a-pwa-from-scratch-with-html-css-and-javascript%2Famp%2F&data=04%7C01%7Caharui%40adobe.com%7C2de406a4f86e4d46fcae08da0a273352%7Cfa7b1b5a7b34438794aed2c178decee1%7C0%7C0%7C637833460731724903%7CUnknown%7CTWFpbGZsb3d8eyJWIjoiMC4wLjAwMDAiLCJQIjoiV2luMzIiLCJBTiI6Ik1haWwiLCJXVCI6Mn0%3D%7C3000&sdata=EyrAD%2FSo4egYram%2FYCLj8TJ3sxcy4rOOBAogq6fScgs%3D&reserved=0>
>
>
>
>
> The following steps are to be done to convert an app to pwa
>
> 1. Create a manifest.json file.
>
>
>
> 2. Modify the index.html file to reference the manifest.json.
>
>
>
> 3. Implement a ServiceWorker.js file. This will be in the same root folder as the generated main entry point js file.
>
>
>
> 4. Register the ServiceWorker.js file by modifying for the generated entry point js file.
>
>
>
>
>
> If I am coding my web app using plain html, css and javascript it will not be a problem doing the above 4 tasks. But as I am using royale task three and four look challenging. I think the royale sdk and compiler might need to be tweaked to support those tasks.
>
>
>
> On Sun, 13 Mar 2022, 19:04 Harbs, <harbs.lists@gmail.com <ma...@gmail.com>> wrote:
>
> No. Why would you need to modify the js file?
>
>
>
> On Mar 13, 2022, at 7:47 PM, Roman Isitua <romanisitua@gmail.com <ma...@gmail.com>> wrote:
>
>
>
> So I am free to modify the generated entry point js file as well ?
>
>
>
> This does not really look like an ideal solution because each time I recompile the project the generated js file will be overwritten. An ideal solution will be to add support for it in royale sdk.
>
>
>
>
>
>
>
> On Sun, 13 Mar 2022, 18:36 Harbs, <harbs.lists@gmail.com <ma...@gmail.com>> wrote:
>
> It shouldn’t be any different than a regular web app.
>
>
>
> You can add whatever you want to the template index.html file.
>
>
>
> On Mar 12, 2022, at 11:53 AM, Roman Isitua <romanisitua@gmail.com <ma...@gmail.com>> wrote:
>
>
>
> I just stumbled on a tutorial on how to create a pwa app using plain html, javascript and css (i.e. no framework).
>
>
>
> I am now forced to ask the question. How can i do this in royale ?
>
>
>
> Here is the link
>
>
>
> https://www.google.com/amp/s/www.freecodecamp.org/news/build-a-pwa-from-scratch-with-html-css-and-javascript/amp/ <https://nam04.safelinks.protection.outlook.com/?url=https%3A%2F%2Fwww.google.com%2Famp%2Fs%2Fwww.freecodecamp.org%2Fnews%2Fbuild-a-pwa-from-scratch-with-html-css-and-javascript%2Famp%2F&data=04%7C01%7Caharui%40adobe.com%7C2de406a4f86e4d46fcae08da0a273352%7Cfa7b1b5a7b34438794aed2c178decee1%7C0%7C0%7C637833460731724903%7CUnknown%7CTWFpbGZsb3d8eyJWIjoiMC4wLjAwMDAiLCJQIjoiV2luMzIiLCJBTiI6Ik1haWwiLCJXVCI6Mn0%3D%7C3000&sdata=EyrAD%2FSo4egYram%2FYCLj8TJ3sxcy4rOOBAogq6fScgs%3D&reserved=0>
>
>
>
>
> How can I register all the generated javascript files ?
>
>
>
> Is modifying the main entry point js file in my royale project allowed ? From the tutorial this file will need to be modified to register the service worker.
>
>
>
>
>
> Has someone created a pwa in royale before ?
>
>
>
>
>
> Pwa's are rapidly being adopted it will be nice if I can package my responsive web application to be a pwa with little effort.
>
>
>
>
>
> Regards,
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
> --
>
> Andrew Wetmore
>
> Editor, Moose House Publications <https://nam04.safelinks.protection.outlook.com/?url=https%3A%2F%2Fmoosehousepress.com%2F&data=04%7C01%7Caharui%40adobe.com%7C2de406a4f86e4d46fcae08da0a273352%7Cfa7b1b5a7b34438794aed2c178decee1%7C0%7C0%7C637833460731724903%7CUnknown%7CTWFpbGZsb3d8eyJWIjoiMC4wLjAwMDAiLCJQIjoiV2luMzIiLCJBTiI6Ik1haWwiLCJXVCI6Mn0%3D%7C3000&sdata=zqnC8KH0bE9UnMDTac4mnScppkx%2FxzPHt5D5CtR%2Bs60%3D&reserved=0>
> Editor-Writer, The Apache Software Foundation <https://nam04.safelinks.protection.outlook.com/?url=https%3A%2F%2Fapache.org%2F&data=04%7C01%7Caharui%40adobe.com%7C2de406a4f86e4d46fcae08da0a273352%7Cfa7b1b5a7b34438794aed2c178decee1%7C0%7C0%7C637833460731724903%7CUnknown%7CTWFpbGZsb3d8eyJWIjoiMC4wLjAwMDAiLCJQIjoiV2luMzIiLCJBTiI6Ik1haWwiLCJXVCI6Mn0%3D%7C3000&sdata=AYCgoh52cVWv8ZP9BovsW0G8Y%2Fv6VcKtEFOGAkz9IFs%3D&reserved=0>
>
>
>
>
>
>
>
>
Re: Royale support for progressive web apps (pwa)
Posted by Roman Isitua <ro...@gmail.com>.
I will be interested in accessing features like camera (to take pictures)
or even geolocation via the html5 (javascript) api.
https://dzone.com/refcardz/html5-new-standards-web-interactivity
The below is a list of what is supported today in android phones. IOS
supports a smaller subset.
https://whatwebcando.today/
In absence of documentation for the "full" integration, I can look at the
existing examples you listed (JQuery, MDL). For the "none" integration, I
stumbled on this example below
https://royale.apache.org/using-external-javascript-libraries-in-apache-royale/
Is this what you mean by "none" integration ?
On Mon, Mar 21, 2022 at 5:34 PM Alex Harui <ah...@adobe.com> wrote:
> Responses inline…
>
>
>
> *From: *Roman Isitua <ro...@gmail.com>
> *Reply-To: *"users@royale.apache.org" <us...@royale.apache.org>
> *Date: *Saturday, March 19, 2022 at 9:07 PM
> *To: *"users@royale.apache.org" <us...@royale.apache.org>
> *Subject: *Re: Royale support for progressive web apps (pwa)
>
>
>
> Actually the goal is to be able to leverage the new browser api's.
>
>
>
> AJH: OK, but in what way? That’s why I’m asking about the 3 levels of
> integration. One way to think of it is as a spectrum where on the “none”
> end, the goal is to re-use as much example code from MDN and other JS
> sources as possible. Then their recipes for how to install and setup and
> their “Getting Started” examples have a better chance of working, but yoo
> don’t get to use MXML or type-checking. At the “full” end, you’ll probably
> end up writing a “Getting Started” for Royale that leverages MXML. Which
> should reduce the steps and amount of typing to get the example up and
> running.
>
> Is there online Documentation about the three levels of integration that
> you just listed ?
>
>
>
> AJH: There is a need for documentation in many areas, including this
>
>
>
> Or at least if you can point to some simple examples in the royale sdk
> that use the three ways of integration that will be helpful. I can study
> the source code and learn how it is done.
>
>
>
> AJH: . Most of the SWCs for 3rd party libraries in frameworks/libs, like
> CreateJS, JQuery, Material, are full integration SWCs because the goal was
> to use MXML as much as possible. ACE might be the middle. There won’t be
> frameworks/libs SWCs for “none” integration as then you would code directly
> against the typedefs SWCs and not use MXML at all.
>
>
>
>
> Last question, (since you mentioned air.) Does royale support deploying to
> adobe air for mobile devices ? If yes. How can I leverage air mobile sdk
> functionality in a royale app.
>
>
> AJH: Theoretcially, Royale can output running SWF code, and we have one
> automated test that proves that some basic functionality works, but I don’t
> think most components currently work as well on SWF. AIR supposedly has a
> JS engine, but I haven’t tried it. And then there are desktop runtimes for
> JS that are similar to AIR like Electron and I think some Cordova-related
> options ,and I think someone recently got Royale working in Electron.
>
> HTH,
>
> -Alex
>
>
>
> On Sun, 20 Mar 2022, 00:23 Alex Harui, <ah...@adobe.com> wrote:
>
> (If you read my thoughts in the “Implementing JS Renderer” thread, you can
> skip the next 6 paragraphs)
>
>
>
> AFAIK, there is no current "Royale way" of creating PWAs. However, the
> whole point of Royale is to improve developer productivity for common
> patterns. New patterns become popular every day and it is "just" a matter
> of identifying what parts of those patterns can be made easier via
> declarative syntax (MXML) or strong typing (AS) and updating Royale
> accordingly.
>
>
>
> And while the Basic and especially MXRoyale and SparkRoyale libraries are
> intended to emulate Flex patterns. There is no requirement for all SWCs to
> emulate Flex patterns. New patterns might require more compiler changes,
> but are possible.
>
>
>
> Also, IMO, there are 3 "levels" of Royale integration for external
> libraries: Full, partial, and none. Full integration generally involves
> wrapping external in AS classes. Most of the current SWCs do that. An AS
> Class is instantiated and its APIs do things to some JS library. That
> generally provides the most developer productivity because the library
> supports MXML (no constructor parameters, more get/set APIs instead of
> functions/methods) and AS (strong typing). However, that means more code
> runs since you are essentially wrapping a library in a library.
>
>
>
> Partial integration involves creating a few AS classes to talk to the JS
> library. I think the ACE SWC does is an example of partial integration.
>
>
>
> And "none" means that you are writing code that pretty much calls the
> typedefs directly.
>
>
>
> As you can hopefully see, there is a tradeoff between how much work you
> put into wrapping up external libraries and how easy it is to then write
> code against it. If you only need to do something once, then it might be
> easier to just hack something to talk to the typedefs.
>
>
>
> Specific to PWAs, I am definitely not an expert on PWAs, but IMO, the link
> posted was for an example of some of the related PWA APIs but didn’t really
> produce anything Progressive. Reading the MDN articles on PWAs was a bit
> more informative, especially about the two places where the word
> “Progressive” showed up, which was 1) providing progressively more
> functionality based on device capability, and 2) progressively loading the
> application.
>
>
>
> I could argue that Flex and Royale already provide a way of creating PWAs,
> but don’t use the new browser APIs. AIR-based apps, for example, provide
> offline capabilities. Proper use of view states provide a different way of
> managing what UI is presented to the users. And modules provide a way to
> progressively load your app. What is missing might be capability
> detection, although some of that may already be available by detecting OS
> or via some Cordova libraries.
>
>
>
> But if the goal is to leverage these new browser APIs in Royale, then it
> comes down to picking the level of integration and creating any wrapping
> code if desired. It would be interesting to see if Royale view states and
> MXML would make it much more efficient to create PWAs. However, I don’t
> have the time to work on that these days.
>
>
>
> My 2 cents,
>
> -Alex
>
>
>
> *From: *Roman Isitua <ro...@gmail.com>
> *Reply-To: *"users@royale.apache.org" <us...@royale.apache.org>
> *Date: *Monday, March 14, 2022 at 11:17 AM
> *To: *"users@royale.apache.org" <us...@royale.apache.org>
> *Subject: *Re: Royale support for progressive web apps (pwa)
>
>
>
> Yes. It should be in a similar section to where cordova is.
>
>
>
> On Mon, 14 Mar 2022, 12:23 Andrew Wetmore, <co...@gmail.com> wrote:
>
> Roman, when you get this sorted out, let's figure out where in the
> documentation we should explain how to use Royale to create progressive web
> apps. I presume it would go alongside explaining how to prepare a Royale
> app for use with Cordova to achieve a similar goal.
>
>
>
> a
>
>
>
> On Mon, Mar 14, 2022 at 8:16 AM Roman Isitua <ro...@gmail.com>
> wrote:
>
> One question.
>
>
>
> At which point in the code should the below actionscript code be added.
> Is it in the sp:Application (assuming I am using spectrum) area ? I.e In
> the fx script portion of the mxml ?
>
>
>
> On Mon, 14 Mar 2022, 08:45 Roman Isitua, <ro...@gmail.com> wrote:
>
> Wow ! I will definitely try this and provide an update on the outcome.
>
>
>
> On Mon, 14 Mar 2022, 08:42 Harbs, <ha...@gmail.com> wrote:
>
> Yes.
>
>
>
> You can put that in a script tag in the html.
>
>
>
> Here’s an ActionScript equivalent of that code:
>
>
>
> if ("serviceWorker" in window.navigator) {
>
> window.addEventListener("load", function():void {
>
> window.navigator.serviceWorker
>
> .register("/serviceWorker.js")
>
> .then(function(res):void{trace("service worker registered")})
>
> .catch(function(err):void{trace("service worker not registered: "+
> err)})
>
> })
>
> }
>
>
>
> If there’s no typedef support for serviceWorker you might need to use:
> window.navigator[“serviceWorker”]
>
>
>
> On Mar 14, 2022, at 1:00 AM, Roman Isitua <ro...@gmail.com> wrote:
>
>
>
> From the tutorial the code to register the service worker is as follows:
>
>
>
>
>
>
>
> if ("serviceWorker" in navigator) {
>
> window.addEventListener("load", function() {
>
> navigator.serviceWorker
>
> .register("/serviceWorker.js")
>
> .then(res => console.log("service worker registered"))
>
> .catch(err => console.log("service worker not registered", err))
>
> })
>
> }
>
> To implement the main entry point js file was modified.
>
>
>
> So your saying it possible to do same in the index.html or actionscript ?
>
>
>
> If yes my next question is how ?
>
>
>
> On Sun, 13 Mar 2022, 20:19 Harbs, <ha...@gmail.com> wrote:
>
> If you want it to work offline with Cache, you will need a service worker,
> but that is a _SEPARATE_ js file. You don’t need to modify the main JS file.
>
>
>
> You do need to register the service worker, but that can be done either in
> the index html file, or in your ActionScript code.
>
>
>
> On Mar 13, 2022, at 8:24 PM, Roman Isitua <ro...@gmail.com> wrote:
>
>
>
> From the below link
>
>
>
>
> https://www.google.com/amp/s/www.freecodecamp.org/news/build-a-pwa-from-scratch-with-html-css-and-javascript/amp/
> <https://nam04.safelinks.protection.outlook.com/?url=https%3A%2F%2Fwww.google.com%2Famp%2Fs%2Fwww.freecodecamp.org%2Fnews%2Fbuild-a-pwa-from-scratch-with-html-css-and-javascript%2Famp%2F&data=04%7C01%7Caharui%40adobe.com%7C2de406a4f86e4d46fcae08da0a273352%7Cfa7b1b5a7b34438794aed2c178decee1%7C0%7C0%7C637833460731724903%7CUnknown%7CTWFpbGZsb3d8eyJWIjoiMC4wLjAwMDAiLCJQIjoiV2luMzIiLCJBTiI6Ik1haWwiLCJXVCI6Mn0%3D%7C3000&sdata=EyrAD%2FSo4egYram%2FYCLj8TJ3sxcy4rOOBAogq6fScgs%3D&reserved=0>
>
>
>
>
>
> The following steps are to be done to convert an app to pwa
>
> 1. Create a manifest.json file.
>
>
>
> 2. Modify the index.html file to reference the manifest.json.
>
>
>
> 3. Implement a ServiceWorker.js file. This will be in the same root folder
> as the generated main entry point js file.
>
>
>
> 4. Register the ServiceWorker.js file by modifying for the generated entry
> point js file.
>
>
>
>
>
> If I am coding my web app using plain html, css and javascript it will not
> be a problem doing the above 4 tasks. But as I am using royale task three
> and four look challenging. I think the royale sdk and compiler might need
> to be tweaked to support those tasks.
>
>
>
> On Sun, 13 Mar 2022, 19:04 Harbs, <ha...@gmail.com> wrote:
>
> No. Why would you need to modify the js file?
>
>
>
> On Mar 13, 2022, at 7:47 PM, Roman Isitua <ro...@gmail.com> wrote:
>
>
>
> So I am free to modify the generated entry point js file as well ?
>
>
>
> This does not really look like an ideal solution because each time I
> recompile the project the generated js file will be overwritten. An ideal
> solution will be to add support for it in royale sdk.
>
>
>
>
>
>
>
> On Sun, 13 Mar 2022, 18:36 Harbs, <ha...@gmail.com> wrote:
>
> It shouldn’t be any different than a regular web app.
>
>
>
> You can add whatever you want to the template index.html file.
>
>
>
> On Mar 12, 2022, at 11:53 AM, Roman Isitua <ro...@gmail.com> wrote:
>
>
>
> I just stumbled on a tutorial on how to create a pwa app using plain html,
> javascript and css (i.e. no framework).
>
>
>
> I am now forced to ask the question. How can i do this in royale ?
>
>
>
> Here is the link
>
>
>
>
> https://www.google.com/amp/s/www.freecodecamp.org/news/build-a-pwa-from-scratch-with-html-css-and-javascript/amp/
> <https://nam04.safelinks.protection.outlook.com/?url=https%3A%2F%2Fwww.google.com%2Famp%2Fs%2Fwww.freecodecamp.org%2Fnews%2Fbuild-a-pwa-from-scratch-with-html-css-and-javascript%2Famp%2F&data=04%7C01%7Caharui%40adobe.com%7C2de406a4f86e4d46fcae08da0a273352%7Cfa7b1b5a7b34438794aed2c178decee1%7C0%7C0%7C637833460731724903%7CUnknown%7CTWFpbGZsb3d8eyJWIjoiMC4wLjAwMDAiLCJQIjoiV2luMzIiLCJBTiI6Ik1haWwiLCJXVCI6Mn0%3D%7C3000&sdata=EyrAD%2FSo4egYram%2FYCLj8TJ3sxcy4rOOBAogq6fScgs%3D&reserved=0>
>
>
>
>
>
> How can I register all the generated javascript files ?
>
>
>
> Is modifying the main entry point js file in my royale project allowed ?
> From the tutorial this file will need to be modified to register the
> service worker.
>
>
>
>
>
> Has someone created a pwa in royale before ?
>
>
>
>
>
> Pwa's are rapidly being adopted it will be nice if I can package my
> responsive web application to be a pwa with little effort.
>
>
>
>
>
> Regards,
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
> --
>
> Andrew Wetmore
>
> Editor, Moose House Publications
> <https://nam04.safelinks.protection.outlook.com/?url=https%3A%2F%2Fmoosehousepress.com%2F&data=04%7C01%7Caharui%40adobe.com%7C2de406a4f86e4d46fcae08da0a273352%7Cfa7b1b5a7b34438794aed2c178decee1%7C0%7C0%7C637833460731724903%7CUnknown%7CTWFpbGZsb3d8eyJWIjoiMC4wLjAwMDAiLCJQIjoiV2luMzIiLCJBTiI6Ik1haWwiLCJXVCI6Mn0%3D%7C3000&sdata=zqnC8KH0bE9UnMDTac4mnScppkx%2FxzPHt5D5CtR%2Bs60%3D&reserved=0>
>
> Editor-Writer, The Apache Software Foundation
> <https://nam04.safelinks.protection.outlook.com/?url=https%3A%2F%2Fapache.org%2F&data=04%7C01%7Caharui%40adobe.com%7C2de406a4f86e4d46fcae08da0a273352%7Cfa7b1b5a7b34438794aed2c178decee1%7C0%7C0%7C637833460731724903%7CUnknown%7CTWFpbGZsb3d8eyJWIjoiMC4wLjAwMDAiLCJQIjoiV2luMzIiLCJBTiI6Ik1haWwiLCJXVCI6Mn0%3D%7C3000&sdata=AYCgoh52cVWv8ZP9BovsW0G8Y%2Fv6VcKtEFOGAkz9IFs%3D&reserved=0>
>
>
>
>
>
>
>
>
>
>
Re: Royale support for progressive web apps (pwa)
Posted by Alex Harui <ah...@adobe.com>.
Responses inline…
From: Roman Isitua <ro...@gmail.com>
Reply-To: "users@royale.apache.org" <us...@royale.apache.org>
Date: Saturday, March 19, 2022 at 9:07 PM
To: "users@royale.apache.org" <us...@royale.apache.org>
Subject: Re: Royale support for progressive web apps (pwa)
Actually the goal is to be able to leverage the new browser api's.
AJH: OK, but in what way? That’s why I’m asking about the 3 levels of integration. One way to think of it is as a spectrum where on the “none” end, the goal is to re-use as much example code from MDN and other JS sources as possible. Then their recipes for how to install and setup and their “Getting Started” examples have a better chance of working, but yoo don’t get to use MXML or type-checking. At the “full” end, you’ll probably end up writing a “Getting Started” for Royale that leverages MXML. Which should reduce the steps and amount of typing to get the example up and running.
Is there online Documentation about the three levels of integration that you just listed ?
AJH: There is a need for documentation in many areas, including this
Or at least if you can point to some simple examples in the royale sdk that use the three ways of integration that will be helpful. I can study the source code and learn how it is done.
AJH: . Most of the SWCs for 3rd party libraries in frameworks/libs, like CreateJS, JQuery, Material, are full integration SWCs because the goal was to use MXML as much as possible. ACE might be the middle. There won’t be frameworks/libs SWCs for “none” integration as then you would code directly against the typedefs SWCs and not use MXML at all.
Last question, (since you mentioned air.) Does royale support deploying to adobe air for mobile devices ? If yes. How can I leverage air mobile sdk functionality in a royale app.
AJH: Theoretcially, Royale can output running SWF code, and we have one automated test that proves that some basic functionality works, but I don’t think most components currently work as well on SWF. AIR supposedly has a JS engine, but I haven’t tried it. And then there are desktop runtimes for JS that are similar to AIR like Electron and I think some Cordova-related options ,and I think someone recently got Royale working in Electron.
HTH,
-Alex
On Sun, 20 Mar 2022, 00:23 Alex Harui, <ah...@adobe.com>> wrote:
(If you read my thoughts in the “Implementing JS Renderer” thread, you can skip the next 6 paragraphs)
AFAIK, there is no current "Royale way" of creating PWAs. However, the whole point of Royale is to improve developer productivity for common patterns. New patterns become popular every day and it is "just" a matter of identifying what parts of those patterns can be made easier via declarative syntax (MXML) or strong typing (AS) and updating Royale accordingly.
And while the Basic and especially MXRoyale and SparkRoyale libraries are intended to emulate Flex patterns. There is no requirement for all SWCs to emulate Flex patterns. New patterns might require more compiler changes, but are possible.
Also, IMO, there are 3 "levels" of Royale integration for external libraries: Full, partial, and none. Full integration generally involves wrapping external in AS classes. Most of the current SWCs do that. An AS Class is instantiated and its APIs do things to some JS library. That generally provides the most developer productivity because the library supports MXML (no constructor parameters, more get/set APIs instead of functions/methods) and AS (strong typing). However, that means more code runs since you are essentially wrapping a library in a library.
Partial integration involves creating a few AS classes to talk to the JS library. I think the ACE SWC does is an example of partial integration.
And "none" means that you are writing code that pretty much calls the typedefs directly.
As you can hopefully see, there is a tradeoff between how much work you put into wrapping up external libraries and how easy it is to then write code against it. If you only need to do something once, then it might be easier to just hack something to talk to the typedefs.
Specific to PWAs, I am definitely not an expert on PWAs, but IMO, the link posted was for an example of some of the related PWA APIs but didn’t really produce anything Progressive. Reading the MDN articles on PWAs was a bit more informative, especially about the two places where the word “Progressive” showed up, which was 1) providing progressively more functionality based on device capability, and 2) progressively loading the application.
I could argue that Flex and Royale already provide a way of creating PWAs, but don’t use the new browser APIs. AIR-based apps, for example, provide offline capabilities. Proper use of view states provide a different way of managing what UI is presented to the users. And modules provide a way to progressively load your app. What is missing might be capability detection, although some of that may already be available by detecting OS or via some Cordova libraries.
But if the goal is to leverage these new browser APIs in Royale, then it comes down to picking the level of integration and creating any wrapping code if desired. It would be interesting to see if Royale view states and MXML would make it much more efficient to create PWAs. However, I don’t have the time to work on that these days.
My 2 cents,
-Alex
From: Roman Isitua <ro...@gmail.com>>
Reply-To: "users@royale.apache.org<ma...@royale.apache.org>" <us...@royale.apache.org>>
Date: Monday, March 14, 2022 at 11:17 AM
To: "users@royale.apache.org<ma...@royale.apache.org>" <us...@royale.apache.org>>
Subject: Re: Royale support for progressive web apps (pwa)
Yes. It should be in a similar section to where cordova is.
On Mon, 14 Mar 2022, 12:23 Andrew Wetmore, <co...@gmail.com>> wrote:
Roman, when you get this sorted out, let's figure out where in the documentation we should explain how to use Royale to create progressive web apps. I presume it would go alongside explaining how to prepare a Royale app for use with Cordova to achieve a similar goal.
a
On Mon, Mar 14, 2022 at 8:16 AM Roman Isitua <ro...@gmail.com>> wrote:
One question.
At which point in the code should the below actionscript code be added. Is it in the sp:Application (assuming I am using spectrum) area ? I.e In the fx script portion of the mxml ?
On Mon, 14 Mar 2022, 08:45 Roman Isitua, <ro...@gmail.com>> wrote:
Wow ! I will definitely try this and provide an update on the outcome.
On Mon, 14 Mar 2022, 08:42 Harbs, <ha...@gmail.com>> wrote:
Yes.
You can put that in a script tag in the html.
Here’s an ActionScript equivalent of that code:
if ("serviceWorker" in window.navigator) {
window.addEventListener("load", function():void {
window.navigator.serviceWorker
.register("/serviceWorker.js")
.then(function(res):void{trace("service worker registered")})
.catch(function(err):void{trace("service worker not registered: "+ err)})
})
}
If there’s no typedef support for serviceWorker you might need to use: window.navigator[“serviceWorker”]
On Mar 14, 2022, at 1:00 AM, Roman Isitua <ro...@gmail.com>> wrote:
From the tutorial the code to register the service worker is as follows:
if ("serviceWorker" in navigator) {
window.addEventListener("load", function() {
navigator.serviceWorker
.register("/serviceWorker.js")
.then(res => console.log("service worker registered"))
.catch(err => console.log("service worker not registered", err))
})
}
To implement the main entry point js file was modified.
So your saying it possible to do same in the index.html or actionscript ?
If yes my next question is how ?
On Sun, 13 Mar 2022, 20:19 Harbs, <ha...@gmail.com>> wrote:
If you want it to work offline with Cache, you will need a service worker, but that is a _SEPARATE_ js file. You don’t need to modify the main JS file.
You do need to register the service worker, but that can be done either in the index html file, or in your ActionScript code.
On Mar 13, 2022, at 8:24 PM, Roman Isitua <ro...@gmail.com>> wrote:
From the below link
https://www.google.com/amp/s/www.freecodecamp.org/news/build-a-pwa-from-scratch-with-html-css-and-javascript/amp/<https://nam04.safelinks.protection.outlook.com/?url=https%3A%2F%2Fwww.google.com%2Famp%2Fs%2Fwww.freecodecamp.org%2Fnews%2Fbuild-a-pwa-from-scratch-with-html-css-and-javascript%2Famp%2F&data=04%7C01%7Caharui%40adobe.com%7C2de406a4f86e4d46fcae08da0a273352%7Cfa7b1b5a7b34438794aed2c178decee1%7C0%7C0%7C637833460731724903%7CUnknown%7CTWFpbGZsb3d8eyJWIjoiMC4wLjAwMDAiLCJQIjoiV2luMzIiLCJBTiI6Ik1haWwiLCJXVCI6Mn0%3D%7C3000&sdata=EyrAD%2FSo4egYram%2FYCLj8TJ3sxcy4rOOBAogq6fScgs%3D&reserved=0>
The following steps are to be done to convert an app to pwa
1. Create a manifest.json file.
2. Modify the index.html file to reference the manifest.json.
3. Implement a ServiceWorker.js file. This will be in the same root folder as the generated main entry point js file.
4. Register the ServiceWorker.js file by modifying for the generated entry point js file.
If I am coding my web app using plain html, css and javascript it will not be a problem doing the above 4 tasks. But as I am using royale task three and four look challenging. I think the royale sdk and compiler might need to be tweaked to support those tasks.
On Sun, 13 Mar 2022, 19:04 Harbs, <ha...@gmail.com>> wrote:
No. Why would you need to modify the js file?
On Mar 13, 2022, at 7:47 PM, Roman Isitua <ro...@gmail.com>> wrote:
So I am free to modify the generated entry point js file as well ?
This does not really look like an ideal solution because each time I recompile the project the generated js file will be overwritten. An ideal solution will be to add support for it in royale sdk.
On Sun, 13 Mar 2022, 18:36 Harbs, <ha...@gmail.com>> wrote:
It shouldn’t be any different than a regular web app.
You can add whatever you want to the template index.html file.
On Mar 12, 2022, at 11:53 AM, Roman Isitua <ro...@gmail.com>> wrote:
I just stumbled on a tutorial on how to create a pwa app using plain html, javascript and css (i.e. no framework).
I am now forced to ask the question. How can i do this in royale ?
Here is the link
https://www.google.com/amp/s/www.freecodecamp.org/news/build-a-pwa-from-scratch-with-html-css-and-javascript/amp/<https://nam04.safelinks.protection.outlook.com/?url=https%3A%2F%2Fwww.google.com%2Famp%2Fs%2Fwww.freecodecamp.org%2Fnews%2Fbuild-a-pwa-from-scratch-with-html-css-and-javascript%2Famp%2F&data=04%7C01%7Caharui%40adobe.com%7C2de406a4f86e4d46fcae08da0a273352%7Cfa7b1b5a7b34438794aed2c178decee1%7C0%7C0%7C637833460731724903%7CUnknown%7CTWFpbGZsb3d8eyJWIjoiMC4wLjAwMDAiLCJQIjoiV2luMzIiLCJBTiI6Ik1haWwiLCJXVCI6Mn0%3D%7C3000&sdata=EyrAD%2FSo4egYram%2FYCLj8TJ3sxcy4rOOBAogq6fScgs%3D&reserved=0>
How can I register all the generated javascript files ?
Is modifying the main entry point js file in my royale project allowed ? From the tutorial this file will need to be modified to register the service worker.
Has someone created a pwa in royale before ?
Pwa's are rapidly being adopted it will be nice if I can package my responsive web application to be a pwa with little effort.
Regards,
--
Andrew Wetmore
Editor, Moose House Publications<https://nam04.safelinks.protection.outlook.com/?url=https%3A%2F%2Fmoosehousepress.com%2F&data=04%7C01%7Caharui%40adobe.com%7C2de406a4f86e4d46fcae08da0a273352%7Cfa7b1b5a7b34438794aed2c178decee1%7C0%7C0%7C637833460731724903%7CUnknown%7CTWFpbGZsb3d8eyJWIjoiMC4wLjAwMDAiLCJQIjoiV2luMzIiLCJBTiI6Ik1haWwiLCJXVCI6Mn0%3D%7C3000&sdata=zqnC8KH0bE9UnMDTac4mnScppkx%2FxzPHt5D5CtR%2Bs60%3D&reserved=0>
Editor-Writer, The Apache Software Foundation<https://nam04.safelinks.protection.outlook.com/?url=https%3A%2F%2Fapache.org%2F&data=04%7C01%7Caharui%40adobe.com%7C2de406a4f86e4d46fcae08da0a273352%7Cfa7b1b5a7b34438794aed2c178decee1%7C0%7C0%7C637833460731724903%7CUnknown%7CTWFpbGZsb3d8eyJWIjoiMC4wLjAwMDAiLCJQIjoiV2luMzIiLCJBTiI6Ik1haWwiLCJXVCI6Mn0%3D%7C3000&sdata=AYCgoh52cVWv8ZP9BovsW0G8Y%2Fv6VcKtEFOGAkz9IFs%3D&reserved=0>
Re: Royale support for progressive web apps (pwa)
Posted by Roman Isitua <ro...@gmail.com>.
Actually the goal is to be able to leverage the new browser api's.
Is there online Documentation about the three levels of integration that
you just listed ?
Or at least if you can point to some simple examples in the royale sdk that
use the three ways of integration that will be helpful. I can study the
source code and learn how it is done.
Last question, (since you mentioned air.) Does royale support deploying to
adobe air for mobile devices ? If yes. How can I leverage air mobile sdk
functionality in a royale app.
On Sun, 20 Mar 2022, 00:23 Alex Harui, <ah...@adobe.com> wrote:
> (If you read my thoughts in the “Implementing JS Renderer” thread, you can
> skip the next 6 paragraphs)
>
>
>
> AFAIK, there is no current "Royale way" of creating PWAs. However, the
> whole point of Royale is to improve developer productivity for common
> patterns. New patterns become popular every day and it is "just" a matter
> of identifying what parts of those patterns can be made easier via
> declarative syntax (MXML) or strong typing (AS) and updating Royale
> accordingly.
>
>
>
> And while the Basic and especially MXRoyale and SparkRoyale libraries are
> intended to emulate Flex patterns. There is no requirement for all SWCs to
> emulate Flex patterns. New patterns might require more compiler changes,
> but are possible.
>
>
>
> Also, IMO, there are 3 "levels" of Royale integration for external
> libraries: Full, partial, and none. Full integration generally involves
> wrapping external in AS classes. Most of the current SWCs do that. An AS
> Class is instantiated and its APIs do things to some JS library. That
> generally provides the most developer productivity because the library
> supports MXML (no constructor parameters, more get/set APIs instead of
> functions/methods) and AS (strong typing). However, that means more code
> runs since you are essentially wrapping a library in a library.
>
>
>
> Partial integration involves creating a few AS classes to talk to the JS
> library. I think the ACE SWC does is an example of partial integration.
>
>
>
> And "none" means that you are writing code that pretty much calls the
> typedefs directly.
>
>
>
> As you can hopefully see, there is a tradeoff between how much work you
> put into wrapping up external libraries and how easy it is to then write
> code against it. If you only need to do something once, then it might be
> easier to just hack something to talk to the typedefs.
>
>
>
> Specific to PWAs, I am definitely not an expert on PWAs, but IMO, the link
> posted was for an example of some of the related PWA APIs but didn’t really
> produce anything Progressive. Reading the MDN articles on PWAs was a bit
> more informative, especially about the two places where the word
> “Progressive” showed up, which was 1) providing progressively more
> functionality based on device capability, and 2) progressively loading the
> application.
>
>
>
> I could argue that Flex and Royale already provide a way of creating PWAs,
> but don’t use the new browser APIs. AIR-based apps, for example, provide
> offline capabilities. Proper use of view states provide a different way of
> managing what UI is presented to the users. And modules provide a way to
> progressively load your app. What is missing might be capability
> detection, although some of that may already be available by detecting OS
> or via some Cordova libraries.
>
>
>
> But if the goal is to leverage these new browser APIs in Royale, then it
> comes down to picking the level of integration and creating any wrapping
> code if desired. It would be interesting to see if Royale view states and
> MXML would make it much more efficient to create PWAs. However, I don’t
> have the time to work on that these days.
>
>
>
> My 2 cents,
>
> -Alex
>
>
>
> *From: *Roman Isitua <ro...@gmail.com>
> *Reply-To: *"users@royale.apache.org" <us...@royale.apache.org>
> *Date: *Monday, March 14, 2022 at 11:17 AM
> *To: *"users@royale.apache.org" <us...@royale.apache.org>
> *Subject: *Re: Royale support for progressive web apps (pwa)
>
>
>
> Yes. It should be in a similar section to where cordova is.
>
>
>
> On Mon, 14 Mar 2022, 12:23 Andrew Wetmore, <co...@gmail.com> wrote:
>
> Roman, when you get this sorted out, let's figure out where in the
> documentation we should explain how to use Royale to create progressive web
> apps. I presume it would go alongside explaining how to prepare a Royale
> app for use with Cordova to achieve a similar goal.
>
>
>
> a
>
>
>
> On Mon, Mar 14, 2022 at 8:16 AM Roman Isitua <ro...@gmail.com>
> wrote:
>
> One question.
>
>
>
> At which point in the code should the below actionscript code be added.
> Is it in the sp:Application (assuming I am using spectrum) area ? I.e In
> the fx script portion of the mxml ?
>
>
>
> On Mon, 14 Mar 2022, 08:45 Roman Isitua, <ro...@gmail.com> wrote:
>
> Wow ! I will definitely try this and provide an update on the outcome.
>
>
>
> On Mon, 14 Mar 2022, 08:42 Harbs, <ha...@gmail.com> wrote:
>
> Yes.
>
>
>
> You can put that in a script tag in the html.
>
>
>
> Here’s an ActionScript equivalent of that code:
>
>
>
> if ("serviceWorker" in window.navigator) {
>
> window.addEventListener("load", function():void {
>
> window.navigator.serviceWorker
>
> .register("/serviceWorker.js")
>
> .then(function(res):void{trace("service worker registered")})
>
> .catch(function(err):void{trace("service worker not registered: "+
> err)})
>
> })
>
> }
>
>
>
> If there’s no typedef support for serviceWorker you might need to use:
> window.navigator[“serviceWorker”]
>
>
>
> On Mar 14, 2022, at 1:00 AM, Roman Isitua <ro...@gmail.com> wrote:
>
>
>
> From the tutorial the code to register the service worker is as follows:
>
>
>
>
>
>
>
> if ("serviceWorker" in navigator) {
>
> window.addEventListener("load", function() {
>
> navigator.serviceWorker
>
> .register("/serviceWorker.js")
>
> .then(res => console.log("service worker registered"))
>
> .catch(err => console.log("service worker not registered", err))
>
> })
>
> }
>
> To implement the main entry point js file was modified.
>
>
>
> So your saying it possible to do same in the index.html or actionscript ?
>
>
>
> If yes my next question is how ?
>
>
>
> On Sun, 13 Mar 2022, 20:19 Harbs, <ha...@gmail.com> wrote:
>
> If you want it to work offline with Cache, you will need a service worker,
> but that is a _SEPARATE_ js file. You don’t need to modify the main JS file.
>
>
>
> You do need to register the service worker, but that can be done either in
> the index html file, or in your ActionScript code.
>
>
>
> On Mar 13, 2022, at 8:24 PM, Roman Isitua <ro...@gmail.com> wrote:
>
>
>
> From the below link
>
>
>
>
> https://www.google.com/amp/s/www.freecodecamp.org/news/build-a-pwa-from-scratch-with-html-css-and-javascript/amp/
> <https://nam04.safelinks.protection.outlook.com/?url=https%3A%2F%2Fwww.google.com%2Famp%2Fs%2Fwww.freecodecamp.org%2Fnews%2Fbuild-a-pwa-from-scratch-with-html-css-and-javascript%2Famp%2F&data=04%7C01%7Caharui%40adobe.com%7Cab1cddab4d0b48e3edae08da05e6eee4%7Cfa7b1b5a7b34438794aed2c178decee1%7C0%7C0%7C637828786655879622%7CUnknown%7CTWFpbGZsb3d8eyJWIjoiMC4wLjAwMDAiLCJQIjoiV2luMzIiLCJBTiI6Ik1haWwiLCJXVCI6Mn0%3D%7C3000&sdata=HE2ZLP3a4xtS9ylqr19Az13Wbp4jNPIY35%2FqCVZhw9I%3D&reserved=0>
>
>
>
>
>
> The following steps are to be done to convert an app to pwa
>
> 1. Create a manifest.json file.
>
>
>
> 2. Modify the index.html file to reference the manifest.json.
>
>
>
> 3. Implement a ServiceWorker.js file. This will be in the same root folder
> as the generated main entry point js file.
>
>
>
> 4. Register the ServiceWorker.js file by modifying for the generated entry
> point js file.
>
>
>
>
>
> If I am coding my web app using plain html, css and javascript it will not
> be a problem doing the above 4 tasks. But as I am using royale task three
> and four look challenging. I think the royale sdk and compiler might need
> to be tweaked to support those tasks.
>
>
>
> On Sun, 13 Mar 2022, 19:04 Harbs, <ha...@gmail.com> wrote:
>
> No. Why would you need to modify the js file?
>
>
>
> On Mar 13, 2022, at 7:47 PM, Roman Isitua <ro...@gmail.com> wrote:
>
>
>
> So I am free to modify the generated entry point js file as well ?
>
>
>
> This does not really look like an ideal solution because each time I
> recompile the project the generated js file will be overwritten. An ideal
> solution will be to add support for it in royale sdk.
>
>
>
>
>
>
>
> On Sun, 13 Mar 2022, 18:36 Harbs, <ha...@gmail.com> wrote:
>
> It shouldn’t be any different than a regular web app.
>
>
>
> You can add whatever you want to the template index.html file.
>
>
>
> On Mar 12, 2022, at 11:53 AM, Roman Isitua <ro...@gmail.com> wrote:
>
>
>
> I just stumbled on a tutorial on how to create a pwa app using plain html,
> javascript and css (i.e. no framework).
>
>
>
> I am now forced to ask the question. How can i do this in royale ?
>
>
>
> Here is the link
>
>
>
>
> https://www.google.com/amp/s/www.freecodecamp.org/news/build-a-pwa-from-scratch-with-html-css-and-javascript/amp/
> <https://nam04.safelinks.protection.outlook.com/?url=https%3A%2F%2Fwww.google.com%2Famp%2Fs%2Fwww.freecodecamp.org%2Fnews%2Fbuild-a-pwa-from-scratch-with-html-css-and-javascript%2Famp%2F&data=04%7C01%7Caharui%40adobe.com%7Cab1cddab4d0b48e3edae08da05e6eee4%7Cfa7b1b5a7b34438794aed2c178decee1%7C0%7C0%7C637828786656035836%7CUnknown%7CTWFpbGZsb3d8eyJWIjoiMC4wLjAwMDAiLCJQIjoiV2luMzIiLCJBTiI6Ik1haWwiLCJXVCI6Mn0%3D%7C3000&sdata=PIQzsk9GO3fCXzO%2B2a%2BQ8WyGrDmadUN%2BFDOVX82U9jE%3D&reserved=0>
>
>
>
>
>
> How can I register all the generated javascript files ?
>
>
>
> Is modifying the main entry point js file in my royale project allowed ?
> From the tutorial this file will need to be modified to register the
> service worker.
>
>
>
>
>
> Has someone created a pwa in royale before ?
>
>
>
>
>
> Pwa's are rapidly being adopted it will be nice if I can package my
> responsive web application to be a pwa with little effort.
>
>
>
>
>
> Regards,
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
> --
>
> Andrew Wetmore
>
> Editor, Moose House Publications
> <https://nam04.safelinks.protection.outlook.com/?url=https%3A%2F%2Fmoosehousepress.com%2F&data=04%7C01%7Caharui%40adobe.com%7Cab1cddab4d0b48e3edae08da05e6eee4%7Cfa7b1b5a7b34438794aed2c178decee1%7C0%7C0%7C637828786656035836%7CUnknown%7CTWFpbGZsb3d8eyJWIjoiMC4wLjAwMDAiLCJQIjoiV2luMzIiLCJBTiI6Ik1haWwiLCJXVCI6Mn0%3D%7C3000&sdata=wCQy8Dvq%2FfNO7e3NcoNvzLkJViuR7sdjx9CAJpwS2zk%3D&reserved=0>
>
> Editor-Writer, The Apache Software Foundation
> <https://nam04.safelinks.protection.outlook.com/?url=https%3A%2F%2Fapache.org%2F&data=04%7C01%7Caharui%40adobe.com%7Cab1cddab4d0b48e3edae08da05e6eee4%7Cfa7b1b5a7b34438794aed2c178decee1%7C0%7C0%7C637828786656035836%7CUnknown%7CTWFpbGZsb3d8eyJWIjoiMC4wLjAwMDAiLCJQIjoiV2luMzIiLCJBTiI6Ik1haWwiLCJXVCI6Mn0%3D%7C3000&sdata=r1tuVnxdGrpfyMZbROPti77gjgGuWreB9Bj2cExO%2BAE%3D&reserved=0>
>
>
>
>
>
>
>
>
>
>
Re: Royale support for progressive web apps (pwa)
Posted by Alex Harui <ah...@adobe.com>.
(If you read my thoughts in the “Implementing JS Renderer” thread, you can skip the next 6 paragraphs)
AFAIK, there is no current "Royale way" of creating PWAs. However, the whole point of Royale is to improve developer productivity for common patterns. New patterns become popular every day and it is "just" a matter of identifying what parts of those patterns can be made easier via declarative syntax (MXML) or strong typing (AS) and updating Royale accordingly.
And while the Basic and especially MXRoyale and SparkRoyale libraries are intended to emulate Flex patterns. There is no requirement for all SWCs to emulate Flex patterns. New patterns might require more compiler changes, but are possible.
Also, IMO, there are 3 "levels" of Royale integration for external libraries: Full, partial, and none. Full integration generally involves wrapping external in AS classes. Most of the current SWCs do that. An AS Class is instantiated and its APIs do things to some JS library. That generally provides the most developer productivity because the library supports MXML (no constructor parameters, more get/set APIs instead of functions/methods) and AS (strong typing). However, that means more code runs since you are essentially wrapping a library in a library.
Partial integration involves creating a few AS classes to talk to the JS library. I think the ACE SWC does is an example of partial integration.
And "none" means that you are writing code that pretty much calls the typedefs directly.
As you can hopefully see, there is a tradeoff between how much work you put into wrapping up external libraries and how easy it is to then write code against it. If you only need to do something once, then it might be easier to just hack something to talk to the typedefs.
Specific to PWAs, I am definitely not an expert on PWAs, but IMO, the link posted was for an example of some of the related PWA APIs but didn’t really produce anything Progressive. Reading the MDN articles on PWAs was a bit more informative, especially about the two places where the word “Progressive” showed up, which was 1) providing progressively more functionality based on device capability, and 2) progressively loading the application.
I could argue that Flex and Royale already provide a way of creating PWAs, but don’t use the new browser APIs. AIR-based apps, for example, provide offline capabilities. Proper use of view states provide a different way of managing what UI is presented to the users. And modules provide a way to progressively load your app. What is missing might be capability detection, although some of that may already be available by detecting OS or via some Cordova libraries.
But if the goal is to leverage these new browser APIs in Royale, then it comes down to picking the level of integration and creating any wrapping code if desired. It would be interesting to see if Royale view states and MXML would make it much more efficient to create PWAs. However, I don’t have the time to work on that these days.
My 2 cents,
-Alex
From: Roman Isitua <ro...@gmail.com>
Reply-To: "users@royale.apache.org" <us...@royale.apache.org>
Date: Monday, March 14, 2022 at 11:17 AM
To: "users@royale.apache.org" <us...@royale.apache.org>
Subject: Re: Royale support for progressive web apps (pwa)
Yes. It should be in a similar section to where cordova is.
On Mon, 14 Mar 2022, 12:23 Andrew Wetmore, <co...@gmail.com>> wrote:
Roman, when you get this sorted out, let's figure out where in the documentation we should explain how to use Royale to create progressive web apps. I presume it would go alongside explaining how to prepare a Royale app for use with Cordova to achieve a similar goal.
a
On Mon, Mar 14, 2022 at 8:16 AM Roman Isitua <ro...@gmail.com>> wrote:
One question.
At which point in the code should the below actionscript code be added. Is it in the sp:Application (assuming I am using spectrum) area ? I.e In the fx script portion of the mxml ?
On Mon, 14 Mar 2022, 08:45 Roman Isitua, <ro...@gmail.com>> wrote:
Wow ! I will definitely try this and provide an update on the outcome.
On Mon, 14 Mar 2022, 08:42 Harbs, <ha...@gmail.com>> wrote:
Yes.
You can put that in a script tag in the html.
Here’s an ActionScript equivalent of that code:
if ("serviceWorker" in window.navigator) {
window.addEventListener("load", function():void {
window.navigator.serviceWorker
.register("/serviceWorker.js")
.then(function(res):void{trace("service worker registered")})
.catch(function(err):void{trace("service worker not registered: "+ err)})
})
}
If there’s no typedef support for serviceWorker you might need to use: window.navigator[“serviceWorker”]
On Mar 14, 2022, at 1:00 AM, Roman Isitua <ro...@gmail.com>> wrote:
From the tutorial the code to register the service worker is as follows:
if ("serviceWorker" in navigator) {
window.addEventListener("load", function() {
navigator.serviceWorker
.register("/serviceWorker.js")
.then(res => console.log("service worker registered"))
.catch(err => console.log("service worker not registered", err))
})
}
To implement the main entry point js file was modified.
So your saying it possible to do same in the index.html or actionscript ?
If yes my next question is how ?
On Sun, 13 Mar 2022, 20:19 Harbs, <ha...@gmail.com>> wrote:
If you want it to work offline with Cache, you will need a service worker, but that is a _SEPARATE_ js file. You don’t need to modify the main JS file.
You do need to register the service worker, but that can be done either in the index html file, or in your ActionScript code.
On Mar 13, 2022, at 8:24 PM, Roman Isitua <ro...@gmail.com>> wrote:
From the below link
https://www.google.com/amp/s/www.freecodecamp.org/news/build-a-pwa-from-scratch-with-html-css-and-javascript/amp/<https://nam04.safelinks.protection.outlook.com/?url=https%3A%2F%2Fwww.google.com%2Famp%2Fs%2Fwww.freecodecamp.org%2Fnews%2Fbuild-a-pwa-from-scratch-with-html-css-and-javascript%2Famp%2F&data=04%7C01%7Caharui%40adobe.com%7Cab1cddab4d0b48e3edae08da05e6eee4%7Cfa7b1b5a7b34438794aed2c178decee1%7C0%7C0%7C637828786655879622%7CUnknown%7CTWFpbGZsb3d8eyJWIjoiMC4wLjAwMDAiLCJQIjoiV2luMzIiLCJBTiI6Ik1haWwiLCJXVCI6Mn0%3D%7C3000&sdata=HE2ZLP3a4xtS9ylqr19Az13Wbp4jNPIY35%2FqCVZhw9I%3D&reserved=0>
The following steps are to be done to convert an app to pwa
1. Create a manifest.json file.
2. Modify the index.html file to reference the manifest.json.
3. Implement a ServiceWorker.js file. This will be in the same root folder as the generated main entry point js file.
4. Register the ServiceWorker.js file by modifying for the generated entry point js file.
If I am coding my web app using plain html, css and javascript it will not be a problem doing the above 4 tasks. But as I am using royale task three and four look challenging. I think the royale sdk and compiler might need to be tweaked to support those tasks.
On Sun, 13 Mar 2022, 19:04 Harbs, <ha...@gmail.com>> wrote:
No. Why would you need to modify the js file?
On Mar 13, 2022, at 7:47 PM, Roman Isitua <ro...@gmail.com>> wrote:
So I am free to modify the generated entry point js file as well ?
This does not really look like an ideal solution because each time I recompile the project the generated js file will be overwritten. An ideal solution will be to add support for it in royale sdk.
On Sun, 13 Mar 2022, 18:36 Harbs, <ha...@gmail.com>> wrote:
It shouldn’t be any different than a regular web app.
You can add whatever you want to the template index.html file.
On Mar 12, 2022, at 11:53 AM, Roman Isitua <ro...@gmail.com>> wrote:
I just stumbled on a tutorial on how to create a pwa app using plain html, javascript and css (i.e. no framework).
I am now forced to ask the question. How can i do this in royale ?
Here is the link
https://www.google.com/amp/s/www.freecodecamp.org/news/build-a-pwa-from-scratch-with-html-css-and-javascript/amp/<https://nam04.safelinks.protection.outlook.com/?url=https%3A%2F%2Fwww.google.com%2Famp%2Fs%2Fwww.freecodecamp.org%2Fnews%2Fbuild-a-pwa-from-scratch-with-html-css-and-javascript%2Famp%2F&data=04%7C01%7Caharui%40adobe.com%7Cab1cddab4d0b48e3edae08da05e6eee4%7Cfa7b1b5a7b34438794aed2c178decee1%7C0%7C0%7C637828786656035836%7CUnknown%7CTWFpbGZsb3d8eyJWIjoiMC4wLjAwMDAiLCJQIjoiV2luMzIiLCJBTiI6Ik1haWwiLCJXVCI6Mn0%3D%7C3000&sdata=PIQzsk9GO3fCXzO%2B2a%2BQ8WyGrDmadUN%2BFDOVX82U9jE%3D&reserved=0>
How can I register all the generated javascript files ?
Is modifying the main entry point js file in my royale project allowed ? From the tutorial this file will need to be modified to register the service worker.
Has someone created a pwa in royale before ?
Pwa's are rapidly being adopted it will be nice if I can package my responsive web application to be a pwa with little effort.
Regards,
--
Andrew Wetmore
Editor, Moose House Publications<https://nam04.safelinks.protection.outlook.com/?url=https%3A%2F%2Fmoosehousepress.com%2F&data=04%7C01%7Caharui%40adobe.com%7Cab1cddab4d0b48e3edae08da05e6eee4%7Cfa7b1b5a7b34438794aed2c178decee1%7C0%7C0%7C637828786656035836%7CUnknown%7CTWFpbGZsb3d8eyJWIjoiMC4wLjAwMDAiLCJQIjoiV2luMzIiLCJBTiI6Ik1haWwiLCJXVCI6Mn0%3D%7C3000&sdata=wCQy8Dvq%2FfNO7e3NcoNvzLkJViuR7sdjx9CAJpwS2zk%3D&reserved=0>
Editor-Writer, The Apache Software Foundation<https://nam04.safelinks.protection.outlook.com/?url=https%3A%2F%2Fapache.org%2F&data=04%7C01%7Caharui%40adobe.com%7Cab1cddab4d0b48e3edae08da05e6eee4%7Cfa7b1b5a7b34438794aed2c178decee1%7C0%7C0%7C637828786656035836%7CUnknown%7CTWFpbGZsb3d8eyJWIjoiMC4wLjAwMDAiLCJQIjoiV2luMzIiLCJBTiI6Ik1haWwiLCJXVCI6Mn0%3D%7C3000&sdata=r1tuVnxdGrpfyMZbROPti77gjgGuWreB9Bj2cExO%2BAE%3D&reserved=0>
Re: Royale support for progressive web apps (pwa)
Posted by Roman Isitua <ro...@gmail.com>.
Yes. It should be in a similar section to where cordova is.
On Mon, 14 Mar 2022, 12:23 Andrew Wetmore, <co...@gmail.com> wrote:
> Roman, when you get this sorted out, let's figure out where in the
> documentation we should explain how to use Royale to create progressive web
> apps. I presume it would go alongside explaining how to prepare a Royale
> app for use with Cordova to achieve a similar goal.
>
> a
>
> On Mon, Mar 14, 2022 at 8:16 AM Roman Isitua <ro...@gmail.com>
> wrote:
>
>> One question.
>>
>> At which point in the code should the below actionscript code be added.
>> Is it in the sp:Application (assuming I am using spectrum) area ? I.e In
>> the fx script portion of the mxml ?
>>
>> On Mon, 14 Mar 2022, 08:45 Roman Isitua, <ro...@gmail.com> wrote:
>>
>>> Wow ! I will definitely try this and provide an update on the outcome.
>>>
>>> On Mon, 14 Mar 2022, 08:42 Harbs, <ha...@gmail.com> wrote:
>>>
>>>> Yes.
>>>>
>>>> You can put that in a script tag in the html.
>>>>
>>>> Here’s an ActionScript equivalent of that code:
>>>>
>>>> if ("serviceWorker" in window.navigator) {
>>>> window.addEventListener("load", function():void {
>>>> window.navigator.serviceWorker
>>>> .register("/serviceWorker.js")
>>>> .then(function(res):void{trace("service worker registered")})
>>>> .catch(function(err):void{trace("service worker not registered:
>>>> "+ err)})
>>>> })
>>>> }
>>>>
>>>> If there’s no typedef support for serviceWorker you might need to use:
>>>> window.navigator[“serviceWorker”]
>>>>
>>>> On Mar 14, 2022, at 1:00 AM, Roman Isitua <ro...@gmail.com>
>>>> wrote:
>>>>
>>>> From the tutorial the code to register the service worker is as follows:
>>>>
>>>>
>>>>
>>>> if ("serviceWorker" in navigator) {
>>>> window.addEventListener("load", function() {
>>>> navigator.serviceWorker
>>>> .register("/serviceWorker.js")
>>>> .then(res => console.log("service worker registered"))
>>>> .catch(err => console.log("service worker not registered", err))
>>>> })
>>>> }
>>>>
>>>> To implement the main entry point js file was modified.
>>>>
>>>> So your saying it possible to do same in the index.html or
>>>> actionscript ?
>>>>
>>>> If yes my next question is how ?
>>>>
>>>> On Sun, 13 Mar 2022, 20:19 Harbs, <ha...@gmail.com> wrote:
>>>>
>>>>> If you want it to work offline with Cache, you will need a service
>>>>> worker, but that is a _SEPARATE_ js file. You don’t need to modify the main
>>>>> JS file.
>>>>>
>>>>> You do need to register the service worker, but that can be done
>>>>> either in the index html file, or in your ActionScript code.
>>>>>
>>>>> On Mar 13, 2022, at 8:24 PM, Roman Isitua <ro...@gmail.com>
>>>>> wrote:
>>>>>
>>>>> From the below link
>>>>>
>>>>>
>>>>> https://www.google.com/amp/s/www.freecodecamp.org/news/build-a-pwa-from-scratch-with-html-css-and-javascript/amp/
>>>>>
>>>>>
>>>>> The following steps are to be done to convert an app to pwa
>>>>> 1. Create a manifest.json file.
>>>>>
>>>>> 2. Modify the index.html file to reference the manifest.json.
>>>>>
>>>>> 3. Implement a ServiceWorker.js file. This will be in the same root
>>>>> folder as the generated main entry point js file.
>>>>>
>>>>> 4. Register the ServiceWorker.js file by modifying for the generated
>>>>> entry point js file.
>>>>>
>>>>>
>>>>> If I am coding my web app using plain html, css and javascript it will
>>>>> not be a problem doing the above 4 tasks. But as I am using royale task
>>>>> three and four look challenging. I think the royale sdk and compiler might
>>>>> need to be tweaked to support those tasks.
>>>>>
>>>>> On Sun, 13 Mar 2022, 19:04 Harbs, <ha...@gmail.com> wrote:
>>>>>
>>>>>> No. Why would you need to modify the js file?
>>>>>>
>>>>>> On Mar 13, 2022, at 7:47 PM, Roman Isitua <ro...@gmail.com>
>>>>>> wrote:
>>>>>>
>>>>>> So I am free to modify the generated entry point js file as well ?
>>>>>>
>>>>>> This does not really look like an ideal solution because each time I
>>>>>> recompile the project the generated js file will be overwritten. An ideal
>>>>>> solution will be to add support for it in royale sdk.
>>>>>>
>>>>>>
>>>>>>
>>>>>> On Sun, 13 Mar 2022, 18:36 Harbs, <ha...@gmail.com> wrote:
>>>>>>
>>>>>>> It shouldn’t be any different than a regular web app.
>>>>>>>
>>>>>>> You can add whatever you want to the template index.html file.
>>>>>>>
>>>>>>> On Mar 12, 2022, at 11:53 AM, Roman Isitua <ro...@gmail.com>
>>>>>>> wrote:
>>>>>>>
>>>>>>> I just stumbled on a tutorial on how to create a pwa app using plain
>>>>>>> html, javascript and css (i.e. no framework).
>>>>>>>
>>>>>>> I am now forced to ask the question. How can i do this in royale ?
>>>>>>>
>>>>>>> Here is the link
>>>>>>>
>>>>>>>
>>>>>>> https://www.google.com/amp/s/www.freecodecamp.org/news/build-a-pwa-from-scratch-with-html-css-and-javascript/amp/
>>>>>>>
>>>>>>>
>>>>>>> How can I register all the generated javascript files ?
>>>>>>>
>>>>>>> Is modifying the main entry point js file in my royale project
>>>>>>> allowed ? From the tutorial this file will need to be modified to register
>>>>>>> the service worker.
>>>>>>>
>>>>>>>
>>>>>>> Has someone created a pwa in royale before ?
>>>>>>>
>>>>>>>
>>>>>>> Pwa's are rapidly being adopted it will be nice if I can package my
>>>>>>> responsive web application to be a pwa with little effort.
>>>>>>>
>>>>>>>
>>>>>>> Regards,
>>>>>>>
>>>>>>>
>>>>>>>
>>>>>>>
>>>>>>
>>>>>
>>>>
>
> --
> Andrew Wetmore
>
> Editor, Moose House Publications <https://moosehousepress.com/>
> Editor-Writer, The Apache Software Foundation <https://apache.org/>
>
>
>
>
>
Re: Royale support for progressive web apps (pwa)
Posted by Andrew Wetmore <co...@gmail.com>.
Roman, when you get this sorted out, let's figure out where in the
documentation we should explain how to use Royale to create progressive web
apps. I presume it would go alongside explaining how to prepare a Royale
app for use with Cordova to achieve a similar goal.
a
On Mon, Mar 14, 2022 at 8:16 AM Roman Isitua <ro...@gmail.com> wrote:
> One question.
>
> At which point in the code should the below actionscript code be added.
> Is it in the sp:Application (assuming I am using spectrum) area ? I.e In
> the fx script portion of the mxml ?
>
> On Mon, 14 Mar 2022, 08:45 Roman Isitua, <ro...@gmail.com> wrote:
>
>> Wow ! I will definitely try this and provide an update on the outcome.
>>
>> On Mon, 14 Mar 2022, 08:42 Harbs, <ha...@gmail.com> wrote:
>>
>>> Yes.
>>>
>>> You can put that in a script tag in the html.
>>>
>>> Here’s an ActionScript equivalent of that code:
>>>
>>> if ("serviceWorker" in window.navigator) {
>>> window.addEventListener("load", function():void {
>>> window.navigator.serviceWorker
>>> .register("/serviceWorker.js")
>>> .then(function(res):void{trace("service worker registered")})
>>> .catch(function(err):void{trace("service worker not registered: "+
>>> err)})
>>> })
>>> }
>>>
>>> If there’s no typedef support for serviceWorker you might need to use:
>>> window.navigator[“serviceWorker”]
>>>
>>> On Mar 14, 2022, at 1:00 AM, Roman Isitua <ro...@gmail.com> wrote:
>>>
>>> From the tutorial the code to register the service worker is as follows:
>>>
>>>
>>>
>>> if ("serviceWorker" in navigator) {
>>> window.addEventListener("load", function() {
>>> navigator.serviceWorker
>>> .register("/serviceWorker.js")
>>> .then(res => console.log("service worker registered"))
>>> .catch(err => console.log("service worker not registered", err))
>>> })
>>> }
>>>
>>> To implement the main entry point js file was modified.
>>>
>>> So your saying it possible to do same in the index.html or actionscript
>>> ?
>>>
>>> If yes my next question is how ?
>>>
>>> On Sun, 13 Mar 2022, 20:19 Harbs, <ha...@gmail.com> wrote:
>>>
>>>> If you want it to work offline with Cache, you will need a service
>>>> worker, but that is a _SEPARATE_ js file. You don’t need to modify the main
>>>> JS file.
>>>>
>>>> You do need to register the service worker, but that can be done either
>>>> in the index html file, or in your ActionScript code.
>>>>
>>>> On Mar 13, 2022, at 8:24 PM, Roman Isitua <ro...@gmail.com>
>>>> wrote:
>>>>
>>>> From the below link
>>>>
>>>>
>>>> https://www.google.com/amp/s/www.freecodecamp.org/news/build-a-pwa-from-scratch-with-html-css-and-javascript/amp/
>>>>
>>>>
>>>> The following steps are to be done to convert an app to pwa
>>>> 1. Create a manifest.json file.
>>>>
>>>> 2. Modify the index.html file to reference the manifest.json.
>>>>
>>>> 3. Implement a ServiceWorker.js file. This will be in the same root
>>>> folder as the generated main entry point js file.
>>>>
>>>> 4. Register the ServiceWorker.js file by modifying for the generated
>>>> entry point js file.
>>>>
>>>>
>>>> If I am coding my web app using plain html, css and javascript it will
>>>> not be a problem doing the above 4 tasks. But as I am using royale task
>>>> three and four look challenging. I think the royale sdk and compiler might
>>>> need to be tweaked to support those tasks.
>>>>
>>>> On Sun, 13 Mar 2022, 19:04 Harbs, <ha...@gmail.com> wrote:
>>>>
>>>>> No. Why would you need to modify the js file?
>>>>>
>>>>> On Mar 13, 2022, at 7:47 PM, Roman Isitua <ro...@gmail.com>
>>>>> wrote:
>>>>>
>>>>> So I am free to modify the generated entry point js file as well ?
>>>>>
>>>>> This does not really look like an ideal solution because each time I
>>>>> recompile the project the generated js file will be overwritten. An ideal
>>>>> solution will be to add support for it in royale sdk.
>>>>>
>>>>>
>>>>>
>>>>> On Sun, 13 Mar 2022, 18:36 Harbs, <ha...@gmail.com> wrote:
>>>>>
>>>>>> It shouldn’t be any different than a regular web app.
>>>>>>
>>>>>> You can add whatever you want to the template index.html file.
>>>>>>
>>>>>> On Mar 12, 2022, at 11:53 AM, Roman Isitua <ro...@gmail.com>
>>>>>> wrote:
>>>>>>
>>>>>> I just stumbled on a tutorial on how to create a pwa app using plain
>>>>>> html, javascript and css (i.e. no framework).
>>>>>>
>>>>>> I am now forced to ask the question. How can i do this in royale ?
>>>>>>
>>>>>> Here is the link
>>>>>>
>>>>>>
>>>>>> https://www.google.com/amp/s/www.freecodecamp.org/news/build-a-pwa-from-scratch-with-html-css-and-javascript/amp/
>>>>>>
>>>>>>
>>>>>> How can I register all the generated javascript files ?
>>>>>>
>>>>>> Is modifying the main entry point js file in my royale project
>>>>>> allowed ? From the tutorial this file will need to be modified to register
>>>>>> the service worker.
>>>>>>
>>>>>>
>>>>>> Has someone created a pwa in royale before ?
>>>>>>
>>>>>>
>>>>>> Pwa's are rapidly being adopted it will be nice if I can package my
>>>>>> responsive web application to be a pwa with little effort.
>>>>>>
>>>>>>
>>>>>> Regards,
>>>>>>
>>>>>>
>>>>>>
>>>>>>
>>>>>
>>>>
>>>
--
Andrew Wetmore
Editor, Moose House Publications <https://moosehousepress.com/>
Editor-Writer, The Apache Software Foundation <https://apache.org/>
Re: Royale support for progressive web apps (pwa)
Posted by Roman Isitua <ro...@gmail.com>.
One question.
At which point in the code should the below actionscript code be added. Is
it in the sp:Application (assuming I am using spectrum) area ? I.e In the
fx script portion of the mxml ?
On Mon, 14 Mar 2022, 08:45 Roman Isitua, <ro...@gmail.com> wrote:
> Wow ! I will definitely try this and provide an update on the outcome.
>
> On Mon, 14 Mar 2022, 08:42 Harbs, <ha...@gmail.com> wrote:
>
>> Yes.
>>
>> You can put that in a script tag in the html.
>>
>> Here’s an ActionScript equivalent of that code:
>>
>> if ("serviceWorker" in window.navigator) {
>> window.addEventListener("load", function():void {
>> window.navigator.serviceWorker
>> .register("/serviceWorker.js")
>> .then(function(res):void{trace("service worker registered")})
>> .catch(function(err):void{trace("service worker not registered: "+
>> err)})
>> })
>> }
>>
>> If there’s no typedef support for serviceWorker you might need to use:
>> window.navigator[“serviceWorker”]
>>
>> On Mar 14, 2022, at 1:00 AM, Roman Isitua <ro...@gmail.com> wrote:
>>
>> From the tutorial the code to register the service worker is as follows:
>>
>>
>>
>> if ("serviceWorker" in navigator) {
>> window.addEventListener("load", function() {
>> navigator.serviceWorker
>> .register("/serviceWorker.js")
>> .then(res => console.log("service worker registered"))
>> .catch(err => console.log("service worker not registered", err))
>> })
>> }
>>
>> To implement the main entry point js file was modified.
>>
>> So your saying it possible to do same in the index.html or actionscript ?
>>
>> If yes my next question is how ?
>>
>> On Sun, 13 Mar 2022, 20:19 Harbs, <ha...@gmail.com> wrote:
>>
>>> If you want it to work offline with Cache, you will need a service
>>> worker, but that is a _SEPARATE_ js file. You don’t need to modify the main
>>> JS file.
>>>
>>> You do need to register the service worker, but that can be done either
>>> in the index html file, or in your ActionScript code.
>>>
>>> On Mar 13, 2022, at 8:24 PM, Roman Isitua <ro...@gmail.com> wrote:
>>>
>>> From the below link
>>>
>>>
>>> https://www.google.com/amp/s/www.freecodecamp.org/news/build-a-pwa-from-scratch-with-html-css-and-javascript/amp/
>>>
>>>
>>> The following steps are to be done to convert an app to pwa
>>> 1. Create a manifest.json file.
>>>
>>> 2. Modify the index.html file to reference the manifest.json.
>>>
>>> 3. Implement a ServiceWorker.js file. This will be in the same root
>>> folder as the generated main entry point js file.
>>>
>>> 4. Register the ServiceWorker.js file by modifying for the generated
>>> entry point js file.
>>>
>>>
>>> If I am coding my web app using plain html, css and javascript it will
>>> not be a problem doing the above 4 tasks. But as I am using royale task
>>> three and four look challenging. I think the royale sdk and compiler might
>>> need to be tweaked to support those tasks.
>>>
>>> On Sun, 13 Mar 2022, 19:04 Harbs, <ha...@gmail.com> wrote:
>>>
>>>> No. Why would you need to modify the js file?
>>>>
>>>> On Mar 13, 2022, at 7:47 PM, Roman Isitua <ro...@gmail.com>
>>>> wrote:
>>>>
>>>> So I am free to modify the generated entry point js file as well ?
>>>>
>>>> This does not really look like an ideal solution because each time I
>>>> recompile the project the generated js file will be overwritten. An ideal
>>>> solution will be to add support for it in royale sdk.
>>>>
>>>>
>>>>
>>>> On Sun, 13 Mar 2022, 18:36 Harbs, <ha...@gmail.com> wrote:
>>>>
>>>>> It shouldn’t be any different than a regular web app.
>>>>>
>>>>> You can add whatever you want to the template index.html file.
>>>>>
>>>>> On Mar 12, 2022, at 11:53 AM, Roman Isitua <ro...@gmail.com>
>>>>> wrote:
>>>>>
>>>>> I just stumbled on a tutorial on how to create a pwa app using plain
>>>>> html, javascript and css (i.e. no framework).
>>>>>
>>>>> I am now forced to ask the question. How can i do this in royale ?
>>>>>
>>>>> Here is the link
>>>>>
>>>>>
>>>>> https://www.google.com/amp/s/www.freecodecamp.org/news/build-a-pwa-from-scratch-with-html-css-and-javascript/amp/
>>>>>
>>>>>
>>>>> How can I register all the generated javascript files ?
>>>>>
>>>>> Is modifying the main entry point js file in my royale project allowed
>>>>> ? From the tutorial this file will need to be modified to register the
>>>>> service worker.
>>>>>
>>>>>
>>>>> Has someone created a pwa in royale before ?
>>>>>
>>>>>
>>>>> Pwa's are rapidly being adopted it will be nice if I can package my
>>>>> responsive web application to be a pwa with little effort.
>>>>>
>>>>>
>>>>> Regards,
>>>>>
>>>>>
>>>>>
>>>>>
>>>>
>>>
>>
Re: Royale support for progressive web apps (pwa)
Posted by Roman Isitua <ro...@gmail.com>.
Wow ! I will definitely try this and provide an update on the outcome.
On Mon, 14 Mar 2022, 08:42 Harbs, <ha...@gmail.com> wrote:
> Yes.
>
> You can put that in a script tag in the html.
>
> Here’s an ActionScript equivalent of that code:
>
> if ("serviceWorker" in window.navigator) {
> window.addEventListener("load", function():void {
> window.navigator.serviceWorker
> .register("/serviceWorker.js")
> .then(function(res):void{trace("service worker registered")})
> .catch(function(err):void{trace("service worker not registered: "+
> err)})
> })
> }
>
> If there’s no typedef support for serviceWorker you might need to use:
> window.navigator[“serviceWorker”]
>
> On Mar 14, 2022, at 1:00 AM, Roman Isitua <ro...@gmail.com> wrote:
>
> From the tutorial the code to register the service worker is as follows:
>
>
>
> if ("serviceWorker" in navigator) {
> window.addEventListener("load", function() {
> navigator.serviceWorker
> .register("/serviceWorker.js")
> .then(res => console.log("service worker registered"))
> .catch(err => console.log("service worker not registered", err))
> })
> }
>
> To implement the main entry point js file was modified.
>
> So your saying it possible to do same in the index.html or actionscript ?
>
> If yes my next question is how ?
>
> On Sun, 13 Mar 2022, 20:19 Harbs, <ha...@gmail.com> wrote:
>
>> If you want it to work offline with Cache, you will need a service
>> worker, but that is a _SEPARATE_ js file. You don’t need to modify the main
>> JS file.
>>
>> You do need to register the service worker, but that can be done either
>> in the index html file, or in your ActionScript code.
>>
>> On Mar 13, 2022, at 8:24 PM, Roman Isitua <ro...@gmail.com> wrote:
>>
>> From the below link
>>
>>
>> https://www.google.com/amp/s/www.freecodecamp.org/news/build-a-pwa-from-scratch-with-html-css-and-javascript/amp/
>>
>>
>> The following steps are to be done to convert an app to pwa
>> 1. Create a manifest.json file.
>>
>> 2. Modify the index.html file to reference the manifest.json.
>>
>> 3. Implement a ServiceWorker.js file. This will be in the same root
>> folder as the generated main entry point js file.
>>
>> 4. Register the ServiceWorker.js file by modifying for the generated
>> entry point js file.
>>
>>
>> If I am coding my web app using plain html, css and javascript it will
>> not be a problem doing the above 4 tasks. But as I am using royale task
>> three and four look challenging. I think the royale sdk and compiler might
>> need to be tweaked to support those tasks.
>>
>> On Sun, 13 Mar 2022, 19:04 Harbs, <ha...@gmail.com> wrote:
>>
>>> No. Why would you need to modify the js file?
>>>
>>> On Mar 13, 2022, at 7:47 PM, Roman Isitua <ro...@gmail.com> wrote:
>>>
>>> So I am free to modify the generated entry point js file as well ?
>>>
>>> This does not really look like an ideal solution because each time I
>>> recompile the project the generated js file will be overwritten. An ideal
>>> solution will be to add support for it in royale sdk.
>>>
>>>
>>>
>>> On Sun, 13 Mar 2022, 18:36 Harbs, <ha...@gmail.com> wrote:
>>>
>>>> It shouldn’t be any different than a regular web app.
>>>>
>>>> You can add whatever you want to the template index.html file.
>>>>
>>>> On Mar 12, 2022, at 11:53 AM, Roman Isitua <ro...@gmail.com>
>>>> wrote:
>>>>
>>>> I just stumbled on a tutorial on how to create a pwa app using plain
>>>> html, javascript and css (i.e. no framework).
>>>>
>>>> I am now forced to ask the question. How can i do this in royale ?
>>>>
>>>> Here is the link
>>>>
>>>>
>>>> https://www.google.com/amp/s/www.freecodecamp.org/news/build-a-pwa-from-scratch-with-html-css-and-javascript/amp/
>>>>
>>>>
>>>> How can I register all the generated javascript files ?
>>>>
>>>> Is modifying the main entry point js file in my royale project allowed
>>>> ? From the tutorial this file will need to be modified to register the
>>>> service worker.
>>>>
>>>>
>>>> Has someone created a pwa in royale before ?
>>>>
>>>>
>>>> Pwa's are rapidly being adopted it will be nice if I can package my
>>>> responsive web application to be a pwa with little effort.
>>>>
>>>>
>>>> Regards,
>>>>
>>>>
>>>>
>>>>
>>>
>>
>
Re: Royale support for progressive web apps (pwa)
Posted by Harbs <ha...@gmail.com>.
Yes.
You can put that in a script tag in the html.
Here’s an ActionScript equivalent of that code:
if ("serviceWorker" in window.navigator) {
window.addEventListener("load", function():void {
window.navigator.serviceWorker
.register("/serviceWorker.js")
.then(function(res):void{trace("service worker registered")})
.catch(function(err):void{trace("service worker not registered: "+ err)})
})
}
If there’s no typedef support for serviceWorker you might need to use: window.navigator[“serviceWorker”]
> On Mar 14, 2022, at 1:00 AM, Roman Isitua <ro...@gmail.com> wrote:
>
> From the tutorial the code to register the service worker is as follows:
>
>
>
> if ("serviceWorker" in navigator) {
> window.addEventListener("load", function() {
> navigator.serviceWorker
> .register("/serviceWorker.js")
> .then(res => console.log("service worker registered"))
> .catch(err => console.log("service worker not registered", err))
> })
> }
> To implement the main entry point js file was modified.
>
> So your saying it possible to do same in the index.html or actionscript ?
>
> If yes my next question is how ?
>
> On Sun, 13 Mar 2022, 20:19 Harbs, <harbs.lists@gmail.com <ma...@gmail.com>> wrote:
> If you want it to work offline with Cache, you will need a service worker, but that is a _SEPARATE_ js file. You don’t need to modify the main JS file.
>
> You do need to register the service worker, but that can be done either in the index html file, or in your ActionScript code.
>
>> On Mar 13, 2022, at 8:24 PM, Roman Isitua <romanisitua@gmail.com <ma...@gmail.com>> wrote:
>>
>> From the below link
>>
>> https://www.google.com/amp/s/www.freecodecamp.org/news/build-a-pwa-from-scratch-with-html-css-and-javascript/amp/ <https://www.google.com/amp/s/www.freecodecamp.org/news/build-a-pwa-from-scratch-with-html-css-and-javascript/amp/>
>>
>>
>> The following steps are to be done to convert an app to pwa
>> 1. Create a manifest.json file.
>>
>> 2. Modify the index.html file to reference the manifest.json.
>>
>> 3. Implement a ServiceWorker.js file. This will be in the same root folder as the generated main entry point js file.
>>
>> 4. Register the ServiceWorker.js file by modifying for the generated entry point js file.
>>
>>
>> If I am coding my web app using plain html, css and javascript it will not be a problem doing the above 4 tasks. But as I am using royale task three and four look challenging. I think the royale sdk and compiler might need to be tweaked to support those tasks.
>>
>> On Sun, 13 Mar 2022, 19:04 Harbs, <harbs.lists@gmail.com <ma...@gmail.com>> wrote:
>> No. Why would you need to modify the js file?
>>
>>> On Mar 13, 2022, at 7:47 PM, Roman Isitua <romanisitua@gmail.com <ma...@gmail.com>> wrote:
>>>
>>> So I am free to modify the generated entry point js file as well ?
>>>
>>> This does not really look like an ideal solution because each time I recompile the project the generated js file will be overwritten. An ideal solution will be to add support for it in royale sdk.
>>>
>>>
>>>
>>> On Sun, 13 Mar 2022, 18:36 Harbs, <harbs.lists@gmail.com <ma...@gmail.com>> wrote:
>>> It shouldn’t be any different than a regular web app.
>>>
>>> You can add whatever you want to the template index.html file.
>>>
>>>> On Mar 12, 2022, at 11:53 AM, Roman Isitua <romanisitua@gmail.com <ma...@gmail.com>> wrote:
>>>>
>>>> I just stumbled on a tutorial on how to create a pwa app using plain html, javascript and css (i.e. no framework).
>>>>
>>>> I am now forced to ask the question. How can i do this in royale ?
>>>>
>>>> Here is the link
>>>>
>>>> https://www.google.com/amp/s/www.freecodecamp.org/news/build-a-pwa-from-scratch-with-html-css-and-javascript/amp/ <https://www.google.com/amp/s/www.freecodecamp.org/news/build-a-pwa-from-scratch-with-html-css-and-javascript/amp/>
>>>>
>>>>
>>>> How can I register all the generated javascript files ?
>>>>
>>>> Is modifying the main entry point js file in my royale project allowed ? From the tutorial this file will need to be modified to register the service worker.
>>>>
>>>>
>>>> Has someone created a pwa in royale before ?
>>>>
>>>>
>>>> Pwa's are rapidly being adopted it will be nice if I can package my responsive web application to be a pwa with little effort.
>>>>
>>>>
>>>> Regards,
>>>>
>>>>
>>>
>>
>
Re: Royale support for progressive web apps (pwa)
Posted by Roman Isitua <ro...@gmail.com>.
From the tutorial the code to register the service worker is as follows:
if ("serviceWorker" in navigator) {
window.addEventListener("load", function() {
navigator.serviceWorker
.register("/serviceWorker.js")
.then(res => console.log("service worker registered"))
.catch(err => console.log("service worker not registered", err))
})
}
To implement the main entry point js file was modified.
So your saying it possible to do same in the index.html or actionscript ?
If yes my next question is how ?
On Sun, 13 Mar 2022, 20:19 Harbs, <ha...@gmail.com> wrote:
> If you want it to work offline with Cache, you will need a service worker,
> but that is a _SEPARATE_ js file. You don’t need to modify the main JS file.
>
> You do need to register the service worker, but that can be done either in
> the index html file, or in your ActionScript code.
>
> On Mar 13, 2022, at 8:24 PM, Roman Isitua <ro...@gmail.com> wrote:
>
> From the below link
>
>
> https://www.google.com/amp/s/www.freecodecamp.org/news/build-a-pwa-from-scratch-with-html-css-and-javascript/amp/
>
>
> The following steps are to be done to convert an app to pwa
> 1. Create a manifest.json file.
>
> 2. Modify the index.html file to reference the manifest.json.
>
> 3. Implement a ServiceWorker.js file. This will be in the same root folder
> as the generated main entry point js file.
>
> 4. Register the ServiceWorker.js file by modifying for the generated entry
> point js file.
>
>
> If I am coding my web app using plain html, css and javascript it will not
> be a problem doing the above 4 tasks. But as I am using royale task three
> and four look challenging. I think the royale sdk and compiler might need
> to be tweaked to support those tasks.
>
> On Sun, 13 Mar 2022, 19:04 Harbs, <ha...@gmail.com> wrote:
>
>> No. Why would you need to modify the js file?
>>
>> On Mar 13, 2022, at 7:47 PM, Roman Isitua <ro...@gmail.com> wrote:
>>
>> So I am free to modify the generated entry point js file as well ?
>>
>> This does not really look like an ideal solution because each time I
>> recompile the project the generated js file will be overwritten. An ideal
>> solution will be to add support for it in royale sdk.
>>
>>
>>
>> On Sun, 13 Mar 2022, 18:36 Harbs, <ha...@gmail.com> wrote:
>>
>>> It shouldn’t be any different than a regular web app.
>>>
>>> You can add whatever you want to the template index.html file.
>>>
>>> On Mar 12, 2022, at 11:53 AM, Roman Isitua <ro...@gmail.com>
>>> wrote:
>>>
>>> I just stumbled on a tutorial on how to create a pwa app using plain
>>> html, javascript and css (i.e. no framework).
>>>
>>> I am now forced to ask the question. How can i do this in royale ?
>>>
>>> Here is the link
>>>
>>>
>>> https://www.google.com/amp/s/www.freecodecamp.org/news/build-a-pwa-from-scratch-with-html-css-and-javascript/amp/
>>>
>>>
>>> How can I register all the generated javascript files ?
>>>
>>> Is modifying the main entry point js file in my royale project allowed ?
>>> From the tutorial this file will need to be modified to register the
>>> service worker.
>>>
>>>
>>> Has someone created a pwa in royale before ?
>>>
>>>
>>> Pwa's are rapidly being adopted it will be nice if I can package my
>>> responsive web application to be a pwa with little effort.
>>>
>>>
>>> Regards,
>>>
>>>
>>>
>>>
>>
>
Re: Royale support for progressive web apps (pwa)
Posted by Harbs <ha...@gmail.com>.
If you want it to work offline with Cache, you will need a service worker, but that is a _SEPARATE_ js file. You don’t need to modify the main JS file.
You do need to register the service worker, but that can be done either in the index html file, or in your ActionScript code.
> On Mar 13, 2022, at 8:24 PM, Roman Isitua <ro...@gmail.com> wrote:
>
> From the below link
>
> https://www.google.com/amp/s/www.freecodecamp.org/news/build-a-pwa-from-scratch-with-html-css-and-javascript/amp/ <https://www.google.com/amp/s/www.freecodecamp.org/news/build-a-pwa-from-scratch-with-html-css-and-javascript/amp/>
>
>
> The following steps are to be done to convert an app to pwa
> 1. Create a manifest.json file.
>
> 2. Modify the index.html file to reference the manifest.json.
>
> 3. Implement a ServiceWorker.js file. This will be in the same root folder as the generated main entry point js file.
>
> 4. Register the ServiceWorker.js file by modifying for the generated entry point js file.
>
>
> If I am coding my web app using plain html, css and javascript it will not be a problem doing the above 4 tasks. But as I am using royale task three and four look challenging. I think the royale sdk and compiler might need to be tweaked to support those tasks.
>
> On Sun, 13 Mar 2022, 19:04 Harbs, <harbs.lists@gmail.com <ma...@gmail.com>> wrote:
> No. Why would you need to modify the js file?
>
>> On Mar 13, 2022, at 7:47 PM, Roman Isitua <romanisitua@gmail.com <ma...@gmail.com>> wrote:
>>
>> So I am free to modify the generated entry point js file as well ?
>>
>> This does not really look like an ideal solution because each time I recompile the project the generated js file will be overwritten. An ideal solution will be to add support for it in royale sdk.
>>
>>
>>
>> On Sun, 13 Mar 2022, 18:36 Harbs, <harbs.lists@gmail.com <ma...@gmail.com>> wrote:
>> It shouldn’t be any different than a regular web app.
>>
>> You can add whatever you want to the template index.html file.
>>
>>> On Mar 12, 2022, at 11:53 AM, Roman Isitua <romanisitua@gmail.com <ma...@gmail.com>> wrote:
>>>
>>> I just stumbled on a tutorial on how to create a pwa app using plain html, javascript and css (i.e. no framework).
>>>
>>> I am now forced to ask the question. How can i do this in royale ?
>>>
>>> Here is the link
>>>
>>> https://www.google.com/amp/s/www.freecodecamp.org/news/build-a-pwa-from-scratch-with-html-css-and-javascript/amp/ <https://www.google.com/amp/s/www.freecodecamp.org/news/build-a-pwa-from-scratch-with-html-css-and-javascript/amp/>
>>>
>>>
>>> How can I register all the generated javascript files ?
>>>
>>> Is modifying the main entry point js file in my royale project allowed ? From the tutorial this file will need to be modified to register the service worker.
>>>
>>>
>>> Has someone created a pwa in royale before ?
>>>
>>>
>>> Pwa's are rapidly being adopted it will be nice if I can package my responsive web application to be a pwa with little effort.
>>>
>>>
>>> Regards,
>>>
>>>
>>
>
Re: Royale support for progressive web apps (pwa)
Posted by Roman Isitua <ro...@gmail.com>.
From the below link
https://www.google.com/amp/s/www.freecodecamp.org/news/build-a-pwa-from-scratch-with-html-css-and-javascript/amp/
The following steps are to be done to convert an app to pwa
1. Create a manifest.json file.
2. Modify the index.html file to reference the manifest.json.
3. Implement a ServiceWorker.js file. This will be in the same root folder
as the generated main entry point js file.
4. Register the ServiceWorker.js file by modifying for the generated entry
point js file.
If I am coding my web app using plain html, css and javascript it will not
be a problem doing the above 4 tasks. But as I am using royale task three
and four look challenging. I think the royale sdk and compiler might need
to be tweaked to support those tasks.
On Sun, 13 Mar 2022, 19:04 Harbs, <ha...@gmail.com> wrote:
> No. Why would you need to modify the js file?
>
> On Mar 13, 2022, at 7:47 PM, Roman Isitua <ro...@gmail.com> wrote:
>
> So I am free to modify the generated entry point js file as well ?
>
> This does not really look like an ideal solution because each time I
> recompile the project the generated js file will be overwritten. An ideal
> solution will be to add support for it in royale sdk.
>
>
>
> On Sun, 13 Mar 2022, 18:36 Harbs, <ha...@gmail.com> wrote:
>
>> It shouldn’t be any different than a regular web app.
>>
>> You can add whatever you want to the template index.html file.
>>
>> On Mar 12, 2022, at 11:53 AM, Roman Isitua <ro...@gmail.com> wrote:
>>
>> I just stumbled on a tutorial on how to create a pwa app using plain
>> html, javascript and css (i.e. no framework).
>>
>> I am now forced to ask the question. How can i do this in royale ?
>>
>> Here is the link
>>
>>
>> https://www.google.com/amp/s/www.freecodecamp.org/news/build-a-pwa-from-scratch-with-html-css-and-javascript/amp/
>>
>>
>> How can I register all the generated javascript files ?
>>
>> Is modifying the main entry point js file in my royale project allowed ?
>> From the tutorial this file will need to be modified to register the
>> service worker.
>>
>>
>> Has someone created a pwa in royale before ?
>>
>>
>> Pwa's are rapidly being adopted it will be nice if I can package my
>> responsive web application to be a pwa with little effort.
>>
>>
>> Regards,
>>
>>
>>
>>
>
Re: Royale support for progressive web apps (pwa)
Posted by Harbs <ha...@gmail.com>.
No. Why would you need to modify the js file?
> On Mar 13, 2022, at 7:47 PM, Roman Isitua <ro...@gmail.com> wrote:
>
> So I am free to modify the generated entry point js file as well ?
>
> This does not really look like an ideal solution because each time I recompile the project the generated js file will be overwritten. An ideal solution will be to add support for it in royale sdk.
>
>
>
> On Sun, 13 Mar 2022, 18:36 Harbs, <harbs.lists@gmail.com <ma...@gmail.com>> wrote:
> It shouldn’t be any different than a regular web app.
>
> You can add whatever you want to the template index.html file.
>
>> On Mar 12, 2022, at 11:53 AM, Roman Isitua <romanisitua@gmail.com <ma...@gmail.com>> wrote:
>>
>> I just stumbled on a tutorial on how to create a pwa app using plain html, javascript and css (i.e. no framework).
>>
>> I am now forced to ask the question. How can i do this in royale ?
>>
>> Here is the link
>>
>> https://www.google.com/amp/s/www.freecodecamp.org/news/build-a-pwa-from-scratch-with-html-css-and-javascript/amp/ <https://www.google.com/amp/s/www.freecodecamp.org/news/build-a-pwa-from-scratch-with-html-css-and-javascript/amp/>
>>
>>
>> How can I register all the generated javascript files ?
>>
>> Is modifying the main entry point js file in my royale project allowed ? From the tutorial this file will need to be modified to register the service worker.
>>
>>
>> Has someone created a pwa in royale before ?
>>
>>
>> Pwa's are rapidly being adopted it will be nice if I can package my responsive web application to be a pwa with little effort.
>>
>>
>> Regards,
>>
>>
>
Re: Royale support for progressive web apps (pwa)
Posted by Roman Isitua <ro...@gmail.com>.
So I am free to modify the generated entry point js file as well ?
This does not really look like an ideal solution because each time I
recompile the project the generated js file will be overwritten. An ideal
solution will be to add support for it in royale sdk.
On Sun, 13 Mar 2022, 18:36 Harbs, <ha...@gmail.com> wrote:
> It shouldn’t be any different than a regular web app.
>
> You can add whatever you want to the template index.html file.
>
> On Mar 12, 2022, at 11:53 AM, Roman Isitua <ro...@gmail.com> wrote:
>
> I just stumbled on a tutorial on how to create a pwa app using plain html,
> javascript and css (i.e. no framework).
>
> I am now forced to ask the question. How can i do this in royale ?
>
> Here is the link
>
>
> https://www.google.com/amp/s/www.freecodecamp.org/news/build-a-pwa-from-scratch-with-html-css-and-javascript/amp/
>
>
> How can I register all the generated javascript files ?
>
> Is modifying the main entry point js file in my royale project allowed ?
> From the tutorial this file will need to be modified to register the
> service worker.
>
>
> Has someone created a pwa in royale before ?
>
>
> Pwa's are rapidly being adopted it will be nice if I can package my
> responsive web application to be a pwa with little effort.
>
>
> Regards,
>
>
>
>
Re: Royale support for progressive web apps (pwa)
Posted by Harbs <ha...@gmail.com>.
It shouldn’t be any different than a regular web app.
You can add whatever you want to the template index.html file.
> On Mar 12, 2022, at 11:53 AM, Roman Isitua <ro...@gmail.com> wrote:
>
> I just stumbled on a tutorial on how to create a pwa app using plain html, javascript and css (i.e. no framework).
>
> I am now forced to ask the question. How can i do this in royale ?
>
> Here is the link
>
> https://www.google.com/amp/s/www.freecodecamp.org/news/build-a-pwa-from-scratch-with-html-css-and-javascript/amp/ <https://www.google.com/amp/s/www.freecodecamp.org/news/build-a-pwa-from-scratch-with-html-css-and-javascript/amp/>
>
>
> How can I register all the generated javascript files ?
>
> Is modifying the main entry point js file in my royale project allowed ? From the tutorial this file will need to be modified to register the service worker.
>
>
> Has someone created a pwa in royale before ?
>
>
> Pwa's are rapidly being adopted it will be nice if I can package my responsive web application to be a pwa with little effort.
>
>
> Regards,
>
>