﻿/**************************************************************************************************
* Google Map Functions
*/
var mapLoading = null, mapLegend = null, mapListOn = false, walkBounds = null, loadCounter = 0;

function MapSetup(mapMode) {
	//Create the Google map object.
	if (googleMap != null) {
		return;
	}
	
	var mapContainer = Get('mapContainer');
	var mapDiv = Get('mapDiv');
	var googleDiv = Get('googleMap');
	
	//See if the location list is turned on.
	mapListOn = (GetUrlParam('list') == '1' ? true : false);
		
	mapSpokane = new google.maps.LatLng(47.672323, -117.403679);
	
	var mapOptions = {
		zoom: 11,
		center: mapSpokane,
		mapTypeControl: false,
		navigationControlOptions: { style: google.maps.NavigationControlStyle.SMALL },
		mapTypeId: google.maps.MapTypeId.ROADMAP
	};
	
	googleMap = new google.maps.Map(googleDiv, mapOptions);
	mapBounds = new google.maps.LatLngBounds();
	mapInfoWindow = new google.maps.InfoWindow();
	mapLocations = new MapLocations();
	
	//Create the loading message
	mapLoading = new MapControl( {
			pos: google.maps.ControlPosition.TOP_RIGHT,
			width: 135, height: 35,
			message: '<div style="font-weight:bold; margin:7px 10px">Loading map...</div>'
		}, 
		googleMap
	);
	
	//Add the map legend.
	mapLegend = new MapControl( {
			pos: google.maps.ControlPosition.TOP_LEFT, 
			width: 300, //height: 50,
			header: '',
			message:
				'<div class="mapLegend">' +
				'	<div>' +
				'		<span><img src="/StaffDirectory/images/Maps/bus.gif" style="margin-right:2px" />Bus Stops</span>' +
				'		<span style="margin-left:10px"><img src="/StaffDirectory/images/Maps/crosswalk.png" style="margin-right:2px" />Cross Walks</span>' +
				'		<span style="margin-left:10px"><img src="/StaffDirectory/images/Maps/legend_busarea.gif" style="margin-right:2px" />Bus Area</span>' +
				'	</div>' +
				'	<div>' +
				'		<img src="/StaffDirectory/images/Maps/legend_walkroute.gif" style="margin-right:2px" />Suggested Walk Routes' +
				'		<span style="margin-left:20px"><a href="#" onclick="MapZoomWalkingToggle(this); return false" zoomToggle="0">Zoom In</a></span>' +
				'	</div>' +
				'</div>'
		},
		googleMap 
	);
}

//Show a location on the map.
function MapShowLoc(locID) {
	MapClear();
	
	//See if this location is already loaded.
	var foundLoc = mapLocations.Get(locID);
	
	if (foundLoc != null) {
		//If it was found, turn it on.
		foundLoc.Show(true, true);
		mapBounds.extend(foundLoc.Corners.nw);
		mapBounds.extend(foundLoc.Corners.se);
		MapCheckBounds();
		return;
	}
	
	//The location is not on the map, so we need to add it.
	new Ajax.Request('/StaffDirectory/Map.aspx', {
		method: 'get',
		parameters: { m: 'load', loc: locID },
		onSuccess: function(result) {
			var data = eval('(' + result.responseText + ')');
			
			if (data.status != 'success') {
				SPS_DEBUG.Add(data.message);
				return;
			}
			
			mapLocations.AddArray(data.locs);
		},
		onFailure: function(response) {
			SPS_DEBUG.Add(response.responseText);
		}
	});
}

function MapLocLoaded(mapLoc) {
	mapBounds.extend(mapLoc.Marker.getPosition());
	
	if (mapLoc.HasCorners) {
		mapBounds.extend(mapLoc.Corners.nw);
		mapBounds.extend(mapLoc.Corners.se);
	}
	
	if (mapListOn) {
		MapListToggle(mapLoc, true);
	}
	
	var showStuff = (mapLocations.totalActive == 1);
	mapLoc.Show(showStuff, showStuff);
	
	MapCheckBounds();
}

//Clears the map's boundaries, markers, and map extends, then relocates on Spokane.
function MapClear() {
	mapBounds = new google.maps.LatLngBounds();
	walkBounds = null;
	mapLocations.HideAll();
	googleMap.setCenter(mapSpokane);
	mapLoading.Hide();
}

//Moves the map to show all of the loaded locations.  Also shows or hides the map legend.
function MapCheckBounds() {
	if (mapLocations.AllLoaded()) {
		if (mapLocations.TotalActive() > 1) {
			mapLegend.Hide();
		}
		else {
			//If we only have one locations showing and it has shapes (crosswalks, etc), show the map legend.
			var loc = mapLocations.GetActive()[0];
			
			if (loc.Shapes.length > 0)
				mapLegend.Show();
			else
				mapLegend.Hide();
		}
		
		googleMap.fitBounds(mapBounds);
		mapLoading.Hide();
	}
}

