function changeAOI(AOIf){
	if(AOIf.AOI.value==-1){
		submitAOI(AOIf);
	} else {
		//if(confirm("Are you sure you want to change AOIs?")){
			AOIf.submit();
		//}
	}
	AOIf.AOI.selectedIndex = 0;
}

function getFlashMovie(movieName) {
	var isIE = navigator.appName.indexOf("Microsoft") != -1;
	return (isIE) ? window[movieName] : document[movieName];
}
function formSend(stf) {
	AOIName = document.getElementById("AOIName").value;
	if((AOIName=='')||(AOIName==null)){
		alert("Please enter an AOI name before upload.");
		document.getElementById("AOIName").focus();
	} else {
		uploadMovie = getFlashMovie("dot");
		if(uploadMovie) { uploadMovie.sendTextToFlash(stf); }
	}
	return false;
}
function getTextFromFlash(str) {
	alert(str);
	return str + " received";
}
function setFocusFromFlash(objectName) {
	if(objectName=="cancelAOI"){
		document.getElementById("cancelAOI").value = "Done";
	}
	document.getElementById(objectName).focus();
	return objectName + " received";
}

function manageAOIs(mgForm, aoiValue) {
	document.getElementById('aoiExtents').style.display = "block";
	document.getElementById('uploadFlash').style.display = "none";
	document.getElementById('uploadFlashBrowse').style.display = "none";
	document.getElementById('submitNewAOI').style.display = "inline";
	if(!isNaN(aoiValue)) {
		mgForm.AOIName.readOnly = "";
		mgForm.AOIName.value = "";
		mgForm.AOIName.focus();
		lon0_latlon = "";
		lat1_latlon = "";
		lon1_latlon = "";
		lat0_latlon = "";
		setLatLonOptions();
		latLonWidgetVisibility();
		if(aoiValue==-2) { // Upload shapefile AOI
			document.getElementById('aoiExtents').style.display = "none";
			document.getElementById('uploadFlash').style.display = "block";
			document.getElementById('uploadFlashBrowse').style.display = "block";
			document.getElementById('submitNewAOI').style.display = "none";
			//document.getElementById('uploadFlash').style.top = "-42px";
			var so = new SWFObject("upload2.swf", "dot", "430", "150", "6.0.0", "#ffffff", true, "high");
			so.addParam("wmode", "transparent");
			so.addVariable("uType", "SHP");
			//so.addParam("SeamlessTabbing", "true");
			so.write("uploadFlash");
		}
	} else {
		mgForm.AOIName.value = aoiValue;
		mgForm.AOIName.readOnly = "readonly";
		aoiValue = "__"+aoiValue.replace(/[ \/&#\.,\?;\+\-]/g, "_");
		lon0_latlon = lonlat[aoiValue][0];
		lat1_latlon = lonlat[aoiValue][1];
		lon1_latlon = lonlat[aoiValue][2];
		lat0_latlon = lonlat[aoiValue][3];
		
		setOpt1("lon0");	setOpt2("lon0");	setOpt3("lon0");
		setOpt1("lat1");	setOpt2("lat1");	setOpt3("lat1");
		setOpt1("lon1");	setOpt2("lon1");	setOpt3("lon1");
		setOpt1("lat0");	setOpt2("lat0");	setOpt3("lat0");

		//mgForm.lon0.value = lonlat[aoiValue][0];
		//mgForm.lat1.value = lonlat[aoiValue][1];
		//mgForm.lon1.value = lonlat[aoiValue][2];
		//mgForm.lat0.value = lonlat[aoiValue][3];
	}
}

function submitAOI(){
		createAOI = parent.document.getElementById('validateData');
		createAOI.style.display = "block";
		createAOI.style.left = "280px";
		createAOI.style.top = "150px";
		createAOI.style.width = "520px";
		createAOI.style.backgroundColor = "#ffffff";
		createAOI.style.border = "2px solid black";
		createAOI.style.paddingTop = "6px";
		createAOI.innerHTML = '<span class="tabPageTitle drag" dragTarget="validateData">Manage AOIs</span><div class="pageForms" id="manageAOIs"><form id="manageAOIForm"><fieldset style="margin: 6px; margin-left: -4px;"><legend onclick="showHelp(\'aoi\', 200, 60, 150);" title="Click for help">Select AOI</legend><table cellspacing="4" align="center"><tr><td colspan="3"><div id="mgAOIselect"></div></td></tr></table></fieldset><fieldset style="margin: 6px; margin-left: -4px;"><legend onclick="showHelp(\'aoi\', 200, 60, 150);" title="Click for help">AOI parameters</legend><div style="float:left;">AOI Name: <input type="text" size="40" id="AOIName" name="AOIName" maxlength="20" style="z-index: 35;"> </div><div id="uploadFlashBrowse" style="float:right; display:none;"><input type="button" name="Browse" value="Browse" onClick="formSend(\'go\');"></div><br><br><div id="uploadFlash" style="position: relative; z-index:33;"><img src="images/dot.gif" border="0" alt=""></div><table cellspacing="4" align="center" id="aoiExtents"><tr><td colspan="3">Enter extents for <strong>area of interest</strong> in the lat/lon format below, or click the right arrow to change input formats.<br></td></tr><tr><td colspan="3" align="center">LATITUDE TOP<br><div id="divlat0" style=" height: 32px;"></div></td></tr><tr><td align="center">LONGITUDE LEFT<br><div id="divlon0" style=" height: 32px;"></div></td><td bgcolor="#cacabc" align="center" valign="middle" style="padding: 6px; border: 1px solid black; vertical-align:middle;">AOI</td><td align="center">LONGITUDE RIGHT<br><div id="divlon1" style=" height: 32px;"></div></td></tr><tr><td colspan="3" align="center">LATITUDE BOTTOM<br><div id="divlat1" style=" height: 32px;"></div></td></tr></table><div id="arrowAOI" style="float:left;"><span id="ddmAOI"></span> <img src="images/arrows.png" border="0" onclick="nextFormat(event, arrowAOI);" style="cursor: pointer;"><br>(Use arrow to change coordinate input display format.)</div><div style="float:right;"><input type="button" id="submitNewAOI" name="submitNewAOI" value="Submit" onclick="createNewAOI();"><input type="button" id="cancelAOI" name="cancelAOI" value="Cancel" onclick="parent.createAOI.style.display=\'none\';"></div></fieldset></form></div>';
		document.getElementById('mgAOIselect').innerHTML = aoiMgSelect;
		document.getElementById('divlat0').innerHTML = '<div id="lat0_optContainer" style="width: 206px; position: relative;"><div id="lat0_opt1x" style="float:left; z-index: 3; position: absolute; left: 0px; top: 0px; color:#0099CC; font-family: Arial,Helvetica; font-size:8px; visibility: hidden;"><div class="widget">DIR<br><select id="lat0_opt1_1x" onChange="opt1_1Change(this.selectedIndex,\'lat0\');"><option value="N" selected="selected">N</option><option value="S">S</option></select></div><div class="widget">DEGREES<br><input id="lat0_opt1_2x" type="text" size="3" maxlength="3" name="degrees" onKeyDown="saveVal=this.value;" onKeyUp="opt1_2Change(this.value,\'lat0\');"></div><div class="widget">MINUTES<br><input id="lat0_opt1_3x" type="text" size="3" maxlength="2" name="minutes" onKeyDown="saveVal=this.value;" onKeyUp="opt1_3Change(this.value,\'lat0\');"></div><div class="widget">SECONDS<br><input id="lat0_opt1_4x" type="text" size="3" maxlength="5" name="seconds" onKeyDown="saveVal=this.value;" onKeyUp="opt1_4Change(this.value,\'lat0\');"></div></div><div id="lat0_opt2x" style="float:left; z-index: 4; position: absolute; left: 0px; top: 0px; color:#0099CC; font-family: Arial,Helvetica; font-size:8px; visibility: hidden;"><div class="widget">DIR<br><select id="lat0_opt2_1x" onChange="opt2_1Change(this.selectedIndex,\'lat0\');"><option value="N" selected="selected">N</option><option value="S">S</option></select></div><div class="widget">DEGREES<br><input id="lat0_opt2_2x" type="text" size="3" maxlength="3" name="degrees" onKeyDown="saveVal=this.value;" onKeyUp="opt2_2Change(this.value,\'lat0\');"></div><div class="widget">DECIMAL MINUTES<br><input id="lat0_opt2_3x" type="text" size="8" maxlength="7" name="minutes" style="width:84px;" onKeyDown="saveVal=this.value;" onKeyUp="opt2_3Change(this.value,\'lat0\');"></div></div><div id="lat0_opt3x" style="float:left; z-index: 5; position: absolute; left: 0px; top: 0px; color:#0099CC; font-family: Arial,Helvetica; font-size:8px; visibility: hidden;"><div class="widget">DECIMAL DEGREES<br><input id="lat0_opt3_1x" type="text" size="24" maxlength="10" name="degrees" style="width:169px;" value="" onChange="opt3Change(this.value,\'lat0\');"></div></div></div>';
		document.getElementById('divlat1').innerHTML = '<div id="lat1_optContainer" style="width: 206px; position: relative;"><div id="lat1_opt1x" style="float:left; z-index: 3; position: absolute; left: 0px; top: 0px; color:#0099CC; font-family: Arial,Helvetica; font-size:8px; visibility: hidden;"><div class="widget">DIR<br><select id="lat1_opt1_1x" onChange="opt1_1Change(this.selectedIndex,\'lat1\');"><option value="N" selected="selected">N</option><option value="S">S</option></select></div><div class="widget">DEGREES<br><input id="lat1_opt1_2x" type="text" size="3" maxlength="3" name="degrees" onKeyDown="saveVal=this.value;" onKeyUp="opt1_2Change(this.value,\'lat1\');"></div><div class="widget">MINUTES<br><input id="lat1_opt1_3x" type="text" size="3" maxlength="2" name="minutes" onKeyDown="saveVal=this.value;" onKeyUp="opt1_3Change(this.value,\'lat1\');"></div><div class="widget">SECONDS<br><input id="lat1_opt1_4x" type="text" size="3" maxlength="5" name="seconds" onKeyDown="saveVal=this.value;" onKeyUp="opt1_4Change(this.value,\'lat1\');"></div></div><div id="lat1_opt2x" style="float:left; z-index: 4; position: absolute; left: 0px; top: 0px; color:#0099CC; font-family: Arial,Helvetica; font-size:8px; visibility: hidden;"><div class="widget">DIR<br><select id="lat1_opt2_1x" onChange="opt2_1Change(this.selectedIndex,\'lat1\');"><option value="N" selected="selected">N</option><option value="S">S</option></select></div><div class="widget">DEGREES<br><input id="lat1_opt2_2x" type="text" size="3" maxlength="3" name="degrees" onKeyDown="saveVal=this.value;" onKeyUp="opt2_2Change(this.value,\'lat1\');"></div><div class="widget">DECIMAL MINUTES<br><input id="lat1_opt2_3x" type="text" size="8" maxlength="7" name="minutes" style="width:84px;" onKeyDown="saveVal=this.value;" onKeyUp="opt2_3Change(this.value,\'lat1\');"></div></div><div id="lat1_opt3x" style="float:left; z-index: 5; position: absolute; left: 0px; top: 0px; color:#0099CC; font-family: Arial,Helvetica; font-size:8px; visibility: hidden;"><div class="widget">DECIMAL DEGREES<br><input id="lat1_opt3_1x" type="text" size="24" maxlength="10" name="degrees" style="width:169px;" value="" onChange="opt3Change(this.value,\'lat1\');"></div></div></div>';
		document.getElementById('divlon0').innerHTML = '<div id="lon0_optContainer" style="width: 206px; position: relative;"><div id="lon0_opt1x" style="float:left; z-index: 3; position: absolute; left: 0px; top: 0px; color:#0099CC; font-family: Arial,Helvetica; font-size:8px; visibility: hidden;"><div class="widget">DIR<br><select id="lon0_opt1_1x" onChange="opt1_1Change(this.selectedIndex,\'lon0\');"><option value="E">E</option><option value="W" selected="selected">W</option></select></div><div class="widget">DEGREES<br><input id="lon0_opt1_2x" type="text" size="3" maxlength="3" name="degrees" onKeyDown="saveVal=this.value;" onKeyUp="opt1_2Change(this.value,\'lon0\');"></div><div class="widget">MINUTES<br><input id="lon0_opt1_3x" type="text" size="3" maxlength="2" name="minutes" onKeyDown="saveVal=this.value;" onKeyUp="opt1_3Change(this.value,\'lon0\');"></div><div class="widget">SECONDS<br><input id="lon0_opt1_4x" type="text" size="3" maxlength="5" name="seconds" onKeyDown="saveVal=this.value;" onKeyUp="opt1_4Change(this.value,\'lon0\');"></div></div><div id="lon0_opt2x" style="float:left; z-index: 4; position: absolute; left: 0px; top: 0px; color:#0099CC; font-family: Arial,Helvetica; font-size:8px; visibility: hidden;"><div class="widget">DIR<br><select id="lon0_opt2_1x" onChange="opt2_1Change(this.selectedIndex,\'lon0\');"><option value="E">E</option><option value="W" selected="selected">W</option></select></div><div class="widget">DEGREES<br><input id="lon0_opt2_2x" type="text" size="3" maxlength="3" name="degrees" onKeyDown="saveVal=this.value;" onKeyUp="opt2_2Change(this.value,\'lon0\');"></div><div class="widget">DECIMAL MINUTES<br><input id="lon0_opt2_3x" type="text" size="8" maxlength="7" name="minutes" style="width:84px;" onKeyDown="saveVal=this.value;" onKeyUp="opt2_3Change(this.value,\'lon0\');"></div></div><div id="lon0_opt3x" style="float:left; z-index: 5; position: absolute; left: 0px; top: 0px; color:#0099CC; font-family: Arial,Helvetica; font-size:8px; visibility: hidden;"><div class="widget">DECIMAL DEGREES<br><input id="lon0_opt3_1x" type="text" size="24" maxlength="10" name="degrees" style="width:169px;" value="" onChange="opt3Change(this.value,\'lon0\');"></div></div></div>';
		document.getElementById('divlon1').innerHTML = '<div id="lon1_optContainer" style="width: 206px; position: relative;"><div id="lon1_opt1x" style="float:left; z-index: 3; position: absolute; left: 0px; top: 0px; color:#0099CC; font-family: Arial,Helvetica; font-size:8px; visibility: hidden;"><div class="widget">DIR<br><select id="lon1_opt1_1x" onChange="opt1_1Change(this.selectedIndex,\'lon1\');"><option value="E">E</option><option value="W" selected="selected">W</option></select></div><div class="widget">DEGREES<br><input id="lon1_opt1_2x" type="text" size="3" maxlength="3" name="degrees" onKeyDown="saveVal=this.value;" onKeyUp="opt1_2Change(this.value,\'lon1\');"></div><div class="widget">MINUTES<br><input id="lon1_opt1_3x" type="text" size="3" maxlength="2" name="minutes" onKeyDown="saveVal=this.value;" onKeyUp="opt1_3Change(this.value,\'lon1\');"></div><div class="widget">SECONDS<br><input id="lon1_opt1_4x" type="text" size="3" maxlength="5" name="seconds" onKeyDown="saveVal=this.value;" onKeyUp="opt1_4Change(this.value,\'lon1\');"></div></div><div id="lon1_opt2x" style="float:left; z-index: 4; position: absolute; left: 0px; top: 0px; color:#0099CC; font-family: Arial,Helvetica; font-size:8px; visibility: hidden;"><div class="widget">DIR<br><select id="lon1_opt2_1x" onChange="opt2_1Change(this.selectedIndex,\'lon1\');"><option value="E">E</option><option value="W" selected="selected">W</option></select></div><div class="widget">DEGREES<br><input id="lon1_opt2_2x" type="text" size="3" maxlength="3" name="degrees" onKeyDown="saveVal=this.value;" onKeyUp="opt2_2Change(this.value,\'lon1\');"></div><div class="widget">DECIMAL MINUTES<br><input id="lon1_opt2_3x" type="text" size="8" maxlength="7" name="minutes" style="width:84px;" onKeyDown="saveVal=this.value;" onKeyUp="opt2_3Change(this.value,\'lon1\');"></div></div><div id="lon1_opt3x" style="float:left; z-index: 5; position: absolute; left: 0px; top: 0px; color:#0099CC; font-family: Arial,Helvetica; font-size:8px; visibility: hidden;"><div class="widget">DECIMAL DEGREES<br><input id="lon1_opt3_1x" type="text" size="24" maxlength="10" name="degrees" style="width:169px;" value="" onChange="opt3Change(this.value,\'lon1\');"></div></div></div>';

		initLatLonWidget("lat0");
		initLatLonWidget("lat1");
		initLatLonWidget("lon0");
		initLatLonWidget("lon1");
		
		// Display current format
		ddm = document.getElementById("ddmAOI");
		ddm.innerHTML = "DECIMAL "+ddms[degreeDisplayMode-1];
		latLonWidgetVisibility();
		saveVal = 0.0;
		manageAOIs(document.getElementById('manageAOIForm'),AOI);
}

String.prototype.trim = function() { return this.replace(/^\s+|\s+$/g, ''); }

function createNewAOI(){
	// Check that ...
	setLatLonOptions();
	AOIName = document.getElementById('AOIName').value;
	if(!AOIName) {
		alert("AOI name required!");
		document.getElementById('AOIName').focus();
		return;
	}
	// Validate long/lat values
	//long0 = Number(document.getElementById('lon0').value);
	//long1 = Number(document.getElementById('lon1').value);
	long0 = Number(lon0_latlon);
	long1 = Number(lon1_latlon);
	if(!long0) {
		alert("Left longitude required."); return; }
	if(!long1) {
		alert("Right longitude required."); return; }
	if(isNaN(long0) || (long0<longMin) || (long0>longMax)) {
		alert("Invalid longitude: "+long0); return; }
	if(isNaN(long1) || (long1<longMin) || (long1>longMax)) {
		alert("Invalid longitude: "+long1); return; }
	if(long0>=long1) {
		alert("Right longitude must be greater than left longitude."); return; }
	//if(((long0>lonUMACMax) && (long1>lonUMACMax)) ||
	//	((long0<lonUMACMin) && (long1<lonUMACMin))) {
	//	alert("Both longitudes are outside the UMAC area."); document.getElementById('lon0').focus(); return; }

	//lati0 = Number(document.getElementById('lat0').value);
	//lati1 = Number(document.getElementById('lat1').value);
	lati0 = Number(lat0_latlon);
	lati1 = Number(lat1_latlon);
	if(!lati0) {
		alert("Top Latitude required."); return; }
	if(!lati1) {
		alert("Bottom latitude required."); return; }
	if(isNaN(lati0) || (lati0<latiMin) || (lati0>latiMax)) {
		alert("Invalid latitude: "+lati0); return; }
	if(isNaN(lati1) || (lati1<latiMin) || (lati1>latiMax)) {
		alert("Invalid latitude: "+lati1); return; }
	if(lati0<=lati1) {
		alert("Top latitude must be greater than bottom latitude."); return; }
	//if(((lati0>latUMACMax) && (lati1>latUMACMax)) ||
	//	((lati0<latUMACMin) && (lati1<latUMACMin))) {
	//	alert("Both latitudes are outside the UMAC area."); document.getElementById('lat0').focus(); return; }

	// Initialize create AOI URL with user and AOI args
	createAOIURL = "/createAOI.php?";
	createAOIURL += "lat[]="+lat0_latlon;
	createAOIURL += "&lat[]="+lat1_latlon;
	createAOIURL += "&lon[]="+lon0_latlon;
	createAOIURL += "&lon[]="+lon1_latlon;
	mgAOI = document.getElementById('mgAOI').value;
	if(mgAOI!=-1) { createAOIURL += "&UPD_AOI=1"; }

	// Show the overlay image animation
	//showOverlayImage('manageUserData', 'userselectPic');
	parent.createAOI.style.display="none";
	
	//aoiButton = parent.document.getElementById('submit_AOI');
	//aoiButton.value = "Submit AOI";
	//aoiTitle = parent.document.getElementById('aoiHTMLTitle');
	//aoiTitle.innerHTML = "Submit AOI";
	//alert(createAOIURL);
	
	// Call the create AOI script and target the hidden frame
	frames['hiddenFrame'].location.href = 'createNewAOI.html?AOI='+encodeURIComponent(AOIName)+'&max='+IMG_DIM+'&aoiURL='+escape(createAOIURL);
}