Rails Google Maps integration Javascript problem

update I

Based on feedback, I've changed var maps to var adds.

problem description

I'm working on Rails 3.0.0.beta2, following Advanced Rails Recipes "Recipe #32, Mark locations on a Google Map" and I hit a road block: I do not see a google map. My @adds view uses @adds.to_json to connect the google maps api with my model. My database contains "latitude" "longitude", as floating points. And the entire project can be accessed at github.

Can you see where I'm not connecting the to_json output with the javascript correctly? Can you see other glairing errors in my javascript? Thanks in advance!

My application.js file:

    function initialize() { 
      if (GBrowserIsCompatible() && typeof adds != 'undefined') {
        var adds = new GMap2(document.getElementById("map"));
        map.setCenter(new GLatLng(37.4419, -122.1419), 13);
        map.addControl(new GLargeMapControl());

        function createMarker(latlng, add) {
          var marker = new GMarker(latlng);
          var html="<strong>"+add.first_name+"</strong><br />"+add.address;
          GEvent.addListener(marker,"click", function() {
            map.openInfoWindowHtml(latlng, html);
          });
          return marker;
        }

        var bounds = new GLatLngBounds;
        for (var i = 0; i < adds.length; i++) {
          var latlng=new GLatLng(adds[i].latitude,adds[i].longitude)
          bounds.extend(latlng);
          map.addOverlay(createMarker(latlng, adds[i]));
        }
        map.setCenter(bounds.getCenter(),map.getBoundsZoomLevel(bounds));
      }
    }  
    window.onload=initialize;
    window.onunload=GUnload;

Layouts/adds.html.erb:

  <script src="http://maps.google.com/maps?file=api&amp;v=2&amp;sensor=true_or_false&amp;key=ABQIAAAAeH4ThRuftWNHlwYdvcK1QBTJQa0g3IQ9GZqIMmInSLzwtGDKaBQvZChl_y5OHf0juslJRNx7TbxK3Q" type="text/javascript"></script>

<% if @adds -%>
<script type="text/javascript">
    var adds = <%= raw @adds.to_json %>;
</script>
<% end -%>

Rails Console Output

a = Add.all
 => [#<Add id: 1, first_name: "Jason", last_name: "Wade", address: "225 Anzavista Ave, San Francisco, CA", address2: "", zip: "94115", city: "San Francisco", phone: "415-280-6678", float: nil, campaign_id: 1, email: 开发者_开发百科"jwade@gmail.com", employer: "Google", occupation: "", created_at: "2010-04-06 14:00:36", updated_at: "2010-04-06 14:00:36", latitude: 37.779623, longitude: -122.445662>] 

ruby-1.9.1-p378 > a.to_json
     => "[{\"address\":\"225 Anzavista Ave, San Francisco, CA\",\"address2\":\"\",\"campaign_id\":1,\"city\":\"San Francisco\",\"created_at\":\"2010-04-06T14:00:36Z\",\"email\":\"jwade@gmail.com\",\"employer\":\"Google\",\"first_name\":\"Jason\",\"float\":null,\"id\":1,\"last_name\":\"Wade\",\"latitude\":37.779623,\"longitude\":-122.445662,\"occupation\":\"\",\"phone\":\"415-280-6678\",\"updated_at\":\"2010-04-06T14:00:36Z\",\"zip\":\"94115\"}]"

  var bounds = new GLatLngBounds;

should be

  var bounds = new GLatLngBounds();

And you were initially correct:

  var map = new GMap2(document.getElementById("map"));