// variable to control amount of additional rows added dynamically
var extraRows = 0;

function loadStep2(){

	// make stepcolumn display correctly
	document.getElementById("stepPointer_Start").setAttribute("class","greyed_out_step");
	document.getElementById("stepPointer_Start").setAttribute("className","greyed_out_step");
		document.getElementById("stepPointer_Start").firstChild.onclick = function () {loadStep1();};
	document.getElementById("stepPointer_Further").setAttribute("class","active_step");
	document.getElementById("stepPointer_Further").setAttribute("className","active_step");
		document.getElementById("stepPointer_Further").firstChild.onclick = "javascript:;";
	document.getElementById("stepPointer_Terms").setAttribute("class","greyed_out_step");
	document.getElementById("stepPointer_Terms").setAttribute("className","greyed_out_step");
		document.getElementById("stepPointer_Terms").firstChild.onclick = "javascript:;";
	document.getElementById("stepPointer_Payment").setAttribute("class","greyed_out_step");
	document.getElementById("stepPointer_Payment").setAttribute("className","greyed_out_step");
		document.getElementById("stepPointer_Payment").firstChild.onclick = "javascript:;";
	document.getElementById("stepPointer_Complete").style.visibility = "hidden";

	// delete warning message if it exists
	if (document.getElementById("warningRow")){
		document.getElementById("buttonsRow").parentNode.removeChild(document.getElementById("buttonsRow").previousSibling);
	}

	var formarea = document.getElementById("formarea");

	newTable = document.createElement("table");
	newTable.setAttribute("border","0");
	newTable.setAttribute("width","100%");
	newTable.setAttribute("cellSpacing","0");
	newTable.setAttribute("cellPadding","0");
	newTable.setAttribute("id","formTable");

	newTbody = document.createElement("tbody");

	newRow = document.createElement("tr");
	newRow.setAttribute("vAlign","top");
	newRow.setAttribute("id","howhearRow");

			newCol = document.createElement("td");
			newCol.setAttribute("class","fieldtags");
			newCol.setAttribute("className","fieldtags");
			newCol.setAttribute("align","right");
			newCol.setAttribute("width","50%");
	
			newTxt = document.createTextNode("How did you hear about us?:");
			newCol.appendChild(newTxt);
		newRow.appendChild(newCol);

			newCol = document.createElement("td");
			newCol.setAttribute("class","info");
			newCol.setAttribute("className","info");
			newCol.setAttribute("width","50%");	
	
			newSelect = document.createElement("select");
			newSelect.setAttribute("name","howhear");
			newSelect.setAttribute("id","howhear");
			newSelect.onchange = function () {createFurther("howhear");};
			newSelect.onfocus = function () {resetElement(this);};
			newOption = document.createElement("option");
			newOption.setAttribute("value","");
			newTxt = document.createTextNode("Please select");
			newOption.appendChild(newTxt);
			newSelect.appendChild(newOption);		
			newOption = document.createElement("option");
			newOption.setAttribute("value","Search Engine");
			newTxt = document.createTextNode("Search Engine");
			newOption.appendChild(newTxt);
			newSelect.appendChild(newOption);
			newOption = document.createElement("option");
			newOption.setAttribute("value","Website");
			newTxt = document.createTextNode("Website");
			newOption.appendChild(newTxt);
			newSelect.appendChild(newOption);
			newOption = document.createElement("option");
			newOption.setAttribute("value","Press");
			newTxt = document.createTextNode("Press");
			newOption.appendChild(newTxt);
			newSelect.appendChild(newOption);
			newOption = document.createElement("option");
			newOption.setAttribute("value","Word of Mouth");
			newTxt = document.createTextNode("Word of Mouth");
			newOption.appendChild(newTxt);
			newSelect.appendChild(newOption);
			newOption = document.createElement("option");
			newOption.setAttribute("value","Other");
			newTxt = document.createTextNode("Other");
			newOption.appendChild(newTxt);
			newSelect.appendChild(newOption);

			newCol.appendChild(newSelect);				

		newRow.appendChild(newCol);
	newTbody.appendChild(newRow);

	newRow = document.createElement("tr");
	newRow.setAttribute("vAlign","top");
	newRow.setAttribute("id","aimsRow");

			newCol = document.createElement("td");
			newCol.setAttribute("class","fieldtags");
			newCol.setAttribute("className","fieldtags");
			newCol.setAttribute("align","right");
	
			newTxt = document.createTextNode("What are your main achievement aims from the course?:");
			newCol.appendChild(newTxt);
		newRow.appendChild(newCol);

			newCol = document.createElement("td");
			newCol.setAttribute("class","info");
			newCol.setAttribute("className","info");			
			newCol.setAttribute("id","checkboxCol");			

			newCheckbox = document.createElement("input");
			newCheckbox.setAttribute("type","checkbox");
			newCheckbox.setAttribute("class","checkbox");
			newCheckbox.setAttribute("className","checkbox");
			newCheckbox.setAttribute("name","aims");
			newCheckbox.setAttribute("id","aims");
			newCheckbox.setAttribute("value","Improve existing camera skills");
			newCheckbox.onfocus = function () {resetElement(this);};
			newCheckbox.onclick = function () {resetElement(this);};
			newCol.appendChild(newCheckbox);

			newTxt = document.createTextNode("Improve existing camera skills");
			newCol.appendChild(newTxt);

			newBR = document.createElement("br");
			newCol.appendChild(newBR);

			newCheckbox = document.createElement("input");
			newCheckbox.setAttribute("type","checkbox");
			newCheckbox.setAttribute("class","checkbox");
			newCheckbox.setAttribute("className","checkbox");
			newCheckbox.setAttribute("name","aims");
			newCheckbox.setAttribute("id","aims");
			newCheckbox.setAttribute("value","Learn tricks of the trade");
			newCheckbox.onfocus = function () {resetElement(this);};
			newCheckbox.onclick = function () {resetElement(this);};
			newCol.appendChild(newCheckbox);

			newTxt = document.createTextNode("Learn tricks of the trade");
			newCol.appendChild(newTxt);

			newBR = document.createElement("br");
			newCol.appendChild(newBR);

			newCheckbox = document.createElement("input");
			newCheckbox.setAttribute("type","checkbox");
			newCheckbox.setAttribute("class","checkbox");
			newCheckbox.setAttribute("className","checkbox");
			newCheckbox.setAttribute("name","aims");
			newCheckbox.setAttribute("id","aims");
			newCheckbox.setAttribute("value","Learn how to produce broadcast footage");
			newCheckbox.onfocus = function () {resetElement(this);};
			newCheckbox.onclick = function () {resetElement(this);};
			newCol.appendChild(newCheckbox);

			newTxt = document.createTextNode("Learn how to produce broadcast footage");
			newCol.appendChild(newTxt);

			newBR = document.createElement("br");
			newCol.appendChild(newBR);

			newCheckbox = document.createElement("input");
			newCheckbox.setAttribute("type","checkbox");
			newCheckbox.setAttribute("class","checkbox");
			newCheckbox.setAttribute("className","checkbox");
			newCheckbox.setAttribute("name","aims");
			newCheckbox.setAttribute("id","aims");
			newCheckbox.setAttribute("value","Learn for a forthcoming trip");
			newCheckbox.onfocus = function () {resetElement(this);};
			newCheckbox.onclick = function () {resetElement(this);};
			newCol.appendChild(newCheckbox);

			newTxt = document.createTextNode("Learn for a forthcoming trip");
			newCol.appendChild(newTxt);

		newRow.appendChild(newCol);
	newTbody.appendChild(newRow);			


	newRow = document.createElement("tr");
	newRow.setAttribute("vAlign","top");
	newRow.setAttribute("id","fitnessRow");

			newCol = document.createElement("td");
			newCol.setAttribute("class","fieldtags");
			newCol.setAttribute("className","fieldtags");
			newCol.setAttribute("align","right");
	
			newTxt = document.createTextNode("What is your level of fitness?:");
			newCol.appendChild(newTxt);
		newRow.appendChild(newCol);

			newCol = document.createElement("td");
			newCol.setAttribute("class","info");
			newCol.setAttribute("className","info");

			newSelect = document.createElement("select");
			newSelect.setAttribute("name","fitness");
			newSelect.setAttribute("id","fitness");
			newSelect.onfocus = function () {resetElement(this);};
			newOption = document.createElement("option");
			newOption.setAttribute("value","");
			newTxt = document.createTextNode("Please select");
			newOption.appendChild(newTxt);
			newSelect.appendChild(newOption);		
			newOption = document.createElement("option");
			newOption.setAttribute("value","Excellent");
			newTxt = document.createTextNode("Excellent");
			newOption.appendChild(newTxt);
			newSelect.appendChild(newOption);
			newOption = document.createElement("option");
			newOption.setAttribute("value","Good");
			newTxt = document.createTextNode("Good");
			newOption.appendChild(newTxt);
			newSelect.appendChild(newOption);
			newOption = document.createElement("option");
			newOption.setAttribute("value","Average");
			newTxt = document.createTextNode("Average");
			newOption.appendChild(newTxt);
			newSelect.appendChild(newOption);
			newOption = document.createElement("option");
			newOption.setAttribute("value","Poor");
			newTxt = document.createTextNode("Poor");
			newOption.appendChild(newTxt);
			newSelect.appendChild(newOption);
	
			newCol.appendChild(newSelect);
		newRow.appendChild(newCol);
	newTbody.appendChild(newRow);

	newRow = document.createElement("tr");
	newRow.setAttribute("vAlign","top");

			newCol = document.createElement("td");
			newCol.setAttribute("colSpan","2");
			newTxt = document.createTextNode("\u00A0");			
			newCol.appendChild(newTxt);
		newRow.appendChild(newCol);
	newTbody.appendChild(newRow);

	newRow = document.createElement("tr");
	newRow.setAttribute("vAlign","top");
	newRow.setAttribute("id","equipmentRow");

			newCol = document.createElement("td");
			newCol.setAttribute("class","fieldtags");
			newCol.setAttribute("className","fieldtags");
			newCol.setAttribute("align","right");
	
			newTxt = document.createTextNode("Do you currently have your own filming equipment?:");
			newCol.appendChild(newTxt);
		newRow.appendChild(newCol);

			newCol = document.createElement("td");
			newCol.setAttribute("class","info");
			newCol.setAttribute("className","info");
			newCol.setAttribute("id","equipmentSelectCol");

			newSelect = document.createElement("select");
			newSelect.setAttribute("name","equipment");
			newSelect.setAttribute("id","equipment");
			newSelect.onchange = function () {createFurther("equipment");};
			newSelect.onfocus = function () {resetElement(this);};
			newOption = document.createElement("option");
			newOption.setAttribute("value","");
			newTxt = document.createTextNode("Please select");
			newOption.appendChild(newTxt);
			newSelect.appendChild(newOption);		
			newOption = document.createElement("option");
			newOption.setAttribute("value","Yes");
			newTxt = document.createTextNode("Yes");
			newOption.appendChild(newTxt);
			newSelect.appendChild(newOption);
			newOption = document.createElement("option");
			newOption.setAttribute("value","No");
			newTxt = document.createTextNode("No");
			newOption.appendChild(newTxt);
			newSelect.appendChild(newOption);
			newOption = document.createElement("option");
			newOption.setAttribute("value","About to buy some");
			newTxt = document.createTextNode("About to buy some");
			newOption.appendChild(newTxt);
			newSelect.appendChild(newOption);
	
			newCol.appendChild(newSelect);

		newRow.appendChild(newCol);
	newTbody.appendChild(newRow);

	newRow = document.createElement("tr");
	newRow.setAttribute("vAlign","top");
	newRow.setAttribute("id","underEquipmentRow");

			newCol = document.createElement("td");
			newCol.setAttribute("colSpan","2");
			newTxt = document.createTextNode("\u00A0");			
			newCol.appendChild(newTxt);
		newRow.appendChild(newCol);
	newTbody.appendChild(newRow);

	newRow = document.createElement("tr");
	newRow.setAttribute("vAlign","top");
	newRow.setAttribute("id","experienceRow");

			newCol = document.createElement("td");
			newCol.setAttribute("class","fieldtags");
			newCol.setAttribute("className","fieldtags");
			newCol.setAttribute("align","right");
	
			newTxt = document.createTextNode("What is your level of experience?:");
			newCol.appendChild(newTxt);
		newRow.appendChild(newCol);

			newCol = document.createElement("td");
			newCol.setAttribute("class","info");
			newCol.setAttribute("className","info");
			newCol.setAttribute("id","experienceSelectCol");

			newSelect = document.createElement("select");
			newSelect.setAttribute("name","experience");
			newSelect.setAttribute("id","experience");
			newSelect.onfocus = function () {resetElement(this);};
			newOption = document.createElement("option");
			newOption.setAttribute("value","");
			newTxt = document.createTextNode("Please select");
			newOption.appendChild(newTxt);
			newSelect.appendChild(newOption);		
			newOption = document.createElement("option");
			newOption.setAttribute("value","Never used a camera");
			newTxt = document.createTextNode("Never used a camera");
			newOption.appendChild(newTxt);
			newSelect.appendChild(newOption);
			newOption = document.createElement("option");
			newOption.setAttribute("value","Some experience");
			newTxt = document.createTextNode("Some experience");
			newOption.appendChild(newTxt);
			newSelect.appendChild(newOption);
			newOption = document.createElement("option");
			newOption.setAttribute("value","Very experienced");
			newTxt = document.createTextNode("Very experienced");
			newOption.appendChild(newTxt);
			newSelect.appendChild(newOption);
	
			newCol.appendChild(newSelect);

		newRow.appendChild(newCol);
	newTbody.appendChild(newRow);

	// dummy empty row to solve crazy IE bug - not having an odd number
	// of rows in this bottom section causes an extra 1 pixel gap at the
	// bottom of the div, meaning that the bottom corner images don't align
	// correctly. crazy but true

	newRow = document.createElement("tr");
	newRow.setAttribute("vAlign","top");
			newCol = document.createElement("td");
			newCol.setAttribute("class","fieldtags");
			newCol.setAttribute("colSpan","2");
			newCol.setAttribute("style","height:0px");
		newRow.appendChild(newCol);
	newTbody.appendChild(newRow);

	newRow = document.createElement("tr");
	newRow.setAttribute("vAlign","top");
			newCol = document.createElement("td");
			newCol.setAttribute("class","fieldtags");
			newCol.setAttribute("colSpan","2");
			newCol.setAttribute("style","height:0px");
		newRow.appendChild(newCol);
	newTbody.appendChild(newRow);

	newTable.appendChild(newTbody);

//	formarea.appendChild(newTable);
	formarea.replaceChild(newTable,formarea.firstChild);

	// Populate 'back' and 'continue' buttons
	document.getElementById("backButton").style.visibility = "visible";
	document.getElementById("continueButton").style.visibility = "visible";

	document.getElementById("backButton").onclick = function () {loadStep1();};
	document.getElementById("continueButton").onclick = function () {checkStep2();};
}

