// JavaScript to control google map page of IncidentNews

var map;
var numMapMarkers = 0;			// number of incidents on the map overlay (subset of all_markers)
//var showIncident;
//var incident_index;

// these are all parallel arrays: all indexes point to the same incident
var all_markers = new Array();	// master list of all data points (incidents)
var marker_year = new Array();	// year of each incident in all_markers
var marker_info = new Array();	// html info window text for each incident in all_markers

// this is a special dictionary of orr ids with indexes into the arrays above
var marker_ids = new Array();

/*
window.onresize = function()
{
	setMapSize();
}
*/

function initPage()
{
	if (GBrowserIsCompatible())
	{
		map = new GMap2(document.getElementById("map"));
		map.addControl(new GMapTypeControl());
		map.addControl(new GLargeMapControl());
		map.addControl(new GOverviewMapControl());
		
		GEvent.addListener(map, "click", handleMapClick);
		initMapView();
		GDownloadUrl("map_markers", loadMarkers);
	}
}

function exitPage()
{
	// save current map view in session cookies
	var center = map.getCenter();
	var selectbox = document.getElementById("yearpicker");
	
	setCookieData("mapLat", center.lat());
	setCookieData("mapLon", center.lng());
	setCookieData("mapZoom", map.getZoom());
	setCookieData("mapYear", selectbox.options[selectbox.selectedIndex].text);	
	
	GUnload();
}

function initMapView()
{
	// get previous state from cookies
	var lat = getCookieData("mapLat", "38.0000");
	var lon = getCookieData("mapLon", "-100.0000");
	var year = getCookieData("mapYear", "2007");
	var zoom = getCookieData("mapZoom", "3");
	
	setYearControl(year);
	
	var latnum = parseFloat(lat);
	var lngnum = parseFloat(lon);
	var zoomnum = parseInt(zoom);
	map.setCenter(new GLatLng(latnum, lngnum), zoomnum);
}

function handleMapClick(overlay, point)
{
	// Handle user clicks on the map
	// code idea from http://mapki.com/wiki/Marker_Optimization_Tips
	
	// we need a check in case the overlay is the info window
	// only our markers will have a .orr_id property
	
	if (overlay && overlay.orr_id)
	{
		//overlay.openInfoWindowHtml(overlay.orr_id);
		var index = marker_ids[overlay.orr_id];
		overlay.openInfoWindowHtml(marker_info[index]);
	}
	else if (point)
	{
		showClickPt(point);
	}
}

function showClickPt(point)
{
	// show (lat,lon) user's click position on the map
	if (point)
	{
		var latabs = Math.abs(point.y);
		var lngabs = Math.abs(point.x);
		var latdeg = Math.floor(latabs);
		var lngdeg = Math.floor(lngabs);
		var latmin = (latabs - latdeg) * 60;
		var lngmin = (lngabs - lngdeg) * 60;
		var lathem = (point.y > 0) ? "N" : "S";
		var lnghem = (point.x > 0) ? "E" : "W";
						
		var msg = "Click point:&nbsp;";
		msg += latdeg+"&deg; "+latmin.toFixed(2)+"' "+lathem+" ("+point.y.toFixed(6)+")&nbsp;&nbsp;";
		msg += lngdeg+"&deg; "+lngmin.toFixed(2)+"' "+lnghem+" ("+point.x.toFixed(6)+")";
		
		document.getElementById("clickLoc").innerHTML = msg;
	}
}

function yearChange(selectbox)
{
	// called by user selecting from the year picklist
	// we add or remove markers from the map based on the user action
	// (but still maintain a master list of all markers in all_markers[])
	
	var year = selectbox.options[selectbox.selectedIndex].text;
	
	// close any open info window cause the marker for it might go away
	map.closeInfoWindow();
	map.clearOverlays();
	numMapMarkers = 0;
	addMarkers(year);
	document.getElementById("numMarkers").innerHTML = numMapMarkers;
}

