/** 
 * By Andrei Scheinkman http://andreischeinkman.com
 * Design, data and code are licensed under a Creative  
 * Commons Attribution-NonCommercial 2.5 License. See 
 * http://creativecommons.org/licenses/by-nc/2.5/
 **/

var map;

function onLoad() 
{
	if ( ! GBrowserIsCompatible() ) {
		showMessage("Sorry, Google Maps doesn't work with your browser.");
		return;
	}

	// Create the map
	map = new GMap(document.getElementById("map"));
	map.addControl(new GLargeMapControl());
	map.addControl(new GMapTypeControl());
	
	// Center the map on Chicago
	map.centerAndZoom(new GPoint(-87.62909889221191, 41.886432216946986), 3);

	// Ping the server
	var request = GXmlHttp.create();
	request.open("GET", "ping.php", true);
	request.send(null);

	// Draw bike routes
	loadExistingLanes();
}


/** Bike lanes, trails, and routes **/

PATH_COLOR = "#00cc00" ; 
PROPOSED_LANE_COLOR = "#3333cc" ; 
EXISTING_LANE_COLOR = "#0000cc" ; 
REC_ROUTE_COLOR = "#663366" ;
LINE_THICKNESS = 4 ;
LINE_OPACITY = 0.85 ;

function loadExistingLanes()
{
	showMessage("Loading bike lanes...");
	
	var request = GXmlHttp.create();
	request.open("GET", "data/existinglanes.xml", true);
	request.onreadystatechange = function() {
		if (request.readyState == 4) {
			addLines(request.responseXML, EXISTING_LANE_COLOR);
			loadProposedLanes();			
		}
	};
	request.send(null);
}

function loadProposedLanes()
{
	showMessage("Loading more bike lanes...");
	var request = GXmlHttp.create();
	request.open("GET", "data/proposedlanes.xml", true);
	request.onreadystatechange = function() {
		if (request.readyState == 4) {
			addLines(request.responseXML,PROPOSED_LANE_COLOR);
			loadPaths();				
		}
	};
	request.send(null);
}

function loadPaths()
{
	showMessage("Loading offstreet bike paths...");
	var request = GXmlHttp.create();
	request.open("GET", "data/existingoffstreet.xml", true);
	request.onreadystatechange = function() {
		if (request.readyState == 4) {
			addLines(request.responseXML,PATH_COLOR);
			loadRoutes();				
		}
	};
	request.send(null);
}

function loadRoutes()
{
	showMessage("Loading recommended routes...");
	var request = GXmlHttp.create();
	request.open("GET", "data/routes.xml", true);
	request.onreadystatechange = function() {
		if (request.readyState == 4) {
			addLines(request.responseXML, REC_ROUTE_COLOR);
			showMessage("");
		}
	};
	request.send(null);
}

function addLines(xmlDoc, color)
{
	var lines = xmlDoc.documentElement.getElementsByTagName("line");
	for (var i = 0; i < lines.length; i++) {
		var gpoints = parsePoints(lines[i].getElementsByTagName("point")); 
		map.addOverlay(new GPolyline(gpoints, color, LINE_THICKNESS, LINE_OPACITY));
	}
}

function parsePoints( points )
{
	var gpoints = [];
	for (var j=0; j<points.length; j++) {
		var lng = parseFloat(points[j].getAttribute("lng"));
		var lat = parseFloat(points[j].getAttribute("lat"));
		var gpoint = new GPoint(lng,lat);
		gpoints.push(gpoint);
	}
	return gpoints;
}


/** Address lookup (geocoding) **/

