The need

So, I've been playing with Silverlight 1.1.  I'm coauthoring an upcoming Silverlight 1.1 book, so it's kind of important that I know this stuff ;).  I was looking for some kind of real-world app I could sink my teeth into. 

Genesis of an idea

Around the same time, I was getting ready to fly down to Jacksonville to help out a client.  I went to TSA's web site to check wait times at the security checkpoints.  I got the data back, but it wasn't as useful  as I thought it could be.  Here's an example of the results:

I looked a little further down the page, and, lo and behold, there was a link to the data in XML format.  An idea was born!

From concept to reality

I'm not a graphics guy.  However, it didn't take a rocket scientist to realize that the TSA data could be presented in such a way that a user could immediately decide the best time to go through security.  I came up with a pie chart-like clock metaphor, where a glance at the chart gave you both average (outer colors) and max (inner colors) times for the entire day.  Here's a screenshot:

Finally, I extended the UI to display the whole week for each checkpoint on one screen. 

With the TSA web site, you can't get a feel for traffic patterns, or what the busiest times are.  On the other hand, by using Silverlight, it becomes immediately apparent when you DON'T want to be at the airport!

Architecture

I wrote a web service in .NET to provide the data.  The Silverlight app has three controls, the Clockgrid control, the Clock control, and the Slice control.  The Clock control is made up of Slice controls, and the Clockgrid control is used to position the Clock controls on the page.  The Clock and Slice controls were designed in Blend.  It's all hosted on an asp.net page that's used to provide the airport selection capability.

<shamelessplug>
If you want to learn more, you'll have to pick up the upcoming Silverlight book I'm working on :)!
</shamelessplug>

What I learned

Silverlight 1.1 is incredibly powerful!  I've been doing ajax-like apps since Microsoft's first xmlhttp implementation.  I've always thought it was incredibly fragile.  On the DOM side, you have to worry about browser-specific idiosyncrasies.  On the web service side, you have to worry about data formats, async callbacks, etc.  Yes, I know there are libraries like ajax.net that wrap the hard work for you, but that doesn't mean the problems don't still exist.  Well, with Silverlight, it's so much easier in comparison!  There is one UI, the Silverlight UI.  No worries about incompatibilities.  On the web service side, you can add a reference to a web service just like you can within a traditional .NET app.  Everything gets wired up for you.  And best of all, it's all in managed code!!!  Life is good!

Try it for yourself

Ok.  I hesitate to throw a URL out there, but since this is my first blog post, and no one reads this :), why not?  If you want to try the app above, go to http://www.airportwait.com.  You'll need the latest Silverlight 1.1 refresh in order for it to work.  I still need to clean up some things, and some airport codes don't work like they should (MSP, for example), but you should get the idea.  And hey, since the data is updated as of a week ago, you might actually find it useful if you're flying somewhere!

Left undone

Here's what I want to do when I have more time.

• Make it prettier.  It needs the standard web page treatment (menus, header, etc).
• Add a scale animation when you mouseover a clock chart.  This way, the clock would zoom in and out as it was selected and unselected.
• Fix 0am to be 12am :).
• Fix the airports that don't work.  I think the reason is because Silverlight limits the returned web service data size to 120,400 bytes.  I know how to change this in asp.net, but I have not found a setting in Silverlight.  This is one of the reasons it takes a few seconds to display an airport.  Instead of making one call to the web service to get the data for an airport, I had to break it into seven calls, one for each day.  While slower, this enabled larger airports to work.
• More data!  I'd love to show flight on-time statuses and other significant airline-related data.  Ah, one day...

Final thoughts

I've heard a lot of people wonder how useful Silverlight's going to be for anything other than playing video.  Well, hopefully this example gives you a little taste of how Silverlight can make any application that has data more useful.  Download the SDK and get started today!