Today’s WhatTheBus progress (see tag “MapSeeds”) created the foundation for live maps. These maps will only show a single bus at a time because our initial use case is that a parent wants to monitor their child’s bus.

To accomplish this use case, we need to provide a list of all the buses in the system (grouped by district) and then allow users to select a bus and see the map.

This foundation started with a series of Cucumber tests that verified the navigation structure and the base map page.  These pages used the existing page tests (yawn).

In fact, most of this work is pretty dull Rails web navigation stuff.  The interesting parts were:

1. DRY the bus location from cache by moving it into the model
2. Add jRails so that we can use jQuery goodness
3. Optimization: added index for Bus xref
4. Optimization: added ?cache flag for the bus json requests to bypass database calls on location only requests

In our next pass, we’ll add support for Google Maps (v3).  Until then, we just have some simple script that pulls the current bus position using our existing bus JSON request.  I am using the simulator (“rake sim:move”) to verify this; unfortunately, Cucumber does have native AJAX support.

Here’s the <script>

<script type="text/javascript">
  var xref = '<%= @bus.xref %>';
  var name = '<%= @bus.name %>';

  function initMap() {
    window.setInterval('updateMap();', <%= MAP_UPDATE_SECS %>000);
    updateMap();
  }

  function updateMap() {
    jQuery("#ll").text("?,?");

    // get the data for the map
    jQuery.getJSON("/bus/index/"+ xref +".json?cache", {}, function(data){
    jQuery("#ll").text(data.buses[xref].lat + ',' + data.buses[xref].lng);
    });
  }
</script>