Trouble port PhoneGap project to Windows Phone - dojo

Porting www.canterburymaps.govt.nz to PhoneGap has been successful for Android and iOS, but Windows Phone (8) is causing issues.
The site works if viewed through IE, but when hosted within Cordova the Windows Phone app loads but there's issues with the functionality. We've discovered it's failing on the JavaScript "dojo.require" e.g.
dojo.require('dijit.layout.BorderContainer');
It doesn't seem to matter which library is passed in, so it seems to be an issue with the dojo.require function itself.
I've found this example online - http://dotnetspeak.com/2013/05/using-esri-arcgis-in-phonegap-applications - and have followed step 3 to change the root url in dojo, but this doesn't seem to help.
Anyone have any ideas what the issue might be?

Please mention the version numbers of both Dojo and PhoneGap.
If you are not using the latest available for both, can you try upgrading?
You mentioned that you tried changing the root URL, but did you try to configure the Dojo loader in sync mode (vs async)? Say data-dojo-config="async: 0, ..." in the script tag which loads dojo.js. Does it work better?

Related

Vue Native - Debugging

Recently I switched from Ionic framework to vue-native (vue.js wrapper around react-native), everything seems to be cool, development is fast and easy, but I have some real issues with debugging those apps. With Ionic Framework (Cordova) I was able to open an app in web browser and could easily manage Vuex state (for example) from Chrome Console. It doesn't seems so easy and trivial in react native world. Is it possible to have similar debugging experience in vue-native? When my app starts to grow and gets complicated it's really hard to handle it other way around. Any help appreciated.
Basically all my problems gone away when I ported my apps to Expo (which allows for JS remote debugging) and grabbed React Native Debugger - https://github.com/jhen0409/react-native-debugger.
Important part is having simulator installed on your developer machine (like iphone simulator) because debugger doesn't play nicely with real machines.
Inside debugger hit cmd+t to open a new window and set port to 19001 (because of Expo using this port). Now start expo with npm start command and in Expo panel hit 'Run in simulator' button.
In simulator make a shake gesture (ctrl+cmd+z) and allow remote debugging in developer menu.
Done. Pleasant experience similar to one known from Cordova. You have a js console, you can inspect elements and change styles live. Expo comes with live reload to make things smoother.
More info here: https://docs.expo.io/versions/latest/workflow/debugging/
Unfortunately, you cannot debug script parts in the VUE files in Chrome Dev Tools (you can put the breakpoints, but they are not working well), but if you put the methods to a separate JS file, it works like a charm. I know, it's a workaround, but not a big pain, and working well.
See my TODO app for example: https://github.com/TheBojda/VueNativeTodo

How to disable phonegap autoreload (At least during dev)

Here is my issue:
I've installed phonegap and phonegap desktop.
http://code.riffzone.net/phonegap-install-msw/
Now, when I'm working on my application (Jquery Mobile), I'm testing it on a browser, but the application is reloading again and again after every 2 seconds and I can't even write something in the form input, reloading to fast..
I don't understand where this is coming from?
Here is the screen shot of my browser and the firebug console where you can see the page reloading over and over (1) and the api_auto_reload in the console (2).
Thanks a lot :)
The reload should be triggered only when some of your source files is changed. For some reason it does detect change on your files constantly. That reason is quite hard to find out without debugging more. You can, though, turn the auto reload off with --no-autoreload switch for phonegap serve like this
phonegap serve --no-autoreload
It was phonegap desktop beta (the minimalist server) and not phonegap (command line) which was causing this bug.
If you have the same issue, make sure you are not using it.

Using Worklight JSONStore

I am not that new to Worklight, but the JSONStore is a new feature and I'm trying to learn how to use it. I downloaded the sample app (module_07_10_Using_JSONStore.zip) and installed it in my development environment, ran build and deployed it.
When I preview the app (as Android) in the Mobile Browser Simulator, and run through the sequence of Initialize the Collection, Add a Document, and then try to Find by Name, Find All, or get Number of Documents in Collection - I do not see the table at the bottom of the screen that displays the input data. I don't see any errors in the WL console. In the Android console, I get the error messages:
Unable to resolve target 'android-8'
WARNING: unable to write jarlist cache file - and then it points to location of jarlist.cache in the module.
I did not make any changes to the code. I looked it over, compared it to the education module content, and I don't see the problem. Any thoughts? Clues? Your help is appreciated. Thanks.
JSONStore is not supported in the Mobile Browser Simulator, it must run on an Android or iOS device or simulator, if you run it on the Android simulator it should work just fine.

PhoneGap Build integrated with Dreamweaver CS6 is different than CS5.5, how can I change the assets/www folder?

I used DW5.5 to build a PhoneGap application before, and it was easy to access all of the files within the app to integrate such things as native API functionallity etc...
But now I am using DWCS6, I cant seem to locate the whole app folder structure. All it does is compiles the app to an .apk file (android) and you download it. Am I missing something here?
I am using jQuery mobile and PhoneGap within Dreamweaver CS6 and just tried to test the native API from phonegap, and just cant seem to get it to work. The examples online show the usage of a cordova.js file (which I know is what used to be called phonegap.js or whatever) but the native fiunctionallty doesnt seem to be working.
Any thoughts?? I have been on it all day now so its likely im missing something simple as my head is fuc***.
Thanks :)
I suspect it is Adobe's way of forcing users to pay for their compilation service. AFAIKT, the ability to compile native apps using external programs like Xcode or Eclipse has been removed. I use Dreamweaver 5.5. The issues with mobile app development have been fraught with problems, but, at least, you could find work arounds. I'm hoping that some enterprising CS6 user will find a good workaround for those of us who don't have $$$$ of dollars to buy adobe products, and then more $$ per month to compile the code. Personally, I'm looking for other options. I saved for months to buy cs5.5 and it has never operated as advertised. I found workarounds for Xcode, but nothing for Android. I do like some things about the design/code piece of Dreamweaver, but all in all, I've been disappointed in the product for mobile development.
Keep us posted on your progress.
Thanks.-Rachel
Have you tried copying the Site files from Dreamweaver Source Folder to Eclipse www/assets folder and running it on Android Emulator. This worked for me, at least for simple Hello World index.html file, but it is not working for 5 page - HTML site developed in Dreamweaver CS6.

Any recommendation/suggestion on best practice to develop app using PhoneGap for Android or iOS?

Also, is there a way to test those webapp in a webkit based browser such as chrome (with phonegap plug-in maybe) on a PC first before compiling it to test on a device or emulator?
The key reason is that trouble shooting mal-formed html, javascript code is very difficult on a device or emulator. You can not view the js console to see all error. The Weinre is great, but it can not spits out the error browser complains when initially loading the page.
It will be great if we can validate the html, js, css app first before diving deeper into testing on Android device. i.e. a way to weed out some simple problems before getting into more complicated deeper problems.
Any experience/suggestions/ideas/pointers are greatly appreciated.
Paul> Seems promising. Will try and report back. It seems knowledgeable in phoneGap mob dev. What are the key steps would you go through to dev a phoneGap mob web-app?
Ripple is a Chrome plug-in that includes a PhoneGap mode.
For JavaScript static validation, the PhoneGap Android Eclipse AppLaud plug-in includes a JSLint mode.
I would recommend you use Safari. In your Safari (on Mac) go to Settings (on PC) goto preferences -> Advanced -> check on "Show Develop in Menu bar".
Now you'll find in the Menu "Develop" "User Agent". There you can change the UserAgent identification, that will be send to the server. You can then change it to iPhone.
This way you can at least test it for iOS.
Hope that helps somewhat.