function createFurther(dropdown){

	if (dropdown == "howhear"){
		var howhearField = document.getElementById("howhear");
		var howhearChoice = howhearField.options[howhearField.selectedIndex].value;

		// specify row to insert before
		var endRow = document.getElementById("aimsRow");

		if (howhearChoice == "Search Engine"){
//			alert('search engine');
			newFurtherRow(dropdown,"howhearFurther","Search Engine details",endRow);
		}else if (howhearChoice == "Website"){
			newFurtherRow(dropdown,"howhearFurther","Website details",endRow);
		}else if (howhearChoice == "Other"){
			newFurtherRow(dropdown,"howhearFurther","",endRow);
		}else{			
			deleteFurtherRow((1),"furtherRow");
		}
	}else if (dropdown == "equipment"){
		var equipmentField = document.getElementById("equipment");
		var equipmentChoice = equipmentField.options[equipmentField.selectedIndex].value;

		// specify row to insert before
		var endRow = document.getElementById("underEquipmentRow");

		if (equipmentChoice == "Yes"){
			newFurtherRow(dropdown,"equipmentFurther","Equipment details",endRow);
			if (document.getElementById("equipmentBuyMsg")){
				document.getElementById("equipmentSelectCol").removeChild(document.getElementById("equipmentSelectCol").childNodes[1]);
//				document.getElementById("equipmentBuyMsg").style.visibility = "hidden";
			}
		}else{
			if ((equipmentChoice == "No")||(equipmentChoice == "About to buy some")){
				if (!document.getElementById("equipmentBuyMsg")){
					// create new message span
					newSpan = document.createElement("span");
					newSpan.setAttribute("id","equipmentBuyMsg");
					newSpan.style.visibility = "visible";
					newBr = document.createElement("br");
					newTxt = document.createTextNode("[If you would like advice about equipment please ");
					newSpan.appendChild(newBr);
					newSpan.appendChild(newTxt);
					newA = document.createElement("a");
					newA.setAttribute("class","inline");
					newA.setAttribute("className","inline");
					newA.setAttribute("href","mailto:info@explorersfilmschool.com");
					newTxt = document.createTextNode("contact\u00A0Andrew");
					newA.appendChild(newTxt);
					newSpan.appendChild(newA);
					newTxt = document.createTextNode(".]");
					newSpan.appendChild(newTxt);
		
					document.getElementById("equipmentSelectCol").appendChild(newSpan);
				}else{
					document.getElementById("equipmentBuyMsg").style.visibility = "visible";
				}
			}else{
				if (document.getElementById("equipmentBuyMsg")){
					document.getElementById("equipmentBuyMsg").style.visibility = "hidden";
				}
			}
			deleteFurtherRow((5+extraRows),"equipmentFurtherRow");
		}		
	}
}
function deleteFurtherRow(rowIndex,rowID){

	if (document.getElementById(rowID)){		
		var formarea = document.getElementById("formarea");
		var form_table = formarea.firstChild;
		var form_tbody = form_table.firstChild;

		form_tbody.removeChild(form_tbody.childNodes[rowIndex]);
		if (rowID == "furtherRow"){
			extraRows--;
		}
	}
//	alert(extraRows);
}
function newFurtherRow(dropdown,id,msg,endRow){

	var formarea = document.getElementById("formarea");
	var form_table = formarea.firstChild;
	var form_tbody = form_table.firstChild;

	// create new Row
	newRow = document.createElement("tr");
	newRow.setAttribute("vAlign","top");
	if (dropdown == "equipment"){
		newRow.setAttribute("id","equipmentFurtherRow");		
	}else{
		newRow.setAttribute("id","furtherRow");		
	}

	newCol = document.createElement("td");
	newCol.setAttribute("class","fieldtags");
	newCol.setAttribute("className","fieldtags");
	newCol.setAttribute("align","right");	
	newTxt = document.createTextNode("Please give details:");
	newCol.appendChild(newTxt);
	newRow.appendChild(newCol);

	newCol = document.createElement("td");
	newCol.setAttribute("class","info");
	newCol.setAttribute("className","info");
	
	if (dropdown == "equipment"){
		newTextarea = document.createElement("textarea");
		newTextarea.setAttribute("id",id);
		newTextarea.setAttribute("class","textbox");
		newTextarea.setAttribute("className","textbox");
		newTextarea.setAttribute("rows","3");
		newTextarea.onfocus = function () {if (this.value === msg){this.value = '';} resetElement(this);};
		newTxt = document.createTextNode(msg);
		newTextarea.appendChild(newTxt);
		newCol.appendChild(newTextarea);

		newBR = document.createElement("br");
		newTxt = document.createTextNode("[We advise that you bring the camera with you that you intend to use after the course.]");
		newCol.appendChild(newBR);
		newCol.appendChild(newTxt);	
	}else{			
		newInput = document.createElement("input");
		newInput.setAttribute("type","text");
		newInput.setAttribute("id",id);
		newInput.setAttribute("class","textbox");
		newInput.setAttribute("className","textbox");
		newInput.setAttribute("value",msg);
		newInput.onfocus = function () {if (this.value === msg){this.value = '';} resetElement(this);};

		newCol.appendChild(newInput);		
	}

	newRow.appendChild(newCol);

	if (dropdown == "equipment"){
		if (document.getElementById("equipmentFurtherRow")){
			form_tbody.replaceChild(newRow,document.getElementById("equipmentFurtherRow"));
		}else{
			form_tbody.insertBefore(newRow,endRow);
//			extraRows++;
		}
	}else{
		if (document.getElementById("furtherRow")){
			form_tbody.replaceChild(newRow,document.getElementById("furtherRow"));
		}else{
			form_tbody.insertBefore(newRow,endRow);
			extraRows++;
		}
	}
//	alert(extraRows);
}

