XUL the “forgotten” RIA technology

I started building my first Firefox extension last night and as a result I had to dig into XUL (pronounced zool, al la Ghostbusters).

XUL is the “XML User Interface Language” and is technology of the cross-platform GUI used by Mozilla products such as Firefox and Thunderbird.

Now I have been aware of XUL for years but haven’t really thought about it much until I clicked on the XUL Periodic Table example  that I suddenly realized that XUL makes for a pretty swanky RIA platform (not too mention it was around years before the others).

Not only does it use common technologies (XML, HTML, CSS, JavaScript, AJAX) but it “just works’ which I particularly love in a technology and as a bonus it is open source.

Of course if you clicked on that XUL Periodic table example above using Internet Explorer then of course it would not have worked since IE doesn’t support XUL which of course is a bit of a problem.

Having said that there is XULRunner which lets you run standalone XUL based applications (kinda like Adobe Air).

XUL use isn’t limited to Mozilla products check out Songbird (Media Player) , Miro (Internet TV) or Celtx (Script writing & preproduction tool), which all use XUL.

I wonder how hard it would be to get the XUL engine installed as an IE helper application for .xul files? Maybe something else for me to play with :)

Google’s Friend Connect

So I’d thought I’d give Google’s Friend Connect a whirl. Friend Connect allows you to embed social networking components onto your website. Out of the box you get a members gadget, a wall gadget and a review/rate gadget. Since it is all based on OpenSocial you can add any other OpenSocial gadgets to your site as well.

Here is the quick intro video:

YouTube Preview Image

Getting set up is very easy, you simple add two .html pages to your site and then embed some Javascript whereever you want the gadgets to appear.

It took all of 5 minutes to set up the members gadget as the “Friends” box in the left bar of my blog.

Google Friend connect is a direct competitor for Facebook Connect which lets you do similar functions but built around the Facebook API. Facebook Connect is much harder to set up but seems to be gaining more traction with big sites such as Digg.  It’ll be interesting to see who wins this race and if this whole thing takes off.

Android getting ready for launch

Well things seem to be heating up in the Android world…

First off the new version of the SDK (0.9) became available. The APIs have undergone some rather radical changes since m15 but apparently they should be mostly stable now. Its going to take some serious work to get Bubbles! up and running again.

Next all sorts of leaks about the first Android handset (the HTC Dream) starting popping up on the Internet. Gizmodo have some spy pictures of the phone, it looks good but not iPhone sexy. I think the slide out qwerty keyboard is a good idea but it doesn’t help the devices looks.

Google also posted some information about their content distribution system which will be the Android equivalent of the iPhone’s App Store.

“Developers will be able to make their content available on an open service hosted by Google that features a feedback and rating system similar to YouTube. We chose the term “market” rather than “store” because we feel that developers should have an open and unobstructed environment to make their content available. Similar to YouTube, content can debut in the marketplace after only three simple steps: register as a merchant, upload and describe your content and publish it.”

It certainly seems that getting an Android application out into the wild will be far easier (and less expensive) then an iPhone application.

And lastly, today the Android team posted the Android Developer Challenge Winners gallery showcasing the final 50 apps and the winning apps. Some pretty interesting application here.

Its going to be interesting to see how Android and the HTC Dream do against the iPhone tsunami.

Bubbles! now uses Google App Engine

Just for kicks I decided to port the backend services for my Google Android app, Bubbles!,  to use the Google App Engine.

For those of you who don’t know Googles App Engine is a “free” application hosting environment. It promises to be able to scale Google style (as long as you pay of course).

The free account gives you 500Mb of persistent storage and bandwidth and CPU for around 5million pages views a month which is not bad for free.

Python

For some strange reason Python is the language of choice for app engine. I’ve never really taken to Python and I don’t really like languages where indentation is syntactically meaningful but it wasn’t too painful after skimming some tutorials on the web and running through the tutorial.

SDK

The SDK is only a couple of megabytes to download (you need Python 2.5 installed) and ran fine on my Windows XP desktop and Ubuntu laptop. Having said that the SDK doesn’t give you very much in the way of an IDE, it just gives you a dev web server and a tool to upload your application to the hosting platform. So I just used gedit and Notepad++ (which both have Python syntax highlighting) as my editors.

Platform Features

App Engine provides a pretty easy to use framework for building web applications in Python. The engine is WSGI compliant so you can plugin in any of the common Python frameworks such as Django, CherryPy, Pylons and web.py. Django seems to be the web app framework of choice.

Apart from a web application framework, the engine also provides APIs for email, image manipulation, URL fetching, users and datastorage.

The Users API is pretty cool as it hooks into Google’s user accounts so anyone with a Google account can log into your application (if you want them too).

The datastore is an object based transaction engine with a SQL like syntax. On the face of it is very clean and easy to use but its here that I had the biggest headaches when porting the Bubbles! services.

**

Porting the services**

Bubbles! uses 3 very simple services: popin, popout and getpops (where a POP is a point of presence). These services take input parameters from the query string and return JSON response strings.

Creating a class to represent a Pop in the datastore was very simple; as was creating and deleting Pops in the datastore. The biggest issue I had here was coming up with an elegant way of validating the input parameters.

But when I came to getting things back out of the datastore things went a little pear shaped…

