Amber Cordova - and Richards Tutorial

On 3 Mar 2016, at 13:23, Norbert Hartl <[hidden email]> wrote:

We are using ionic and not cordova directly but the problem should be the same in both environments. 

The web page should work regardless if in devel or deploy mode. The real issue seems to be if you are running on a device or on a desktop browser. We detect in which environment the app is running and start the app differently

        var isCordovaApp = (typeof window.cordova !== "undefined");

        var startApp = function(amber, angular) {

            amber.initialize({

                //used for all new packages in IDE

                'transport.defaultAmdNamespace': "port1-app"

            });

            angular.element(document).ready(function () {

                angular.bootstrap(document, ['starter']);

            });

            amber.globals.Port1App._start();

        }

        require(['app', 'googlemaps', 'ionic', 'app-main'], function (amber, googlemaps, ionic, appMain) {

            var start = function () {

                startApp(amber, angular);

            };

            if(isCordovaApp) {

                document.addEventListener("deviceready", start, false);

            } else {

                start();

            }

        }, function (err) {

…

});

The window.cordova property is created early in the process so it should be reliable.

Hope that helps,

Norbert

Am 03.03.2016 um 11:33 schrieb [hidden email]:

Maybe Norbert can chime in as he has working mobile apps with Cordova and Amber.

Maybe not a 0.15 version...

Tim,

A writeup of what you have is welcome once working!

Phil

On Thu, Mar 3, 2016 at 1:42 AM, Herby Vojčík <[hidden email]> wrote:

Dňa 3. marca 2016 1:33:32 CET používateľ Tim Mackinnon <[hidden email]> napísal:
>Thanks Herby - I’m not quite at that level of sophistication (but I can
>see where I need to learn more).
>
>I can’t get the inline method to work - it took me a while to realise I
>need to back tick a multiline js string, but now i get some esprema
>error, so I must have got a type somewhere…. you just can’t avoid all
>the js knowledge overhead you need - when I just want a simple
>smalltalk life  ;)

Well, not true. This scenario is a bit special. Don't throw cordova and waiting for deviceready in, and you don't need any of this.

