var markers = [];
var htmls = [];
var i = 0;

function makeGoogleMap() {
  var map = new GMap(document.getElementById("google_map"));
  map.addControl(new GLargeMapControl());
  map.addControl(new GMapTypeControl());
  map.centerAndZoom(new GPoint(-84.283605, 30.441645), 1);
		 
  var request = GXmlHttp.create();
  request.open("GET", "/xml/gmaps.xml", true);
  request.onreadystatechange = function() {
    if (request.readyState == 4) {
      var xmlDoc = request.responseXML;
      var markers = xmlDoc.documentElement.getElementsByTagName("marker");

      for (var i = 0; i < markers.length; i++) {
        var myLng = parseFloat(markers[i].getAttribute("lng"));
        var myLat = parseFloat(markers[i].getAttribute("lat"));
        var point = new GPoint(myLng, myLat);

        var html = '<span class="name">' + markers[i].getAttribute("name") + '</span><br>' +
  		   '<span class="address">' + 
                      markers[i].getAttribute("addr_line1") + '<br>' +
		      markers[i].getAttribute("addr_line2") + '<br><br>' +
		      markers[i].getAttribute("hours") + 
                   '</span>' + 
                   '<br><br>';

        var dest = markers[i].getAttribute("addr_line1") + ',' + markers[i].getAttribute("addr_line2");
        var dirLink = '<form action="http://maps.google.com/maps" method="get">' +
                      '  <label for="saddr">' +
                      '    <span class="example"><b>Enter your address</b>: &nbsp;&quot;123 Main St, Tallahassee, FL 32301&quot;</span>' +
                      '  </label><br>' +
                      '  <input type="text" size="50" name="saddr" id="saddr" value="" /><br>' +
                      '  <input type="hidden" name="daddr" value="'+dest+'" />' +
                      '  <input type="hidden" name="hl" value="en" />' + 
                      '  <input type="submit" value="Get directions" align="right">'
                      '</form>';
        var info = '<div id="gmap">' + html + dirLink + '</div>';
        var marker = createMarker(point, info);
        map.addOverlay(marker);
      }				
    }
  }
  request.send(null);
}

function createMarker(point, html) {
  var icon = new GIcon();
    icon.image = "/images/mm_20_red.png";
    icon.shadow = "/images/mm_20_shadow.png";
    icon.iconSize = new GSize(12, 20);
    icon.shadowSize = new GSize(20, 18);
    icon.iconAnchor = new GPoint(6, 20);
    icon.infoWindowAnchor = new GPoint(5, 1);
    var marker = new GMarker(point, icon);
    GEvent.addListener(marker, "click", function() {
    marker.openInfoWindowHtml(html);
  });

  markers[i] = marker;
  htmls[i] = html;
  i++;
  return marker;
}
		
function zoomAndLoad(i) {
  markers[i].openInfoWindowHtml(htmls[i]);
}