//global variables that can be used by ALL the functions on this page.
var formFieldInputs;
var imgCheckboxFalse = 'images/button-unchecked.gif';
var imgCheckboxTrue = 'images/button-checked.gif';

function replaceChecks() {
	
	//get all the input fields on the page
	formFieldInputs = document.getElementsByTagName('input');

	//cycle trough the input fields
	for(var i=0; i < formFieldInputs.length; i++) {

		//check if the input is a checkbox
		if(formFieldInputs[i].getAttribute('type') == 'checkbox') {
			
			//create a new image
			var img = document.createElement('img');
			
			//check if the checkbox is checked
			if(formFieldInputs[i].checked) {
				img.src = imgCheckboxTrue;
			} else {
				img.src = imgCheckboxFalse;
			}

			//set image ID and onclick action
			img.id = 'checkImage'+i;
			//set image 
			img.onclick = new Function('checkChange('+i+')');
			//place image in front of the checkbox
			formFieldInputs[i].parentNode.insertBefore(img, formFieldInputs[i]);
			
			//hide the checkbox
			formFieldInputs[i].style.display='none';
		}
		
		//MODIFY_TEXT_FIELDS_hexcolor_0 - last digit is 1 for password, or 0 for text field
		//modify_text_fields(id,color,isPasswd) we are calling this function
		if(/__MODIFY_TEXT_FIELDS/.test(formFieldInputs[i].id)) {
			var isPasswd = formFieldInputs[i].id.replace(/.*__MODIFY_TEXT_FIELDS_[a-zA-Z0-9]{6}_(\d).*/, "$1");
			var hexcolor = formFieldInputs[i].id.replace(/.*__MODIFY_TEXT_FIELDS_([a-zA-Z0-9]{6})_\d.*/, "$1");
			formFieldInputs[i].onfocus = new Function('modify_text_fields(this.id,\'' + hexcolor + '\',\'' + isPasswd + '\')');
		}

	}//for
	

	//cosmetic adjustment to start with square corners via initial css and
	//then strip background-color to reveal rounded image corners
	var tdCells=document.getElementsByTagName("td");
	for (var i=0;i<tdCells.length;i++) {
		if(tdCells[i].className == "shell_corner_tmp") {
			tdCells[i].style.backgroundColor = "transparent";
		}
	}
	
	
}//function replaceChecks()

//change the checkbox status and the replacement image
function checkChange(i) {

	if(formFieldInputs[i].checked) {
		formFieldInputs[i].checked = '';
		document.getElementById('checkImage'+i).src=imgCheckboxFalse;
	} else {
		formFieldInputs[i].checked = 'checked';
		document.getElementById('checkImage'+i).src=imgCheckboxTrue;
	}
}
window.onload = replaceChecks;






//add NAME keys from IDs, validate, disable all form inputs, and submit form
var storeInputFlag = new Array();
var storeInputPadding = new Array();
var alreadySubmittedForm = new Array();
function validate_and_submit(formID,imageURL,allowOneSubmit) {
	if(!(alreadySubmittedForm[formID] == 'yes' && allowOneSubmit)) {

	var formNode=document.getElementById(formID);
	var flagElement = 0;
	var flagToFix = 'no';
	for (var i=0;i<formNode.length;i++) {
	
		//store original values
		if(storeInputFlag[i] != 'stored') {
			storeInputFlag[i] = 'stored';
			storeInputPadding[i] = formNode.elements[i].style.padding;
		}

		//give NAME key a value from ID and keep track if there is a default value
		//don't let form submit with default value!
	    if(formNode.elements[i].id && !formNode.elements[i].name) {
	    	if(formNode.elements[i].id.indexOf("__HAS_DEFAULT_VALUE") == -1) {
				//never leave the NAME key without the delimiter! we only take it and everything else out right before a submit.
	    		formNode.elements[i].name = formNode.elements[i].id.replace(/__XXX.*/,"");
	    	} else {
	    		flagElement=1; //we don't want the user submitting a default value, so bail.
	    	}
	    }
	    else if(/__HAS_DEFAULT_VALUE/.test(formNode.elements[i].name)) {
	    	flagElement=1;
	    }
	    //validate any fields that are required
	    if(formNode.elements[i].id.indexOf("__REQUIRE_EMAIL") != -1) {
	    	if (!(/^([A-Za-z0-9_\-\.])+\@([A-Za-z0-9_\-\.])+\.([A-Za-z]{2,4})$/.test(formNode.elements[i].value))) {
	    		flagElement=1;
	    	}
	    }
	    if(formNode.elements[i].id.indexOf("__REQUIRE_TEXT") != -1) {
	    	if(/^\s*$/.test(formNode.elements[i].value)) {
	    		flagElement=1;
	    	}
	    }
	    
		//reset markers and go back to normal state
		formNode.elements[i].style.padding = storeInputPadding[i];
		formNode.elements[i].style.backgroundImage = "none";
	    
	    //identify bad fields by showing markers
	    if(flagElement == 1) {
			formNode.elements[i].style.backgroundImage = "url(" + imageURL + ")";
			formNode.elements[i].style.paddingLeft = "17px";
			formNode.elements[i].style.backgroundPosition = "4px 4px";
			formNode.elements[i].style.backgroundRepeat = "no-repeat";
			if(flagToFix == 'no') { flagToFix = i; }
	    }
		
		//reset for next check in loop
		flagElement = 0;
		
	}//for
	
	if(flagToFix != 'no') {
		//bring focus to problem fields, issue alert, and do not finishing submitting this form
		//use a timer to delay the alert, so the screen has time to finish rendering dom changes
		var tAlert=setTimeout("alert('We have marked one or more fields with a question mark. Please correct or enter information in these fields.')",300);
		//do not focus if there is no NAME key, only when there is.
		if(formNode.elements[flagToFix].name) {
			//formNode.elements[flagToFix].focus();
			//formNode.elements[flagToFix].select();
		}
	   	return;
	} else {
		//pass this form name to CGI - if we don't see the variable "formID", then we know the form
		//was passed without JS, and this is not good.  don't process the form!
  		var confirmJS = document.createElement("input");
		confirmJS.setAttribute("type", "hidden");
		confirmJS.setAttribute("name", formID);
		confirmJS.setAttribute("value", "1");
		formNode.appendChild(confirmJS);
		//formNode.insertBefore(confirmJS, formNode.elements[0]);
		//formNode.removeChild(formNode.elements[i]);
		
		//ready NAME key for submission
		for (var i=0;i<formNode.length;i++) {
			formNode.elements[i].name = formNode.elements[i].name.replace(/__XXX.*/,"");
		}
		
		//submit form and disable ability to keep clicking submit
		alreadySubmittedForm[formID] = 'yes';
		document.getElementById(formID).submit();
	}
	
	}//if(alreadySubmittedForm[formID] != 'yes')
	
}//function