>
>I’m assuming I’m doing this in the right place - mine looks like this:
>
>           deploy: {
>                options: {
>                    mainConfigFile: "config.js",
>                    rawText: {
>                        "amber/compatibility": "/*stub*/",
>                        "amber/Platform": "/*stub*/",
>                        "app": `define(["deploy"],function(amber){
>                                                       var oldInitialize = amber.initialize.bind(amber);
>                                                       amber.initialize = function(){
>                                                       var args = arguments;
>                                                       return new Promise(function(resolve, reject){
>                                                               function onDeviceReady(){resolve(oldInitialize.apply(args));}
>                                                               document.addEventListener(“deviceready”, onDeviceReady, false);
>
>                                                               };
>                                                       };
>                                                       return amber;
>                                               });`
>                    },
>                    pragmas: { …..
>
>
>> On 2 Mar 2016, at 23:53, Herby Vojčík <[hidden email]> wrote:
>>
>>
>>
>> Herby Vojčík wrote:
>>>
>>>
>>> Herby Vojčík wrote:
>>>> If you really need to customize things for devel / deploy, maybe do
>it
>>>> inside Gruntfile.js, where the main magic is done - in devel mode
>"app"
>>>> is defined as "load deploy" and in deploy mode it is defined as
>"load
>>>> deploy" (and the packaging is different and other things, but it
>does
>>>> not matter). There you can redefine "app" for deploy mode to
>actually
>>>> wait for onDeviceReady and only then allow initialize to run (with
>0.15
>>>> line where initialize actually returns a promise, this is actually
>much
>>>> easier to accomplish than before - just do something like
>>>>
>>>> define("app", ["deploy"], function (amber) {
>>>> var oldInitialize = amber.initialize.bind(amber);
>>>> amber.initialize = function () {
>>>> var args = arguments;
>>>> return new Promise(function (resolve, reject) {
>>>> function onDeviceReady() { resolve(oldInitialize.apply(args)); }
>>>> document.addEventListener(“device ready”, onDeviceReady, false);
>>>> };
>>>> };
>>>> return amber;
>>>> });
>>>
>>> Alternatively, you need not to write it all in Gruntfile itself; you
>may
>>> want to put the "deviceready transformation" in a little module of
>your
>>> own, and only change definition in Gruntfile.js slightly, to be
>>> something like:
>>>
>>> define("app", ["deploy", "device-wait"], function (amber, transform)
>{
>>> return transform(amber);
>>> });
>>
>> You can even release the device-wait.js file as a micro library for
>amber users on cordova, as the transformation will always be the same.
>>
>>>
>>>>
>>>> and this definition is packed into the.js in deploy mode.
>>>>
>>>> Tim Mackinnon wrote:
>>>>> Ahhh - I just wasn’t reading the tutorial properly - you do need
>some
>>>>> subtle differences for a Cordova app, because you can’t start
>amber
>>>>> until the device is ready - hence you have to put the normal
>startup
>>>>> code in a deviceReady listener… duh.
>>>>>
>>>>> So - here’s a question - if I run grunt deploy, is there anything
>in
>>>>> the.js that I could use to detect I am in deploy mode such that I
>>>>> could put something in my index.html<script> to detect this and
>add
>>>>> that listener conditionally? I’m thinking something like
>>>>>
>>>>> if(globals.isDeploy) { document.addEventListener(“device ready”,
>>>>> onDeviceReady, false) };
>>>>>
>>>>> Tim
>>>>>
>>>>>> On 2 Mar 2016, at 22:05, Tim Mackinnon<[hidden email]>
>wrote:
>>>>>>
>>>>>> So - are we saying that if using Cordova, to develop I run grunt
>>>>>> level (which is the default), and the embedded script in
>index.html
>>>>>> will happily work because the.js has the right bits in. If I want
>to
>>>>>> try the simulator, I ru
>>>> n grunt deploy, and then the cordova emulate iOS (which packages up
>all
>>>> my stuff) and because the.js is stripped - the script reference in
>>>> index.html will just silently fail with no harm done? (so there is
>no
>>>> need to include/exclude it)?
>>>>>>
>>>>>> Tim
>>>>>>
>>>>>>> On 2 Mar 2016, at 21:57,
>>>>>>> [hidden email]<[hidden email]> wrote:
>>>>>>>
>>>>>>> ide is not in the.js so the loading step fails but without
>>>>>>> consrquences.
>>>>>>>
>>>>>>> no big deal.
>>>>>>>
>>>>>>> grunt devel
>>>>>>> grunt deploy
>>>>>>>
>>>>>>> is the way to go.
>>>>>>>
>>>>>>> Phil
>>>>>>>
>>>>>>> On Mar 2, 2016 10:14 PM, "Tim Mackinnon"<[hidden email]>
>wrote:
>>>>>>> Actually - I’m thick, I’ve noticed what he’s talking about - in
>the
>>>>>>> actual body of index.html it has:
>>>>>>>
>>>>>>> <script type='text/javascript'>
>>>>>>> require(['app'], function (amber) {
>>>>>>> amber.initialize({
>>>>>>> //used for all new packages in IDE
>>>>>>> 'transport.defaultAmdNamespace': "amber-richardengtutorial"
>>>>>>> }).then(func
>>>> tion () {
>>>>>>> require(["amber-ide-starter-dialog"], function (dlg) {
>dlg.start();
>>>>>>> });
>>>>>>> amber.globals.RichardEngTutorial._start();
>>>>>>> });
>>>>>>> });
>>>>>>> </script>
>>>>>>>
>>>>>>> This is what he was referring to.
>>>>>>>
>>>>>>> So given your answer - how does grunt devel/deploy handle this?
>I
>>>>>>> just ran grunt deploy on my other example, it churned away for a
>few
>>>>>>> minutes and when i run amber serve and view my page - it still
>>>>>>> prompts for the helios browser and then gives a javascript
>exception
>>>>>>> error:
>>>>>>>
>>>>>>> resignal
>>>>>>> "Resignal the receiver without changing its exception context"
>>>>>>>
>>>>>>> <
>>>>>>> self.amberHandled = false;
>>>>>>> throw(self);
>>>>>>> >
>>>>>>>
>>>>>>>
>>>>>>> I thought that grunt deploy was going to strip out the bit about
>>>>>>> launching the ide? So I’m a bit confused about what it does and
>how
>>>>>>> you handle this? Which I think is why Richard had a script to
>flip
>>>>>>> between two files - which it
>>>> sounds like you’ve solved somehow???
>>>>>>>
>>>>>>> Tim
>>>>>>>
>>>>>>>> On 2 Mar 2016, at 20:54, Herby Vojčík<[hidden email]> wrote:
>>>>>>>>
>>>>>>>>
>>>>>>>>
>>>>>>>> Dňa 2. marca 2016 21:38:17 CET používateľ Tim
>>>>>>>> Mackinnon<[hidden email]> napísal:
>>>>>>>>> Hi guys - as I excitedly try and see what’s possible with
>Amber,
>>>>>>>>> I’ve
>>>>>>>>> hit the first bit of Richard’s tutorial where I can’t work out
>>>>>>>>> what he
>>>>>>>>> means.
>>>>>>>>>
>>>>>>>>> I’m not sure about “deletes the dialog line
>>>>>>>>> (“amber-die-starter-dialog”) “ where he writes:
>>>>>>>>>
>>>>>>>>> I created two different index.html files, one for development
>and
>>>>>>>>> one
>>>>>>>>> for deployment on the device/emulator. The latter deletes the
>dialog
>>>>>>>> Don't do that. Use only one. Do not bother about IDE dialog at
>all.
>>>>>>>> It won't load in deployment.
>>>>>>>>
>>>>>>>> Two index.html is antipattern. You have `grunt devel` and
>`grunt
>>>>>>>> deploy` there to switch between the two modes, and index.html
>is
>>>>>>>> reused without changes (only the.js changes).
>>>>>>>>
>>>>>>>>>
>>>> line (“amber-die-starter-dialog”) for starting Helios, because you
>>>>>>>>> can’t run it in Android, and runs the Amber startup code
>within the
>>>>>>>>> onDeviceReady()function.
>>>>>>>>>
>>>>>>>>> All I see in my generated index file is a<script
>>>>>>>>> type=‘text/javascript' src='the.js'></script>
>>>>>>>>>
>>>>>>>>> I recall years ago reading about all kinds of require things -
>but
>>>>>>>>> that
>>>>>>>>> seems to have gone away now, so I’m wondering if 15.x has
>changed
>>>>>>>>> things since that tutorial?
>>>>>>>>>
>>>>>>>>> Has anyone tried Cordova recently?
>>>>>>>>>
>>>>>>>>> Tim
>>>>>>> --
>>>>>>> You received this message because you are subscribed to the
>Google
>>>>>>> Groups "amber-lang" group.
>>>>>>> To unsubscribe from this group and stop receiving emails from
>it,
>>>>>>> send an email to [hidden email].
>>>>>>> For more options, visit https://groups.google.com/d/optout.
>>>>>>>
>>>>>>> --
>>>>>>> You received this message because you are subscribed to the
>Google
>>>>>>> Groups "amber-lang" group.
>>>>>>> To unsubscribe from this group
>>>> and stop receiving emails from it, send an email to
>>>> [hidden email].
>>>>>>> For more options, visit https://groups.google.com/d/optout.
>>>>>>
>>>>>> --
>>>>>> You received this message because you are subscribed to the
>Google
>>>>>> Groups "amber-lang" group.
>>>>>> To unsubscribe from this group and stop receiving emails from it,
>>>>>> send an email to [hidden email].
>>>>>> For more options, visit https://groups.google.com/d/optout.
>>>>>
>>>>
>>>
>>
>> --
>> You received this message because you are subscribed to the Google
>Groups "amber-lang" group.
>> To unsubscribe from this group and stop receiving emails from it,
>send an email to [hidden email].
>> For more options, visit https://groups.google.com/d/optout.

--
You received this message because you are subscribed to the Google Groups "amber-lang" group.
To unsubscribe from this group and stop receiving emails from it, send an email to [hidden email].
For more options, visit https://groups.google.com/d/optout.

--
You received this message because you are subscribed to the Google Groups "amber-lang" group.
To unsubscribe from this group and stop receiving emails from it, send an email to [hidden email].
For more options, visit https://groups.google.com/d/optout.

--
You received this message because you are subscribed to the Google Groups "amber-lang" group.
To unsubscribe from this group and stop receiving emails from it, send an email to [hidden email].
For more options, visit https://groups.google.com/d/optout.