function setYearControl(year)
{
	// set the select element in the form to the proper year
	var selectbox = document.getElementById("yearpicker");
	for (var i=0; i < selectbox.length; i++)
	{
		if (year == selectbox.options[i].text)
		{
			selectbox.selectedIndex = i;
			break;
		}
	}
}


/*************************************************************
* Google map marker display code
*************************************************************/

function loadMarkers(data, responseCode)
{
	// called after the asynchronous GDownloadUrl() is 
	// finished getting the data file from the server
	
	// load the data from a tab delimited, return terminated text file
	// miss-named "markers.xml" (I couldn't get the xml stuff to work with
	// html text inside an xml element attribute)
	
	var rows = data.split("\n");
	var rowdata;
	
	//document.getElementById("bug_msg1").innerHTML = responseCode;
	//document.getElementById("bug_msg2").innerHTML = rows.length;
	
	numMapMarkers = 0;
	
	for (var i=0; i < rows.length; i++)
	{
		// ignore any blank lines (like a final, empty line)
		if (rows[i])
		{
			// fields passed are: year, lat, lon, html-snippet
			rowdata = rows[i].split("\t");
			//createMarker(rowdata[0], rowdata[1], rowdata[2], rowdata[3]);
			
			// fields are: orr_id, name, location, date, year, lat, lon, type, cause
			createMarker(rowdata[0], rowdata[1], rowdata[2], rowdata[3], rowdata[4], rowdata[5], rowdata[6], rowdata[7], rowdata[8], rowdata[9]);
			numMapMarkers++;
		}
	}
	
	//document.getElementById("bug_msg3").innerHTML = all_markers.length;
	
	postLoadSetup();
}

function postLoadSetup()
{
	// after the markers have been loaded, we need to:
	// 1. add markers to map for seleted year
	// 2. go to marker if coming from an incident detail page
	
	var orr_id = getSelectedId();
	var index = marker_ids[orr_id];
	var showIncident = false;
	var marker;
	var info;
	var year;
	
	if (index)
	{
		showIncident = true;
		marker = all_markers[index];
		info = marker_info[index];
		year = marker_year[index];
		
		setYearControl(year);
		
		var point = marker.getPoint();
		var zoom = 10;
		map.setCenter(point, zoom);
	}
	else
	{
		var selectbox = document.getElementById("yearpicker");
		year = selectbox.options[selectbox.selectedIndex].text;
	}
	
	numMapMarkers = 0;
	addMarkers(year);
	document.getElementById("numMarkers").innerHTML = numMapMarkers;
	
	if (showIncident)
	{
		marker.openInfoWindowHtml(info);
	}
}

function getSelectedId()
{
	// pulls URL parameter (ala GET forms)
	var orr_id = 0;
	
	if (location.search)
	{
		var urlParams = getUrlParams();
	
		if (urlParams["orr_id"])
		{
			orr_id = urlParams["orr_id"];
		}
	}
	
	return orr_id;
}

function createMarker(orr_id, name, location, date, year, lat, lng, type, cause)
{
	// puts the markers into a master array of all incidents (not on the map)
	// map stuff is done with addMarkers() and removeMarkers()
	
	var point = new GLatLng( parseFloat(lat), parseFloat(lng) );
	//var marker = new GMarker(point);
	//var myicon = new GIcon(G_DEFAULT_ICON, "http://incidentnews.gov:8086/images/marker_brown.png");
	var myicon = new GIcon(G_DEFAULT_ICON, "http://incidentnews.gov/images/marker_brown.png");
	var marker = new GMarker(point, {title:name, icon:myicon});
	
	//marker.myhtml = info;
	marker.orr_id = orr_id;
	
	all_markers.push(marker);
	marker_year.push(parseInt(year));
	
	marker_ids[orr_id] = numMapMarkers;
	
	// build info bubble
	var info = '<a class="recent_name" href="/incident/'+ orr_id +'">'+ name +'</a><br />';
	if (location) info += '<span class="recent_location">'+ location +'</span>&nbsp;&nbsp;&nbsp;&nbsp;';
	if (date) info += '<span class="recent_date">'+ date +'</span>';
	if (type) info += '<br />'+ type;
	if (cause) info += '<br />'+ cause;
	
	marker_info.push(info);
}

