// Marker Creation: This file deals with all of the function concerning marker creation.
// By: Max Sklar.

//This boolean variable tells us if the user is in the process of creating a new marker.
var inCreationMode;

//Define our form so that all functions have access to it.
var ourForm;

//This variable tells us what page we're on in the creation form.
var creationPage;

//This variable tells us the icon that was chosen by the user.
var newMarkerIcon = 1;

//This varialbe tells us what level the user wants to put the marker.
var markerLevel = 17;
var highestLevel;
var STREET_LEVEL = 17;
var NEIGHBORHOOD_LEVEL = 14;
var CITY_LEVEL = 10;
var MACRO_LEVEL = 5;

function levelToCatId(level) {
	if (level == STREET_LEVEL) return 1;
	if (level == NEIGHBORHOOD_LEVEL) return 2;
	if (level == CITY_LEVEL) return 3;
	if (level == MACRO_LEVEL) return 4;
}

//The variables with the title and description
var newMarkerTitle = "";
var newMarkerDescription = "";

//Now we have several pages in our form - here's how its layed out:
//Page 1: Choose Icon
//Page 2: Choose Location
//Page 3: Type in Title and Description

//The User has just clicked "Create Marker"
//Display the marker form
function displayNewMarkerForm() {
	inCreationMode = true;
	dumpMarkerInfo();
	
	creationPage = 1;
	currentIcon = 1;
	
	document.getElementById("creationFormContainer").style.display = "block";
	setTextEditorHtml("newdescription", "");

	ourForm = document.forms["creationForm"];
	ourForm.elements["title"].value = "";
//	ourForm.elements["creation_importance"].value = -1;
	
	updateMarkerCreationPage();
}

//This function is called when the icon information is retrieved from the Yellow Page Data.
//Here we already know the latitude, longitude, and what text to put in.
//We also know that the marker is going to be placed on the lowest level.
//Therefore, we skip page 1, and go right to page 2.
function streamlineCreateMarkerForm(lat, lng, title, template) {
	ourForm = document.forms["creationForm"];
	ourForm.elements["title"].value = title;
	
	setTextEditorHtml("newdescription", template);
	
	markerLevel = STREET_LEVEL;
	
	map.setZoom(markerLevel);
	
	nextCreationPage();
		
	clickedOnMapWhileCreatingMarker(new GLatLng(lat, lng));
	changedIconWhileCreating(100); //100 is the Yellow Thumb Tack
}

function nextCreationPage() {
	hideCreationPage();
	creationPage++;
	updateMarkerCreationPage();
}

function previousCreationPage() {
	hideCreationPage();
	creationPage--;
	updateMarkerCreationPage();
}

function hideCreationPage() {
	var pageId = "creationPage" + creationPage;
	document.getElementById(pageId).style.display = "none";
}

function updateMarkerCreationPage() {
	if (creationPage == 1) {
		if (sampleMarker) {
			sampleMarker.destroy();
			sampleMarker = null;
		}
	
		document.getElementById("previous").disabled = true;
		document.getElementById("next").disabled = false;
		document.getElementById("finish").disabled = true;
		
		document.getElementById("creationPage1").style.display = "block";
	}
	else if (creationPage == 2) {
		highestLevel = markerLevel;

		var ourPage = document.getElementById("creationPage2");
		
		ourPage.style.display = "block";
	
		document.getElementById("previous").disabled = false;
		document.getElementById("next").disabled = true;
		document.getElementById("finish").disabled = true;
		
		var pageString = "";
		pageString += "<span style=\"font-size: 12px; font-weight: bold;\" id=\"createMarkerByClick\">Click on the map to specify the location of the new marker. </span> <BR>";	
		pageString += "<span style=\"font-size: 12px;\" id='creation_zoomin_notice' style='display : none'>To ensure accuracy and reduce duplicates, we require that you <b>zoom in <span id='creation_zoomin_requirement'>" + (markerLevel - map.getZoom()) + "</span> levels</b> to place this marker.</span>";		
		pageString += DBR + "Choose icon:" + BR + "<span id='iconControlSpan'></span>";
		ourPage.innerHTML = pageString;
	
		if (map.getZoom() < markerLevel) makeVisible('creation_zoomin_notice');
	
		//Create Icon Control Panel
		makeIconControl(levelToCatId(markerLevel), "iconControlSpan", "creationForm", "changedIconWhileCreating");
	}
	else if (creationPage == 3) {
		//Gecko workaround to make the editor work from a hidden element
		//http://wiki.fckeditor.net/Troubleshooting
		//implemented by Craig (just so you know who to blame :)
		document.getElementById("creationPage3").style.display = "block";
		hideCreationPage();
		document.getElementById("creationPage3").style.display = "block";
		
		var editor = FCKeditorAPI.GetInstance("newdescription");
		editor.EditorDocument.designMode = "on";
		
		//Highest and lowest Zoom
		//document.getElementById("lowestZoomAvailability").innerHTML = markerLevel;
		//changeHighestLevel(-2);
		
		document.getElementById("previous").disabled = false;
		document.getElementById("next").disabled = true;
		document.getElementById("finish").disabled = false;
	}
}

