/* Scriptmodule voor formulier verfraaiing
   
   (C) 2008 vizi

   'Progressive enhancement' implementatie van fancy formulier interactie
   
   Geen event handling in XHTML nodig; detectie dmv id op form
   
   Plaats:  /scripts/class_formfactory.js
   Revisie: v1, mei 2008

 */


/*  GLOBALE VARIABELEN EN CONSTANTEN
 *
 */
var emailValid = /^[a-zA-Z0-9\.\-\_]+\@[a-zA-Z0-9\.\-\_]+\.[a-zA-Z]{2,}$/; // Regexp voor mailadres
var formMsg = new Array();
formMsg['nl'] = new Array();
formMsg['nl']['realname'] = "Vult u dit veld ook in? Wij zouden graag weten met wie we contact kunnen opnemen.";
formMsg['nl']['email'] = "Er lijkt iets mis te zijn met het e-mailadres. Wilt u deze extra controleren?";
formMsg['nl']['message'] = "Laat ons weten waarover u contact opneemt.";

formMsg['en'] = new Array();
formMsg['en']['realname'] = "Please fill out this field. We'd really like to know who to contact!";
formMsg['en']['email'] = "There may be an error in your email address. Would you please check it one more time?";
formMsg['en']['message'] = "Please inform us of the nature of your enquiry.";


/*  FORMFACTORY INIT
 *
 */
function form_factory_init()
{
	if (document.getElementsByTagName && document.getElementById)
	{
		// Haal het formulier op, en ga door indien aanwezig.
		var theForm = document.getElementById('contact-form');
		if (!theForm) return;
		
		// Hang formulier check aan form submit event.
		theForm.targetSubmitHandler = check_form;
		dispatch(theForm, "submit", "targetSubmitHandler");

		// Haal inputvelden op
		var allInputs = theForm.getElementsByTagName("input");

		// Loop ze na en hang checks aan de inputvelden die verplicht zijn.
		for (var i = 0; i < allInputs.length; i++)
		{
			if (allInputs[i].className.indexOf("required") > -1)
			{
				// Check bij verandering.
				allInputs[i].targetHandler = check_input;
				dispatch(allInputs[i], "change", "targetHandler");

				// En check tijdens init, indien veld niet leeg is.
				if (allInputs[i].value != "")
				{
					check_input_from_id(allInputs[i].id);
				}
			}
		}

		// Haal ook textareas op.
		var allTextareas = theForm.getElementsByTagName("textarea");

		// Loop ze na en hang checks aan de inputvelden die verplicht zijn.
		for (var i = 0; i < allTextareas.length; i++)
		{
			if (allTextareas[i].className.indexOf("required") > -1)
			{
				// Check bij verandering.
				allTextareas[i].targetHandler = check_input;
				dispatch(allTextareas[i], "change", "targetHandler");

				// En check tijdens init, indien veld niet leeg is.
				if (allTextareas[i].value != "")
				{
					check_input_from_id(allTextareas[i].id);
				}
			}
		}
	}
}



/*  CHECKS OP FORMULIER & INVULVELDEN
 *
 */
function check_input()
{
	return check_input_from_id(this.id);
}

function check_form(e)
{
	if (validate_form()) return true;
	
	if (this.blur) this.blur();
	
	// Voorkom volgen hyperlink door afbreken van event propagation.
	e = (e) ? e : ((event) ? event : null);
	
	if (e && e.returnValue)
	{
		// Zet specifieke property voor IE.
		e.returnValue = false;
	}
	else if (e && e.preventDefault)
	{
		// Method voor Gecko's.
		e.preventDefault();
	}
	else
	{
		// Klassieke return voor andere browsers.
		return false;
	}
}


function check_input_from_id(inputId)
{
	var inputField = document.getElementById(inputId);
	var inputDialog = inputField.parentNode.getElementsByTagName("b")[0];
	inputField.isValid = validate_input_value(inputField)
	
	if (inputField.isValid && inputDialog.className != "ok")
	{
		// Mooi, ingevulde tekst is in orde.
		inputDialog.innerHTML = "";
		inputDialog.className = "ok";

		if (validate_form())
		{
			enable_button('contact-submit');
		}
	}
	else if (!inputField.isValid && inputDialog.className != "notok")
	{
		// Oeps, er is iets niet in orde.
		inputDialog.innerHTML = formMsg[igbLanguage][inputId];
		inputDialog.className = "notok";

		disable_button('contact-submit');
	}
	return inputField.isValid
}

function validate_input_value(inputField)
{
	var inputValid = true;
	if (typeof inputField.value == "undefined" 
	    || inputField.value == ""
	    || (inputField.id == "email" && !emailValid.test(inputField.value)))
	{
		inputValid = false;
	}
	return inputValid;
}

function validate_form()
{
	var theForm = document.getElementById('contact-form');
	if (typeof theForm != "object") return;
	
	var formValid = true;
	
	// Haal inputvelden op
	var allInputs = theForm.getElementsByTagName("input");

	// Loop ze na.
	for (var i = 0; i < allInputs.length; i++)
	{
		if ((allInputs[i].className.indexOf("required") > -1)
		 && (!allInputs[i].isValid))
		{
			formValid = false;
			//console.log("Input check: " + allInputs[i].id + " :: " + allInputs[i].isValid + " :: " + allInputs[i].value);
		}
	}
	
	// Haal textarea's op
	var allTextareas = theForm.getElementsByTagName("textarea");

	// Loop ze na.
	for (var i = 0; i < allTextareas.length; i++)
	{
		if ((allTextareas[i].className.indexOf("required") > -1)
		 && (!allTextareas[i].isValid))
		{
			formValid = false;
			//console.log("Textarea check: " + allTextareas[i].id + " :: " + allTextareas[i].isValid + " :: " + allTextareas[i].value);
		}
	}
	return formValid;
}



/*  HELPERS: SUBMITKNOP AAN- OF UITZETTEN
 *
 */
function enable_button(buttonId)
{
	//console.log("Enable button");
	var button = document.getElementById(buttonId);
	if (!button) return false;
	button.src = button.src.replace("off", "on");
}

function disable_button(buttonId)
{
	//console.log("Disable button");
	var button = document.getElementById(buttonId);
	if (!button) return false;
	button.src = button.src.replace("on", "off");
}


// Hang script in window.onload ketting.
window.targetFormInitHandler = form_factory_init;
dispatch(window, "load", "targetFormInitHandler");