var map;  					// GMap - the google map
var mHash = new Array();	// array - a hash of markers
var dHash = new Array();	// array - a hash of data

var theHighlightedMarker;		// GMarker - the highlighted marker
var highlightedMarkerID = 0;	// int - the ID of the last marker highlighted

var theSelectedMarker;		// GMarker - the selected marker
var selectedMarkerID = 0;	// int - the ID of the last marker "selected"



// longitude is negative because Tacoma roughly 122.5ºW, or -122.5ºE
downtownTacomaLatitude = 47.24730;
downtownTacomaLongitude = -122.44400;
downtownTacomaZoom = 13;

tacomaLatitude = 47.25569;
tacomaLongitude = -122.47112;
tacomaZoom = 12;

southSoundLatitude = 47.10939;
southSoundLongitude = -122.39593;
southSoundZoom = 9;

pugetSoundLatitude = 47.70606;
pugetSoundLongitude = -122.71728;
pugetSoundZoom = 8;

homeLatitude = southSoundLatitude;
homeLongitude = southSoundLongitude;
homeZoom = southSoundZoom;

function zoomDowntownTacoma() {
	map.setCenter(new GLatLng(downtownTacomaLatitude, downtownTacomaLongitude), downtownTacomaZoom);
}

function zoomTacoma() {
	map.setCenter(new GLatLng(tacomaLatitude, tacomaLongitude), tacomaZoom);
}

function zoomSouthSound() {
	map.setCenter(new GLatLng(southSoundLatitude, southSoundLongitude), southSoundZoom);
}

function zoomPugetSound() {
	map.setCenter(new GLatLng(pugetSoundLatitude, pugetSoundLongitude), pugetSoundZoom);
}





var hlMarker = makeIcon("green"); // HighLight
var nMarker = makeIcon("yellow"); // Normal
var sMarker = makeIcon("blue");   // Selected

/* Make an icon based on the folder the icon information is in. */
/* Modification for Holiday Lights map, icons are slightly taller and wider */
function makeIcon(color) {
	var xMarker = new GIcon();
	xMarker = new GIcon();
	xMarker.image = "markers/"+color+"/marker.png";
	xMarker.iconSize = new GSize(20, 34);
	xMarker.shadow = "markers/"+color+"/shadow.png";
	xMarker.printImage = "markers/"+color+"/markerie.gif";
	xMarker.printShadow = "markers/"+color+"/shadowie.gif";
	xMarker.mozPrintImage = "markers/"+color+"/markerff.gif";
	xMarker.mozPrintShadow = "markers/"+color+"/shadowff.gif";
	xMarker.shadowSize = new GSize(37, 34);
	xMarker.iconAnchor = new GPoint(9, 34);
	return xMarker;
}





/* This function runs when the page loads. */
function load() {
  if (GBrowserIsCompatible()) {
	map = new GMap2(document.getElementById("map"));
	map.addControl(new GSmallMapControl());
	map.setCenter(new GLatLng(homeLatitude, homeLongitude), homeZoom);
	
	/* Because of the mouse-over property, you will technically be clicking on "theHighlightedMarker" */
	GEvent.addListener(map, "click", function(marker, point) {
		if (marker) {
			// User clicked on the marker.
			
			// Cover this marker with a second highlight
			theSelectedMarker.setPoint(mHash[highlightedMarkerID].getPoint());
			map.removeOverlay(theSelectedMarker);
			map.addOverlay(theSelectedMarker);
			
			selectedMarkerID = highlightedMarkerID;
			
			document.getElementById("result").innerHTML = makeHTML(dHash[selectedMarkerID]);
			
		}
	});
	
	// Note: theHighlightedMarker does not display until "map.addOverlay(theHighlightedMarker)"
	theHighlightedMarker = new GMarker(new GLatLng(45,-123), {icon: hlMarker});
	
	// Add a hover-off listener
	GEvent.addListener(theHighlightedMarker, "mouseout", function() {
		
		// If a choice has been locked in
		if (selectedMarkerID > 0) {
			// A choice has been locked, default back
			document.getElementById("result").innerHTML = makeHTML(dHash[selectedMarkerID]);
			map.removeOverlay(theHighlightedMarker);
		}
		
	}); // End of "mouseout" function
			
	
	// Note: theHighlightedMarker does not display until "map.addOverlay(theSelected)"
	theSelectedMarker = new GMarker(new GLatLng(45,-123), {icon: sMarker});
	
	displayMarkers();
  }
}






/* Information about GXmlHttp and XmlHttpRequest can be found around half way down
 * the page, by the title "Object Properties" at...
 *    http://developer.apple.com/internet/webcontent/xmlhttpreq.html
 */