function changeHighestLevel(amount) {
	highestLevel += amount;
	var s = "";
	if (highestLevel > markerLevel - 4)
		s += "<a href=\"javascript:changeHighestLevel(-1)\">&lt;&lt;</a> ";
	s += highestLevel;
	if (highestLevel < markerLevel)
		s += " <a href=\"javascript:changeHighestLevel(1)\">&gt;&gt;</a>";
	
	document.getElementById("highestZoomAvailability").innerHTML = s;
}

//This function submits a marker to the php marker creator, but uses AJAX and doesn't actually go to the page.
function submitMarker() {
	if (ourForm.elements["creation_importance"].value == -1) {
		alert("Please choose an importance level from the drop-down menu.");
		return;
	}

	var file = 'createMarker.php';
		
	//Post the values to a string:
	var str = "";
	str += createPostStatement("title", ourForm.elements["title"].value);
	str += createPostStatement("description", getTextEditorHtml("newdescription"));
	str += createPostStatement("latitude", sampleMarker.point.y);
	str += createPostStatement("longitude", sampleMarker.point.x);
	str += createPostStatement("maxZoom", markerLevel);
	str += createPostStatement("minZoom", markerLevel - ourForm.elements["creation_importance"].value);
	str += createPostStatement("icon", iconDatabase[getIconDbNumber(newMarkerIcon)][2]);
	str += createPostStatement("submit", 1);
	str = str.substr(0,(str.length - 1));  //Get rid of last ampersand
	
	document.getElementById("finish").disabled = true;
	postWithFile(file, false, str, function(response) {
		alert(response);
		document.getElementById("finish").disabled = false;
		exitCreationMode();
		switchTab(EXPLORER_TAB);
	});
}

//This function erased all materials (buttons, text)  associated with marker creation.
function hideCreationArea() {
	makeInvisible("creationPage1");
	makeInvisible("creationPage2");
	makeInvisible("creationPage3");
	makeInvisible("creationFormContainer");
}

//This function both hids the creation area and allows the "Creation Button" to be used again
function exitCreationMode() {
	hideCreationArea();
	inCreationMode = false;
	if (sampleMarker) sampleMarker.destroy();
}
	
function clickedOnMapWhileCreatingMarker(point) {
	//You can only specify the marker on page 2.
	if (creationPage != 2) return;
	
	//You can only specify the marker when you are on zoom level 0.
	if (map.getZoom() != markerLevel) {
		if (map.getZoom() < markerLevel) {
			var numLevels = markerLevel - map.getZoom();
			
			var lPhrase;
			if (numLevels == 1) lPhrase = "1 level";
			else lPhrase = numLevels + " levels";
			alert("You are zoomed out too far to create this type of marker.  Please zoom in " + lPhrase + " before placing your marker so that you can be more accurate.");
			return;
		}
		else map.setZoom(markerLevel);
	}
	
	//Get the icon that is selected and store it in icon.
	var icon = newMarkerIcon;
	
	if (!icon) {
		alert("Trying to place empty icon on map during marker creation.  -Max Sklar.");
		return;
	}

	//Add the new marker to the map
	var myIcon = iconDatabase[getIconDbNumber(icon)][1];
	if (!sampleMarker) sampleMarker = new SampleMarker(null, point, myIcon, map);
	else sampleMarker.moveToPoint(point);

	document.getElementById("createMarkerByClick").innerHTML = "A location has been specified." + BR +
				"Click on the map to change the location of the new marker";
	document.getElementById("next").disabled = false;
}

//Eventually, we want to fill in stuff here so that the sample marker remains.
function changedZoomWhileCreatingMarker() {
	if (sampleMarker) sampleMarker.redisplay();
	if (creationPage == 2)
		if (map.getZoom() < markerLevel) {
			document.getElementById('creation_zoomin_requirement').innerHTML = markerLevel - map.getZoom();
			makeVisible('creation_zoomin_notice');
		}
		else {
			makeInvisible('creation_zoomin_notice');
		}
}

//What to do when the user changes the icon.
function changedIconWhileCreating(icon) {
	//What to do when we changed the icon.
	newMarkerIcon = icon;

	if (!sampleMarker) return;
	sampleMarker.changeIcon(iconDatabase[getIconDbNumber(icon)][1]);
}