///////////////////////////////////////////////////////////////////
//// 
//// website utilities - A.R. Galiano ( argaliano@optonline.com )
////
///////////////////////////////////////////////////////////////////

///////////////////////////////////////////////////////////////////
//// simple form validator

/*

USAGE:

This validator mis-uses the css class attribute to specify validation requirements.
The class attribute is both "safe" to use in WordPress, and easily accessible in JS.

Sample syntax:

--------------------------------------------------------

<form id="form-id" ... >
<input type="text"     class="valid-required" ... />
<input type="text"     class="valid-email" ... />
<input type="text"     class="valid-phone" ... />
<input type="text"     class="valid-zip" ... />
<input type="textarea" class="valid-required" ... ></textarea>
<input type="select"   class="valid-required" ... >
<input type="submit"   onclick="validate('form-id')"... />
</form>

------------------------------------------------------------

The "classes" trigger validation as follows:

valid-required: non-null text value or selection (all inputs)
valid-email:    valid email address (text only)
valid-phone:    text min length 10 characters (text only)

If none of these classes is specified for a field, the validator simply skips it. These names
will hopefully not collide with any real css classes that may be in use.

Single selects ( drop-down lists ) require a choice other than the first one, which must be set up as the default. 
Multiple selects require any choice at all.

For radio buttons, just one button in a group needs to be marked required to trigger validation on the entire group.
It is best to mark the first one in the group, or all of them. Radio buttons are inherently messy.

The validate function takes the form id as a parameter, allowing multiple forms on a page. This is a simple
text string. The function knows nothing about the fields, nor does it need to. All set-up is done in the
html, no programming is required. Error messages are generic, the user is guided with color highlighting.

*/

function validate( frm )
{
emailfilter=/^\w+[\+\.\w-]*@([\w-]+\.)*\w+[\w-]*\.([a-z]{2,4}|\d+)$/i ; //// by Michael Cooper

zipfilter=/(^\d{5}$)|(^\d{5}-\d{4}$)/; 

theform = document.forms[frm] ;

if ( typeof theform  == "undefined" )
  {  
  alert( "Error - form not found" ) ;
  return false ;
  }

var radiosval = new Array();
var radiosreq = new Array();

//// collect all radio button states
for( i=0 ; i<theform.length ; i++ )
  {
  thefield = theform.elements[i] ;
  if( thefield.type == "radio" )
    {
    if( radiosval[thefield.name] == undefined ) radiosval[thefield.name] = 0 ;
    if( thefield.checked ) radiosval[thefield.name] = 1 ;
    if( thefield.className == "valid-required" && radiosreq[thefield.name] == undefined ) radiosreq[thefield.name] = 1 ;
    }
  }

//// validate fields
for( i=0 ; i<theform.length ; i++ )
  {
  thefield = theform.elements[i] ;

  //alert( thefield.name + " - " + thefield.type + " - " + thefield.className ) ;

  if ( thefield.type == "text" && thefield.className == "valid-required" )
  if ( thefield.value.length < 1 )
    {
    thefield.focus();
    thefield.style.background = "yellow" ;
    alert( "Please enter a value" ) ;
    return false ;
    } else { thefield.style.background = "white" ; } ;

  if ( thefield.type == "text" && thefield.className == "valid-phone" )
  if ( thefield.value.length < 10 )
    {
    thefield.focus();
    thefield.style.background = "yellow" ;
    alert( "Please enter a valid phone number" ) ;
    return false ;
    } else { thefield.style.background = "white" ; } ;
	
   if ( thefield.type == "text" && thefield.className == "valid-zip" )
   if ( ! zipfilter.test(thefield.value) )
    {
    thefield.focus();
    thefield.style.background = "yellow" ;
    alert( "Please enter a valid zip code" ) ;
    return false ;
    } else { thefield.style.background = "white" ; } ;

  if ( thefield.type == "text" && thefield.className == "valid-email" )
  if ( ! emailfilter.test(thefield.value) )
    {
    thefield.focus();
    thefield.style.background = "yellow" ;
    alert( "Please enter a valid email address" ) ;
    return false ;
    } else { thefield.style.background = "white" ; } ;

  if( thefield.type == "textarea" && thefield.className == "valid-required" )
  if( thefield.value.length < 1 )
    {
    thefield.focus();
    thefield.style.background = "yellow" ;
    alert( "Please enter a value" ) ;
    return false;
    } else { thefield.style.background = "white" ; } ;

  if( thefield.type == "select-one" && thefield.className == "valid-required" )
  if( thefield.selectedIndex == 0 )
    {
    thefield.focus();
    thefield.style.background = "yellow" ;
    alert( "Please make a selection" ) ;
    return false;
    } else { thefield.style.background = "white" ; } ;

  if( thefield.type == "select-multiple" && thefield.className == "valid-required" )
  if( thefield.selectedIndex == -1 )
    {
    thefield.focus();
    thefield.style.background = "yellow" ;
    alert( "Please make a selection" ) ;
    return false;
    } else { thefield.style.background = "white" ; }

  if ( radiosreq[thefield.name] != undefined ) 
    {
    if ( ! radiosval[thefield.name] ) 
      {
      for( j=0 ; j<theform.length ; j++ )
        { //// paint all elements
        tmp = theform.elements[j] ;
        if( tmp.name == thefield.name ) tmp.style.background = "yellow" ;
        }
      thefield.focus();
      alert( "Please make a selection" ) ;
      return false;
      } else { thefield.style.background = "white" ; }
    }  

  }

return true ;
}





