<!--

	var maps = new Object();

	 
	 
	$(document).ready(function() {
		renderMaps();
	});



	function renderMaps()
	{		
		// get all map_canvas elements and loop through them to insert a new map
		var elements = $('[id^=map_canvas]');
		for (i = 0; i < elements.length; i++ )
		{
			var mapId = elements[i].id.replace("map_canvas", "");
			createMap(elements[i], mapId);
		}
	}



	function createMap(element, mapID)
	{
		if (GBrowserIsCompatible()) {
			var map = getMap(mapID);
			if (map)
			{
				// get start properties from the html
				map.startLatitude = getMapHTMLProperty("start_latitude" + mapID);
				map.startLongitude = getMapHTMLProperty("start_longitude" + mapID);
				map.startScale = getMapHTMLProperty("start_scale" + mapID);
				map.infoHeight = getMapHTMLProperty("info_height" + mapID);
				map.infoWidth = getMapHTMLProperty("info_width" + mapID);

				map.render(element);				
			}
		}else {
			alert("Sorry, the Google Maps API is not compatible with this browser"); 
		}
	}



	function getMap(mapID)
	{		
		if (maps[mapID] == undefined)
			maps[mapID] = new Map;
		
		return maps[mapID];
	}



	function createTabs(tabs, mapID)
	{
		var map = getMap(mapID);

		if (map)
			map.tabs = tabs;
	}



	function createMarker(latitude, longitude, markerID, markerData, mapID)
	{
		var map = getMap(mapID);

		if (map)
			map.createMarker(latitude, longitude, markerID, markerData);
	}



	function getMapHTMLProperty(elementName)
	{
		var output = "";		
		var element = $('[id=' + elementName + ']');
		
		if (element)
			output = element.html();

		return output;
	}



	function activateMarker(markerID, mapID)
	{
		var map = getMap(mapID);

		if (map)
			map.activateMarker(markerID);
	}




	// Map class
	// ------------------------------------------------------------------------------

	function Map(){
		this.markers = new Array;	
		this.startLatitude = 0;
		this.startLongitude = 0;
		this.startScale = 2;
		this.infoHeight = 50;
		this.infoWidth = 50;
		this.component;	
		this.tabs;
	} 



	Map.prototype.render = function(element)
	{
		this.component = new GMap2(element); 
		this.component.addControl(new GLargeMapControl());
		this.component.addControl(new GMapTypeControl());
		this.component.setCenter(new GLatLng(this.startLatitude, this.startLongitude), parseInt(this.startScale));
		this.component.setMapType(G_HYBRID_MAP);

		this.renderMarkers();
	}



	Map.prototype.renderMarkers = function()
	{		
		if (this.markers != undefined){
			for (var i = 0; i < this.markers.length; i++){					
				this.component.addOverlay(this.markers[i].render());
			}					
		}	
	}	



	Map.prototype.createMarker = function(latitude, longitude, markerID, markerData)
	{
		var mapPoint = new GLatLng(latitude, longitude);
		var marker = new MapMarker(mapPoint);
		marker.id = markerID
		marker.map = this;
		marker.markerData = markerData;
		this.markers.push(marker);
	}



	Map.prototype.activateMarker = function(markerID)
	{
		var marker = this.getMarkerByID(markerID);

		if (marker)	{
			GEvent.trigger(marker, "click");
			return false;
		}
	}



	Map.prototype.getMarkerByID = function(markerID)
	{
		var marker = null;
		
		if (this.markers != undefined){
			for (var i = 0; i < this.markers.length; i++){								
				if (this.markers[i].id == markerID)
				{
					marker = this.markers[i].marker;
					return marker;
				}
			}					
		}

		return marker;
	}






	// Marker class
	// ------------------------------------------------------------------------------

	function MapMarker(mapPointIn){
		this.marker;
		this.id;
		this.mapPoint = mapPointIn;	
		this.customMarker = "";
		this.map;
		this.tabContents = new Array();
		this.markerData = "";
	} 



	MapMarker.prototype.render = function()
	{
		if (this.customMarker == ""){
			this.marker = new GMarker(this.mapPoint); 
		}else{
			this.marker = new GMarker(this.mapPoint, getIcon());
		}

		// create tab contents for this marker
		for (var i = 0; i < this.map.tabs.length; i++)
		{
			this.tabContents.push(new GInfoWindowTab(this.map.tabs[i], "<div style='background-color:#ffffff; height:" + this.map.infoHeight + "px; width:" + this.map.infoWidth + "px; overflow:auto; margin-right:9px; float:left;'>" + this.markerData[i] + "</div>"));  
		}

		// create a click handler for this marker
		GEvent.addListener(this.marker, "click", this.createClickHandler(this.clickMarker, this)); 

		//GEvent.addListener(objMarker, "infowindowclose", function() { 
			//objMap.panTo(objMarker.getPoint());  
			//objMap.setCenter(objMarker.getPoint()); } 
		//);  
		
		return this.marker;
	}



	MapMarker.prototype.createClickHandler = function(listener, marker)
	{
		return function()		
		{
			listener(marker);		
		}
	}



	MapMarker.prototype.clickMarker = function(mapMarker)
	{
		mapMarker.map.component.panTo(mapMarker.marker.getPoint());		
		mapMarker.marker.openInfoWindowTabsHtml(mapMarker.tabContents);  
	}




	MapMarker.prototype.getIcon = function()
	{
		var icon = new GIcon();  
		//icon.image = strCustomMarker;  
		//icon.iconSize = new GSize(50, 50);  
		//icon.iconAnchor = new GPoint(1, 50);  
		//icon.infoWindowAnchor = new GPoint(5, 34); 		
		return icon;
	}
-->