/*

* This notice must be untouched at all times.



============= META ==================

@name : passwordvalidator.js

@version : 0.9

@copyright (c) 2005 Sarat Pediredla. All rights reserved.

@last-modified: 10/06/2005

@url : http://sarat.xcelens.co.uk

@latest-version-url : http://sarat.xcelens.co.uk/2005/06/10/password-validator/

======================================



============== DESCRIPTION =============

This code snippet creates an dynamic password validator for a password fields in a form resembling the functionality provided by ASP.Net.

=========================================



========== INSTALLATION AND USAGE =============

1.  Include the javascript file (passwordvalidator.js) in the head or body of your HTML page

	Example: <script language="javascript" src="passwordvalidator.js"></script>

2.  Place the following password calling code IMMEDIATELY after the password field you want to validate

     and replace passwordid with the ID of the password field being validated. Keep the double qoutes.

	Example: <script language="javascript">

				createPasswordValidator("passwordid");

			 </script>

==========================================



And thats it! You have your own password field validator.



============= FEATURES ==================

- Editable validation settings to create a custom password field

- i18n support for strings

- Customisable UI

- Use on any number of password fields

============================================



============= FUTURE PLANS ==================

- Allow validator to block all submits until field is validated

- Allow automatic addition of validator to all password fields by just including

- Create XML markup tag syntax to enable designers to create validator as in .NET

==============================================



LICENSE: LGPL



This library is free software; you can redistribute it and/or

modify it under the terms of the GNU Lesser General Public

License (LGPL) as published by the Free Software Foundation; either

version 2.1 of the License, or (at your option) any later version.



This library is distributed in the hope that it will be useful,

but WITHOUT ANY WARRANTY; without even the implied warranty of

MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.



For more details on the GNU Lesser General Public License,

see http://www.gnu.org/copyleft/lesser.html

*/



/************** OPTIONAL EDIT BELOW THIS LINE  ***********************/

/************** User specified settings *******************/

// Validation settings

var minLength = 3;             // Minimum length of password

var maxLength = 12;            // Maximum length of password

var noSpecialChars = false;     // Sets if special characters (punctuation etc.) can be in password

var isPasswordRequired = true;  // Sets if the password is a required field

var showTip = false;             // Show a tip to users if their password is not perfect



// Custom strings for personalisation or i18n

var strRequired = '<table border="0" cellpadding="0" cellspacing="0" style="border-collapse: collapse" bordercolor="#111111" width="175" dir="rtl" id="AutoNumber17"><tr>      <td width="57" align="center" bgcolor="#FFDA70"><span style="font-size: 1pt" lang="ar-sa">&nbsp;</span></td><td width="2" valign="middle" align="center"><span style="font-size: 1pt" lang="ar-sa">&nbsp;</span></td>    <td width="57" align="center" bgcolor="#FFDA70"><span style="font-size: 1pt" lang="ar-sa">&nbsp;</span></td><td width="2" valign="middle" align="center"><span style="font-size: 1pt" lang="ar-sa">&nbsp; </span></td>  <td width="57" align="center" bgcolor="#FFDA70"><span style="font-size: 1pt" lang="ar-sa">&nbsp;</span></td></tr><tr><td width="57" valign="middle" align="center"><p style="margin-top: 0; margin-bottom: 0"><span lang="ar-sa">        <font size="1" face="MS Sans Serif" color="#FFDA70">سهلة</font></span></td><td width="2" valign="middle" align="center"></td><td width="57" valign="middle" align="center"><p style="margin-bottom: 0"><span lang="ar-sa">        <font size="1" face="MS Sans Serif" color="#FFDA70">متوسطة</font></span></td><td width="2" valign="middle" align="center"></td><td width="57" valign="middle" align="center"><p style="margin-top: 0; margin-bottom: 0"><span lang="ar-sa"><font size="1" face="MS Sans Serif" color="#FFDA70">صعبة</font></span></td></tr></table>';     // Displays when nothing is entered & password is required

var strTooShort = "قصيرة";   // Displays when password is less than minLength

var strTooLong = "طويلة";      // Displays when password is too long

var strSpecialChars = "Special characters not allowed";     // Displays when user enters special chars

