//JavaScript
//<![CDATA[

//these are containers for the zipcode search thingies
var XML_MAP = "";
var XML_MAP_ZIP = "";
var XML_MAP_LAT = "";
var XML_MAP_LNG = "";

// this variable will collect the html which will eventually be placed in the side_bar
var side_bar_html = [];
var points = [];
var markers = [];
var infoHtmls = [];
var i = 0;
var icon = [];
var map = [];
var linkarray = [];

function makeIcon() {
    // Create our "smaller" marker icon
	icon = new GIcon();
	icon.image = "http://www.nutradvice.com/dietitians/marker_blue.png";
	icon.shadow = "http://www.nutradvice.com/dietitians/shadow50.png";
	icon.iconSize = new GSize(12, 20);
	icon.shadowSize = new GSize(22, 20);
	icon.iconAnchor = new GPoint(6, 20);
	icon.infoWindowAnchor = new GPoint(5, 1);
}

function makeMap() {
    if (GBrowserIsCompatible()) {
 		map = new GMap2(document.getElementById("map"));
		map.addControl(new GLargeMapControl());
 		map.addControl(new GMapTypeControl());
 		//map.setMapType(G_NORMAL_MAP);
		map.addControl(new GOverviewMapControl());
		//map.addControl(new GSmallMapControl());
		map.setCenter(new GLatLng(XML_MAP_LAT,XML_MAP_LNG), 9);
    }
}

// Open the info box for the specified marker.

function opener(i) {
	//map.recenterOrPanToLatLng(points[i]);
	markers[i].openInfoWindowHtml(infoHtmls[i]);	
}

function openerlegend(j) {
	for (i=0; i<markers.length; i++) {
		if (linkarray[i] == j) {
			opener(i);
		} // if
	} // for
} // opener

// This returns a function closure that calls opener() with the specified arg.
// These functions are necessary because the API left out client-data.
function makeOpenerCaller(i) {
	return function() {
		opener(i);
	}
}

function getMyXml() {
	var request = GXmlHttp.create();
	request.open("GET",XML_MAP, true);
	request.onreadystatechange = function() {
		if (request.readyState == 4) {
			var xmlDoc = request.responseXML;
			var markerElements = xmlDoc.getElementsByTagName("name");
			points = new Array(markerElements.length);
			markers = new Array(markerElements.length);
			infoHtmls = new Array(markerElements.length);
			for (var i = 0; i < markerElements.length; ++i) {
				var name = markerElements[i].firstChild.nodeValue; //works in IE, Firefox, Netscape, and Opera
				var href = markerElements[i].getAttribute ("href");
				var id = markerElements[i].getAttribute ("id");
				var username = markerElements[i].getAttribute ("username");
				var fullname = markerElements[i].getAttribute ("fullname");
				var visibility = markerElements[i].getAttribute ("visibility");
				var blurb = markerElements[i].getAttribute ("blurb");
				var credentials = markerElements[i].getAttribute ("credentials");
				var schools = markerElements[i].getAttribute ("schools");
				var bio = markerElements[i].getAttribute ("bio");
				var specialties = markerElements[i].getAttribute ("specialties");
				var languages = markerElements[i].getAttribute ("languages");
				var location = markerElements[i].getAttribute ("location");
				var image = markerElements[i].getAttribute ("image");
				var distance = markerElements[i].getAttribute ("distance");
				var zip = markerElements[i].getAttribute ("zip");
				var lat = markerElements[i].getAttribute ("lat");
				var lng = markerElements[i].getAttribute ("lng");
				var width = markerElements[i].getAttribute ("width");
				var height = markerElements[i].getAttribute ("height");
				var letter = String.fromCharCode("A".charCodeAt(0) + i); // may be alphabetical?
				points[i] = new GPoint(parseFloat(lng),parseFloat(lat));
				markers[i] = new GMarker(points[i], icon);
				infoHtmls[i] = "<div class='mapbody' style='white-space: nowrap;' align='center' valign='top' >" + "<b>" + name + "</b><br /><br />" + image + "<br /><br />" + "<b>Credentials: </b>" + credentials + "<br /><b>Location: </b>" + location + "<br /><b>Distance: </b>" + distance + " miles<br /><b>Languages: </b>" + languages + "<br /><br />Click for <a href='" + href + "' target='_blank' style='color:#3C8B00'>more info<br /><br /></a></div>";
				// create the marker
				GEvent.addListener(markers[i],'click',makeOpenerCaller(i));
				// make a reference point for the side bar
				//side_bar_html += '<a href="javascript:opener(' + i + ');">' + name + '</a><br>';
				map.addOverlay(markers[i]);
				linkarray[i] = id;
			}
			// put the assembled side_bar_html contents into the side_bar div
	  		document.getElementById("side_bar").innerHTML = side_bar_html;
		}
	}
	request.send(null);
}

function mapLoad() {
	makeIcon();
	makeMap();
	getMyXml();	
}

//]]>