git.roojs.org Git - roojs1/blob - Roo/bootstrap/form/SecurePass.js

   1 /*
   2  * - LGPL
   3  *
   4  * Input
   5  *
   6  */
   7
   8 /**
   9  * @class Roo.bootstrap.form.SecurePass
  10  * @extends Roo.bootstrap.form.Input
  11  * Bootstrap SecurePass class
  12  * @cfg {Number} minimumStrength invalid if the strength of the password input is less than the minimum strength (from 0 to 3) (default 2)
  13  *
  14  *
  15  * @constructor
  16  * Create a new SecurePass
  17  * @param {Object} config The config object
  18  */
  19
  20 Roo.bootstrap.form.SecurePass = function (config) {
  21
  22     Roo.bootstrap.form.SecurePass.superclass.constructor.call(this, config);
  23 }
  24
  25 Roo.extend(Roo.bootstrap.form.SecurePass, Roo.bootstrap.form.Input, {
  26     minimumStrength : 2,
  27     // private
  28     meterWidth: 300,
  29     imageRoot: '/',
  30     // private
  31     strength: 0,
  32     // private
  33     _lastPwd: null,
  34     // private
  35     kCapitalLetter: 0,
  36     kSmallLetter: 1,
  37     kDigit: 2,
  38     kPunctuation: 3,
  39
  40     insecure: false,
  41     // private
  42     initEvents: function ()
  43     {
  44         Roo.bootstrap.form.SecurePass.superclass.initEvents.call(this);
  45
  46         if (this.el.is('input[type=password]') && Roo.isSafari) {
  47             this.el.on('keydown', this.SafariOnKeyDown, this);
  48         }
  49
  50         this.el.on('keyup', this.checkStrength, this, {buffer: 50});
  51     },
  52     // private
  53     onRender: function (ct, position)
  54     {
  55         Roo.bootstrap.form.SecurePass.superclass.onRender.call(this, ct, position);
  56         this.wrap = this.el.wrap({cls: 'x-form-field-wrap'});
  57         this.trigger = this.wrap.createChild({tag: 'div', cls: 'StrengthMeter ' + this.triggerClass});
  58
  59         this.trigger.createChild({
  60                    cn: [
  61                     {
  62                     //id: 'PwdMeter',
  63                     tag: 'div',
  64                     cls: 'roo-password-meter-grey col-xs-12',
  65                     style: {
  66                         //width: 0,
  67                         //width: this.meterWidth + 'px'
  68                         }
  69                     },
  70                     {
  71                          cls: 'roo-password-meter-text'
  72                     }
  73                 ]
  74         });
  75
  76
  77         if (this.hideTrigger) {
  78             this.trigger.setDisplayed(false);
  79         }
  80         this.setSize(this.width || '', this.height || '');
  81     },
  82     // private
  83     onDestroy: function ()
  84     {
  85         if (this.trigger) {
  86             this.trigger.removeAllListeners();
  87             this.trigger.remove();
  88         }
  89         if (this.wrap) {
  90             this.wrap.remove();
  91         }
  92         Roo.bootstrap.form.TriggerField.superclass.onDestroy.call(this);
  93     },
  94     // private
  95     checkStrength: function ()
  96     {
  97         var pwd = this.inputEl().getValue();
  98         if (pwd == this._lastPwd) {
  99             return;
 100         }
 101
 102         var strength;
 103         if (this.ClientSideStrongPassword(pwd)) {
 104             strength = 3;
 105         } else if (this.ClientSideMediumPassword(pwd)) {
 106             strength = 2;
 107         } else if (this.ClientSideWeakPassword(pwd)) {
 108             strength = 1;
 109         } else {
 110             strength = 0;
 111         }
 112
 113         Roo.log('strength1: ' + strength);
 114
 115         //var pm = this.trigger.child('div/div/div').dom;
 116         var pm = this.trigger.child('div/div');
 117         pm.removeClass(Roo.bootstrap.form.SecurePass.meterClass);
 118         pm.addClass(Roo.bootstrap.form.SecurePass.meterClass[strength]);
 119
 120
 121         var pt = this.trigger.child('/div').child('>*[class=roo-password-meter-text]').dom;
 122
 123         pt.innerHTML = Roo.bootstrap.form.SecurePass.meterLabel + '&nbsp;' + Roo.bootstrap.form.SecurePass.pwdStrengths[strength];
 124
 125         this._lastPwd = pwd;
 126     },
 127     reset: function ()
 128     {
 129         Roo.bootstrap.form.SecurePass.superclass.reset.call(this);
 130
 131         this._lastPwd = '';
 132
 133         var pm = this.trigger.child('div/div');
 134         pm.removeClass(Roo.bootstrap.form.SecurePass.meterClass);
 135         pm.addClass('roo-password-meter-grey');
 136
 137
 138         var pt = this.trigger.child('/div').child('>*[class=roo-password-meter-text]').dom;
 139
 140         pt.innerHTML = '';
 141         this.inputEl().dom.type='password';
 142     },
 143     // private
 144     validateValue: function (value)
 145     {
 146         if (!Roo.bootstrap.form.SecurePass.superclass.validateValue.call(this, value)) {
 147             return false;
 148         }
 149         if (value.length == 0) {
 150             if (this.allowBlank) {
 151                 this.clearInvalid();
 152                 return true;
 153             }
 154
 155             this.invalidText = Roo.bootstrap.form.SecurePass.errors.PwdEmpty;
 156             return false;
 157         }
 158
 159         if(this.insecure){
 160             return true;
 161         }
 162
 163         if (!value.match(/[\x21-\x7e]+/)) {
 164             this.invalidText = Roo.bootstrap.form.SecurePass.errors.PwdBadChar;
 165             return false;
 166         }
 167         if (value.length < 6) {
 168             this.invalidText = Roo.bootstrap.form.SecurePass.errors.PwdShort;
 169             return false;
 170         }
 171         if (value.length > 16) {
 172             this.invalidText = Roo.bootstrap.form.SecurePass.errors.PwdLong;
 173             return false;
 174         }
 175         var strength;
 176         if (this.ClientSideStrongPassword(value)) {
 177             strength = 3;
 178         } else if (this.ClientSideMediumPassword(value)) {
 179             strength = 2;
 180         } else if (this.ClientSideWeakPassword(value)) {
 181             strength = 1;
 182         } else {
 183             strength = 0;
 184         }
 185
 186
 187         if (strength < this.minimumStrength) {
 188             this.invalidText = Roo.bootstrap.form.SecurePass.errors.TooWeak;
 189             return false;
 190         }
 191
 192
 193         console.log('strength2: ' + strength);
 194
 195         //var pm = this.trigger.child('div/div/div').dom;
 196
 197         var pm = this.trigger.child('div/div');
 198         pm.removeClass(Roo.bootstrap.form.SecurePass.meterClass);
 199         pm.addClass(Roo.bootstrap.form.SecurePass.meterClass[strength]);
 200
 201         var pt = this.trigger.child('/div').child('>*[class=roo-password-meter-text]').dom;
 202
 203         pt.innerHTML = Roo.bootstrap.form.SecurePass.meterLabel + '&nbsp;' + Roo.bootstrap.form.SecurePass.pwdStrengths[strength];
 204
 205         return true;
 206     },
 207     // private
 208     CharacterSetChecks: function (type)
 209     {
 210         this.type = type;
 211         this.fResult = false;
 212     },
 213     // private
 214     isctype: function (character, type)
 215     {
 216         switch (type) {
 217             case this.kCapitalLetter:
 218                 if (character >= 'A' && character <= 'Z') {
 219                     return true;
 220                 }
 221                 break;
 222
 223             case this.kSmallLetter:
 224                 if (character >= 'a' && character <= 'z') {
 225                     return true;
 226                 }
 227                 break;
 228
 229             case this.kDigit:
 230                 if (character >= '0' && character <= '9') {
 231                     return true;
 232                 }
 233                 break;
 234
 235             case this.kPunctuation:
 236                 if ('!@#$%^&*()_+-=\'";:[{]}|.>,</?`~'.indexOf(character) >= 0) {
 237                     return true;
 238                 }
 239                 break;
 240
 241             default:
 242                 return false;
 243         }
 244
 245     },
 246     // private
 247     IsLongEnough: function (pwd, size)
 248     {
 249         return !(pwd == null || isNaN(size) || pwd.length < size);
 250     },
 251     // private
 252     SpansEnoughCharacterSets: function (word, nb)
 253     {
 254         if (!this.IsLongEnough(word, nb))
 255         {
 256             return false;
 257         }
 258
 259         var characterSetChecks = new Array(
 260             new this.CharacterSetChecks(this.kCapitalLetter), new this.CharacterSetChecks(this.kSmallLetter),
 261             new this.CharacterSetChecks(this.kDigit), new this.CharacterSetChecks(this.kPunctuation)
 262         );
 263
 264         for (var index = 0; index < word.length; ++index) {
 265             for (var nCharSet = 0; nCharSet < characterSetChecks.length; ++nCharSet) {
 266                 if (!characterSetChecks[nCharSet].fResult && this.isctype(word.charAt(index), characterSetChecks[nCharSet].type)) {
 267                     characterSetChecks[nCharSet].fResult = true;
 268                     break;
 269                 }
 270             }
 271         }
 272
 273         var nCharSets = 0;
 274         for (var nCharSet = 0; nCharSet < characterSetChecks.length; ++nCharSet) {
 275             if (characterSetChecks[nCharSet].fResult) {
 276                 ++nCharSets;
 277             }
 278         }
 279
 280         if (nCharSets < nb) {
 281             return false;
 282         }
 283         return true;
 284     },
 285     // private
 286     ClientSideStrongPassword: function (pwd)
 287     {
 288         return this.IsLongEnough(pwd, 8) && this.SpansEnoughCharacterSets(pwd, 3);
 289     },
 290     // private
 291     ClientSideMediumPassword: function (pwd)
 292     {
 293         return this.IsLongEnough(pwd, 7) && this.SpansEnoughCharacterSets(pwd, 2);
 294     },
 295     // private
 296     ClientSideWeakPassword: function (pwd)
 297     {
 298         return this.IsLongEnough(pwd, 6) || !this.IsLongEnough(pwd, 0);
 299     }
 300
 301 });
 302
 303 Roo.bootstrap.form.SecurePass.errors = {
 304     PwdEmpty: "Please type a password, and then retype it to confirm.",
 305     PwdShort: "Your password must be at least 6 characters long. Please type a different password.",
 306     PwdLong: "Your password can't contain more than 16 characters. Please type a different password.",
 307     PwdBadChar: "The password contains characters that aren't allowed. Please type a different password.",
 308     IDInPwd: "Your password can't include the part of your ID. Please type a different password.",
 309     FNInPwd: "Your password can't contain your first name. Please type a different password.",
 310     LNInPwd: "Your password can't contain your last name. Please type a different password.",
 311     TooWeak: "Your password is Too Weak."
 312 };
 313
 314 Roo.bootstrap.form.SecurePass.meterLabel = "Password strength:";
 315 Roo.bootstrap.form.SecurePass.pwdStrengths = ["Too Weak", "Weak", "Medium", "Strong"];
 316 Roo.bootstrap.form.SecurePass.meterClass = [
 317     "roo-password-meter-tooweak",
 318     "roo-password-meter-weak",
 319     "roo-password-meter-medium",
 320     "roo-password-meter-strong",
 321     "roo-password-meter-grey"
 322 ];