// 07/31/2008 - gsc - modify for Phoenix and owl database
// 08/02/2008 - gsc - change item names, add email
// 08/31/2008 - gsc - validate email and dates
// 09/13/2008 - gsc - adapt for peach-face lovebird page
// 07/29/2010 cursor

var centerLatitude = 33.58259;
var centerLongitude = -111.86828;
var startZoom = 10;

var map;

function init() {
	map = new GMap2(document.getElementById("map"));
	map.addControl(new GLargeMapControl());
	map.addControl(new GMapTypeControl());
	map.setCenter(new GLatLng(centerLatitude, centerLongitude), startZoom);
	map.setMapType(G_HYBRID_MAP);
	
	
	// Create the "tiny" marker icon
	var tinyIcon = new GIcon();
	tinyIcon.image = "http://labs.google.com/ridefinder/images/mm_20_yellow.png";
	tinyIcon.shadow = "http://labs.google.com/ridefinder/images/mm_20_shadow.png";
	tinyIcon.iconSize = new GSize(12, 20);
	tinyIcon.shadowSize = new GSize(22, 20);
	tinyIcon.iconAnchor = new GPoint(6, 20);
	tinyIcon.infoWindowAnchor = new GPoint(5, 1);
	// Set up our GMarkerOptions object literal
	markerOptions = { icon:tinyIcon };
	
	// add current range outline
	
	var polyline = new GPolyline([
	
		new GLatLng(33.9177225477, -111.956348419),
		new GLatLng(33.4363120136, -111.563887596),
		new GLatLng(33.3788492675, -111.609592438),
		new GLatLng(33.3640833755, -111.734519005),		
		new GLatLng(33.3297931897, -112.000497580),
		new GLatLng(33.4504748216, -112.204903364),
		new GLatLng(33.6821396027, -112.203390598),
		new GLatLng(33.9177225477, -111.956348419)
		], "#ff0000",10);
	map.addOverlay(polyline);
	//map.innerHTML = "wait";
	//document.body.style.cursor = "wait"; // new code 07/29/2010
	
	//var infowindow = new google.maps.InfoWindow( 
      //{ content: "Wait", 
       // size: new google.maps.Size(50,50) 
      //});
	
//	infowindow.open(map); 
	
	//retrieve the markers from xml
	retrieveMarkers();
	//document.body.style.cursor = "default"; // new code 07/29/2010
	//map.innerHTML = "";
	
	GEvent.addListener(map, "click", function(overlay, latlng) {
		//only perform the click if the window is closed and the click was directly on the map.
		if(!overlay) {
			//create an HTML DOM form element
			var inputForm = document.createElement("form");
			inputForm.setAttribute("action","");
			inputForm.onsubmit = function() {storeMarker(); return false;};

			//retrieve the longitude and lattitude of the click point
			var lng = latlng.lng();
			var lat = latlng.lat();

			inputForm.innerHTML = '<fieldset style="width:300px;">'
			+ '<legend>Peach-faced Lovebird Location</legend>'
			+ '<label for="New_Site_Name">New Site Name (do not use & sign, use and)</label>' // second New Site Name is displayed
			+ '<input type="text" id="New_Site_Name" style="width:100%;"/>'
			+ '<label for="Observation_Date">Observation Date (mm/dd/yyyy)</label>'
			+ '<input type="text" id="Observation_Date" style="width:100%;"/>'
			
			+ '<label for="Number_Seen">Number Seen (1,2,5,10,etc.)</label>'
			+ '<input type="text" id="Number_Seen" style="width:100%;"/>'
			
			+ '<label for="Lovebird_Type">Lovebird Type (Peach-face, Lutino, Blue or Black-masked, Other)</label>'
			+ '<input type="text" id="Lovebird_Type" style="width:100%;"/>'
			
			+ '<label for="Email">Email</label>'
			+ '<input type="text" id="Email" style="width:100%;"/>'
			+ '<input type="submit" value="Save"/>'
			+ '<input type="hidden" id="longitude" value="' + lng + '"/>'
			+ '<input type="hidden" id="latitude" value="' + lat + '"/>'
			+ '</fieldset>';

			map.openInfoWindow (latlng,inputForm);
		}
	});

}

window.onload = init;

