OSDC2011, PhoneGap and Google Spreadsheet Hacking

An article by Glen    No Comments

I’m really looking forward to hanging out with the crew at osdc2011 next week in Canberra, and have been busy working on my sample code for my talks.

I’ll be giving a talk titled, “Fake Your Way as a Mobile Developer Rockstar with PhoneGap” where I’ll be talking a little about a recent client project I was working on developing for iPhone,iPad,Android (phone + tablet), Blackberry, Playbook and WinPhone7. It was a true “write once, test everywhere” experience!

Anyways, to show off a few of the key ideas, I spent a few hours yesterday morning whipping up a “Conference Schedule” app. The conf organisers kindly flicked me a schedule spreadsheet to use for the demo, which I prompted published as a Google Spreadsheet. All the data for the app is sourced from there, so Google Spreadsheets becomes my CMS for Schedule changes!

This session is going to be all about “faking it”, so while my graphic design skills are pretty rubbish, the amount you can get done using jQueryMobile, jQuery, Handlebars.js, PhoneGap and a few JavaScript libraries in a few hours is pretty sensational.

To do all the Google Spreadsheet parsing, I’m using a nice little library called Google-Spreadsheet-Javascript which has been perfect for the purpose of turning a spreadsheet into JSON! Based on the samples that come with the library (try one here), pulling data from a published spreadsheet is as simple as:

      var osdc_url = "https://spreadsheets.google.com/pub?key=0AsIKXTGzbbNtdDYwZGF3NGtFeVZCRGJDTzhLLTI1YWc&hl=en&output=html";
      var googleSpreadsheet = new GoogleSpreadsheet();
      googleSpreadsheet.url(osdc_url);
      googleSpreadsheet.load(function(result) {
    	  alert("Remote OSDC Schedule Sync'd");
    	  osdcData = result;
      });

The trickiest part was finding the “Publish to Web” option in the Google Spreadsheet itself (which is buried under the File menu rather than the normal Share menu). Now if only I can get Google Spreadsheets to present the dates in the right order I’ll be ready to roll…

See you there next week! (Oh, and all the source code for the app is up on Github).