if (GBrowserIsCompatible()) {
  var side_bar_html = "";
  var gmarkers = [];
  var htmls = [];
  var i = 0;
  
  // custom icons
  var redIcon = new GIcon();
  redIcon.image = "/Stock/GoogleMapPins/map-push-pin-red.png";
  redIcon.iconSize = new GSize(20, 20);
  redIcon.iconAnchor = new GPoint(2, 10);
  redIcon.infoWindowAnchor = new GPoint(2, 10);
  
  var blueIcon = new GIcon();
  blueIcon.image = "/Stock/GoogleMapPins/map-push-pin-blue.png";
  blueIcon.iconSize = new GSize(20, 20);
  blueIcon.iconAnchor = new GPoint(2, 10);
  blueIcon.infoWindowAnchor = new GPoint(2, 10);

  // An array of GIcons, to make the selection easier
  var icons = [];
  icons[0] = redIcon;
  icons[1] = blueIcon;
  
  // A function to create the marker and set up the event window
  function createMarker(point,name,html,icontype) {
    var marker = new GMarker(point,icons[icontype]);
    GEvent.addListener(marker, "click", function() {
      marker.openInfoWindowHtml(html);
    });     
	
    gmarkers[i] = marker;
    htmls[i] = 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]);
  }


	var map = "";
	
	function initializeMap(){
		// create the map
		map = new GMap2(document.getElementById("map"));
		map.setCenter(new GLatLng(44.7923807, -96.455271), 3);
		map.addControl(new GLargeMapControl());
		map.addControl(new GMapTypeControl());
		readMap("/Modules/GoogleMap/GoogleMapLocations/all.xml");
	}

  
	function readMap(url) {
	  var request = GXmlHttp.create();
	  request.open("GET", url, true);
	  request.onreadystatechange = function() {
	    if (request.readyState == 4) {
	      var xmlDoc = request.responseXML;
	      // obtain the array of markers and loop through it
	      var markers = xmlDoc.documentElement.getElementsByTagName("marker");
			// hide the info window, otherwise it still stays open where the removed marker used to be
	        map.getInfoWindow().hide();
	        map.clearOverlays();
	        // empty the array
	        gmarkers = [];
			
	        // reset the side_bar
	        side_bar_html="";
			
	      for (var i = 0; i < markers.length; i++) {
	        // obtain the attribues of each marker
	        var lat = parseFloat(markers[i].getAttribute("lat"));
	        var lng = parseFloat(markers[i].getAttribute("lng"));
	        var point = new GLatLng(lat,lng);
	        var html = markers[i].getAttribute("html");
	        var label = markers[i].getAttribute("label");
			var icontype = parseInt(markers[i].getAttribute("icontype"));
	        // create the marker
	        var marker = createMarker(point,label,html,icontype);
	        map.addOverlay(marker);
	      }
		  
		   // put the assembled side_bar_html contents into the side_bar div
      		document.getElementById("sidebar").innerHTML = side_bar_html;
		  
	    }
	  }
	  request.send(null);
	}
}

// display a warning if the browser was not compatible
else {
  alert("Sorry, the Google Maps API is not compatible with this browser");
}
