Lately, most of my free time has been devoted to the White Star Balloon project. One of the parts of the project I have become involved with is the tracking page. This was a major portion of the project a year ago, when we still had lots of buzz and momentum going. Unfortunately, it was a huge disaster, and we had to cobble something terrible together at the very last moment. Since then, a lot has changed. We’ve become more skilled, new technologies have matured, and new hosting solutions have become cheaper.
White Star’s tracking needs are somewhat unique among the amateur balloon community. Most balloons end up using sites like aprs.fi and spacenear.us. These sites are great, and the guys working on them are better web programmers than I’ll ever be. Unfortunately, they don’t meet our needs. aprs.fi is designed to used with devices carrying APRS transmitters (which we cannot use over the ocean), and spacenear.us is designed to be used with a distributed network of receivers, which doesn’t fit our model very well. We also wanted to plan for a contingency of getting a large number of visitors very suddenly, in case we hit CNN or Reddit.
This year’s tracking page is run entirely on the client side. All telemetry processing is done by the client, and displayed on maps, gauges and graphs. This allows us to use static hosting for everything. I used the following resources to make this happen:
- Twitter Bootstrap – A super quick and easy CSS framework. Looks good out of box, if a little cookie-cutter. Don’t have the time or the design skill to go further, though.
- OpenLayers – More fully-featured than anything from Google. Switched to this when we thought Google was going to price us out of GMaps. One downside: It’s huge!
- HighCharts – Very pretty, easy to use charts.
- Amazon S3 – Used to store all static files.
Everything is up on GitHub, and ready for inspection and shed painting. More about the specifics below.