function MapZoomToggle(link, outZoom, inZoom) {
	if (link.getAttribute("zoomToggle") == "0") {
		link.innerHTML = "Zoom Out";
		link.setAttribute("zoomToggle", "1");
		googleMap.setZoom(inZoom);
	}
	else {
		link.innerHTML = "Zoom In";
		link.setAttribute("zoomToggle", "0");
		googleMap.setZoom(outZoom);
	}
}

//Find the northwest and southeast corner of all the crosswalk and walking routes shapes, then zoom in on it.
function MapZoomWalkingToggle(link) {
	if (link.getAttribute("zoomToggle") == "0") {
		link.setAttribute("zoomToggle", "1");
		link.innerHTML = "Zoom Out";
		
		if (mapLocations.totalActive == 1) {
			if (walkBounds == null) {
				var mapLoc = mapLocations.GetActive()[0];
				
				walkBounds = new google.maps.LatLngBounds();

				for (var i = 0; i < mapLoc.Shapes.length; i++) {
					var shape = mapLoc.Shapes[i];
					
					if (shape.shapeContent != 'cw' && shape.shapeContent != 'wr')
						continue;

					var path = shape.getPath();
					
					path.forEach(function(point, index) {
						walkBounds.extend(point);
					});
				}
			}

			if (!walkBounds.isEmpty()) {
				googleMap.fitBounds(walkBounds);
			}
		}
	}
	else {
		link.setAttribute("zoomToggle", "0");
		link.innerHTML = "Zoom In";
		googleMap.fitBounds(mapBounds);
	}	
}

function MapLocHtml(locData) {
	var currentZoom = googleMap.getZoom();
	var html = 
		'<div style="text-align:left">' +
		'	<div style="font-weight:bold">' + locData.Title + '</div>' + 
		'	<div id="endAddress">' + locData.Address + '</div>' +
		'	<div style="margin-top:8px">' +
		'		<a id="mapZoomLink" href="#" onclick="MapZoomToggle(this,11,' + currentZoom + '); return false" zoomToggle="1">Zoom Out</a>' + 
		'	</div>' +
		'	<div style="margin-top:8px">Get directions:</div>' +
		'	<input id="startAddress" type="text" class="spsFormField" style="width:150px" onkeyup="return MapDirectionsKeyup(event)">' +
		'	<input type="button" value="Go" class="spsFormField" onclick="javascript:MapGetDirections()" />' +
		'</div>';
	
	return html;
}

function MapShapeHtml(title, content) {
	var currentZoom = googleMap.getZoom();
	var html =
		'<div style="text-align:left">' +
		'	<div style="font-weight:bold">' + title + '</div>' +
		'	<div style="margin:10px 0">' + content + '</div>' +
		'	<div style="margin-bottom:15px"><a id="mapShapeZoomLink" href="#" onclick="MapZoomToggle(this,' + currentZoom + ',16); return false" zoomToggle="0">Zoom In</a></div>' +
		'</div>';
	
	return html;
}

function MapListToggle(locData, hilite) {
	var link = FindControl('list_' + locData.LocID, 'a');
	if (link == null)
		return;
	
	var linkDiv = link.parentNode;
	
	if (hilite) {
		linkDiv.style.backgroundColor = locData.MapColor;
	}
	else {
		linkDiv.style.backgroundColor = '';
	}
}

//Called when a key is typed in the directions form fields.  Detects the "enter" key for a form submit.
function MapDirectionsKeyup(ev) {
	var eo = (window.event ? window.event : ev);
	
	if (eo.keyCode == 13) {
		MapGetDirections();
		return false;
	}
	
	return true;
}

function MapGetDirections() {
	//f=d	Show directions form
	//sll=	The lat/lng coordinates for the center of the search (Spokane).
	var url = "http://maps.google.com/maps?&f=d&&sll=47.653544,-117.411263";
	var startAddress = Get("startAddress").value;
	var endAddress = Get("endAddress").innerHTML;
	
	endAddress = endAddress.replace(/<br>/g, ", ");
	url += "&saddr=" + startAddress + "&daddr=" + endAddress
	
	if (parent)
		parent.location.href = url;
	else
		location.href = url;
	
	MapClose();
}