function displayMarkers() {
	
	var url = "data.php";
	var request = GXmlHttp.create();
	
	request.open("GET", url);
	
	// This function runs when the data.php is delivered to the page
	request.onreadystatechange = function() {
		
		// 4 = "completed"
		if (request.readyState == 4) {
			
			// "response" contains information from data.php
			var response = request.responseText;
			
			var rows = response.split("\n");
			for (var i=0; i<rows.length-1; i++) {
				
				var record = rows[i];
				var data = record.split("|");
				if (data.length == 16) {
					
					var point = new GLatLng(data[1],data[2]);
					var marker = createMarker(point, data);
					
					mHash[data[0]] = marker;
					dHash[data[0]] = data;
					
					// Add marker to map
					map.addOverlay(marker);
					
				} // End of "if (data.length == 7)"
				
			} // End of "for (var i=0; i<rows.length-1; i++)"
			
		} // End of "if (request.readyState == 4)"
		
	}; // End of "request.onreadystatechange = function()"
	
	request.send(null);
	
}

function createMarker(point, data) {

	// Create the marker
	var marker = new GMarker(point, {icon: nMarker})
	
	// Add a hover listener
	GEvent.addListener(marker, "mouseover", function() {
		
		// Cover this marker with a highlight
		theHighlightedMarker.setPoint(marker.getPoint());
		map.removeOverlay(theHighlightedMarker);
		map.addOverlay(theHighlightedMarker);
		
		highlightedMarkerID = data[0];
		
		document.getElementById("result").innerHTML = makeHTML(data);
		
		// Start of "change color of icon when hovering over marker"
	//	if (theHighlightedMarker == null) {
	//		theHighlightedMarker = new GMarker(point, {icon: hlMarker}); (2nd)
			
	//	} else {
	//		
	//	}
		// End of "change color of icon when hovering over marker"
		
		// Display the (now hidden) marker's message
	//	
		
	}); // End of "mouseover" function

/*
	// Add a hover-off listener
	GEvent.addListener(marker, "mouseout", function() {
		
		if (highlightedMarkerID > 0) {
			// A choice has been locked, default back
			GEvent.trigger(mHash[highlightedMarkerID], "mouseover", null);
		}
		
	}); // End of "mouseout" function
	
	asdf
*/
	return marker;
	
}





/* Forms an array of information into HTML.
 * data - an array containing information about a specific event
 * returns a string containing the HTML form of the data
 */
function makeHTML(data) {
	
	var result = "";
	
	// Read comments in data.php for explanation of data[] array
	result += "<p><b>Group:</b> "+data[3]+"</p>";
	result += "<p><b>Project:</b> "+data[4]+"</p>";
	result += "<p><b>Location:</b> "+data[5]+"</p>";
	result += "<p><b>Dates and Times:</b> "+data[6]+"</p>";
	
	if (data[7] != "") {
		result += "<p><b>Phone Number:</b> "+data[7]+"</p>";
	}
	
	if (data[8] != "") {
		result += "<p><b>Email:</b> <a href=\"mailto:"+data[8]+"\">"+data[8]+"</a></p>";
	}
	
	if (data[9] != "") {
		result += "<p><b>Website:</b> <a href=\""+httpFront(data[9])+"\" target=\"_blank\">"+makeShort(data[9])+"</a></p>";
	}
	
	// If there is a photo, create a table.
	if (data[10] + data[11] + data[12] != "") {
		result += "<table><tr>";
		result += photoLink(data[10], data[13]);
		result += photoLink(data[11], data[14]);
		result += photoLink(data[12], data[15]);
		result += "</tr></table>";
		result += "<p>Click a thumbnail to view a larger image.</p>";
		result += "<p><div id=\"photo_caption\"></div></p>";
	}
	
	return result;
}

/* Given the name of a photo, make a link to that photo. */
function photoLink(photo, caption) {
	var result = "";
	
	if (photo != "") {
		result += "<td>";
		result += "<a href=\"photo.php?photo="+photo+"\" target=\"_blank\" onmouseover='showPhotoCaption(\""+caption+"\")'>";
		result += "<img src=\"uploads/thumb/"+photo+"\" alt=\"(Photo)\" />";
		result += "</a>";
		result += "</td>";
	}
	
	return result;
}

function showPhotoCaption(caption) {
	document.getElementById("photo_caption").innerHTML = caption;
}

/* Return a shorter version of the URL for display purposes */
function makeShort(url) {
	
	var results = url;
	
	var httpslashes = url.indexOf("//");
	if (httpslashes > 0) {
		results = results.substring(httpslashes+2);
	}
	
	var nextslash = results.indexOf("/");
	if (nextslash == -1) {
		return results;
	} else {
		return results.substring(0, nextslash);
	}
}

/* Put "http://" in front of a URL if necessary */
function httpFront(url) {
	
	if (url.indexOf("http://") == 0) {
		return url;
	} else {
		return "http://" + url;
	}
}