var marker = new Array(10);
var map;
var basedir="/greenspace/";

var markerPoints = new Array();

function truncate(x, len) {
	if(x.length>len) {
		return x.substring(0,len);
	}
	return x;
}

function round(num, d) {
	n = Math.pow(10, d);
	return Math.round(num*n)/n;
}

function getSelectValue(id) {
	var select = document.getElementById(id);
	return select.options[select.selectedIndex].value;
}

function getChildData(parent, name) {
	return parent.getElementsByTagName(name)[0].firstChild.data;
}

// Add marker to map with bubble
function createMarker(map, point, icon, html) {
	if(pointExists(point)) {
		return;
	}
	var marker = new GMarker(point, icon);
	markerPoints.push(point);
	GEvent.addListener(marker, "click", function() {
		marker.openInfoWindowHtml(html);
	});
	map.addOverlay(marker);
}

// True if there is a marker for the point on the map
function pointExists(point) {
	for(var x = 0;x<markerPoints.length;x++) {
		if(markerPoints[x].distanceFrom(point)<700) {
			return true;
		}
	}
	return false;
}

function popupChart(type, data, lat, lng) {
	window.open('ChartPopup.html?type='+type+'&data='+data,'','width=800,height=450,toolbar=1,menubar=1,location=1,resizable=1');
}
function popupAreaChart(name) {
	popupChart("area", name);
}
function popupEmissionChart(name) {
	popupChart("emission", name);
}

function popupTodo(param) {
	window.open('todo.html?'+param, '', 'width=800,height=700,scrollbars=1,toolbar=1,menubar=1,location=1,resizeable=1');
}
function areaTodo(areaname) {
	popupTodo('areaname='+areaname);
}
function commentTodo(id) {
	popupTodo('commentid='+id);
}
function emissionTodo(id) {
	popupTodo('emid='+id);
}

// Load map data with parameters and display results as markers
function loadMarkers(url, maxMarkers, zoom, centerMap, areaname, clearMarkers) {
	document.getElementById("status").innerHTML = "Loading...";
	GDownloadUrl(url, function(data, responseCode) {
		if(clearMarkers) {
			map.clearOverlays();
			markerPoints = new Array();
		}
		var areaSelect = '<option value="all">All Areas</option>';
		var xml = GXml.parse(data);
		var areas = xml.documentElement.getElementsByTagName("area");
		var i;
		for(i = 0;i<areas.length; i++) {
			var name = getChildData(areas[i], "name");
			var latitude = getChildData(areas[i], "latitude");
			var longitude = getChildData(areas[i], "longitude");
			var emission = getChildData(areas[i], "emission");
			var band = getChildData(areas[i], "band");

			if(zoom) {
				name = round(name, 2);
			}
			var lat = round(latitude, 4);
			var lng = round(longitude, 4);
			emission = round(emission, 2);

			// HTML for bubble
			var html = "";
			if(zoom) {
				html += '<h3><a href="javascript:popupEmissionChart('+name+')">'+emission+' t/1x1km</a></h3>';
			} else {
				html += '<h3><a href="javascript:popupAreaChart(\''+name+'\')">'+name+'</a></h3>';
			}
			html += '<b>Latitude:</b> ' + lat + '<br/>';
			html += '<b>Longitude:</b> ' + lng + '<br/>';
			if(!zoom) {
				html += '<b>Average Emission:</b> ' + emission + ' t/1x1km<br/>';
			}
			html += '<br/>'
			if(zoom) {
				html += '<a href="javascript:zoomOut()">Zoom Out</a><br/><br/>';
				html += '<a href="javascript:emissionTodo(\'' + name + '\')">View Todo</a><br/>';
				html += '<a href="javascript:popupEmissionChart('+name+')">View Chart</a>';
			} else {
				html += '<a href="javascript:areaGo(\'' + name + '\', 1)">Zoom In</a><br/><br/>';
				html += '<a href="javascript:areaTodo(\'' + name + '\')">View Todo</a><br/>';
				html += '<a href="javascript:popupAreaChart(\''+name+'\')">View Chart</a>';
			}

			// Icon to use for marker
			var icon = marker[band];

			// Add Marker
			if(i<maxMarkers) {
				latlng = new GLatLng(lat, lng);
				if(i==0 && centerMap) {
					if(areaname=="all") {	
						map.setCenter(0, 5);
					} else {
						map.setCenter(latlng, 10);
					}
				}
				createMarker(map, latlng, icon, html);
			}
		}
		document.getElementById("status").innerHTML = "&nbsp;";
	});
}