function checkStep2(){
	var errors = 0;

	// check standard text fields
	var mandatory_txt_fields = new Array("howhearFurther","equipmentFurther");
	var disallowedValues = new Array(new Array("","Search Engine details","Website details"),new Array("","Equipment details"));

	for (var i=0; i<mandatory_txt_fields.length; i++){
		if (document.getElementById(mandatory_txt_fields[i])){
			var field = document.getElementById(mandatory_txt_fields[i]);

			for (var j=0; j<disallowedValues[i].length; j++){
				if (field.value === disallowedValues[i][j]){
					highlightColumns(field);
					errors++;
				}				
			}
		}
	}

	// check mandatory dropdown fields
	var mandatory_select_fields = new Array("howhear","fitness","equipment","experience");
	for (var i=0; i<mandatory_select_fields.length; i++){
		if (document.getElementById(mandatory_select_fields[i])){
			var field = document.getElementById(mandatory_select_fields[i]);
			var selected = field.options[field.selectedIndex].value;
			if(selected === ""){
				highlightColumns(field);
				errors++;
			}
		}
	}

	var field = document.forms.booking.aims;
	var element = document.getElementById("aims");
	var aimsArray = new Array();

	var boxes_unchecked = 0;
	for (var i=0; i < field.length; i++){
		if (field[i].checked!=true){
		   	boxes_unchecked ++;
		}else{
			aimsArray[aimsArray.length] = field[i].value;
		}
	}
	if (boxes_unchecked == field.length){
		highlightColumns(element);
		errors++;	   
	}

	if (errors > 0){

		// create warning row, if not already in place
		if (!document.getElementById("warningRow")){
			newRow = document.createElement("tr");
			newRow.setAttribute("vAlign","top");
			newRow.setAttribute("id","warningRow");
				newCol = document.createElement("td");
				newCol.setAttribute("class","fieldtags");
				newCol.setAttribute("className","fieldtags");
				newCol.setAttribute("align","right");	
				newTxt = document.createTextNode("\u00A0");
				newCol.appendChild(newTxt);
			newRow.appendChild(newCol);
				newCol = document.createElement("td");
				newCol.setAttribute("class","warning");
				newCol.setAttribute("className","warning");	
				newTxt = document.createTextNode("Please complete all highlighted fields above before continuing.");
				newCol.appendChild(newTxt);
			newRow.appendChild(newCol);

			document.getElementById("bookingTbody").insertBefore(newRow,document.getElementById("buttonsRow"));	
		}
	}else{
		if (document.getElementById("warningRow")){
			document.getElementById("buttonsRow").parentNode.removeChild(document.getElementById("buttonsRow").previousSibling);
		}

		document.getElementById("howhear_").value = document.getElementById("howhear").options[document.getElementById("howhear").selectedIndex].value;
		if (document.getElementById("howhearFurther")){document.getElementById("howhearFurther_").value = filterStr(document.getElementById("howhearFurther").value);}
		var aimsList = aimsArray.join(); document.getElementById("aims_").value = aimsList;
		document.getElementById("fitness_").value = document.getElementById("fitness").options[document.getElementById("fitness").selectedIndex].value;
		document.getElementById("equipment_").value = document.getElementById("equipment").options[document.getElementById("equipment").selectedIndex].value;
		if (document.getElementById("equipmentFurther")){document.getElementById("equipmentFurther_").value = filterStr(document.getElementById("equipmentFurther").value);}
		document.getElementById("experience_").value = document.getElementById("experience").options[document.getElementById("experience").selectedIndex].value;
		
		loadStep3();
	}
}