Mobile/PhoneGap/Tutorial

This page is obsolete. It is kept for historical interest only. It may document extensions or features that are obsolete and/or no longer supported. Do not rely on the information here being up-to-date.

Note: The PhoneGap app is officially in maintenance mode, and no new features will be added. We've switched over to Native app development for major platforms.

On the command line, change to the folder you've cloned the WikipediaMobile source to.

Use the command 'git submodule update --init' to pull in dependencies

Use the command '<sdk-path>/tools/android update project -p .' to setup the android project (where <sdk-path> is the path you installed the SDK to)

You may have to specify the target by appending "-t 8" - choose the Android version defined AndroidManifest.xml (see here)

Wait for the emulator (from step 3) to show the phone's home screen, and then: on the command line, in the project folder, type 'ant debug install'. Assuming the emulator has started up, the android app will be installed there. Go to the apps menu within the emulator and launch the Wikipedia app.

If 'ant debug install' fails saying the device is "offline", turn the emulated phone off and back on again. Shuting down the emulator for the first time may take several minutes. If it doesn't shut down at all, kill it (and also kill the tools/android window).

Note that if you notice an old version of the app is being installed try using the command: "ant uninstall && ant clean && ant debug install" to ensure a clean occurs first.

Assets folder. How the app is structured: Very little Java -- mostly HTML, CSS, JS. The Package Explorer -- look at the assets/www dir, (HTML/JS/CSS). Inside the platform-specific folders, you find overrides -- you won't have to worry about them right now. The prime code is within the js folder. Look at the app names - self-explanatory. Each of the functions in an app is in its own file, usually. There's jQuery, which is used extensively.

Look at the /src directory, and that has the Phonegap plugins. Anything you can do on Android, you can do on Phonegap. Look at com.phonegap.* -- those are readymade, from the official repo.

The last one is our namespace where we have our code. This is the only Java code here. Most of this is plugins for PhoneGap, plus a native Android search provider. The rest of the app is all HTML/JS.

Logging - you can read the log from the android device by typing '<sdk-path>/plattform-tools/adb logcat' in the command line. You can use console.log in javascript to debug and it'll turn up righ there.

QUESTION: purpose of PhoneGap -- you don't have to write Java. So why are you telling us about Java? Well, for a few things you need Java, like search integration. But we're able to use relatively little of it. There are standards for most mobile stuff like GPS where we don't need to do anything Android-specific. Additional glue for nonstandard stuff.