function MapIcon(icon) {
	this.icon = null;
	this.shadow = null;
	this.shape = null;
	//this.infoAnchor = null;

	if (icon.substring(0, 6) == "school") {
		this.icon = new google.maps.MarkerImage(
			"/StaffDirectory/images/Maps/" + icon + ".png",
			new google.maps.Size(32, 32), //icon size
			new google.maps.Point(0, 0), 	//icon origin
			new google.maps.Point(0, 32)	//icon anchor
		);

		this.shadow = new google.maps.MarkerImage(
			"/StaffDirectory/images/Maps/school_shadow.png",
			new google.maps.Size(59, 32),
			new google.maps.Point(0, 0),
			new google.maps.Point(0, 32)
		);

		this.shape = {
			coord: [19, 1, 21, 2, 23, 3, 24, 4, 25, 5, 25, 6, 25, 7, 25, 8, 25, 9, 24, 10, 23, 11, 24, 12, 25, 13, 26, 14, 27, 15, 27, 16, 27, 17, 27, 18, 27, 19, 26, 20, 26, 21, 26, 22, 26, 23, 26, 24, 26, 25, 25, 26, 24, 27, 7, 27, 6, 26, 5, 25, 5, 24, 5, 23, 5, 22, 5, 21, 5, 20, 4, 19, 4, 18, 4, 17, 4, 16, 4, 15, 5, 14, 6, 13, 7, 12, 8, 11, 9, 10, 10, 9, 11, 8, 11, 7, 11, 6, 11, 5, 11, 4, 11, 3, 12, 2, 13, 1],
			type: 'poly'
		};

		//this.infoAnchor = new google.maps.Point(16,0);
	}
	else if (icon == "hotel") {
		this.icon = new google.maps.MarkerImage(
			"/StaffDirectory/images/Maps/" + icon + ".png",
			new google.maps.Size(32, 37), //icon size
			new google.maps.Point(0, 0), 	//icon origin
			new google.maps.Point(0, 37)	//icon anchor
		);

		this.shadow = new google.maps.MarkerImage(
			"/StaffDirectory/images/Maps/" + icon + "_shadow.png",
			new google.maps.Size(51, 37),
			new google.maps.Point(0, 0),
			new google.maps.Point(0, 32)
		);

		this.shape = {
			coord: [29, 0, 30, 1, 31, 2, 31, 3, 31, 4, 31, 5, 31, 6, 31, 7, 31, 8, 31, 9, 31, 10, 31, 11, 31, 12, 31, 13, 31, 14, 31, 15, 31, 16, 31, 17, 31, 18, 31, 19, 31, 20, 31, 21, 31, 22, 31, 23, 31, 24, 31, 25, 31, 26, 31, 27, 31, 28, 31, 29, 30, 30, 29, 31, 23, 32, 22, 33, 21, 34, 20, 35, 19, 36, 12, 36, 11, 35, 10, 34, 9, 33, 8, 32, 2, 31, 1, 30, 0, 29, 0, 28, 0, 27, 0, 26, 0, 25, 0, 24, 0, 23, 0, 22, 0, 21, 0, 20, 0, 19, 0, 18, 0, 17, 0, 16, 0, 15, 0, 14, 0, 13, 0, 12, 0, 11, 0, 10, 0, 9, 0, 8, 0, 7, 0, 6, 0, 5, 0, 4, 0, 3, 0, 2, 1, 1, 2, 0],
			type: 'poly'
		};

		//this.infoAnchor = new google.maps.Point(16,0);
	}
	else if (icon == "bus") {
		this.icon = new google.maps.MarkerImage("/StaffDirectory/images/Maps/bus.gif",
			new google.maps.Size(20, 24),
			new google.maps.Point(0, 0),
			new google.maps.Point(10, 12)
		);

		this.shadow = new google.maps.MarkerImage("/StaffDirectory/images/Maps/bus_shadow.png",
			new google.maps.Size(33, 24),
			new google.maps.Point(0, 0),
			new google.maps.Point(10, 12)
		);
	}
	else if (icon == "crosswalk") {
		this.icon = new google.maps.MarkerImage("/StaffDirectory/images/Maps/crosswalk.png",
			new google.maps.Size(18,18),
			new google.maps.Point(0,0),
			new google.maps.Point(9,9)
		);
		
		this.shadow = new google.maps.MarkerImage("/StaffDirectory/images/Maps/crosswalk_shadow.png",
			new google.maps.Size(28,18),
			new google.maps.Point(0,0),
			new google.maps.Point(9,9)
		);
	}
	else if (icon != "") {
		this.icon = new google.maps.MarkerImage("/StaffDirectory/images/Maps/" + icon + ".png");
		this.shadow = new google.maps.MarkerImage("/StaffDirectory/images/Maps/" + icon + "_shadow.png");
	}
}



/**************************************************************************************************
* MapControl Class - used to create custom map controls
*/
function MapControl(options, map) {
	this.options = options;
	
	if (this.options.pos == null) this.options.pos = google.maps.ControlPosition.TOP;
	if (this.options.width == null) this.options.width = 200;
	if (this.options.padding == null) this.options.padding = 5;
	
	if (this.options.header == null) this.options.header = '';
	if (this.options.message == null) this.options.message = '';
	
	this.div = document.createElement("div");
	this.div.style.padding = "0px";
	this.div.style.margin = this.options.padding + "px";
	this.div.style.border = "1px solid black";
	this.div.style.background = "white";
	this.div.index = 1;
	this.SetContents(this.options.header, this.options.message);
	
	this.div.style.width = this.options.width + "px";
	
	if (this.options.height)
		this.div.style.height = this.options.height + "px";
	
	this.Hide();
	map.controls[this.options.pos].push(this.div);
}

MapControl.prototype.SetContents = function(header, message) {
	this.options.header = header;
	this.options.message = message;
	
	this.div.innerHTML = 
		(header != '' ? '<div class="spsBoxHead">' + header + '</div>' : '') +
		'<div style="padding:2px">' + message + '</div>';
}

MapControl.prototype.Show = function() {
	this.div.style.display = '';
}

MapControl.prototype.Hide = function() {
	this.div.style.display = 'none';
}
