
var passImg = '<img src="images/ok.gif" class="ticker" />';
var failImg ='<img src="images/cancel.gif" class="ticker" /> ';

var gContinue = true;
function attach(objInput)
{
	sVal = objInput.value; //get value inside of input field
	var sFeedBack; //feedback is the feedback message sent back to the user
	gContinue = true; 
	
	sRules = objInput.className.split(' '); // get all the rules from the input box classname
	sValidate = sRules[0]; //validate means we will validate the field
	sRequired = sRules[1]; // required means field is required
	sTypeCheck = sRules[2]; //typecheck are additional validation rules (ie. email, phone, date)
	sFeedbackLoc = sRules[3]; //feedbackLoc is the td id where feedback is sent to.
	sFeedback = validateRequired (sRequired, sVal, sTypeCheck); //validateRequired() checks if it is required and then sends back feedback
	
	if(objInput.name=='size_predefined' && objInput.value=='custom'){
		vform=document.getElementById('order_process');
		vform.size_width.disabled=false;
		vform.size_height.disabled=false;
		vform.size_width.style.backgroundColor = '#666';
		vform.size_height.style.backgroundColor = '#666';
	}else if(objInput.name=='size_predefined' && objInput.value!='custom'){
		vform=document.getElementById('order_process');
		vform.size_width.disabled=true;
		vform.size_width.style.backgroundColor = '#ccc';
		vform.size_height.disabled=true;
		vform.size_height.style.backgroundColor = '#ccc';
	}
	
	
			
		if (gContinue) //if it is required and blank gContinue is false and we don't validate anymore.  // this is done because if it is blank
		//it will also fail other tests.  We don't want to spam the user with INVALID EMAIL!! if the field is still blank.
		{
			// check the different validation cases (ie: email, phone, etc.)
			switch (sTypeCheck)
			
			{
				case "date":
					sFeedback = validateDate(sVal);
					break;
				case "email":
					sFeedback = validateEmail(sVal);
					break;
				case "phone":
					sFeedback = validatePhone(sVal);
					break;
				case "zip":
					sFeedback = validateZip(sVal);
					break;
				case "password":
					sFeedback = validatePassword(sVal);
					break;
				case "name":
					sFeedback = validateName(sVal);
					break;
				case "numeric":
					sFeedback = validateNumeric(sVal);
					break;
				case "tick":
					sFeedback = validateChecked(sTypeCheck);
					break;
				case "valr":
					sFeedback = valreq2(sVal);
					break;
					
			}
		}
			// after validation is complete return the feedback 
			currentInfo=document.getElementById(sFeedbackLoc);
			if(currentInfo){
				currentInfo.innerHTML = sFeedback;
				currentInfo.style.visibility="visible";
				;
				if(sFeedback=='Thank You'){
					//objInput.className="success";
						og = objInput.className;
						if(og.indexOf('required')){
							nc = og.replace('required','success');	
						}
						objInput.className = nc;
						currentInfo.style.color = '#fff';
				}else{
					trim=sFeedback.substr(0,7);
					if(trim=='Invalid' || sFeedback=='Required'){
						og = objInput.className;
						if(og.indexOf('success')){
							nc = og.replace('success','required');	
						}
						objInput.className = nc;
						currentInfo.style.color = '#fff';
						
						
					}
				}
			}
}


function validateRequired(sRequired, sVal, sTypecheck)
{
	if (sRequired == "required")  //check if required if not, continue validation script
	{
   		if (sVal == "") //if it is rquired and blank then it is an error and continues to be required
		{
			gContinue = false;
			return  failImg;
	 	}
  		else if (sTypecheck == "none")  //if its not blank and has no other validation requirements the field passes
		{
			return passImg;
		}
	}
}

function valreq2(sVal){
	if (sVal == "") //if it is rquired and blank then it is an error and continues to be required
		{
		
			return  failImg;
	 	}
  		else  //if its not blank and has no other validation requirements the field passes
		{
			return passImg;
		}
}


function validateEmail(sVal)
{
	
// our email regular expression (http://www.regexlib.com)
 var regex=/^[a-zA-Z0-9._-]+@([a-zA-Z0-9.-]+\.)+[a-zA-Z0-9.-]{2,4}$/;
 
	// do the comparison, if we have a match write thank you or else the email is invalid
	if (regex.test(sVal))
	{
      return passImg;
	}
	else
	{
      return failImg;
	}
}



function validateChecked(sVal){
	chkbx = document.getElementById(sVal);
	//alert(sVal);
	if (chkbx.checked==true){
	//if (sval==true){	
		return passImg;
	}else{
		return "Please tick the box to acknowledge the following:";
	}

}


function validateName(sVal)
{ 
//This is the simplest RegEx for validating someone's name. The name can contain only alphabets(in either case) & 
//should be of minimum length 4 & maximum length 32. Only white spaces are allowed apart from alphabets.
//Matches: 	[some body], [hey there], [hello] (http://www.regexlib.com)
 var regex=/^([a-zA-z\s0-9-]{4,32})$/;
 
	// do the comparison, if we have a match write thank you or else the email is invalid
	if (regex.test(sVal))
	{
      return passImg;
	}
	else
	{
      return failImg;
	}
}


function validateNumeric(sVal)
{ 
//Input for Numeric values. Handles negatives, and comma formatted values. Also handles a single decimal point
//Matches: 	[5,000], [-5,000], [100.044] (http://www.regexlib.com)
 var regex=/^([\s\+\(\)\-0-9-]{7,32})$/;
 
	// do the comparison, if we have a match write thank you or else the email is invalid
	if (regex.test(sVal))
	{
      return passImg;
	}
	else
	{
      return failImg;
	}
}

//Created By: Chris Campbell
//www.particletree.com

var gErrors = 0; //number of errors is set to none to begin with

function validate()
{

arr_msgs = new Array('Required','Required','Required','Required','Required','You must select a file to upload','Please select size','Please select colour option','Please select a payment method','Please tick the box to acknowledge the following:');
var rules; 
rules = document.getElementsBySelector('span.rules');
//loop through all the <td> elements 
	for (i=0; i<rules.length; i++)
		{
		// if the class name of that td element is rules check to see if there are error warnings
				//if there is a thank you or its blank then it passes
				if (rules[i].innerHTML.indexOf("ok.gif") != -1 )
				{
					;
				rules[i].style.color = '#000000';//the color is changed to blank or stays black
				}
				else
				{
					
				gErrors = gErrors + 1; //the error count increases by 1
				currentRule=document.getElementById(rules[i].id)
				currentRule.innerHTML=failImg+arr_msgs[i];
				rules[i].style.color = '#f27917';
				rules[i].style.visibility="visible";
				//error messages are changed to red
				}
				
		}
		

			
		
		
		
		if (gErrors > 0){
			//if there are any errors give a message
			alert ("Please make sure all fields are properly completed.  Errors are marked with crosses!");
			gErrors = 0;// reset errors to 0
			return false;
		}
		
		else 
		{
			//alert("The Form Is Valid!");
			return true;//set this to true in practice to allow the form to submit
		}
	

}
