var i;
var fieldsets = document.getElementsByTagName('fieldset');

//WHEN THIS SCRIPT FILE IS CALLED, DO THIS:
//loop through all fieldsets and start eventbinding for the one of class="quest"
for (i=0; i<fieldsets.length; i++){
	if (fieldsets[i].className=='quest') fieldsets[i].onclick=highlightFieldsets;
}

//change the background color of clicked fieldset to blue
function highlightFieldsets(){
	this.style.backgroundColor='#f2f7f9';
	this.style.border = '1px solid #e0e9ec';
}

//resets the background color of all fieldset to gray upon reset
function resetFieldsets(){
	var fieldsets = document.getElementsByTagName('fieldset');

	for (i=0; i<fieldsets.length; i++){
		if (fieldsets[i].className=='quest') {
			fieldsets[i].style.backgroundColor='#fcfcfc';
			fieldsets[i].style.border = '1px solid #dddddd';
		}
	}
}


//check if the user has provided all required information (Firstname, Lastname, E-mail) and if so, change the background color for the address fieldset
function check_status(theForm, theFieldset){
	//completed...
	if (theForm.fname.value.length>3 && theForm.lname.value.length>3 && theForm.email.value.length>5) {
		theFieldset.style.backgroundColor ='#f2f7f9';
		theFieldset.style.border = '1px solid #e0e9ec';
	}
	
	//not completed...
	else {
		theFieldset.style.backgroundColor = '#eeeeee';
		theFieldset.style.border = '1px solid #cccccc';
	}
}


//validate form and provide user feedback
function validate_form(theForm)
{

  if (theForm.fname.value == "")
  {
	alert("Please enter a value for the \"First Name\" field.");
	theForm.fname.focus();
	return (false);
  }

  if (theForm.fname.value.length < 3)
  {
	alert("Please enter at least 3 characters in the \"First Name\" field.");
	theForm.fname.focus();
	return (false);
  }

  if (theForm.lname.value == "")
  {
	alert("Please enter a value for the \"Last Name\" field.");
	theForm.lname.focus();
	return (false);
  }

  if (theForm.lname.value.length < 3)
  {
	alert("Please enter at least 3 characters in the \"Last Name\" field.");
	theForm.lname.focus();
	return (false);
  }

  if (theForm.email.value == "")
  {
	alert("Please enter a value for the \"Email Address\" field.");
	theForm.email.focus();
	return (false);
  }

  if (theForm.email.value.length < 5)
  {
	alert("Please enter at least 5 characters in the \"Email Address\" field.");
	theForm.email.focus();
	return (false);
  }
  return (true);
}