‘Your Next Bus’ is the system used in West Yorkshire (and other regions) to provide live bus timetables. Some time ago I wrote a Dashboard Widget to display live timetables on a OS X Dashboard. I had a request to develop this for the iPhone and so I knocked something together with Dashcode and came up with tyr.org.uk/bus. Browse to in in your iPhone and see it in action, requires Version 2.0 of the OS.

Please feedback with any bug reports or feature requests.

Read on for some of the behind the scenes info.

There are two options facing a prospective iPhone application developer, to develop a web app or a full blown iPhone application. Prior to the release of the iPhone 2.0 OS web apps were the only option open to developers wanting to target users without jailbroken phones.

Writing a full iPhone application requires Cocoa and Objective-C fu, which whilst I’m learning I’m nowhere near the level required this task. Conversely web apps are much simpler and are just served as standard web pages to the local iPhone Safari browser. All the client side coding can be created in JavaScript.

Apple’s provided development environment for web apps is called Dashcode. I’d used it previously as a beta on Tiger to create the Dashboard widget and found it to be fairly buggy. This time however I’m pleased to say it performed admirably. To aid development a selection of framework apps are provided, in this instance the ‘browser’ framework was picked. This provides you with a simple interface that lets the user browse through multiple view in a tree structure. The only Javascript you need to provide is a controller for the view, a sufficient outline is given to get you going without too much work.

I don’t actually own an iPhone but an iPhone simulator is provided with the development tools. As soon as you click ‘Run’ in Dashcode the simulator loads up and launches your web app. You can simulate pretty much all the normal iPhone functionality including rotation and multi touch. It really helps make development a breeze.

iPhone OS 2 ships with a version of Safari 3.1.1, which supports client side SQL in JavaScript. Using this to store user settings is a breath of fresh air compared to creating bespoke functions to (un)pack data into cookies. Here’s the SQL used to create a database

 try {
     var shortName = 'yournextbus';
     var version = '1.0';
     var displayName = 'Your Next Bus Database';
     var maxSize = 2048;
     var db = openDatabase (shortName, version, displayName, maxSize);
     return db;
 } catch (e) {
     if ( e == INVALID_STATE_ERR ) {
         // Version number mismatch
         alert ("Invalid database version");
     } else {
         alert ("An error occured creating a database "+e+".");
     }
 }

And here’s the code to create a table and add a row:

 this._db.transaction (
    function (transaction) {
        transaction.executeSql('CREATE TABLE stops(id INTEGER NOT NULL PRIMARY KEY AUTOINCREMENT, name TEXT NOT NULL DEFAULT "A Bus Stop", number INTEGER NOT NULL)', [], nullDataHandler, killTransactionSilently);
        transaction.executeSql('INSERT INTO stops ( name , number ) VALUES (?,?) ', [ 'Demo Stop', 45013610 ], nullDataHandler, errorHandler );

     }
 )

Whilst the data being stored for this app is fairly trivial it’s simple to see how this could become very powerful.

A couple of pics of the app in action: