  var side_bar_html = "";
    
  // arrays to hold copies of the markers and html used by the side_bar
  // because the function closure trick doesnt work there
  var gmarkers = [];
  var htmls = [];
  var i = 0;
  var geocoder = null;
  var map = null;
  var kmlmap = null;

  var iconbig = new GIcon();
  //iconbig.image = "http://www.google.com/mapfiles/marker.png";
  iconbig.image = "images/blue.png";
  iconbig.shadow = "http://www.google.com/mapfiles/shadow50.png";
  iconbig.iconSize = new GSize(20, 34);
  iconbig.shadowSize = new GSize(37, 34);
  iconbig.iconAnchor = new GPoint(6, 34);
  iconbig.infoWindowAnchor = new GPoint(5, 1);

  var icons = new Array();
  icons[null] = iconbig;

  // A function to create the marker and set up the event window
  function createMarker(point,name,html,imageUrl) {
    var icon = icons[imageUrl];
    if (icon == null) {
      icon = new GIcon(icons[null]);
      icon.image = imageUrl;
      //icon.iconSize = new GSize(25,18);
    }
    var marker = new GMarker(point,icon);

    GEvent.addListener(marker, "click", function() {
      marker.openInfoWindowHtml(html);
    });
    // save the info we need to use later for the side_bar
    gmarkers[i] = marker;
    htmls[i] = html;
    // add a line to the side_bar html
    side_bar_html += '<a href="javascript:myclick(' + i + ')">' + name + '<\/a><br/>';
    i++;
    return marker;
  }

  // This function picks up the click and opens the corresponding info window
  function myclick(i) {
    gmarkers[i].openInfoWindowHtml(htmls[i]);
  }

  function showAddress(address) {
    if (geocoder == null) {
      geocoder = new GClientGeocoder();
    }
    geocoder.getLatLng(address, function(point) {
      if (point) {
        alert(address + " = " + point);
      } else {
        alert(address + " not found");
      }
    }); 
  }

// zoom map to
function zoomMapTo(lat,lng) {
  var currentZoom = map.getZoom();
  newzoom = (currentZoom > 17) ? 17 : ((currentZoom == 0) ? 0 : (currentZoom + 1));
  map.setCenter(new GLatLng(lat,lng), newzoom);
}

function KMLMap(map,url) {
  // create the map
  map = new GMap2(map);
  map.addControl(new google.maps.LargeMapControl());
  map.addControl(new google.maps.MapTypeControl());
  map.setCenter(new GLatLng(43.2545039,-78.0788272), 10);

  process_it = function(data) {
    // To ensure against HTTP errors that result in null or bad data,
    // always check status code is equal to 200 before processing the data
    //if(responseCode == 200) {
      try {
        var xml = GXml.parse(data);
        var doc = xml.documentElement.getElementsByTagName("Document")[0];
        for (var i = 0; i < doc.childNodes.length; i++) {
          var node = doc.childNodes[i];
          if (node.tagName == 'Folder') {
            processFolder(map, node);
          } else if (node.tagName == 'Placemark') {
            side_bar_html += '<h3>';
            processPlacemark(map, node);
            side_bar_html += '</h3>';
          }
        }
        document.getElementById("side_bar").innerHTML = side_bar_html;
      } catch (e) {
        alert(e.name + ':' + e.message);
      }
    //} else if(responseCode == -1) {
      //alert("Data request timed out. Please try later.");
    //} else { 
      //alert("Request resulted in error. Check XML file is retrievable. " + responseCode);
    //}
  }
  GDownloadUrl(url, process_it);
}

function processFolder(map, folder) {
  var name = GXml.value(folder.getElementsByTagName("name")[0]);
  side_bar_html += '<h3>' + name + '</h3>';
  processPlacemarks(map, folder.getElementsByTagName("Placemark"));
}

function processPlacemarks(map, placemarks) {
  for (var i = 0; i < placemarks.length; i++) {
    processPlacemark(map, placemarks[i]);
  }
}

function processPlacemark(map, placemark) {
    var coordinates = placemark.getElementsByTagName("coordinates");
    for (var j = 0; j < coordinates.length; j++) {
      var coord = GXml.value(coordinates[j]).split(',');
      var lat = parseFloat(coord[1]);
      var lng = parseFloat(coord[0]);
      var point = new GLatLng(lat, lng);
      var name = GXml.value(placemark.getElementsByTagName("name")[0]);
      var desc = GXml.value(placemark.getElementsByTagName("description")[0]);
      var html = "<div class=\"IW\"><div class=\"IWCaption\">" +
            name +
            "</div><div class=\"IWContent\">" +
            desc +
            //"<br><a href=http://maps.google.com/maps?daddr=" + 
            //escape(address) + " target='_blank'>Map &amp; Directions</a>" +
            //"<br><br>" + comments +
            "</div><div class=\"IWFooter\"><div class=\"IWFooterZoom\"><a href=\"javascript:void(0)\" onclick=\"zoomMapTo("+lat+","+lng+")\">Zoom To</a></div></div></div>";
      var icon = placemark.getElementsByTagName("Icon")[0];
      var imageUrl = null;
      if (icon) {
        imageUrl = GXml.value(icon.getElementsByTagName("href")[0]);
      }
      var marker = createMarker(point,name,html,imageUrl);
      map.addOverlay(marker);
    }
}

function load(filename) {
  if (GBrowserIsCompatible()) {
    // this variable will collect the html which will eventually be placed in the side_bar
    kmlmap = new KMLMap(document.getElementById("map"), filename);
  } else {
    alert("Sorry, the Google Maps API is not compatible with this browser");
  }
}

