// JavaScript Document
//<![CDATA[
	var map = null;
	Event.observe(window, 'load', load);
	Event.observe(window, 'unload', GUnload);
	var newIcon;
	
	
    function load() {
		if (GBrowserIsCompatible()) {
		   var i = 0;
		  // Create the map
		  // Make sure this element has the same ID as your div
		  var map = new GMap2(document.getElementById("marketmap"));
		  // Add controls for moving and zooming the map.  Use GSmallMapControl for small maps
		  map.addControl(new GLargeMapControl());
		  //map.addControl(new GSmallMapControl());
		  // Add controls for switching between regular and satellite views
		 map.addControl(new GMapTypeControl());
		  // Set the starting position and zoom level when the map loads
		  map.setCenter(new GLatLng(40.4401357, -80.0065613), 9);
		  //map.setMapType(G_SATELLITE_MAP); 
		  
		  
  
		  // Read the data from XML
		  var request = GXmlHttp.create();
		  // Open the XML file
		  //request.open("GET", "map-markers.xml", true);
		  request.open("GET", "http://www.post-gazette.com/pg/xml/200908/farmersmarkets.xml", 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");
			  //alert(markers.length);
			  
			  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 label = markers[i].getAttribute("label");
				var location = markers[i].getAttribute("location");
				var day = markers[i].getAttribute("day");
				var dates = markers[i].getAttribute("dates");
				var specialties = markers[i].getAttribute("specialties");
				var website = markers[i].getAttribute("website");
				var hours = markers[i].getAttribute("hours");
				// Call the function to create the marker
				var marker = createMarker(point,label,location,day,dates,specialties,website,hours);
				//alert(type);
				
				map.addOverlay(marker);
			  }
			}
		  }
		  request.send(null);
		  
		  // Function to create the marker and set up the event window
		  function createMarker(point,label,location,day,dates,specialties,website,hours) {
		  	// Create the HTML text based on the values passed in from XML
			
			var markerhtml = "";
			if (label != "") markerhtml += "<div style='width: 250px;font-family: Arial, Helvetica, sans-serif; font-size:80%;'><strong><span style='font-size:110%;'>" + label + "</span></strong><br>";
			if (location != "") markerhtml += "<strong>Location: </strong>" + location + "<br>";
			if (hours != "") markerhtml += "<strong>Times: </strong>" + hours + "<br>";
			if (day != "") markerhtml += "<strong>Day of week: </strong>" + day + "<br>";
			if (dates != "") markerhtml += "<strong>Dates: </strong>" + dates + "<br>";
			if (specialties != "") markerhtml += "<strong>Notes: </strong>" + specialties + "<br>";
			if (website != "") markerhtml += "<strong>Website: </strong> <a href='" + website + "' target='_blank'>" + website + "</a><br>";
			markerhtml += "</div>";
			
		    
			// Create the map marker
			
			if (day == "Sunday") {//white
				newIcon = MapIconMaker.createMarkerIcon({width: 30, height: 30, primaryColor: "#FFFFFF", cornerColor: "#FFFFFF"});
				}
			else if (day == "Monday") {//blue
				newIcon = MapIconMaker.createMarkerIcon({width: 30, height: 30, primaryColor: "#3333FF", cornerColor: "#3333FF"});
				}
			else if (day == "Tuesday") {//red
				newIcon = MapIconMaker.createMarkerIcon({width: 30, height: 30, primaryColor: "#CC0033", cornerColor: "#CC0033"});
				}
			else if (day == "Wednesday") {//green
				newIcon = MapIconMaker.createMarkerIcon({width: 30, height: 30, primaryColor: "#009900", cornerColor: "#009900"});
				}
			else if (day == "Thursday") {//yellow
				newIcon = MapIconMaker.createMarkerIcon({width: 30, height: 30, primaryColor: "#FFFF00", cornerColor: "#FFFF00"});
				}
			else if (day == "Friday") {//orange
				newIcon = MapIconMaker.createMarkerIcon({width: 30, height: 30, primaryColor: "#FF6600", cornerColor: "#FF6600"});
				}
			else if (day == "Saturday") {//light blue
				newIcon = MapIconMaker.createMarkerIcon({width: 30, height: 30, primaryColor: "#33CCFF", cornerColor: "#33CCFF"});
				}
			else if (day == "Multiple") {//purple
				newIcon = MapIconMaker.createMarkerIcon({width: 30, height: 30, primaryColor: "#9933FF", cornerColor: "#9933FF"});
				}
			var marker = new GMarker(point, {icon: newIcon});
			// Add a click event to each marker which will open the HTML window
			GEvent.addListener(marker, "click", function() {
			   										 
			  marker.openInfoWindowHtml(markerhtml);
			});
			i++;
			return marker;
		  }
		}
		// Javascript alert for older browsers where Google Maps isn't supported
		else {
		  alert("Sorry, the Google Maps API is not compatible with this browser");
		}
	}

    //]]>