function addMarkers(year)
{
	// from our list of all markers, add ones from the specified year
	var yearint = parseInt(year);
	
	//document.getElementById("bug_msg4").innerHTML = "add "+year;
	
	for (var i = 0; i < all_markers.length; i++)
	{
		if (marker_year[i] == yearint)
		{
			numMapMarkers++;
			map.addOverlay(all_markers[i]);
		}
	}
}


/*************************************************************
* URL parameter manipulation (DOM window.location.search)
*************************************************************/

function getUrlParams()
{
	// code from JavaScript Bible, 5th edition (ISBN 0-7645-5743-2)
	
	var results = new Array();
	var input = unescape(location.search.substr(1));
	
	if (input)
	{
		var srchArray = input.split("&");
		var tempArray = new Array();
		for (var i = 0; i < srchArray.length; i++)
		{
			tempArray = srchArray[i].split("=");
			results[tempArray[0]] = tempArray[1];
		}
	}
	
	return results;
}


/*************************************************************
* Cookie manipulation
*************************************************************/

function setCookieData(label, data)
{
	document.cookie = label + "=" + data;
}

function getCookieData(label, defaultValue)
{
	// code from JavaScript Bible, 5th edition (ISBN 0-7645-5743-2)
	// it looks kinda lame, I should rewrite it sometime using data.split(";");
	
	var labelLen = label.length;
	var cEnd;
	var j;
	var i = 0;
	
	if (document.cookie)
	{
		var cookieData = document.cookie;
		var cLen = cookieData.length;
		
		//document.getElementById("bug_msg5").innerHTML = "cookie: " + cookieData;
		
		while (i < cLen)
		{
			j = i + labelLen;
			if (cookieData.substring(i,j) == label)
			{
				cEnd = cookieData.indexOf(";",j);
				if (cEnd == -1) cEnd = cLen;
				return unescape(cookieData.substring(j+1, cEnd));
			}
			i++;
		}
	}

	return defaultValue;
}


/*************************************************************
* resizing test code
*************************************************************/

function setMapSize()
{
	var viewportSize = getViewportSize();
	var bannerSize = getObjectSize("banner");
	var footerSize = getObjectSize("footer");
	var sidebarSize = getObjectSize("sidebar");
	
	var width = viewportSize[0] - sidebarSize[0];
	var height = viewportSize[1] - bannerSize[1] - footerSize[1];
	
	document.getElementById("map").width = width;
	document.getElementById("map").height = height;
}

function getViewportSize()
{
	// function from The Javascript Anthology p.141 (ISBN 0-9752402-6-9)
	var size = [0,0];
	
	if (typeof window.innerWidth != 'undefined')
	{
		size = [window.innerWidth, window.innerHeight];
	}
	else if (typeof document.documentElement != 'undefined'
			&& typeof document.documentElement.clientWidth != 'undefined'
			&& document.documentElement.clientWidth != 0)
	{
		size = [document.documentElement.clientWidth, document.documentElement.clientHeight];
	}
	else // this is used by Win IE 6
	{
		size = [document.getElementsByTagName('body')[0].clientWidth, document.getElementsByTagName('body')[0].clientHeight];
	}
	
	return size;
}

function getObjectSize(id)
{
	var size = [0,0];
	var elem = document.getElementById(id);
	
	if (elem.offsetWidth)
	{
		size = [elem.offsetWidth, elem.offsetHeight];
	}
	else if (elem.clip && elem.clip.width)
	{
		size = [elem.clip.width, elem.clip.height];
	}
	else if (elem.style && elem.style.pixelWidth)
	{
		size = [elem.style.pixelWidth, elem.style.pixelHeight];
	}
	
	return size;
}