function go()
{
	var addr = $('geocode_form').geocode_address.value ;
		 
	if ( ! addr ) {
		return ; 
	}
	$('geocode_search_button').disabled = true; 
	showMessage("Looking up \"" + addr + "\"");
	
	var url = "proxy.php?" + encodeURI("http://api.local.yahoo.com/MapsService/V1/geocode?appid=chicagobikemap&city=chicago&state=IL&street=" + addr );

	var request = GXmlHttp.create();
	request.open("GET", url, true);
	request.onreadystatechange = function() {
		if (request.readyState == 4) {
			var xmlDoc = request.responseXML;
			var lats = xmlDoc.documentElement.getElementsByTagName("Latitude");
			var lngs = xmlDoc.documentElement.getElementsByTagName("Longitude");
			if (lats.length == 0) {
				showErrorMessage("Can't find \"" + addr + "\"");
				showMessage("");
			}
			else {
				var lng = lngs[0].firstChild.nodeValue;
				var lat = lats[0].firstChild.nodeValue;
				showMessage( "Moving to " + addr );
				map.recenterOrPanToLatLng(new GPoint(lng,lat), 1);
				
				var html = '<div style="margin-top: 10px; font-size: small; width: 200px; ">';
				html += addr;
				html += '</div>';
				
				addMarker(lng,lat,html);
				showMessage("");
			}
			$('geocode_search_button').disabled = false; 
		}
	}
	request.send(null);
}

function addMarker(lng, lat, html)
{
	var point = new GPoint(lng,lat);
	
	var icon = new GIcon();
	icon.image = "images/mm_20_red.png";
	icon.iconSize = new GSize(12, 20);
	icon.iconAnchor = new GPoint(6, 20);
	icon.infoWindowAnchor = new GPoint(5, 1);
	
	var marker = new GMarker(point, icon);
	map.addOverlay(marker);
	marker.openInfoWindowHtml(html);
	GEvent.addListener(marker, "click", function() {
		marker.openInfoWindowHtml(html);
	});			
}


/** Bike shops **/

var shopsLoaded = false ; 

function loadShops()
{
	if (shopsLoaded) {
		return;
	}
	
	showMessage("Loading bike shops...");
	var request = GXmlHttp.create();
	
	// Fetch data (for now, grab my copy of the data.)
	// TODO: fix proxy to fetch data straight from www.chicagobikeshops.info/bikeshopDataXML.php
	var url = "data/bikeshops.xml";
	request.open("GET", url, true);
	request.onreadystatechange = function() {
		if (request.readyState == 4) {
			var xmlDoc = request.responseXML;
			var markers = xmlDoc.documentElement.getElementsByTagName("shop");
			for (var i = 0; i < markers.length; i++) {
				createShopMarker(markers[i]);
			}
			showMessage("");
		}
		shopsLoaded = true ; 
		
		// Hide button and show bike shop key
		$('show_shops_button').style.display = "none"
		$("shop_key").style.display = "inline"; 
	};
	request.send(null);
}

function createShopMarker(element) 
{
	var icon = new GIcon();
	icon.image = "images/mm_20_yellow.png";
	icon.iconSize = new GSize(12, 20);
	icon.iconAnchor = new GPoint(6, 20);
	icon.infoWindowAnchor = new GPoint(5, 1);

	var point = new GPoint(element.getAttribute("long"), element.getAttribute("lat"));
	var marker = new GMarker(point, icon);
	
	// Don't show infoWindows in Safari, since Safari bug causes to crash.
	if ( navigator.userAgent.indexOf('Safari') == -1 )
	{
		GEvent.addListener(marker, "click", function() {
			map.recenterOrPanToLatLng(point);
			marker.openInfoWindowHtml(
				createShopInfoWindowHTML(
					element.getAttribute("shopid"), 
					element.getAttribute("name"), 
					element.getAttribute("address"), 
					element.getAttribute("phone"), 
					element.getAttribute("hours")
				)
			);
		});
	}
	map.addOverlay(marker);
}

function createShopInfoWindowHTML(id, name, address, phone, hours)
{
	var html = '<img width="220" style="width: 220px; height: 160px; float: top; "';
	html += 'src="http://www.chicagobikeshops.info/shopphotos/' + id + '/main.jpg" />';
	html += '<div style="margin-top: 10px; font-size: small; ">';
	html += '<b>' + name + '</b><br/>';
	html += address + " / " + phone;
	html += '</div>';

	return html;
}


/** Utility functions **/

function showErrorMessage(str) 
{
	$("indicator").style.display = (str.length == 0) ? "none" : "inline"; 
	$("message").innerHTML = str;
}

function showMessage(str) 
{
	$("indicator").style.display = (str.length == 0) ? "none" : "inline"; 
	$("message").innerHTML = str;
}