$(document).ready(function(){ //Start script when ready
	if (document.getElementById("map_canvas")) {//Checks to see that the page element exists and to prevent conflict with other maps
		
		//Default map center location 40.992336, -74.051971), 9
		var defaultLat = 40.992336;
		var defaultLon = -74.051971;
		var markers = new Array();
			markers[0] = new Array(new GMarker(new GLatLng(40.936502, -73.936958)), "Rio Vista Alpine", "<strong>Rio Vista Alpine</strong><br/>Residential Development<br/><a href='/projects/completed/alpine.html'>More Info...</a>");
			markers[1] = new Array(new GMarker(new GLatLng(40.937815, -73.958158)), "Rio Vista Cresskill", "<strong>Rio Vista Commons</strong><br/>Residential Development<br/><a href='/projects/completed/cresskill.html'>More Info...</a>");
			markers[2] = new Array(new GMarker(new GLatLng(40.986961, -73.932323)), "Rio Vista Norwood", "<strong>Rio Vista Norwood</strong><br/>Residential Development<br/><a href='/projects/completed/norwood.html'>More Info...</a>");
			markers[3] = new Array(new GMarker(new GLatLng(41.07094, -74.190867)), "Rio Vista Mahwah", "<strong>Rio Vista Mahwah</strong><br/>Residential Development<br/><a href='/projects/completed/mahwah.html'>More Info...</a>");
			markers[4] = new Array(new GMarker(new GLatLng(41.072992, -74.192731)), "Darlington Village", "<strong>Darlington Village</strong><br/>Residential Development<br/><a href='/projects/completed/darlington_village.html'>More Info...</a>");
			markers[5] = new Array(new GMarker(new GLatLng(41.070232, -74.190159)), "Walsh Hall", "<strong>Walsh Hall</strong><br/>Residential Development<br/><a href='/projects/completed/walshhall.html'>More Info...</a>");
			markers[6] = new Array(new GMarker(new GLatLng(41.072663, -74.190738)), "Crocker Mansion", "<strong>Crocker Mansion</strong><br/>Residential Development<br/><a href='/projects/completed/crocker_mansion.html'>More Info...</a>");
			markers[7] = new Array(new GMarker(new GLatLng(40.871655, -74.053093)), "Century Center", "<strong>Century Center</strong><br/>Industrial Development<br/><a href='/projects/completed/century_center.html'>More Info...</a>");
			markers[8] = new Array(new GMarker(new GLatLng(40.959508,-74.029714)), "Colonial Corporate", "<strong>Colonial Corporate Center</strong><br/>Commercial Development<br/><a href='/projects/completed/colonial_corporate_center.html'>More Info...</a>");
			markers[9] = new Array(new GMarker(new GLatLng(41.008419, -73.947585)), "Livingston Retail", "<strong>Livingston Retail</strong><br/>Construction Management<br/><a href='/projects/completed/220_livingston_northvale.html'>More Info...</a>");
			markers[10] = new Array(new GMarker(new GLatLng(40.964689, -74.029752)), "Rio Vista Corporate", "<strong>Rio Vista Corporate Center</strong><br/>Commercial Development<br/><a href='/projects/completed/690_kinderkamack.html'>More Info...</a>");
		var map = new google.maps.Map2($("#map_canvas").get(0));//Initialise google maps
		map.setCenter(new GLatLng(defaultLat, defaultLon), 12);//Set location to the default and zoom level to 8
		map.disableDoubleClickZoom();//Disable zooming
		//This section works fine but does not animate on load
		/*
		$(markers).each(function(i,marker){
		   map.addOverlay(marker[0]);
			$("<li />")
				.html(markers[i][1])//Use list item label from array
				.click(function(){
					displayPoint(marker[0], i);
					setActive(this);//Show active state
					if ($('#map_message').is(':hidden')) {//Allow toggling of active state
						setActive();
					}
				})
				.appendTo("#map_list");
			
		    GEvent.addListener(marker[0], "click", function(){
				displayPoint(marker[0], i);
			    setActive(i);//Show active location
				if ($('#map_message').is(':hidden')) {//Allow toggling of active state
					setActive();
				}
			});
		});
		*/

		$.each(markers,function(i,marker){
			var delayTime = ((i * 3000) / (0.5 * markers.length));//Delay time decreases as number of markers increases
		
			setTimeout(function(){ 
				map.addOverlay(marker[0]);
				$("<li />")
					.html(markers[i][1])//Use list item label from array
					.click(function(){
						displayPoint(marker[0], i);
						setActive(this);//Show active state
					})
					.appendTo("#map_list");
			
				GEvent.addListener(marker[0], "click", function(){
					displayPoint(marker[0], i);
					setActive(i);//Show active location
				});
				
				displayPoint(marker[0], i);
				setActive(i);//Show active location
				if (i == (markers.length - 1)) {//If last item in array
					setTimeout(function(){//Remove active class and fade marker after delay
						$("#map_message").fadeOut();
						//setActive();
					}, 3500);
				}
			}, delayTime); 
		});
		
		$("#map_list").css("opacity","0.2").animate({opacity: 1}, 1100);//Fade in menu
		$("#map_message").appendTo(map.getPane(G_MAP_FLOAT_SHADOW_PANE));
						
		function displayPoint(marker, index){
			if ($('#map_message').is(':hidden')) {//Allow toggling of markers
				$('#map_message').fadeIn();
			}
			else{//Remove all .active classes and hide markers
				$('#map_message').hide();
				$(".active").removeClass();
			}
			//$("#map_message").hide();//Default behaviour, doesn't allow toggling
			
			var moveEnd = GEvent.addListener(map, "moveend", function(){
				var markerOffset = map.fromLatLngToDivPixel(marker.getLatLng());
				$("#map_message")
					.html(markers[index][2])//Use information from array
					.fadeIn()
					.css({ top:markerOffset.y, left:markerOffset.x });
			GEvent.removeListener(moveEnd);
			});
			map.panTo(marker.getLatLng());
		}	
		
		function setActive(el){
			$(".active").removeClass();//Remove all .active classes
			$("#map_list").find('li').eq(el).addClass('active');//Find list element equal to index number and set active
			$(el).addClass('active');//Set active if list element clicked directly
		}
	}//End if map_canvas exists
	//$(".jqueryslidemenu").css("zIndex","100");
	//$('.testclass').css("zIndex","9000");
}); //End onReady