// JavaScript Document
var states_url = "xml/states.xml";
var centers_url = "xml/centers.xml?id="; 	//	to this url will be added the id value from the state's xml id attribute

//-----------------------------------

var tooltip = document.createElement("div");
tooltip.id = "tooltip";
tooltip.style.visibility="hidden";


function createMarker222(point,html) {
        var marker = new GMarker(point);
        GEvent.addListener(marker, "click", function() {
          marker.openInfoWindowHtml(html);
        });
        return marker;
}

function myZoomOut()
{
	initCustomGoogleMap('states',null,true);
}

var zoomout = document.createElement("div");
zoomout.innerHTML = '<div class="zoom"><a href="javascript:myZoomOut();" ><img src="images/bt_back.gif" width="64" height="22" border="0" /></a></div>';
/* zoomout.style.visibility="hidden"; */

function createMarker(point,tip,html,id, zoom) 
{
	
	if (window.level == 'states')
	{
		var icon = new GIcon(G_DEFAULT_ICON, "images/map_indicator.gif");
		icon.shadow = "images/map_indicator_25x35.png";
		icon.iconSize=new GSize(25,25);
		icon.iconAnchor=new GPoint(12,12);
		
		var marker = new GMarker(point, icon);
		marker.tooltip = tip;
		
		GEvent.addListener(marker, "click", function() {
			state_marker_click(id, point, zoom);
		});
		GEvent.addListener(marker,"mouseover", function() {
			showTooltip(marker);
		});      
		GEvent.addListener(marker,"mouseout", function() {
			tooltip.style.visibility="hidden"
		});
		
		return marker;
	}
	else if (window.level == 'centers')
	{
		var icon = new GIcon(G_DEFAULT_ICON, "images/markerX.png");
		var marker = new GMarker(point, icon);		
		marker.tooltip = tip;
		
		
		GEvent.addListener(marker, "click", function() {
      setTimeout('zoomout.style.visibility="hidden"',0); 
			marker.openInfoWindowHtml(html);
		});

		GEvent.addListener(marker,"mouseover", function() {
			showTooltip(marker);
		});      
		GEvent.addListener(marker,"mouseout", function() {
			tooltip.style.visibility="hidden"
		});
		
		return marker;
	}
	
}

function state_marker_click(id, point, zoom)
{
	initCustomGoogleMap('centers', id);
	var zoom1 = zoom * 1;;
	map.setCenter(point, zoom1);
	/*alert("zoom71="+zoom1);*/
	
}

function showTooltip(marker) 
{
	tooltip.innerHTML = marker.tooltip;
	var point=map.getCurrentMapType().getProjection().fromLatLngToPixel(map.fromDivPixelToLatLng(new GPoint(0,0),true),map.getZoom());
	var offset=map.getCurrentMapType().getProjection().fromLatLngToPixel(marker.getPoint(),map.getZoom());
	var anchor=marker.getIcon().iconAnchor;
	var width=marker.getIcon().iconSize.width;
	var height=tooltip.clientHeight;
	var pos = new GControlPosition(G_ANCHOR_TOP_LEFT, new GSize(offset.x - point.x - anchor.x + width - 45, offset.y - point.y -anchor.y -height)); 
	pos.apply(tooltip);
	tooltip.style.visibility="visible";
}

function initCustomGoogleMap(level, id, starting)
{
	if (level != 'states')
		var loadXML = centers_url + id;
	else
		var loadXML = states_url;
	
	tooltip.style.visibility="hidden";
	window.level = level;
	
	if (starting)
		window.map = new GMap2(document.getElementById("map"));
	
	map.clearOverlays();
	/*map.addControl(new GSmallMapControl());*/

	map.getPane(G_MAP_FLOAT_PANE).appendChild(tooltip);
	
	var request = GXmlHttp.create();
	request.open("GET", loadXML, true);
	request.onreadystatechange = function() 
	{
		if (request.readyState == 4) 
		{
			if (level == 'states')
			{
				if (!starting)
					map.removeControl(mapControl);
			}
			else if (level == 'centers')
			{
				window.mapControl = new GLargeMapControl();
				map.addControl(mapControl);
				GEvent.addListener(map, "zoomend", function() {
					  var zoom = map.getZoom();
					  if (zoom <= 4)
					  	initCustomGoogleMap('states');
					
				})
			}
				
			
			
			var xmlDoc = request.responseXML;
			var markers = xmlDoc.documentElement.getElementsByTagName("marker");
			for (var i = 0; i < markers.length; i++) 
			{
				var lat = parseFloat(markers[i].getAttribute("lat"));
				var lng = parseFloat(markers[i].getAttribute("lng"));
				var zoom = markers[i].getAttribute("zoom");
				var id = markers[i].getAttribute("id");
				var point = new GLatLng(lat,lng);			
				/*document.getElementById("message").innerHTML = id.toString();*/
				if (level == 'states')
				{
					var tip = markers[i].getAttribute("title");
					map.setCenter(new GLatLng(38,-95),4);
					var html = "";
				}
				else if (level == 'centers')
				{				
					var tip = markers[i].getElementsByTagName("title")[0].firstChild.data;
					var content = markers[i].getElementsByTagName("content")[0].firstChild.data;
					var seemore = markers[i].getElementsByTagName("googlemaps")[0].firstChild.data;
					var html = '<div id="donor_center"><div id="content"><h1>'+tip+'</h1>';
					html += content + '<br /><br><table width="421" border="0" cellpadding="3" cellspacing="3" bgcolor="#DFDEDE" id="schedule">';
					html += '<tr><th>Sunday</th><th>Monday</th><th>Tuesday</th><th>Wednesday</th><th>Thursday</th><th>Friday</th><th>Saturday</th></tr><tr>';
					
					var hours1 = markers[i].getElementsByTagName("hours1")[0].firstChild.data;
					hours1 = hours1.split("|");
					var hours2 = markers[i].getElementsByTagName("hours2")[0].firstChild.data;
					hours2 = hours2.split("|");
					
					for(var j = 0 ; j < hours1.length ; j++)
					{
						html += '<td>' + hours1[j] + '</td>';
					}
					
					html += '</tr><tr>';
					 
					for(var j = 0 ; j < hours2.length ; j++)
					{
						html += '<td>' + hours2[j] + '</td>';
					}
					
					html += '</tr></table>';
					html += '<a href="http://maps.google.com/maps?f=q&amp;q='+seemore+'" target="_blank"><img src="images/see_more_on_google_maps.gif" alt="Advanced Search on Google Maps" width="421" height="28" border="0" /></a>';
					html += '</div>';
					
					
				}
				
				// create the marker
				var marker = createMarker(point,tip, html, id, zoom);
				map.addOverlay(marker);
			}
			
			if (level == 'centers')
			{
				map.getContainer().appendChild(zoomout);
				var pos = new GControlPosition(G_ANCHOR_TOP_LEFT, new GSize(10,15));  
				pos.apply(zoomout);
				
				GEvent.addListener(map,"infowindowclose", function() {
          zoomout.style.visibility="visible";
        });
		
			}
			
		}
	}
	
	request.send(null);
}

function zoomInHere(zLat, zLng) {
        map.setCenter(new GLatLng(zLat, zLng),16);
		map.closeInfoWindow()
}