Tinderbox waterfall in Javascript

Just a quick follow-up on my earlier post about Tinderbox's new JSON output mode - I've hacked up a quick working example of the waterfall page in Javascript. You can view the source to see how you could extract any of this info from Tinderbox.

Here's a screenshot in case it stops working :)

You can click that image to get to the live version. I used a bunch of code, images and ideas from Ted Mielczarek's better-written example. In particular, the idea to parse out the OS and purpose of each column, and display it more directly, and I took some bits of code that looked better than the way I was doing things.

We're already discussing changes that will break these pages, so don't get too cozy with them. I am pretty excited to have something to show for this so quickly though, especially having spent very little time so far.

I am anxious to start trying to improve the experience for tinderbox users (in particular by taking use cases into account), which for me is the whole point of this exercise. If you have ideas for better UI for displaying the kind of information that developers, testers and other Tinderbox users need, this is a great way to mock up a real-life example, so have at it!