// Start of program
function load() {
	if(GBrowserIsCompatible()) {
		// create map
		map = new GMap2(document.getElementById("map"));
		map.setCenter(new GLatLng(55, -5), 5);
		map.addControl(new GLargeMapControl());
		map.addControl(new GMapTypeControl());

		// create icons
		for(x = 0;x<10;x++) {
			marker[x] = new GIcon(G_DEFAULT_ICON);
			marker[x].image = basedir+"marker"+(x+1)+".png";
		}

		// Load initial view
		zoomOut();

		GEvent.addListener(map, "click", function(marker, point) {
			var checkSelect = document.getElementById("clickCheck");
			if(!marker && checkSelect.checked) {
				// Add new marker for areas closest to the point that is clicked
				var scaleselect = document.getElementById("scaleSelect");
				var lat = point.lat();
				var lng = point.lng();
				var cat = getSelectValue("catSelect");
				var scale = parseInt(scaleselect.options[scaleselect.selectedIndex].value);
				var normal = getSelectValue("normalSelect");
				var url = "listNearestArea.xml?latitude="+lat+"&longitude="+lng+"&cat="+cat+"&zoom="+scale+"&normal="+normal;
				loadMarkers(url, 1, scale, 0, "", 0);
			}
		});
	}
	else
	{
		// Browser not supported
		var html = '<p>Sorry, your browser is not supported by google maps. Please see '; 
		html += '<a href="http://local.google.com/support/bin/answer.py?answer=16532&topic=1499">';
		html += 'Browser Compatibility</a></p>';
		//document.getElementById("map").innerHTML = html;
	}
}

// Display areas on a zoomed out map
function zoomOut() {
	// Set area to 'all' and scale to 'Area'
	var areaSelect = document.getElementById("areaSelect");
	if(areaSelect) {
		areaSelect.selectedIndex = 0;
	}

	var scaleselect = document.getElementById("scaleSelect");
	scaleselect.selectedIndex = 0;

	// Load map
	areaGo("", 1);
}

// Load an area using the filter options
function areaGo(areaname, centerMap) {
	var scaleselect = document.getElementById("scaleSelect");
	var areaselect = document.getElementById("areaSelect");
	if(areaname=="") {
		// No area name passed in, get from select box
		areaname = "all";
		if(areaselect) {
			areaname = areaselect.options[areaselect.selectedIndex].value;
		}
	} else {
		// User clicked zoom in, set area select to match areaname
		for(i = 0;i<areaselect.length;i++) {
			if(areaselect.options[i].value == areaname) {
				areaselect.selectedIndex = i;
			}
		}
		// Zoom in and center
		scaleselect.selectedIndex = 1;
		centerMap = 1;
	}
	var scale = parseInt(scaleselect.options[scaleselect.selectedIndex].value);

	var cat = getSelectValue("catSelect");
	var show = getSelectValue("showSelect");
	var filter = getSelectValue("filterSelect");
	var normal = getSelectValue("normalSelect");

	var url = "listAreas.xml?areaname="+areaname+"&zoom="+scale+"&filter="+filter+"&cat="+cat+"&normal="+normal+"&show="+show;
	loadMarkers(url, show, scale, centerMap, areaname, 1);
}
