//
// Ed Knittel's Form-O-Matic™
// http://www.tastypopsicle.com/formomatic
// eNjoy!
//

function swapFields(fieldset) {
	var d = document;
	eraseFields();
	d.getElementById('formStart').style.display = "block";
	d.getElementById('strTemp').style.display = "none";
	d.getElementById('formText').style.display = "none";
	d.getElementById('formTextarea').style.display = "none";
	d.getElementById('formSelectlist').style.display = "none";
	d.getElementById('formCheckboxes').style.display = "none";
	d.getElementById('formRadiobuttons').style.display = "none";
	d.getElementById('formSubmit').style.display = "none";
	d.getElementById('formButtons').style.display = "none";
	d.getElementById('formCodeOutput').style.display = "none";
	if(fieldset == "formText") {
		d.getElementById('formText').style.display = "block";
		//d.getElementById('strTextWidth').focus();
		d.getElementById('formButtons').style.display = "block";
	} else if(fieldset == "formTextarea") {
		d.getElementById('formTextarea').style.display = "block";
		d.getElementById('formButtons').style.display = "block";
	} else if(fieldset == "formSelectlist") {
		d.getElementById('formSelectlist').style.display = "block";
		d.getElementById('formButtons').style.display = "block";
	} else if(fieldset == "formCheckboxes") {
		d.getElementById('formCheckboxes').style.display = "block";
		d.getElementById('formButtons').style.display = "block";
	} else if(fieldset == "formRadiobuttons") {
		d.getElementById('formRadiobuttons').style.display = "block";
		d.getElementById('formButtons').style.display = "block";
	} else if(fieldset == "formSubmit") {
		d.getElementById('formSubmit').style.display = "block";
		d.getElementById('formButtons').style.display = "block";
	} else {
		d.getElementById('strFieldName').value = "";
		d.getElementById('strFieldType').value = "";
		d.getElementById('strFieldName').focus();
	}
}

function addField(fieldset) {
	var d = document;
	var strTemp = d.getElementById('strTemp').value;
	switch(fieldset) {
		case(fieldset="formText"):
			//alert(fieldset);
			strTemp = strTemp + d.getElementById('strFieldType').value + "|" + d.getElementById('strFieldName').value + "|" + d.getElementById('strTextWidth').value + "|" + d.getElementById('strTextMaxlength').value + "|" + d.getElementById('strTextValue').value;
			break;
		case(fieldset="formTextarea"):
			//alert(fieldset);
			strTemp = strTemp + d.getElementById('strFieldType').value + "|" + d.getElementById('strFieldName').value + "|" + d.getElementById('strTextareaWidth').value + "|" + d.getElementById('strTextareaRows').value + "|" + d.getElementById('strTextareaValue').value;
			break;
		case(fieldset="formSelectlist"):
			//alert(fieldset);
			strTemp = strTemp + d.getElementById('strFieldType').value + "|" + d.getElementById('strFieldName').value + "|" + d.getElementById('strSelectlistOptions').value;
			break;
		case(fieldset="formCheckboxes"):
			//alert(fieldset);
			strTemp = strTemp + d.getElementById('strFieldType').value + "|" + d.getElementById('strFieldName').value + "|" + d.getElementById('strCheckboxesOptions').value;
			break;
		case(fieldset="formRadiobuttons"):
			//alert(fieldset);
			strTemp = strTemp + d.getElementById('strFieldType').value + "|" + d.getElementById('strFieldName').value + "|" + d.getElementById('strRadiobuttonsOptions').value;
			break;
		case(fieldset="formSubmit"):
			//alert(fieldset);
			strTemp = strTemp + d.getElementById('strFieldType').value + "|" + d.getElementById('strFieldName').value + "|" + d.getElementById('strSubmitValue').value;
			break;
		default:
			break;
	}
	d.getElementById('strTemp').value = strTemp + "@?@";
	swapFields('');
	makeForm();
	d.getElementById('formButtons2').style.display = "block";
}