var strWeak = '<table border="0" cellpadding="0" cellspacing="0" style="border-collapse: collapse" bordercolor="#111111" width="175" dir="rtl" id="AutoNumber17"><tr>    <td width="57" align="center" bgcolor="#FF0000"><span style="font-size: 1pt" lang="ar-sa">&nbsp;</span></td><td width="2" valign="middle" align="center"><span style="font-size: 1pt" lang="ar-sa">&nbsp;</span></td>    <td width="57" align="center" bgcolor="#FFDA70"><span style="font-size: 1pt" lang="ar-sa">&nbsp;</span></td><td width="2" valign="middle" align="center"><span style="font-size: 1pt" lang="ar-sa">&nbsp; </span></td>  <td width="57" align="center" bgcolor="#FFDA70"><span style="font-size: 1pt" lang="ar-sa">&nbsp;</span></td></tr><tr><td width="57" valign="middle" align="center"><p style="margin-top: 0; margin-bottom: 0"><span lang="ar-sa">    <font size="1" face="MS Sans Serif" color="#FF0000">سهلة</font></span></td><td width="2" valign="middle" align="center"></td><td width="57" valign="middle" align="center"><p style="margin-bottom: 0"><span lang="ar-sa">        <font size="1" face="MS Sans Serif" color="#FFDA70">متوسطة</font></span></td><td width="2" valign="middle" align="center"></td><td width="57" valign="middle" align="center"><p style="margin-top: 0; margin-bottom: 0"><span lang="ar-sa"><font size="1" face="MS Sans Serif" color="#FFDA70">صعبة</font></span></td></tr></table>';       // Displays when password is weak strength

var strMedium = '<table border="0" cellpadding="0" cellspacing="0" style="border-collapse: collapse" bordercolor="#111111" width="175" dir="rtl" id="AutoNumber17"><tr>  <td width="57" align="center" bgcolor="#0000FF"><span style="font-size: 1pt" lang="ar-sa">&nbsp;</span></td><td width="2" valign="middle" align="center"><span style="font-size: 1pt" lang="ar-sa">&nbsp;</span></td>  <td width="57" align="center" bgcolor="#0000FF"><span style="font-size: 1pt" lang="ar-sa">&nbsp;</span></td><td width="2" valign="middle" align="center"><span style="font-size: 1pt" lang="ar-sa">&nbsp; </span></td>  <td width="57" align="center" bgcolor="#FFDA70"><span style="font-size: 1pt" lang="ar-sa">&nbsp;</span></td></tr><tr><td width="57" valign="middle" align="center"><p style="margin-top: 0; margin-bottom: 0"><span lang="ar-sa"><font size="1" face="MS Sans Serif" color="#FFDA70">سهلة</font></span></td><td width="2" valign="middle" align="center"></td><td width="57" valign="middle" align="center"><p style="margin-bottom: 0"><span lang="ar-sa">    <font size="1" face="MS Sans Serif" color="#0000FF">متوسطة</font></span></td><td width="2" valign="middle" align="center"></td><td width="57" valign="middle" align="center"><p style="margin-top: 0; margin-bottom: 0"><span lang="ar-sa"><font size="1" face="MS Sans Serif" color="#FFDA70">صعبة</font></span></td></tr></table>';   // Displays when password is medium strength

var strStrong = '<table border="0" cellpadding="0" cellspacing="0" style="border-collapse: collapse" bordercolor="#111111" width="175" dir="rtl" id="AutoNumber17"><tr><td width="57" align="center" bgcolor="#008000"><span style="font-size: 1pt" lang="ar-sa">&nbsp;</span></td><td width="2" valign="middle" align="center"><span style="font-size: 1pt" lang="ar-sa">&nbsp;</span></td><td width="57" align="center" bgcolor="#008000"><span style="font-size: 1pt" lang="ar-sa">&nbsp;</span></td><td width="2" valign="middle" align="center"><span style="font-size: 1pt" lang="ar-sa">&nbsp; </span></td><td width="57" align="center" bgcolor="#008000"><span style="font-size: 1pt" lang="ar-sa">&nbsp;</span></td></tr><tr><td width="57" valign="middle" align="center"><p style="margin-top: 0; margin-bottom: 0"><span lang="ar-sa"><font size="1" face="MS Sans Serif" color="#FFDA70">سهلة</font></span></td><td width="2" valign="middle" align="center"></td><td width="57" valign="middle" align="center"><p style="margin-bottom: 0"><span lang="ar-sa"><font size="1" face="MS Sans Serif" color="#FFDA70">متوسطة</font></span></td><td width="2" valign="middle" align="center"></td><td width="57" valign="middle" align="center"><p style="margin-top: 0; margin-bottom: 0"><span lang="ar-sa"><font size="1" face="MS Sans Serif" color="#008000">صعبة</font></span></td></tr></table>';          // Displays when password is perfect