function storeMarker(){
	var lng = document.getElementById("longitude").value;
	var lat = document.getElementById("latitude").value;

	var getVars =  "?New_Site_Name=" + document.getElementById("New_Site_Name").value
	+ "&Observation_Date=" + document.getElementById("Observation_Date").value
	
	+ "&Number_Seen=" + document.getElementById("Number_Seen").value
	
	+ "&Lovebird_Type=" + document.getElementById("Lovebird_Type").value

	+ "&Email=" + document.getElementById("Email").value 
																			   
	+ "&lng=" + lng
	+ "&lat=" + lat ;

	var request = GXmlHttp.create();

	//open the request to storeMakres.php on your server
	request.open('GET', 'storeMarker.php' + getVars, true);
	
	request.onreadystatechange = function() {
		if (request.readyState == 4) {
			//the request in complete
			
			var xmlDoc = request.responseXML;

			//retrieve the root document element (response)
			var responseNode = xmlDoc.documentElement;

			//retrieve the type attribute of the node
			var type = responseNode.getAttribute("type");

			//retrieve the content of the responseNode
			var content = responseNode.firstChild.nodeValue;
			//alert(content); // use this to inspect content
			
			$bad_name = content.search(/Is Too Short for a Site Name./);
			$bad_date = content.search(/0000-00-00/);
			$bad_email = content.search(/Is Invalid/);

			if($bad_name > 0 || $bad_date > 0 || $bad_email > 0){
				
				if($bad_name > 0){
				alert("Site Name Too Short");	
				}
			
				if($bad_date > 0){
				alert("Date Format Wrong, Use MM/DD/YYYY");	
				}
				
				if($bad_email > 0){
				alert("Email Address Error");	
				}
				
			} else {
			
				//check to see if it was an error or success
				if(type!='success') {
					alert(content);
				} else {
					//Create a new marker and add it's info window.
					//alert("make marker now.");
					var latlng = new GLatLng(parseFloat(lat),parseFloat(lng));

					var marker = createMarker(latlng, content,50); // force a big marker

					map.addOverlay(marker);
					map.closeInfoWindow();
				}// success
			} // invalid email
		}
	}
	request.send(null);
	return false;
}

function createMarker(latlng, html, size) {
	if(size > 24){
		var marker = new GMarker(latlng); // for default big red marker	
	} else {
		var marker = new GMarker(latlng,markerOptions); // change for small icon
	}
	
	GEvent.addListener(marker, 'click', function() {
		var markerHTML = html;
		marker.openInfoWindowHtml(markerHTML);
	});
	return marker;
}

function retrieveMarkers() {
	var request = GXmlHttp.create();

	//tell the request where to retrieve data from.
	request.open('GET', 'retrieveMarkers.php', true);

	//tell the request what to do when the state changes.
	request.onreadystatechange = function() {
		if (request.readyState == 4) {
			var xmlDoc = request.responseXML;

			var markers = xmlDoc.documentElement.getElementsByTagName("marker");
			for (var i = 0; i < markers.length; i++) {
				var lng = markers[i].getAttribute("lng");
				var lat = markers[i].getAttribute("lat");
				//check for lng and lat so MSIE does not error
				//on parseFloat of a null value
				if(lng && lat) {
					var latlng = new GLatLng(parseFloat(lat),parseFloat(lng));

					var html = '<div><b>Site Name</b> ' // here is the display text for data.xml data from server, not from new
					+ markers[i].getAttribute("New_Site_Name")// here is the variable name
					+ '</div><div><b>Observation Date</b> '
					+ markers[i].getAttribute("Observation_Date")
					
					+ '</div><div><b>Number Seen</b> '
					+ markers[i].getAttribute("Number_Seen")
					
					+ '</div><div><b>Lovebird Type</b> '
					+ markers[i].getAttribute("Lovebird_Type")
					
					//+ '</div><div><b>Email</b> '
					//+ markers[i].getAttribute("Email")
					+ '</div>';
					var new_seen = parseInt(markers[i].getAttribute("Number_Seen")); // make an int
					var marker = createMarker(latlng, html, new_seen);
					map.addOverlay(marker);
				}
			} //for
		} //if
	} //function

	request.send(null);
}


// 08/03/08 - gsc - function for moving the map

function movemap(xlatitude,ylongitude) {

	map.setCenter(new GLatLng(parseFloat(xlatitude), parseFloat(ylongitude), 12));


//var tmp_latlng = new GLatLng(parseFloat(xlatitude), parseFloat(ylongitude)); // now tmp_latlng ready for setCenter
	//map.setCenter(tmp_latlng, startZoom); // move it

}


function attachSecretMessage(marker, number) { 
  var message = ["This","is","the","secret","message"]; 
  var infowindow = new google.maps.InfoWindow( 
      { content: message[number], 
        size: new google.maps.Size(50,50) 
      }); 
  google.maps.event.addListener(marker, 'click', function() { 
    infowindow.open(map,marker); 
  }); 
}