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 <[email protected]> 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 <[email protected] > <mailto:[email protected]>> wrote: > Responses inline… > > > > From: Roman Isitua <[email protected] <mailto:[email protected]>> > Reply-To: "[email protected] <mailto:[email protected]>" > <[email protected] <mailto:[email protected]>> > Date: Saturday, March 19, 2022 at 9:07 PM > To: "[email protected] <mailto:[email protected]>" > <[email protected] <mailto:[email protected]>> > 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, <[email protected] > <mailto:[email protected]>> 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 <[email protected] <mailto:[email protected]>> > Reply-To: "[email protected] <mailto:[email protected]>" > <[email protected] <mailto:[email protected]>> > Date: Monday, March 14, 2022 at 11:17 AM > To: "[email protected] <mailto:[email protected]>" > <[email protected] <mailto:[email protected]>> > 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, <[email protected] > <mailto:[email protected]>> 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 <[email protected] > <mailto:[email protected]>> 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, <[email protected] > <mailto:[email protected]>> wrote: > > Wow ! I will definitely try this and provide an update on the outcome. > > > > On Mon, 14 Mar 2022, 08:42 Harbs, <[email protected] > <mailto:[email protected]>> 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 <[email protected] > <mailto:[email protected]>> 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, <[email protected] > <mailto:[email protected]>> 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 <[email protected] > <mailto:[email protected]>> 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, <[email protected] > <mailto:[email protected]>> wrote: > > No. Why would you need to modify the js file? > > > > On Mar 13, 2022, at 7:47 PM, Roman Isitua <[email protected] > <mailto:[email protected]>> 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, <[email protected] > <mailto:[email protected]>> 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 <[email protected] > <mailto:[email protected]>> 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> > > > > > > > >