function getConnector(position,fStyle) {
	switch(position) {
		case 1:
			if(fStyle=="0") {
				position = "\r\t<div>\r\t\t<span class=\"label\">";
			} else {
				position = "\r\t\t<tr>\r\t\t\t<td valign=\"top\" class=\"label\">";
			}
			break
		case 2:
			if(fStyle=="0") {
				position = "</span>\r\t\t<span class=\"field\">";
			} else {
				position = "</td>\r\t\t\t<td>";
			}
			break
		case 3:
			if(fStyle=="0") {
				position = "</span>\r\t</div>";
			} else {
				position = "</td>\r\t\t</tr>";
			}
			break
	}
	return position;
}

function makeForm() {
	var d = document;
	var formFields = d.getElementById('strTemp').value;
	var formStyle = d.getElementById('formStyle').value;
	formFields = formFields.substr(0,formFields.length-3);
	var strTemp = "";
	var formFields_array = formFields.split("@?@");
	
	for(i=0;i<=formFields_array.length-1;i++) {
		var formElement_array = formFields_array[i].split("|");
		var fieldset = formElement_array[0];
		
		switch(fieldset) {
			case(fieldset="formText"):
				var fieldLabel = formElement_array[1];
				var fieldName = nameTheField(fieldLabel);
				var fieldWidth = formElement_array[2];
				if(fieldWidth.length>0) {
					fieldWidth = "width:" + fieldWidth + "px;";
				}
				var fieldMaxlength = formElement_array[3];
				var fieldValue = formElement_array[4];
				strTemp += getConnector(1,formStyle) + "<label for=\"" + fieldName + "\">" + fieldLabel + "</label>" + getConnector(2,formStyle) + "<input type=\"text\" name=\"" + fieldName + "\" id=\"" + fieldName + "\" style=\"" + fieldWidth + "\" maxlength=\"" + fieldMaxlength + "\" value=\"" + fieldValue + "\">" + getConnector(3,formStyle);
				break;
			case(fieldset="formTextarea"):
				var fieldLabel = formElement_array[1];
				var fieldName = nameTheField(fieldLabel);
				var fieldWidth = formElement_array[2];
				if(fieldWidth.length>0) {
					fieldWidth = "width:" + fieldWidth + "px;";
				}
				var fieldRows = formElement_array[3];
				var fieldValue = formElement_array[4];
				strTemp += getConnector(1,formStyle) + "<label for=\"" + fieldName + "\">" + fieldLabel + "</label>" + getConnector(2,formStyle) + "<textarea name=\"" + fieldName + "\" id=\"" + fieldName + "\" style=\"" + fieldWidth + "\" rows=\"" + fieldRows + "\">" + fieldValue + "</textarea>" + getConnector(3,formStyle);
				break;
			case(fieldset="formSelectlist"):
				var fieldLabel = formElement_array[1];
				var fieldName = nameTheField(fieldLabel);
				var fieldOptions_array = formElement_array[2].split(",");
				strTemp += getConnector(1,formStyle) + "<label for=\"" + fieldName + "\">" + fieldLabel + "</label>" + getConnector(2,formStyle) + "<select name=\"" + fieldName + "\" id=\"" + fieldName + "\">"
				for(k=0;k<=fieldOptions_array.length-1;k++) {
					strTemp += "<option value=\"" + fieldOptions_array[k] + "\">" + fieldOptions_array[k] + "</option>"
				}
				strTemp += "</select>" + getConnector(3,formStyle);
				break;
			case(fieldset="formCheckboxes"):
				var fieldLabel = formElement_array[1];
				var fieldName = nameTheField(fieldLabel);
				var fieldOptions_array = formElement_array[2].split(",");
				strTemp += getConnector(1,formStyle) + fieldLabel + getConnector(2,formStyle);
				for(k=0;k<=fieldOptions_array.length-1;k++) {
					strTemp += "<input type=\"checkbox\" name=\"" + fieldName + "\" id=\"" + fieldName + "_" + k + "\" value=\"" + fieldOptions_array[k] + "\"><label for=\"" + fieldName + "_" + k + "\" class=\"cr\">&nbsp;" + fieldOptions_array[k] + "</label><br />"
				}
				strTemp += getConnector(3,formStyle);
				break;
			case(fieldset="formRadiobuttons"):
				var fieldLabel = formElement_array[1];
				var fieldName = nameTheField(fieldLabel);
				var fieldOptions_array = formElement_array[2].split(",");
				strTemp += getConnector(1,formStyle) + fieldLabel + getConnector(2,formStyle);
				for(k=0;k<=fieldOptions_array.length-1;k++) {
					strTemp += "<input type=\"radio\" name=\"" + fieldName + "\" id=\"" + fieldName + "_" + k + "\" value=\"" + fieldOptions_array[k] + "\"><label for=\"" + fieldName + "_" + k + "\">&nbsp;" + fieldOptions_array[k] + "</label> "
				}
				strTemp += getConnector(3,formStyle);
				break;
			case(fieldset="formSubmit"):
				var fieldLabel = formElement_array[1];
				var fieldName = nameTheField(fieldLabel);
				var fieldValue = formElement_array[2];
				strTemp += getConnector(1,formStyle) + "&nbsp;" + getConnector(2,formStyle) + "<input type=\"submit\" name=\"" + fieldName + "\" id=\"" + fieldName + "\" value=\"" + fieldValue + "\" class=\"button\" />" + getConnector(3,formStyle);
				break;
		}
	}
	if(d.getElementById('formStyle').value == 1) {
		strTemp = "\r\t<table>" + strTemp + "\r\t</table>";
	}
	d.getElementById('strFinal').value = "<form method=\"\" action=\"\" onsubmit=\"\">\r<fieldset>\r\t<legend>Your Form</legend>" + strTemp + "\r</fieldset>\r</form>";
	d.getElementById('formOutputText').innerHTML = strTemp;
	return true;
}