// UI settings

var BackgroundColor = "#FFFFFF";     // Background color of validator

var TextColor = "#FF0000";           // Text color of validator

var TextFontFamily = "Verdana,Arial"; // Font Family

var TextSize = "smaller";               // Text font size

var TextBold = false;              // Is text bold?





/*************** End of user specified settings **********/

/*************** DO NOT EDIT BELOW THIS LINE ****************/





var tip = 'Tips on creating the right password\\n1.Should be between '+minLength+' and '+maxLength+' characters \\n2.Should not be a word from the common dictionary. These passwords are easiest to guess!\\n3.Should have atleast one uppercase letter, one lowercase letter and one digit.';



/************** Create the validator **************/

function createPasswordValidator(elementToValidate)

	{



		var elm;

		if(!(elm = document.getElementById(elementToValidate)))

		{

			alert('Password Validator could not find your password field identified by id='+elementToValidate);

			return;

		}



		var output = '<div id="_pwdvalid'+elementToValidate+'" class="pwdvalid"><table border="0" cellpadding="0" cellspacing="0" style="border-collapse: collapse" bordercolor="#111111" width="175" dir="rtl" id="AutoNumber17"><tr>      <td width="57" align="center" bgcolor="#FFDA70"><span style="font-size: 1pt" lang="ar-sa">&nbsp;</span></td><td width="2" valign="middle" align="center"><span style="font-size: 1pt" lang="ar-sa">&nbsp;</span></td>    <td width="57" align="center" bgcolor="#FFDA70"><span style="font-size: 1pt" lang="ar-sa">&nbsp;</span></td><td width="2" valign="middle" align="center"><span style="font-size: 1pt" lang="ar-sa">&nbsp; </span></td>  <td width="57" align="center" bgcolor="#FFDA70"><span style="font-size: 1pt" lang="ar-sa">&nbsp;</span></td></tr><tr><td width="57" valign="middle" align="center"><p style="margin-top: 0; margin-bottom: 0"><span lang="ar-sa">        <font size="1" face="MS Sans Serif" color="#FFDA70">سهلة</font></span></td><td width="2" valign="middle" align="center"></td><td width="57" valign="middle" align="center"><p style="margin-bottom: 0"><span lang="ar-sa">        <font size="1" face="MS Sans Serif" color="#FFDA70">متوسطة</font></span></td><td width="2" valign="middle" align="center"></td><td width="57" valign="middle" align="center"><p style="margin-top: 0; margin-bottom: 0"><span lang="ar-sa"><font size="1" face="MS Sans Serif" color="#FFDA70">صعبة</font></span></td></tr></table></div>';

		document.write(output);



		var oldEventCode = (elm.onkeyup) ? elm.onkeyup : function () {};

		elm.onkeyup = function () {oldEventCode(); validatePassword(elm.id)};

		oldEventCode = (elm.onmouseout) ? elm.onmouseout : function () {};

		elm.onmouseout = function() {oldEventCode(); validatePassword(elm.id)};

	}



function validatePassword(elementToValidate)

	{

		var elm;

		if(!(elm = document.getElementById(elementToValidate)))

		{

			return;

		}

		var passwordDiv = document.getElementById("_pwdvalid"+elementToValidate);

		var passwordString = elm.value;

		if(passwordString.length == 0)

		{

			passwordDiv.innerHTML = strRequired;

			return;

		}



		var strength = 0;



		if(passwordString.match(/[a-z-ا-ب-ت-ث-ج-ح-خ-د-ذ-ر-ز-س-ش-ص-ض-ط-ظ-ع-غ-ف-ق-ك-ل-م-ن-ه-و-ي]/))

		{

			strength++;

		}

		if(passwordString.match(/[A-Z-ء-ئ]/))

		{

			strength++;

		}

		if(passwordString.match(/\d/))

		{

			strength++;

		}

		if(passwordString.match(/\W/))

		{

			strength++;

		}

		switch(strength)

		{

			case 1: passwordDiv.innerHTML = strWeak;

					break;

			case 3: passwordDiv.innerHTML = strMedium;

					break;

			case 4: passwordDiv.innerHTML = strStrong;

					break;

		}

	}






