/*  (c) Fear of Mice
*   This library is GPL
*   www.fearofmice.co.uk
*
*   The Fear of Mice Quick Form Validation Library
*   -----------------------------------------------------------------
*   v.1.0 (December 2008)
*   A small set of javascript routines to check form fields before posting. Put your calls into the onclick event of the form tag
*   Usage : <form name="demo" onsubmit="return validateFormOnSubmit(this)" action="test.htm"> 
*/

function validateFormOnSubmitDemo(theForm) {
var reason = "";

  reason += validateUsername(theForm.username);
  reason += validatePassword(theForm.pwd);
  reason += validateEmail(theForm.email);
  reason += validatePhone(theForm.phone);
  reason += validateEmpty(theForm.from);
      
  if (reason != "") {
    alert("Some fields need correction:\n" + reason);
    return false;
  }

  return true;
}

/* The function below checks if a required field has been left empty. If the required field is blank, we return the error string to the main function. If it's not blank, the function returns an empty string.*/
function validateEmpty(fld) {
    var error = "";
 
    if (fld.value.length == 0) {
        fld.style.border = '1px solid red';
        error = "The required field has not been filled in.\n"
    } else {
        fld.style.border = '0';
    }
    return error;  
}

/*The function below checks if the user entered anything at all in the username field. If it's not blank, we check the length of the string and permit only usernames that are between 5 and 15 characters. 
   Next, we use the JavaScript regular expression /\W/ to forbid illegal characters from appearing in usernames. We want to allow only letters, numbers and underscopes.*/
function validateUsername(fld) {
    var error = "";
    var illegalChars = /\W/; // allow letters, numbers, and underscores
 
    if (fld.value == "") {
        fld.style.border = '1px solid red';
        error = "You didn't enter a username.\n";
    } else if ((fld.value.length < 5) || (fld.value.length > 15)) {
        fld.style.border = '1px solid red';
        error = "The username is the wrong length.\n";
    } else if (illegalChars.test(fld.value)) {
        fld.style.border = '1px solid red';
        error = "The username contains illegal characters.\n";
    } else {
        fld.style.border = '0';
    }
    return error;
}

/*The function below checks the password field for blankness and allow only letters and numbers - no underscopes this time. So we should use a new regular expression to forbid underscopes. 
   This one /[\W_]/ allow only letters and numbers. Next, we want to permit only passwords that contain letters and at least one numeral. For that we use the seacrh() method and two more 
   regular expressions: /(a-z)+/ and /(0-9)/.*/
function validatePassword(fld) {
    var error = "";
    var illegalChars = /[\W_]/; // allow only letters and numbers 
 
    if (fld.value == "") {
        fld.style.border = '1px solid red';
        error = "You didn't enter a password.\n";
    } else if ((fld.value.length < 7) || (fld.value.length > 15)) {
        error = "The password is the wrong length. \n";
        fld.style.border = '1px solid red';
    } else if (illegalChars.test(fld.value)) {
        error = "The password contains illegal characters.\n";
        fld.style.border = '1px solid red';
    } else if (!((fld.value.search(/(a-z)+/)) && (fld.value.search(/(0-9)+/)))) {
        error = "The password must contain at least one numeral.\n";
        fld.style.border = '1px solid red';
    } else {
        fld.style.border = '0';
    }
   return error;
}

/*Next we want to see if the email address the user entered is real. This means that the input data must contain at least an @ sign and a dot (.), Also, the @ must not be the first character of 
   the email address, and the last dot must at least be one character after the @ sign. At first we check if the user entered anything at all in the email field. Next, we use regular expression and 
   the test() method to check the field for a compliance. Also we will use trim() function that will trim leading whitespace off the string. This won't be perfect validation - it is possible to slip not compliant 
   addresses by it - but it's normally good enough.*/

function trim(s) {
  return s.replace(/^\s+|\s+$/, '');
}

function validateEmail(fld) {
    var error="";
    var tfld = trim(fld.value);                        // value of field with whitespace trimmed off
    var emailFilter = /^[^@]+@[^@.]+\.[^@]*\w\w$/ ;
    var illegalChars= /[\(\)\<\>\,\;\:\\\"\[\]]/ ;
   
    if (fld.value == "") {
        fld.style.border = '1px solid red';
        error = "You didn't enter an email address.\n";
    } else if (!emailFilter.test(tfld)) {              //test email for illegal characters
        fld.style.border = '1px solid red';
        error = "Please enter a valid email address.\n";
    } else if (fld.value.match(illegalChars)) {
        fld.style.border = '1px solid red';
        error = "The email address contains illegal characters.\n";
    } else {
        fld.style.border = '0';
    }
    return error;
}

/*The function below checks if the phone number is valid. At first we use regular expression and the replace() method to clear out any spacer characters. Next, we use the isNaN() function to check if the phone number 
   contain only numbers. At last we check the length of the string and permit only phone numbers with 10 digits.*/
function validatePhone(fld) {
    var error = "";
    var stripped = fld.value.replace(/[\(\)\.\-\ ]/g, '');    

   if (fld.value == "") {
        error = "You didn't enter a phone number.\n";
        fld.style.border = '1px solid red';
    } else if (isNaN(parseInt(stripped))) {
        error = "The phone number contains illegal characters.\n";
        fld.style.border = '1px solid red';
    } else if (!(stripped.length == 10)) {
        error = "The phone number is the wrong length. Make sure you included an area code.\n";
        fld.style.border = '1px solid red';
    }
    return error;
}