function getUsing() {
	var d = document;
	if(d.getElementById('formStyle').value == 0) {
		var strUsing = "&lt;div&gt; and &lt;span&gt;";
	} else {
		var strUsing = "&lt;table&gt; and &lt;td&gt;";
	}
	return strUsing;
}

function finalize(fieldset) {
	var d = document;
	addField(fieldset);
	d.getElementById('formStart').style.display = "none";
	d.getElementById('formCodeOutput').style.display = "block";
	d.getElementById('formButtons2').style.display = "none";
}

function eraseFields() {
	var d = document;
	// Text Field
	d.getElementById('strTextWidth').value = "";
	d.getElementById('strTextMaxlength').value = "";
	d.getElementById('strTextValue').value = "";
	// Textarea
	d.getElementById('strTextareaWidth').value = "";
	d.getElementById('strTextareaRows').value = "";
	d.getElementById('strTextareaValue').value = "";
	// Select List
	d.getElementById('strSelectlistOptions').value = "";
	// Checkboxes
	d.getElementById('strCheckboxesOptions').value = "";
	// Radio Buttons
	d.getElementById('strRadiobuttonsOptions').value = "";
}

function highLight(element,status) {
	var d = document;
	var color;
	if(status == "on") {
		color = "yellow";
	} else {
		color = "";
	}
	d.getElementById(element).style.backgroundColor = color;
}

function nameTheField(fieldName) {
	var string = "";
	var splitName = fieldName.split(" ");
	for(j=0;j<splitName.length;j++) {
		string = string + splitName[j];
	}
	fieldName = "str" + string;
	return fieldName;
}

function startOver() {
	swapFields('');
	document.getElementById('formOutputText').innerHTML = "";
}

function checkNumeric(e) {
	if (e) {
		var eKeyCode = e;
	} else {
		var eKeyCode = window.event.keyCode;
	}
	if((eKeyCode>47)&&(eKeyCode<58)) return true; else return false;
}