/*******************************************************************************
*Copyright (c) 2009 GlobalVetLink, L.C..
*All rights reserved. 
*
*Contributors:
*    GlobalVetLink, L.C. - initial API and implementation
*******************************************************************************/
	var level = 7; // Zoom level
	var center = new GLatLng(41.9985474, -93.6367827);  // Initial point is GVL
	var vets = $A(new Array()); // Vets that are found in the search
	var map; // The Google map
	var baseIcon; // Map icon used to mark were the vets are located
	var blueIcon;
	
	var vetaddrTemplate = new Template(
			'<tr>' + 
			'	<td class="map-label">' +
			'		<img class="map-label-letter" onclick="vetIconClicked(\'vet#{label}\')" src="http://www.google.com/mapfiles/marker#{label}.png"/>' +
			'	</td>' + 
			'	<td>' +
			'		<div class="map-vet-name" onclick="vetIconClicked(\'vet#{label}\')">#{name}</div>' + 
			'		<div class="map-vet-subaddress" id="vet#{label}" style="display:none">#{address}</div>' + 
			'	</td>' + 
			'</tr>');

	Element.observe(window, "load", init);

	function init() {
		$('findbutton').observe('click', find);
		$('zipcode').observe('keypress', kp);
		reloadMap();
	}

	function kp(event) {
		if (event.keyCode == 13) {
			find();
		}
	}

	function reloadMap() {
		if (!GBrowserIsCompatible()) {
			alert('This browser does not support maps');
			return;
		}
		if (map == null) {
			map = new GMap2($('map'));
			map.setCenter(center, level);
			map.addControl(new GSmallMapControl());
//			map.addControl(new GMapTypeControl());

			/*
			** Create the Base icon for vet markers
			*/
			baseIcon = new GIcon(G_DEFAULT_ICON);
			baseIcon.shadow = "http://www.google.com/mapfiles/shadow50.png";
			baseIcon.iconSize = new GSize(20, 34);
			baseIcon.shadowSize = new GSize(37, 34);
			baseIcon.iconAnchor = new GPoint(9, 34);
			baseIcon.infoWindowAnchor = new GPoint(9, 2);
			
			/*
			** Create the "You are Here" blue marker
			*/
			blueIcon = new GIcon(G_DEFAULT_ICON);
			blueIcon.image = "http://gmaps-samples.googlecode.com/svn/trunk/markers/blue/blank.png";
			markerOptions = { icon:blueIcon };
		}
		map.addOverlay(createYouAreHereMarker(center));
		var vethtml = "";
		vets.each(function(vet) {
			map.addOverlay(createMarker(vet));
			vethtml = vethtml + vetaddrTemplate.evaluate(vet);
		});
		$('vets').update(vethtml);
	}

	function find() {
		var zip = new Number($('zipcode').value);
		if (isNaN(zip) || zip == 0 || $('zipcode').value.length < 5) {
			alert("Zip code shoud be a 5 digit number");
			return;
		}
		$('map').innerHTML = '<table style="width: 100%; height: 100%; background-color: white;"><tr><td style="text-align: center; vertical-align: middle"><img src="/images/ajax-loader.gif" style="text-align: center"></td></tr></table>';
		ListRemoteService.findClosestVets($('zipcode').value, function(foundVets) {
			map = null;
			if (foundVets == null) {
				alert("Unknown/bad zip code.");
				reloadMap();
				return;
			}
			center = new GLatLng(foundVets.userAddress.latitude, foundVets.userAddress.logitude);
			vets = foundVets.vets;
			vets.each(function(vet, index) {
				vet.label = String.fromCharCode("A".charCodeAt(0) + index);

				var line1 = append(vet.address1, "<br/>", vet.address2);
				var line2 = append(append(vet.city, ", ", vet.stateAbbr), "  ", vet.zip);
				var email = '<a href="mailto:' + vet.email + '">' + vet.email + '</a>';
				var line3 = append(vet.phone, "<br/>", email);
				vet.address = append(line1, "<br/>", line2);
				vet.address = append(vet.address, "<br/>", line3);
			});
			reloadMap();
		});
	}
		
	function append(orig, seperator, append) {
		if (append.blank()) {
			return orig;
		}
		if (orig.blank()) {
			return append;
		}
		if (seperator == null) {
			return orig + append;
		}
		return orig + seperator + append;
	}

	function createMarker(vet) {
		var letteredIcon = new GIcon(baseIcon);
		letteredIcon.image = "http://www.google.com/mapfiles/marker" + vet.label + ".png";
		// Set up our GMarkerOptions object
		markerOptions = { icon:letteredIcon };
		var marker = new GMarker(new GLatLng(vet.latitude, vet.logitude), markerOptions);
		GEvent.addListener(marker, "click", function() {
			marker.openInfoWindowHtml(vet.name + "<br/>" + vet.address);
		});
		return marker;
	}
	
	function createYouAreHereMarker(aGLatLng) {
		return new GMarker(aGLatLng, {icon:blueIcon});
	}
	
	function vetIconClicked(id) {
		var div = $(id);
		var isVisible = div.visible();
		div.up('table').select('.map-vet-subaddress').each(function(sa) {
			if (sa != div) {
				Effect.Fade(sa);
			}
		});
		if (isVisible) {
			Effect.Fade(div);
		} else {
			Effect.Appear(div);
		} 
	}
