var markers = [];
var i = 0;
var side_bar_html = "<br><br>";
var themap;

var baseIcon = new GIcon();
baseIcon.shadow = "http://www.google.com/mapfiles/shadow50.png";
baseIcon.iconSize = new GSize(20, 34);
baseIcon.shadowSize = new GSize(37, 34);
baseIcon.iconAnchor = new GPoint(9, 34);
baseIcon.infoWindowAnchor = new GPoint(9, 2);
baseIcon.infoShadowAnchor = new GPoint(18, 25);

function loadMap(mapname)
{
	if(GBrowserIsCompatible())
	{
		themap = new GMap2(document.getElementById("map"));
		themap.enableDoubleClickZoom();
		themap.enableContinuousZoom();
		themap.enableScrollWheelZoom();
		//themap.addControl(new GLargeMapControl());
		//themap.addControl(new GMapTypeControl());		
		themap.addControl(new GHierarchicalMapTypeControl());
		themap.setCenter(new GLatLng(20, 0), 4);
		themap.setMapType(G_PHYSICAL_MAP);
		themap.addMapType(G_PHYSICAL_MAP);
		themap.addMapType(G_SATELLITE_3D_MAP);
		themap.setUIToDefault();
		themap.enableRotation();
//		themap.setMapType(G_SATELLITE_TYPE);
		var bounds = new GLatLngBounds();
		
		downloadpath = "/json/maps/" + mapname
		GDownloadUrl(downloadpath, function(data, responseCode)
		{
			var jsonData = eval('(' + data + ')');
			for (var k = 0; k < jsonData.markers.length; k++)
			{
				var marker = jsonData.markers[k];
				var lat = parseFloat(marker.lat);
				var lon = parseFloat(marker.lon)
				var point = new GLatLng(lat, lon)
				bounds.extend(point);
				var windowinfo = marker.infoWindow;
				var name = marker.name;
				var marker = createMarkerWindow(point, windowinfo, name, k);
				themap.addOverlay(marker);
	    		}
			document.getElementById("side_bar").innerHTML = side_bar_html;
			themap.setZoom(themap.getBoundsZoomLevel(bounds));
			themap.setCenter(bounds.getCenter());
		});		  	
	}
	else
	{
		alert("Your browser is not compatible with google maps.  Please update your browser to the latest version or get the newest release of a free browser such as Chrome.");
	}
}

function createMarkerWindow(aPoint, aWindowInfo, title, index)
{

	var markerOpts = {};
	var nIcon = new GIcon(baseIcon);
	nIcon.imageOut = "http://gmaps-samples.googlecode.com/svn/trunk/" +
          "markers/" + "blue" + "/marker" + (index+1) + ".png";
      nIcon.imageOver = "http://gmaps-samples.googlecode.com/svn/trunk/" +
          "markers/" + "red" + "/marker" + (index+1) + ".png";
      nIcon.image = nIcon.imageOut; 
	markerOpts.icon = nIcon;
	markerOpts.title = title;		 
	var aMarker = new GMarker(aPoint, markerOpts);
	
	markers[index] = aMarker;
	side_bar_html += '<a href="javascript:sidebarclick(' + index + ')" onmouseover="sidebarMouseover(' + index + ');" onmouseout="sidebarMouseout(' + index + ');">' + (index+1) + ") " + title + '</a><br>';	
	i++;

 GEvent.addListener(aMarker, "click", function()
	{
    		aMarker.openInfoWindowHtml(aWindowInfo);
  	});
  GEvent.addListener(aMarker, "mouseover", function() {
    aMarker.setImage(aMarker.getIcon().imageOver);
  });
  GEvent.addListener(aMarker, "mouseout", function() {
    aMarker.setImage(aMarker.getIcon().imageOut);
  });
  GEvent.addListener(aMarker, "infowindowopen", function() {
    aMarker.setImage(aMarker.getIcon().imageOver);
  });
  GEvent.addListener(aMarker, "infowindowclose", function() {
    aMarker.setImage(aMarker.getIcon().imageOut);
  });


	return aMarker;
}

function sidebarclick(i)
{
      GEvent.trigger(markers[i], "click");
}

function sidebarMouseover(i)
{
     markers[i].setImage(markers[i].getIcon().imageOver);
}
      
function sidebarMouseout(i)
{
     markers[i].setImage(markers[i].getIcon().imageOut);
}