//clear any content upon focus in a text field, and change text color
var storeOrigFieldFlag = new Array();
var storeOrigFieldColor = new Array();
var storeOrigFieldValue = new Array();
function modify_text_fields(id,color,isPasswd,focusOrBlur) {
		var origField = document.getElementById(id);
		//store original values and do first time things
		//first time here is an onfocus event taking place
		if(storeOrigFieldFlag[id] != 'stored') {
			storeOrigFieldFlag[id] = 'stored';
			storeOrigFieldColor[id] = origField.style.color;
			storeOrigFieldValue[id] = origField.value;
			var copyStyles = origField.style.cssText;
			var newField = document.createElement("input");
			if(isPasswd==1) { newField.setAttribute("type", "password"); }
			else { newField.setAttribute("type", "text"); }
			newField.setAttribute("id", id);
			if(id.indexOf("__XXX") != -1) {
				//never leave the NAME key without the delimiter!
			   	newField.setAttribute("name", id.replace(/__XXX.*/,"__XXX"));
    		} else {
				newField.setAttribute("name", origField.name);
			}
			newField.setAttribute("value", "");
			origField.parentNode.insertBefore(newField, origField);
			origField.parentNode.removeChild(origField);
			newField.style.cssText = copyStyles;
			newField.style.color = "#" + color;
			newField.focus();
			newField.select();
			newField.onfocus = new Function('modify_text_fields(this.id,\'' + color + '\',\'' + isPasswd + '\',\'focus\')');
			newField.onblur = new Function('modify_text_fields(this.id,\'' + color + '\',\'' + isPasswd + '\',\'blur\')');
		}
		if(focusOrBlur == 'focus') {
			if(origField.value == storeOrigFieldValue[id]) {
				if(isPasswd==1) {
					var copyStyles = origField.style.cssText;
					var newField = document.createElement("input");
					newField.setAttribute("type", "password");
					newField.setAttribute("id", id);
					newField.setAttribute("name", origField.name.replace(/__HAS_DEFAULT_VALUE/,""));
					newField.setAttribute("value", "");
					//removing a node causes a blur in safari. after the new node is made, it's reselected.
					//this loop is ignored by setting the alt tag temporarily
					newField.alt = "loop";
					origField.parentNode.insertBefore(newField, origField);
					origField.parentNode.removeChild(origField);
					newField.style.cssText = copyStyles;
					newField.style.color = "#" + color;
					newField.focus();
					newField.select();
					newField.alt = ""; //clear the loop
					newField.onfocus = new Function('modify_text_fields(this.id,\'' + color + '\',\'' + isPasswd + '\',\'focus\')');
					newField.onblur = new Function('modify_text_fields(this.id,\'' + color + '\',\'' + isPasswd + '\',\'blur\')');
					origField = newField;
				} else {
					origField.value = "";
					origField.style.color = "#" + color;
					origField.name = origField.name.replace(/__HAS_DEFAULT_VALUE/,"");
				}
			}
		}
		if(focusOrBlur == 'blur' && origField.alt != 'loop') {
			if(/^\s*$/.test(origField.value)) {
				if(isPasswd==1) {
					var copyStyles = origField.style.cssText;
					var newField = document.createElement("input");
					newField.setAttribute("type", "text");
					newField.setAttribute("id", id);
					newField.setAttribute("name", origField.name += "__HAS_DEFAULT_VALUE");
					newField.setAttribute("value", storeOrigFieldValue[id]);
					origField.parentNode.insertBefore(newField, origField);
					origField.parentNode.removeChild(origField);
					newField.style.cssText = copyStyles;
					newField.style.color = storeOrigFieldColor[id];
					newField.onfocus = new Function('modify_text_fields(this.id,\'' + color + '\',\'' + isPasswd + '\',\'focus\')');
					newField.onblur = new Function('modify_text_fields(this.id,\'' + color + '\',\'' + isPasswd + '\',\'blur\')');
					origField = newField;
				} else {
					origField.style.color = storeOrigFieldColor[id];
					origField.value = storeOrigFieldValue[id];
					if(!/__HAS_DEFAULT_VALUE/.test(origField.name)) { origField.name += "__HAS_DEFAULT_VALUE"; }
				}
			}
		}
}