SOS

Shane O'Sullivan's technical blog… really ties the room together

Getting started with developing on the Palm Pre

Posted by Shane O'Sullivan on August 16, 2009

This post explains how to get up and running with Palm Pre development, including getting the tools, setting up the emulator, as well as getting debugging and the inspector working.

In the last few days I’ve started playing around with the development tools for the extremely cool new phone, the Palm Pre.  The coolest thing, from a developers perspective, is that all application development is done using HTML, JavaScript and CSS.  That means if you can write a website, you can write an application for the Palm Pre (though not necessarily a good one).

However, while Palm does provide a pretty good site, http://developer.palm.com, to help you get started, it’s missing some crucial information, which is scattered all over the web (trying to find out how to do logging is a nightmare).  So, this post will explain some of the steps you need to take to get up and running.  As I prefer to use Palm’s Eclipse based development tools, this post assumes that you are using it also, and not go into the command line stuff.

1. Getting the Tools

Follow Palm’s instructions here – http://developer.palm.com/index.php?option=com_content&view=article&id=1597 , to install their tools.

I strongly encourage you to also get the Eclipse development environment, which while it is a large download, is very useful for packaging and  launching your application with a single click.  Get Eclipse by following the instructions here – http://developer.palm.com/index.php?option=com_content&view=article&id=1639 .

The Eclipse page also includes the required steps for creating a new WebOS application, adding scenes (a scene can be though of as a single web page, and you application will be made up of one or more of them) etc.

2. Create a New Scene

After following the instructions on the Eclipse page to create a new application, create a new scene clicking “File-New-Mojo Scene”, and give it the name “main”.  You should see a number of files created:

  • app/assistants/main-assistant.js – This is the JavaScript code that will be executed when your scene, or page, is rendered
  • app/views/main/main-scene.html – This is the HTML that defines the displayed HTML for the scene.
  • sources.json has also been modified to add information about your scene.

As we want the “main” scene to be displayed when the application starts, open the /app/assistants/stage-assistant.js file, and in the setup method you see there, add the following line:

this.controller.pushScene(‘main’);

That line loads your “main” scene.

3. Starting the Emulator

Palm provides a very cool phone emulator that runs on VirtualBox, which you installed earlier.  Start it by (in Windows) clicking Start > All Programs > Palm > SDK > Palm Emulator.

One thing I’ve noticed is that if you start Eclipse before starting the emulator, it throws errors and can have problems connection. So, start the emulator before Eclipse.

Sometimes you may also see an error when starting the Emulator stating that the Novacom service must be running.  To make sure it is, click Start > Settings > Control Panel > Administration Tools > Services.  Find the Palm Novacom service in the list, right click and choose start.

4. Launching the Application in Debug Mode

As you’ll pretty much always want to be viewing debug output from your application, start it in debug mode.  To do this:

  • Click Run > Debug Configurations
  • Right-Click “Mojo Application” and select “New”
  • Choose your project in the “Project” drop down box.
  • Choose the target to be “Palm Emulator”, or if you’re lucky enough to have a Palm Pre, choose Palm Device
  • Make sure to check both the Inspectable and Mojo debugging checkboxes, and click Debug.

Looking at the emulator, your application should appear.

5. Logging

Debugging with WebOS is currently a pretty nasty affair, that requires a lot of command line wizardry, that I think only a tiny percentage of people will even attempt to use (if you’ve figured it out, well done!).

However, logging is relatively simple to set up, and that’s what I use.

As with developing web applications on Firefox, you can use the Firebug function console.log to print out messages, e.g.

console.log(“the value of the input is ” + event.target.value);

So, feel free to intersperse your code with whatever logging you like.

To view the logs, you need to log into the emulator/phone remotely using Putty, a SSH client.  Luckily this is included with the Palm SDK you installed earlier.

  • Go to the bin folder in the SDK, probably in c:\program files\Palm\SDK\bin, and open putty.exe
  • In Host Name, type localhost
  • In Port, type 5522
  • Save these settings for reuse later by typing in PalmEmulator into the Saved Settings box and clicking Save.
  • Click Open.
  • When Putty prompts you for a login name, type root
  • When prompted for the password, just hit Enter, as the password is blank.
  • Now start the logging application by typing log com.mydomain.myapp. If you’re unsure of what the correct string is, open the appinfo.json file at the root of your project in Eclipse, and the right string is specified as the id in that file.

Now, when you run your application, you’ll see your console.log calls being shown there.  It’s a bit verbose, and prepends a lot before your message, but at least it’s readable.

6. Using the Inspector

Palm includes the a DOM inspector with the SDK. Before running it, and after installing your application on the emulator using Eclipse, open a command window in the SDK’s bin folder, and type

palm-launch -d tcp -i com.mydomain.myapp

once again using the correct string for your application instead of com.mydomain.myapp

Now launch the inspector by clicking Start > Programs > Palm > SDK > Palm Inspector.  The Inspector window should now launch, and display the HTML of your application.

7. Write Something Cool

I’ll leave this as an exercise to you, the good reader.  However, you should now have the ability to log messages and inspect the content of your page, so you’re almost on par with the tools available for web development (a good debugger would be nicer though).

I might write some more posts in the future covering anything cool I found or wrote for the Pre.  I’m starting to use a specialized build of the Dojo Ajax toolkit to fill in some of the blanks that Palm’s Mojo toolkit leaves out, and that’ll probably require another post.

Have fun!

One Response to “Getting started with developing on the Palm Pre”

  1. […] […]

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

 
%d bloggers like this: