mirror of https://github.com/BTCPrivate/copay.git
Merge pull request #904 from yemel/feature/better-password-formula
Implement bitpay's password strength checker
This commit is contained in:
commit
46e8de6314
11
index.html
11
index.html
|
@ -289,9 +289,8 @@
|
||||||
placeholder="Choose your password" name="joinPassword"
|
placeholder="Choose your password" name="joinPassword"
|
||||||
ng-model="$parent.joinPassword"
|
ng-model="$parent.joinPassword"
|
||||||
check-strength="passwordStrength"
|
check-strength="passwordStrength"
|
||||||
tooltip-html-unsafe="Password strength:
|
tooltip-html-unsafe="Strength:
|
||||||
<i>{{passwordStrength}}</i><br/><span class='size-12'>Tip: Use lower and uppercase,
|
<i>{{passwordStrength}}</i>" tooltip-trigger="focus" required>
|
||||||
numbers and symbols</span>" tooltip-trigger="focus" required>
|
|
||||||
<button type="submit" class="button primary radius" ng-disabled="joinForm.$invalid || loading" loading="Joining">Join</button>
|
<button type="submit" class="button primary radius" ng-disabled="joinForm.$invalid || loading" loading="Joining">Join</button>
|
||||||
</form>
|
</form>
|
||||||
</div>
|
</div>
|
||||||
|
@ -373,10 +372,8 @@
|
||||||
<input type="password" placeholder="Choose your password" class="form-control"
|
<input type="password" placeholder="Choose your password" class="form-control"
|
||||||
ng-model="$parent.walletPassword"
|
ng-model="$parent.walletPassword"
|
||||||
check-strength="passwordStrength"
|
check-strength="passwordStrength"
|
||||||
tooltip-html-unsafe="Password strength:
|
tooltip-html-unsafe="Strength:
|
||||||
<i>{{passwordStrength}}</i><br/><span
|
<i>{{passwordStrength}}</i>"
|
||||||
class='size-12'>Tip: Use lower and uppercase, numbers and
|
|
||||||
symbols</span>"
|
|
||||||
tooltip-trigger="focus" required>
|
tooltip-trigger="focus" required>
|
||||||
</label>
|
</label>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
@ -156,63 +156,55 @@ angular.module('copayApp.directives')
|
||||||
restrict: 'EACM',
|
restrict: 'EACM',
|
||||||
require: 'ngModel',
|
require: 'ngModel',
|
||||||
link: function(scope, element, attrs) {
|
link: function(scope, element, attrs) {
|
||||||
var strength = {
|
|
||||||
messages: ['very weak', 'weak', 'weak', 'medium', 'strong'],
|
|
||||||
colors: ['#c0392b', '#e74c3c', '#d35400', '#f39c12', '#27ae60'],
|
|
||||||
mesureStrength: function(p) {
|
|
||||||
var force = 0;
|
|
||||||
var regex = /[$-/:-?{-~!"^_`\[\]]/g;
|
|
||||||
var lowerLetters = /[a-z]+/.test(p);
|
|
||||||
var upperLetters = /[A-Z]+/.test(p);
|
|
||||||
var numbers = /[0-9]+/.test(p);
|
|
||||||
var symbols = regex.test(p);
|
|
||||||
var flags = [lowerLetters, upperLetters, numbers, symbols];
|
|
||||||
var passedMatches = flags.filter(function(el) {
|
|
||||||
return !!el;
|
|
||||||
}).length;
|
|
||||||
|
|
||||||
force = 2 * p.length + (p.length >= 10 ? 1 : 0);
|
var MIN_LENGTH = 8;
|
||||||
force += passedMatches * 10;
|
var MESSAGES = ['Very Weak', 'Very Weak', 'Weak', 'Medium', 'Strong', 'Very Strong'];
|
||||||
|
var COLOR = ['#dd514c', '#dd514c', '#faa732', '#faa732', '#5eb95e', '#5eb95e'];
|
||||||
|
|
||||||
// penality (short password)
|
function evaluateMeter(password) {
|
||||||
force = (p.length <= 6) ? Math.min(force, 10) : force;
|
var passwordStrength = 0;
|
||||||
|
var text;
|
||||||
// penality (poor variety of characters)
|
if (password.length > 0) passwordStrength = 1;
|
||||||
force = (passedMatches == 1) ? Math.min(force, 10) : force;
|
if (password.length >= MIN_LENGTH) {
|
||||||
force = (passedMatches == 2) ? Math.min(force, 20) : force;
|
if ((password.match(/[a-z]/)) && (password.match(/[A-Z]/))) {
|
||||||
force = (passedMatches == 3) ? Math.min(force, 40) : force;
|
passwordStrength++;
|
||||||
return force;
|
|
||||||
},
|
|
||||||
getColor: function(s) {
|
|
||||||
var idx = 0;
|
|
||||||
|
|
||||||
if (s <= 10) {
|
|
||||||
idx = 0;
|
|
||||||
} else if (s <= 20) {
|
|
||||||
idx = 1;
|
|
||||||
} else if (s <= 30) {
|
|
||||||
idx = 2;
|
|
||||||
} else if (s <= 40) {
|
|
||||||
idx = 3;
|
|
||||||
} else {
|
} else {
|
||||||
idx = 4;
|
text = ', add mixed case';
|
||||||
}
|
}
|
||||||
|
if (password.match(/\d+/)) {
|
||||||
return {
|
passwordStrength++;
|
||||||
idx: idx + 1,
|
} else {
|
||||||
col: this.colors[idx],
|
if (!text) text = ', add numerals';
|
||||||
message: this.messages[idx]
|
}
|
||||||
};
|
if (password.match(/.[!,@,#,$,%,^,&,*,?,_,~,-,(,)]/)) {
|
||||||
|
passwordStrength++;
|
||||||
|
} else {
|
||||||
|
if (!text) text = ', add punctuation';
|
||||||
|
}
|
||||||
|
if (password.length > 12) {
|
||||||
|
passwordStrength++;
|
||||||
|
} else {
|
||||||
|
if (!text) text = ', add characters';
|
||||||
|
}
|
||||||
|
} else {
|
||||||
|
text = ', that\'s short';
|
||||||
}
|
}
|
||||||
};
|
if (!text) text = '';
|
||||||
|
|
||||||
|
return {
|
||||||
|
strength: passwordStrength,
|
||||||
|
message: MESSAGES[passwordStrength] + text,
|
||||||
|
color: COLOR[passwordStrength]
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
scope.$watch(attrs.ngModel, function(newValue, oldValue) {
|
scope.$watch(attrs.ngModel, function(newValue, oldValue) {
|
||||||
if (newValue && newValue !== '') {
|
if (newValue && newValue !== '') {
|
||||||
var c = strength.getColor(strength.mesureStrength(newValue));
|
var info = evaluateMeter(newValue);
|
||||||
element.css({
|
element.css({
|
||||||
'border-color': c.col
|
'border-color': info.color
|
||||||
});
|
});
|
||||||
scope[attrs.checkStrength] = c.message;
|
scope[attrs.checkStrength] = info.message;
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
Loading…
Reference in New Issue