United Airlines waiting screen

Like most airlines, United Airlines lets you search for and book flights directly on the website. Like most flight booking services they show you a boring little animation while trying to find suitable tickets for you. If they had shown the code instead it might have been more amusing to those of us who read JavaScript. I've stored the current source as a text file, because it is a good read..

united.txt

Read it and see if you can make sense of those JavaScripts!

Once you've read it, check the full post for my highlights from the code.. …

Here are the issues with United's waiting screen code:

Misunderstanding try..catch
If we use IE on Windows, they do

try {
	  imgLdr[0].src = "http://www.united.com/ual/asset/united2005.gif";
		}
		catch(err) {
		 imgLdr[0].src = "/ube/images/icns/united1005.gif";
		}

The try..catch is superfluous. Setting imgLdr[0].src will never throw an error. (It looks like they expect a JavaScript error if the image can't be loaded but that's a complete misunderstanding. The IMG.onerror event is an event, it doesn't stop the main script thread.).

Silly browser sniffing
Then comes the else clause, if you are not using IE on windows – which does exactly the same thing as the IE-Win clause! Cut-and-paste. So why the sniffing?? That's 17 lines of code to pre-load a single gif.

I also like the comment

//Kaunish change the src below to be http:// version of line 48, http://www.united.com/ual/asset/united2005.gif

Can we assume that Kaunish isn't using version control to document his changes..?

IMG.onload
Now, at the bottom of the code we find evidence of thorough testing and research into how browsers handle IMG.onload. If you are Win-IE or Safari, it seems you won't send onload to an image that was already pre-loaded with JavaScript (um, why did they write those 17 lines to pre-load it in the first place then??), so they set onload on an invisible GIF instead.

We also see what they actually meant by the try..catch stuff here:

onerror='this.src = imgLdr[1].src'

. If image A doesn't load, show image B instead. Ugly and inefficient but possibly the smallest problem with this code..

Look at the considerable amount of testing that went into those sniffing statements. Think about the consequences when the IMG.onload approach fails (a HTTP request gone wrong, a server hiccup for example) – the site will never show you the carefully prepared list of possible tickets. The whole booking simply becomes unusable. Did it really never occur to the person writing this how much simpler and more robust it would be to just use window.onload?

Advertisements

3 thoughts on “United Airlines waiting screen

  1. Originally posted by HeroreV:

    LOL Internet Explorer 7 renders united.txt as HTML.

    The old content sniffing stuff, disregarding Content-Type from server.These guys from UA really don't have a clue to what JS is. They should hang around these forums more đŸ˜€

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