Phonegap development
Phonegap development
Installatie phonegap build en ontwikkeltools : http://wip.tripnet.int/Admin/Knowledgebase/mediawiki-1.18.1/index.php/Main_Page
Debugging tools
Weinre (WEb INspector REmote) is een debugger voor webpagina die is ontworpen om op afstand te werken. Dit is vooral handig voor het debuggen van webpagina's die worden uitgevoerd op mobiele apparaten. Voor installatie zie http://dustint.com/post/482/getting-started-with-weinre-mobile-debugging-on-windows . Er is een dedicated server opgericht op het IP adres http://192.168.0.38/ . Om met weinre te werken heb je chrome nodig. Daarnaast moet het remote script van weinre geimplementeerd worden in de apk index html. ( http://192.168.0.38/target/target-script-min.js#xxx) . De #xxx is je debugging ID, deze kun je dus benaderen via http://192.168.0.38/client/#xxx in je chromebrowser. Wanneer je je applicatie op heb gestart kun je dus remote debuggen like chrome debugger! Uiteraard is het verstandig je eigen ID te verzinnen. Overigens is de debugging script opgenomen in de init script dus deze hoeft niet fysiek gebuild worden naar apk. ( zie tripapp ) . Om daadwerkelijk te zien wat er gebeurt op coreniveau van de android device, connect je device via usb met je computer in tik in je command prompt : adb logcat . om je logcat op je device te clearen : adb logcat -c . Om fancy kleurtjes te krijgen in je logcat kun je programmatjes instaleren zoals http://jsharkey.org/blog/2009/04/22/modifying-the-android-logcat-stream-for-full-color-debugging/ maar dan moet er ook python worden geinstalleerd. Het is ook mogelijk om te logcatten via eclipse. Het kan namelijk voorkomen dat de applicatie al errors geeft voordat weinre dit op kan vangen en stopt met debuggen wanneer er javascript code fouten worden gemaakt, dit is via logcat direct uit te lezen.
- De enige stap is dus om deweinre ID te veranderen in de init_mockup.php ( W:\websites\Erik\tripapp\mockup ) willen we elkaar niet in de weg zitten.
tripapp
Voor de tripapp heb ik een soort launchplatform gebouwd. Deze is nog niet 100% uitontwikkeld maar werkbaar. Dit platform zorgt ervoor dat we dynamisch elk javascript applicatie kunnen inladen en uitvoeren. de apk is te vinden op W:\websites\Erik\tripapp\apk . in deze phonegap build staat op dit moment nog een referentie naar de initialisatiebestand http://wip.tripnet.int/Erik/tripapp/mockup/init_mockup.php?device_id=1 . In de init_mockup staan gegevens zoals data, javascripts, sequencer, en template gegevens maar in principe zijn we vrij om dit aan te passen naar wens. 1 belangrijk gegeven is wel dat er in het javascript altijd een file / class 'RemoteMain.js' geimplementeerd moet worden, deze wordt namelijk aangeroepen nadat alle scripts zijn ingeladen en fungeert als main. De sourcecode van de APK is te vinden op W:\websites\Erik\tripapp\app.
sequencer & modules
De sequencer class zorgt ervoor dat de modules kunnen worden ingeladen. De informatie van de sequence staat beschreven in de init mockup. De modules zijn customwritten scripts, een productfinder module is nu in development, maar een imagecarousel, videoplayer, rss feeds of weatherforecastings worden ook in modules geschreven. Een module bestaat uit een modulenaam, een js bestand, een css bestand en template bestand. Deze bestanden hebben allemaal dezelfde 'module naam' cq. productFinder.js, productFinder.css, productFinder.tpl . Belangrijk is dat de javascript de exacte classnaam als de module naam moet hebben en een methode init moet bevatten. Deze bestanden worden ingeladen via het launchplatform als 1 module en in volgorde afgespeeld door de sequencer. De locatie van de bestanden voor het project tripapp zijn te vinden op W:\websites\Erik\tripapp\templates\tripapp . De js bestanden die via het template systeem worden ingeladen staan los van het launchplatform en de tripapp applicatie, maar kunnen uiteraard wel met elkaar communiceren . Maar dit is doorgaands de locatie waar we ontwikkelen.
De ontwikkelmethode is precies hetzelfde als voor websites. Echter hoeven we minder rekening te houden met browser compatibility.
Ontwikkelen doe ik momenteel in phpstorm / jetbrains, dit omdat javascript support super is, handige refactoring tools werken maar uiteraard voldoet bijna elke ide.
- sidenote : de sequencer is nog niet uitontwikkeld, alleen de 1e module in de sequencer wordt afgespeeld.
how to een module aanmaken