In my Pop class I was storing the latitude and longitude of the POP as floating point numbers. To retrieve the nearby POPs (in the getpops service) I was using a typical SQL like query as follows:

SELECT * FROM POP<br /> WHERE lat >= :1 AND lat < :2 AND lng >= :3 AND lng < :4<br /> ORDER BY lastdatemodified

Where :1, :2, :3 and :4 were set to currentLat-0.001, currentLat+0.001, currentLng-0.001 and currentLng+0.001._

_

This raised the first issue: Only one “property” can have an inequality clause in a query. Turns out that the datastore has some pretty weird and wonderful restrictions, of course this particular one put a major spanner in the works.

Geohash to the rescue

What I needed was a quick way of calculating if a point in space was close to another one and to be honest the approach I was never happy with the approach I used above because it found points in rectangular area not a circular one.

After a little bit of research (I love the web), I came across this concept: the Geohash.

This cool (public domain) algorithm takes a decimal lat/long and turns it into a string. For instance

-36.843480 174.767138

Becomes:

rckq2uve1mx3

Not only does this give you something that you can stick on a #aliases: http://geohash.org/rckq2uve1mx3 but more importantly for points near to each other the first few characters of the hash are the same !

-36.843480 174.767138  =  rckq2uve1mx3<br /> -36.844381 174.765611  =  rckq2usmvvsd<br /> -36.848508 174.765451  =  rckq2gumfhjr<br /> -36.848457 174.748261  =  rckq27zy1tg8

So the solution to my problem turns out to be remarkably easy:

  1. When creating or updating a POP I calculate the Geohash for the longitude and latitude of the POP. I take only the first 6 characters and store them with the POP
  2. When processing getpops, I calculate the Geohash for the current latitude/location, grab the first 6 characters and find any pops in the datastore that have the same stored Geohash.

My select statement is now a simple equals and runs far faster then my original implementation.

Summary

Overall Google App Engine is an interesting platform and baring some quirks it does appear to be a viable platform for building web applications on.

Bubbles! didn’t make it

Google Android Developer Challenge LogoJust received an email from the Android Developer Challenge team, seems that Bubbles! my Google Android application didn’t make it into round two:

_During the past few weeks, 100+ judges around the world reviewed over 1,700

applications. They were extremely impressed with the diversity and the

large number of high quality entries submitted. It is clear that the number

of great applications far exceeds the 50 top scoring applications that will

move on to the final round of the Android Developer Challenge._

_We regret to inform you that your entry was not among the top 50

submissions._

Ah well it was worth a go. Apparently they are going to be putting up an Android Developer Challenge

Gallery shortly so we will get to see what I was up against.

Bubbles! – My Google Android Developer Challenge Entry

Google Android Developer Challenge LogoWell working into the wee hours of the morning I finally finished off my Google Android Developer Challenge entry.

Bubbles! allows you to create a pop (point of presence) that is ‘broadcasted’ from your phone. Other Bubbles! users in close proximity (about 50m) get to see your pop and you get see theirs. Of course as you move around so does your pop.

A pop is anonymous and consists of a message and a nick name that you choose for yourself.

Bubbles! Screenshots

I was going to implement a feature whereby you could tie a pop to a location. This would allow you to attach messages to a point in space for other users to see. Unfortunately I ran out of time but its next on my list to build.

Here are a few screenshots so you can see Bubbles! in action (click to see them full sized)

I’m also thinking of including the ability to see the history of pops for another user and perhaps even the ability to initiate a chat session with another Bubbles! user. Maybe even overlay the pops unto a MapView (which would hook into Google Maps) .

Of course if I get into the top 50 for the first round of the challenge I’ll have some money to invest into more development. We’ll have to see how I go but here’s hoping.

Finalists in TUANZ Business Internet Awards 2007

TUANZ LogoThis is pretty cool. For the last 3 years I’ve been working as the architect with the Innovations and Ventures department at Air New Zealand.

Yesterday we found out that three of our projects are finalists in the TUANZ Business Internet Awards for 2007 !

The projects are:

Grabaseat screenshotGrabaseat (Advertising & Marketing category)

For those of you who haven’t seen grabaseat (GAS) it is a site that has daily discounted fares sometimes as low as a dollar.

This site has been very successful, in May this year we hit 1.9 million visitors a month and the latest “grabaseat on tour” promotion run in October saw a further 30% increase in the number of visitors !

The Air New Zealand ISIS online booking engine (e-Commerce category)

ISIS screenshot

This is the one I am most proud of. Its the cornerstone application developed by Innovations and Ventures.

Its the most complicated system I have every worked on, not such much the user interface (which is very cool with AJAX and the like) but the quoting and pricing engine behind it.

Coming up with a price for a plane ticket is horrendously complicated and mathematically, an unsolvable problem. ISIS not only does it but it does it incredibly fast and smoothly which is what you want in a $1billion sales channel :)

How far can I go? screenshotHow far can I go? (Experimentation category)

One of first ideas we came up with when we started working on the ISIS engine was to turn the usual conversion with a booking engine on its head: rather then picking flights and get a price, wouldn’t it be better to pick a price and get told what was available ?

That is what How far can I go? does. Even better it has very very cool user interface where you move a price slider up and it shows you everywhere you can go for that price on a cool map zooming map and the price points for the next 6 months. Love it.

I’ll keep you posted on how we do. Hopefully we win em all !