summaryrefslogtreecommitdiffstats
diff options
context:
space:
mode:
-rw-r--r--Bugzilla/Config/Auth.pm5
-rw-r--r--Bugzilla/User.pm19
-rw-r--r--js/account.js140
-rw-r--r--skins/standard/admin.css79
-rw-r--r--template/en/default/account/email/confirm-new.html.tmpl69
-rw-r--r--template/en/default/account/password/set-forgotten-password.html.tmpl62
-rw-r--r--template/en/default/account/prefs/account.html.tmpl218
-rw-r--r--template/en/default/account/reset-password.html.tmpl156
-rw-r--r--template/en/default/global/password-features.html.tmpl27
-rw-r--r--template/en/default/global/user-error.html.tmpl52
10 files changed, 482 insertions, 345 deletions
diff --git a/Bugzilla/Config/Auth.pm b/Bugzilla/Config/Auth.pm
index 36287b107..ac5394f04 100644
--- a/Bugzilla/Config/Auth.pm
+++ b/Bugzilla/Config/Auth.pm
@@ -132,9 +132,8 @@ sub get_param_list {
{
name => 'password_complexity',
type => 's',
- choices => [ 'no_constraints', 'mixed_letters', 'letters_numbers',
- 'letters_numbers_specialchars' ],
- default => 'no_constraints',
+ choices => [ 'no_constraints', 'bmo' ],
+ default => 'bmo',
checker => \&check_multi
},
diff --git a/Bugzilla/User.pm b/Bugzilla/User.pm
index ebd82002f..1a0deed6b 100644
--- a/Bugzilla/User.pm
+++ b/Bugzilla/User.pm
@@ -2482,15 +2482,16 @@ sub validate_password_check {
}
my $complexity_level = Bugzilla->params->{password_complexity};
- if ($complexity_level eq 'letters_numbers_specialchars') {
- return 'password_not_complex'
- if ($password !~ /[[:alpha:]]/ || $password !~ /\d/ || $password !~ /[[:punct:]]/);
- } elsif ($complexity_level eq 'letters_numbers') {
- return 'password_not_complex'
- if ($password !~ /[[:lower:]]/ || $password !~ /[[:upper:]]/ || $password !~ /\d/);
- } elsif ($complexity_level eq 'mixed_letters') {
- return 'password_not_complex'
- if ($password !~ /[[:lower:]]/ || $password !~ /[[:upper:]]/);
+ if ($complexity_level eq 'bmo') {
+ my $features = 0;
+
+ $features++ if $password =~ /[a-z]/;
+ $features++ if $password =~ /[A-Z]/;
+ $features++ if $password =~ /[0-9]/;
+ $features++ if $password =~ /[^A-Za-z0-9]/;
+ $features++ if length($password) > 12;
+
+ return 'password_not_complex' if $features < 3;
}
# Having done these checks makes us consider the password untainted.
diff --git a/js/account.js b/js/account.js
index 31c1a50e6..c268bb8e5 100644
--- a/js/account.js
+++ b/js/account.js
@@ -7,6 +7,146 @@
$(function() {
+ function make_password_strength($password) {
+ return function(event) {
+ var password = $password.val();
+ var missing_features = {"upper": true, "lower": true, "numbers": true, "symbols": true, "length12": true};
+ var features = [],
+ charset = 0,
+ score = 0,
+ min_features = 3;
+
+ $("#password-meter").show();
+ $("#password-meter-label").show();
+
+ if (password.match(/[A-Z]/)) {
+ delete missing_features.upper;
+ features.push("upper");
+ charset += 26;
+ }
+ if (password.match(/[a-z]/)) {
+ delete missing_features.lower;
+ features.push("lower");
+ charset += 26;
+ }
+ if (password.match(/[0-9]/)) {
+ delete missing_features.numbers;
+ features.push("numbers");
+ charset += 10;
+ }
+ if (password.match(/[^A-Za-z0-9]/)) {
+ delete missing_features.symbols;
+ features.push("symbols");
+ charset += 30; // there are 30-32 typable characters on a keyboard.
+ }
+ if (password.length > 12) {
+ delete missing_features.length12;
+ features.push("length12");
+ }
+
+ $("#password-features li").removeClass("feature-ok");
+ features.forEach(function(name) {
+ $("#password-feature-" + name).addClass("feature-ok");
+ });
+
+ var entropy = Math.floor(Math.log(charset) * (password.length / Math.log(2)));
+ if (entropy) {
+ score = entropy/128;
+ }
+
+ $password.get(0).setCustomValidity("");
+ if (features.length < min_features) {
+ $("#password-msg")
+ .text("Password does not meet requirements")
+ .attr("class", "password-bad");
+ $password.get(0).setCustomValidity($("#password-msg").text());
+ }
+ else if (password.length < 8) {
+ $("#password-msg")
+ .text("Password is too short")
+ .attr("class", "password-bad");
+ $password.get(0).setCustomValidity($("#password-msg").text());
+ }
+ else {
+ $("#password-msg")
+ .text("Password meets requirements")
+ .attr("class", "password-good");
+ $password.get(0).setCustomValidity("");
+ }
+
+ if (entropy < 60) {
+ $("#password-meter")
+ .removeClass("meter-good meter-ok")
+ .addClass("meter-bad");
+ }
+ else if (entropy >= 120) {
+ $("#password-meter")
+ .removeClass("meter-bad meter-ok")
+ .addClass("meter-good");
+ }
+ else if (entropy > 60) {
+ $("#password-meter")
+ .removeClass("meter-bad meter-good")
+ .addClass("meter-ok");
+ }
+
+ if (score === 0) {
+ score = 0.01;
+ $("#password-meter")
+ .removeClass("meter-good meter-ok")
+ .addClass("meter-bad");
+ }
+
+ $("#password-meter").width(Math.max(0, Math.min($password.width()+10, Math.ceil(($password.width()+10) * score))));
+ };
+ }
+
+ function make_password_confirm($password1, $password2) {
+ return function (event) {
+ if ($password1.val() != $password2.val()) {
+ $password2.get(0).setCustomValidity("Does not match previous password");
+ }
+ else {
+ $password2.get(0).setCustomValidity("");
+ }
+ };
+ }
+ var password1_sel, password2_sel;
+ var complexity = $("#password-features").data("password-complexity");
+ var page = $("#password-features").data("password-page");
+ var check_password_strength, check_password_confirm;
+
+ if (page == "account") {
+ $("#new_password1, #new_password2, #new_login_name").change(function() {
+ $("#old_password").attr("required", true);
+ });
+ }
+
+ if (complexity == "bmo") {
+ if (page == "confirm") {
+ password1_sel = "#passwd1";
+ password2_sel = "#passwd2";
+ }
+ else {
+ password1_sel = "#new_password1";
+ password2_sel = "#new_password2";
+ }
+ $("#password-features").show();
+
+ check_password_strength = make_password_strength($(password1_sel));
+ check_password_confirm = make_password_confirm($(password1_sel), $(password2_sel));
+
+ $(password1_sel).on("input", check_password_strength);
+ $(password1_sel).on("focus", check_password_strength);
+
+ $(password1_sel).on("blur", check_password_confirm);
+ $(password1_sel).on("change", check_password_confirm);
+ $(password2_sel).on("input", check_password_confirm);
+ }
+ else {
+ $("#password-features").hide();
+ }
+
// account disabling
$('#account-disable-toggle')
diff --git a/skins/standard/admin.css b/skins/standard/admin.css
index 2b56c1831..b6ac508c2 100644
--- a/skins/standard/admin.css
+++ b/skins/standard/admin.css
@@ -314,3 +314,82 @@ input[disabled] {
float: left;
margin-right: 1em;
}
+
+.flex {
+ display: flex;
+ flex-flow: row;
+}
+
+.flex-left {
+ flex: 1;
+ min-width: 500px;
+}
+
+.flex-right {
+ flex: 2;
+}
+
+.meter {
+ width: 25px;
+ height: 1em;
+ display: inline-block;
+}
+
+.meter-bad {
+ background-color: #DD514C;
+ background-image: linear-gradient(to bottom, #EE5F5B, #C43C35);
+ background-repeat: repeat-x;
+}
+
+.meter-ok {
+ background-color: #FAA732;
+ background-image: linear-gradient(to bottom, #FBB450, #F89406);
+ background-repeat: repeat-x;
+}
+
+.meter-good {
+ background-color: #5EB95E;
+ background-image: linear-gradient(to bottom, #62C462, #57A957);
+ background-repeat: repeat-x;
+}
+
+.password-bad {
+ color: #DD514C;
+}
+
+.password-ok {
+ color: #FAA732;
+}
+
+.password-good {
+ color: #5EB95E;
+}
+
+#password-features {
+ display: none;
+}
+
+#password-features li.feature-ok:before {
+ font-size: normal;
+ content: "\2611";
+ margin-left: -13px;
+ margin-right: 2px;
+}
+
+#password-features li.feature-ok {
+ color: #5EB95E;
+}
+
+#password-features li:before {
+ font-size: normal;
+ content: "\2610";
+ margin-left: -13px;
+ margin-right: 2px;
+}
+
+#password-features ul {
+ padding-left: 20px;
+ text-indent: 2px;
+ list-style: none;
+ list-style-position: outside;
+}
diff --git a/template/en/default/account/email/confirm-new.html.tmpl b/template/en/default/account/email/confirm-new.html.tmpl
index 3241030e8..f505268f5 100644
--- a/template/en/default/account/email/confirm-new.html.tmpl
+++ b/template/en/default/account/email/confirm-new.html.tmpl
@@ -21,8 +21,10 @@
[% title = BLOCK %]Create a new user account for '[% email FILTER html %]'[% END %]
[% PROCESS "global/header.html.tmpl"
- title = title
- onload = "document.forms['confirm_account_form'].realname.focus();" %]
+ title = title
+ style_urls = ['skins/standard/admin.css']
+ javascript_urls = ['js/account.js']
+ onload = "document.forms['confirm_account_form'].realname.focus();" %]
[% password_complexity = Param('password_complexity') %]
@@ -35,39 +37,36 @@
<form id="confirm_account_form" method="post" action="token.cgi">
<input type="hidden" name="t" value="[% token FILTER html %]">
<input type="hidden" name="a" value="confirm_new_account">
- <table>
- <tr>
- <th align="right">Email Address:</th>
- <td>[% email FILTER html %]</td>
- </tr>
- <tr>
- <th align="right"><small><i>(OPTIONAL)</i></small> <label for="realname">Real Name</label>:</th>
- <td><input type="text" id="realname" name="realname" value=""></td>
- </tr>
- <tr>
- <th align="right"><label for="passwd1">Type your password</label>:</th>
- <td>
- <input type="password" id="passwd1" name="passwd1" value="">
- (Password should be a minimum of [% constants.USER_PASSWORD_MIN_LENGTH FILTER none %] characters long
- [% IF password_complexity == "mixed_letters" %]
- and must contain at least one UPPER and one lowercase letter
- [% ELSIF password_complexity == "letters_numbers" %]
- and must contain at least one UPPER and one lowercase letter and a number
- [% ELSIF password_complexity == "letters_numbers_specialchars" %]
- and must contain at least one letter, a number and a special character
- [% END ~%]
- .)
- </td>
- </tr>
- <tr>
- <th align="right"><label for="passwd2">Confirm your password</label>:</th>
- <td><input type="password" id="passwd2" name="passwd2" value=""></td>
- </tr>
- <tr>
- <th align="right">&nbsp;</th>
- <td><input type="submit" id="confirm" value="Create"></td>
- </tr>
- </table>
+ <div class="flex">
+ <div class="flex-left">
+ <table>
+ <tr>
+ <th align="right">Email Address:</th>
+ <td>[% email FILTER html %]</td>
+ </tr>
+ <tr>
+ <th align="right"><small><i>(OPTIONAL)</i></small> <label for="realname">Real Name</label>:</th>
+ <td><input type="text" id="realname" name="realname" value=""></td>
+ </tr>
+ <tr>
+ <th align="right"><label for="passwd1">Type your password</label>:</th>
+ <td>
+ <input type="password" id="passwd1" name="passwd1" value="" required>
+ </td>
+ </tr>
+ <tr>
+ <th align="right"><label for="passwd2">Confirm your password</label>:</th>
+ <td><input type="password" id="passwd2" name="passwd2" value="" required"></td>
+ </tr>
+ <tr>
+ <th align="right">&nbsp;</th>
+ <td><input type="submit" id="confirm" value="Create"></td>
+ </tr>
+ </table>
+ </div>
+
+ [% INCLUDE "global/password-features.html.tmpl" class="flex-right" password_page="confirm" %]
+ </div>
</form>
<p>
diff --git a/template/en/default/account/password/set-forgotten-password.html.tmpl b/template/en/default/account/password/set-forgotten-password.html.tmpl
index cfeacbb93..68119252e 100644
--- a/template/en/default/account/password/set-forgotten-password.html.tmpl
+++ b/template/en/default/account/password/set-forgotten-password.html.tmpl
@@ -19,39 +19,47 @@
#%]
[% title = "Change Password" %]
-[% PROCESS global/header.html.tmpl %]
+ [% PROCESS global/header.html.tmpl
+ style_urls = ['skins/standard/admin.css']
+ javascript_urls = ['js/account.js']
+ %]
<p>
To change your password, enter a new password twice:
</p>
-<form method="post" action="token.cgi">
- <input type="hidden" name="t" value="[% token FILTER html %]">
- <input type="hidden" name="a" value="chgpw">
- <table>
- <tr>
- <th align="right">New Password:</th>
- <td>
- <input type="password" name="password">
- (minimum [% constants.USER_PASSWORD_MIN_LENGTH FILTER none %] characters)
- </td>
- </tr>
+<div class="flex">
+ <div class="flex-left">
+ <form method="post" action="token.cgi">
+ <input type="hidden" name="t" value="[% token FILTER html %]">
+ <input type="hidden" name="a" value="chgpw">
+ <table>
+ <tr>
+ <th align="right">New Password:</th>
+ <td>
+ <input type="password" name="password" id="new_password1" required>
+ </td>
+ </tr>
- <tr>
- <th align="right">New Password Again:</th>
- <td>
- <input type="password" name="matchpassword">
- </td>
- </tr>
+ <tr>
+ <th align="right">New Password Again:</th>
+ <td>
+ <input type="password" name="matchpassword" id="new_password2" required>
+ </td>
+ </tr>
- <tr>
- <th align="right">&nbsp;</th>
- <td>
- <input type="submit" id="update" value="Submit">
- [% INCLUDE mfa/protected.html.tmpl user=token_user %]
- </td>
- </tr>
- </table>
-</form>
+ <tr>
+ <th align="right">&nbsp;</th>
+ <td>
+ <input type="submit" id="update" value="Submit">
+ [% INCLUDE mfa/protected.html.tmpl user=token_user %]
+ </td>
+ </tr>
+ </table>
+ </form>
+ </div>
+
+ [% INCLUDE "global/password-features.html.tmpl" class="flex-right" password_page="forgot" %]
+</div>
[% PROCESS global/footer.html.tmpl %]
diff --git a/template/en/default/account/prefs/account.html.tmpl b/template/en/default/account/prefs/account.html.tmpl
index 3f838691b..c41ea116f 100644
--- a/template/en/default/account/prefs/account.html.tmpl
+++ b/template/en/default/account/prefs/account.html.tmpl
@@ -27,129 +27,133 @@
[%# BMO - add hook for displaying user-profile link %]
[% Hook.process('start') %]
-<table>
- <tr>
- <th align="right" width="150">Your real name:</th>
- <td>
- <input size="35" name="realname" value="[% realname FILTER html %]">
- <i>optional, but encouraged</i>
- </td>
- </tr>
-
- [%# BMO - moved field hook from end of file to here to group with other account fields %]
- [% Hook.process('field') %]
-
- [% SET can_change = [] %]
- [% IF user.authorizer.can_change_password %]
- [% can_change.push('password') %]
- [% END %]
- [% IF user.authorizer.can_change_email && Param('allowemailchange') %]
- [% can_change.push('email address') %]
- [% END %]
-
- [% IF can_change.size %]
- <tr>
- <td></td>
- <td><hr></td>
- </tr>
- <tr>
- <td colspan="3">
- Your current password is required to
- confirm [% can_change.join(' or ') FILTER html %]
- changes.
- </td>
- </tr>
- <tr>
- <th align="right">Current password:</th>
- <td>
- <input type="hidden" name="old_login" value="[% user.login FILTER html %]">
- <input type="password" name="old_password">
- <a href="#" id="forgot-password">I forgot my password</a>
- </td>
- </tr>
- [% IF user.authorizer.can_change_password %]
+<div class="flex">
+ <div class="flex-left">
+ <table>
<tr>
- <th align="right">New password:</th>
+ <th align="right" width="150">Your real name:</th>
<td>
- <input type="password" name="new_password1">
- [% INCLUDE "mfa/protected.html.tmpl" %]
+ <input size="35" name="realname" value="[% realname FILTER html %]"
+ placeholder="optional, but encouraged">
</td>
</tr>
- <tr>
- <th align="right">Confirm new password:</th>
- <td>
- <input type="password" name="new_password2">
- </td>
- </tr>
- [% END %]
+ [%# BMO - moved field hook from end of file to here to group with other account fields %]
+ [% Hook.process('field') %]
- [% IF user.authorizer.can_change_email && Param('allowemailchange') %]
- [% IF login_change_date %]
- [% IF new_login_name %]
- <tr>
- <th align="right">Pending email address:</th>
- <td>[% new_login_name FILTER html %]</td>
- </tr>
- <tr>
- <th align="right">Change request expires:</th>
- <td>[% login_change_date FILTER time %]</td>
- </tr>
- [% ELSE %]
+ [% SET can_change = [] %]
+ [% IF user.authorizer.can_change_password %]
+ [% can_change.push('password') %]
+ [% END %]
+ [% IF user.authorizer.can_change_email && Param('allowemailchange') %]
+ [% can_change.push('email address') %]
+ [% END %]
+
+ [% IF can_change.size %]
+ <tr>
+ <td></td>
+ <td><hr></td>
+ </tr>
+ <tr>
+ <td colspan="3">
+ Your current password is required to
+ confirm [% can_change.join(' or ') FILTER html %]
+ changes.
+ </td>
+ </tr>
+ <tr>
+ <th align="right">Current password:</th>
+ <td>
+ <input type="hidden" name="old_login" value="[% user.login FILTER html %]">
+ <input type="password" name="old_password" id="old_password">
+ <a href="#" id="forgot-password">I forgot my password</a>
+ </td>
+ </tr>
+ [% IF user.authorizer.can_change_password %]
<tr>
- <th align="right">Confirmed email address:</th>
- <td>[% user.login FILTER html %]</td>
+ <th align="right">New password:</th>
+ <td>
+ <input type="password" name="new_password1" id="new_password1">
+ [% INCLUDE "mfa/protected.html.tmpl" %]
+ </td>
</tr>
<tr>
- <th align="right">Completion date:</th>
- <td>[% login_change_date FILTER time %]</td>
+ <th align="right">Confirm new password:</th>
+ <td>
+ <input type="password" name="new_password2" id="new_password2">
+ </td>
</tr>
[% END %]
- [% ELSE %]
+
+ [% IF user.authorizer.can_change_email && Param('allowemailchange') %]
+ [% IF login_change_date %]
+ [% IF new_login_name %]
+ <tr>
+ <th align="right">Pending email address:</th>
+ <td>[% new_login_name FILTER html %]</td>
+ </tr>
+ <tr>
+ <th align="right">Change request expires:</th>
+ <td>[% login_change_date FILTER time %]</td>
+ </tr>
+ [% ELSE %]
+ <tr>
+ <th align="right">Confirmed email address:</th>
+ <td>[% user.login FILTER html %]</td>
+ </tr>
+ <tr>
+ <th align="right">Completion date:</th>
+ <td>[% login_change_date FILTER time %]</td>
+ </tr>
+ [% END %]
+ [% ELSE %]
+ <tr>
+ <th align="right">New email address:</th>
+ <td>
+ <input size="35" name="new_login_name" id="new_login_name">
+ [% INCLUDE "mfa/protected.html.tmpl" %]
+ </td>
+ </tr>
+ [% END %]
+ [% END %]
<tr>
- <th align="right">New email address:</th>
- <td>
- <input size="35" name="new_login_name">
- [% INCLUDE "mfa/protected.html.tmpl" %]
- </td>
+ <td></td>
+ <td><hr></td>
</tr>
[% END %]
- [% END %]
- <tr>
- <td></td>
- <td><hr></td>
- </tr>
- [% END %]
- <tr>
- <td></td>
- <td>
- <a href="#" id="account-disable-toggle"><span id="account-disable-spinner">&#9656;</span> Disable My Account</a>
- </td>
- </tr>
- <tr id="account-disable" style="display:none">
- <td></td>
- <td>
- <p>
- Your contributions on bugzilla.mozilla.org will still be visible;
- however, your email address and name will be removed in most locations.
- We are not able to remove your details that are part of comment text.
- </p>
- <p>
- <input type="checkbox" id="account-disable-confirm">
- I acknowledge that my account will not be functional after it has been
- disabled.
- </p>
- <input type="hidden" name="account_disable" id="account_disable">
- <button type="button" id="account-disable-button" disabled>Disable Account</button>
- </td>
- </tr>
- <tr>
- <td></td>
- <td><hr></td>
- </tr>
+ <tr>
+ <td></td>
+ <td>
+ <a href="#" id="account-disable-toggle"><span id="account-disable-spinner">&#9656;</span> Disable My Account</a>
+ </td>
+ </tr>
+ <tr id="account-disable" style="display:none">
+ <td></td>
+ <td>
+ <p>
+ Your contributions on bugzilla.mozilla.org will still be visible;
+ however, your email address and name will be removed in most locations.
+ We are not able to remove your details that are part of comment text.
+ </p>
+ <p>
+ <input type="checkbox" id="account-disable-confirm">
+ I acknowledge that my account will not be functional after it has been
+ disabled.
+ </p>
+ <input type="hidden" name="account_disable" id="account_disable">
+ <button type="button" id="account-disable-button" disabled>Disable Account</button>
+ </td>
+ </tr>
+ <tr>
+ <td></td>
+ <td><hr></td>
+ </tr>
+ </table>
+ </div>
-</table>
+ [% INCLUDE "global/password-features.html.tmpl" class="flex-right" password_page="account" %]
+</div>
[% tab_footer = BLOCK %]
<form action="token.cgi" method="post" id="forgot-form">
diff --git a/template/en/default/account/reset-password.html.tmpl b/template/en/default/account/reset-password.html.tmpl
index 2b1d297dc..ec57f19dd 100644
--- a/template/en/default/account/reset-password.html.tmpl
+++ b/template/en/default/account/reset-password.html.tmpl
@@ -52,78 +52,6 @@
[% inline_js = BLOCK %]
$(function() {
-
- $('#old_password, #new_password1, #new_password2')
- .keyup(function() {
- var errors = [];
- var old = $('#old_password').val();
- var new1 = $('#new_password1').val();
- var new2 = $('#new_password2').val();
-
- if (old === '') {
- errors.push('Missing current password');
- }
- if (new1 === '' || new2 === '') {
- errors.push('Missing new password');
- }
- else if (new1 !== new2) {
- errors.push('New passwords do not match');
- }
- else if (new1 === old) {
- errors.push('Your new password must be different from your old password');
- }
- else if (new1.length < [% constants.USER_PASSWORD_MIN_LENGTH FILTER none %]) {
- errors.push('Your password must be at least [% constants.USER_PASSWORD_MIN_LENGTH FILTER none %] long');
- }
- else {
- var complexity_fn;
- [% SWITCH Param('password_complexity') %]
- [% CASE 'no_constraints' %]
- complexity_fn = function() {};
- [% CASE 'mixed_letters' %]
- complexity_fn = function(pass, errors) {
- if (
- pass.search(/[a-z]/) == -1 ||
- pass.search(/[A-Z]/) == -1
- ) {
- errors.push('New password is not complex enough');
- }
- };
- [% CASE 'letters_numbers' %]
- complexity_fn = function(pass, errors) {
- if (
- pass.search(/[a-z]/) == -1 ||
- pass.search(/[A-Z]/) == -1 ||
- pass.search(/[0-9]/) == -1
- ) {
- errors.push('New password is not complex enough');
- }
- };
- [% CASE 'letters_numbers_specialchars' %]
- complexity_fn = function(pass, errors) {
- if (
- pass.search(/[a-z]/) == -1 ||
- pass.search(/[A-Z]/) == -1 ||
- pass.search(/[0-9]/) == -1 ||
- pass.search(/\W/) == -1
- ) {
- errors.push('New password is not complex enough');
- }
- };
- [% END %]
- complexity_fn(new1, errors);
- }
-
- $('#submit').attr('disabled', errors.length > 0);
- if ((old !== '' || new1 !== '' || new2 !== '') && errors.length) {
- $('#errors').html('<ul><li>' + errors.join('</li><li>') + '</li></ul>');
- }
- else {
- $('#errors').html('');
- }
- })
- .keyup();
-
$('#forgot_password')
.click(function(event) {
event.preventDefault();
@@ -134,9 +62,11 @@ $(function() {
[% END %]
[% PROCESS global/header.html.tmpl
- title = "Password change required"
- style = inline_style
- javascript = inline_js
+ title = "Password change required"
+ style = inline_style
+ style_urls = ['skins/standard/admin.css']
+ javascript = inline_js
+ javascript_urls = ['js/account.js']
%]
<h1>Password Reset</h1>
@@ -149,58 +79,48 @@ $(function() {
<input type="hidden" name="token" value="[% token FILTER html %]">
<input type="hidden" name="do_save" value="1">
-<div id="password-reset">
- <div class="field-hr">&nbsp;</div>
- <div class="field-row">
- <div class="field-name">Email</div>
- <div class="field-value">
- [% user.login FILTER html %]
+<div class="flex">
+ <div id="password-reset" class="flex-left">
+ <div class="field-hr">&nbsp;</div>
+ <div class="field-row">
+ <div class="field-name">Email</div>
+ <div class="field-value">
+ [% user.login FILTER html %]
+ </div>
</div>
- </div>
- <div class="field-row">
- <div class="field-name">Current Password</div>
- <div class="field-value">
- <input type="password" name="old_password" id="old_password" size="30">
+ <div class="field-row">
+ <div class="field-name">Current Password</div>
+ <div class="field-value">
+ <input type="password" name="old_password" id="old_password" size="30" required>
+ </div>
</div>
- </div>
- <div class="field-hr">&nbsp;</div>
- <div id="errors"></div>
- <div class="field-row">
- <div class="field-name">New Password</div>
- <div class="field-value">
- <input type="password" name="new_password1" id="new_password1" size="30">
+ <div class="field-hr">&nbsp;</div>
+ <div id="errors"></div>
+ <div class="field-row">
+ <div class="field-name">New Password</div>
+ <div class="field-value">
+ <input type="password" name="new_password1" id="new_password1" size="30" required>
+ </div>
</div>
- </div>
- <div class="field-row">
- <div class="field-name">New Password</div>
- <div class="field-value">
- <input type="password" name="new_password2" id="new_password2" size="30">
- (again)
+ <div class="field-row">
+ <div class="field-name">New Password</div>
+ <div class="field-value">
+ <input type="password" name="new_password2" id="new_password2" size="30" required>
+ (again)
+ </div>
</div>
- </div>
- <div class="field-hr">&nbsp;</div>
- <div class="field-row">
- <div class="field-value">
- <input type="submit" id="submit" value="Update Password">
- <a id="forgot_password" href="#">Forgot Password</a>
+ <div class="field-hr">&nbsp;</div>
+ <div class="field-row">
+ <div class="field-value">
+ <input type="submit" id="submit" value="Update Password">
+ <a id="forgot_password" href="#">Forgot Password</a>
+ </div>
</div>
</div>
+ [% INCLUDE "global/password-features.html.tmpl" class="flex-right" password_page="reset_password" %]
</div>
-
</form>
-<p id="complexity_rules">
- Your password must be a minimum of [% constants.USER_PASSWORD_MIN_LENGTH FILTER none %] characters long
- [% SWITCH Param('password_complexity') %]
- [% CASE 'mixed_letters' %]
- and must contain at least one UPPER and one lowercase letter
- [% CASE 'letters_numbers' %]
- and must contain at least one UPPER and one lowercase letter and a number
- [% CASE 'letters_numbers_specialchars' %]
- and must contain at least one letter, a number and a special character
- [% END ~%].
-</p>
-
<form action="token.cgi" method="post" id="forgot-form">
<input type="hidden" name="loginname" value="[% user.login FILTER html %]">
<input type="hidden" name="a" value="reqpw">
diff --git a/template/en/default/global/password-features.html.tmpl b/template/en/default/global/password-features.html.tmpl
new file mode 100644
index 000000000..5d6c0f8c1
--- /dev/null
+++ b/template/en/default/global/password-features.html.tmpl
@@ -0,0 +1,27 @@
+[%# This Source Code Form is subject to the terms of the Mozilla Public
+ # License, v. 2.0. If a copy of the MPL was not distributed with this
+ # file, You can obtain one at http://mozilla.org/MPL/2.0/.
+ #
+ # This Source Code Form is "Incompatible With Secondary Licenses", as
+ # defined by the Mozilla Public License, v. 2.0.
+ #%]
+
+<div id="password-features"
+ style="display: none"
+ class="[% class FILTER html %]"
+ data-password-page="[% password_page FILTER html %]"
+ data-password-complexity="[% Param("password_complexity") FILTER html %]">
+ Password must be 8 characters or longer,
+ and match at least 3 of the following requirements:
+
+ <ul>
+ <li id="password-feature-upper">uppercase letters</li>
+ <li id="password-feature-lower">lowercase letters</li>
+ <li id="password-feature-numbers">numbers</li>
+ <li id="password-feature-symbols">symbols</li>
+ <li id="password-feature-length12">longer than 12 characters</li>
+ </ul>
+ <div id="password-msg"></div>
+
+ <div id="password-meter-label" style="display: none">Strength: <span id="password-meter" class="meter"></span></div>
+</div> \ No newline at end of file
diff --git a/template/en/default/global/user-error.html.tmpl b/template/en/default/global/user-error.html.tmpl
index 6996832aa..14399f010 100644
--- a/template/en/default/global/user-error.html.tmpl
+++ b/template/en/default/global/user-error.html.tmpl
@@ -1503,59 +1503,19 @@
[% ELSIF error == "password_not_complex" %]
[% title = "Password Fails Requirements" %]
- [% passregex = Param('password_complexity') %]
- The password must contain at least one:
+ The Password must meet three of the following requirements
<ul>
- [% IF passregex == 'letters_numbers_specialchars' %]
- <li>letter</li>
- <li>special character</li>
- [% ELSIF passregex.search('letters') %]
- <li>UPPERCASE letter</li>
- <li>lowercase letter</li>
- [% END %]
- [% IF passregex.search('numbers') %]
- <li>digit</li>
- [% END %]
+ <li>uppercase letters</li>
+ <li>lowercase letters</li>
+ <li>numbers</li>
+ <li>symbols</li>
+ <li>longer than 12 characters</li>
</ul>
[% IF locked_user %]
You must <a href="token.cgi?a=reqpw&amp;loginname=[% locked_user.email FILTER uri %]&amp;token=[% issue_hash_token(['reqpw']) FILTER uri %]">
request a new password</a> in order to log in again.
[% END %]
- [% ELSIF error == "password_not_complex" %]
- [% title = "Password Fails Requirements" %]
- [% passregex = Param('password_complexity') %]
- Password must contain at least one:
- <ul>
- [% IF passregex.search('letters') %]
- <li>UPPERCASE letter</li>
- <li>lowercase letter</li>
- [% END %]
- [% IF passregex.search('numbers') %]
- <li>digit</li>
- [% END %]
- [% IF passregex.search('specialchars') %]
- <li>special character</li>
- [% END %]
- </ul>
-
- [% ELSIF error == "password_not_complex" %]
- [% title = "Password Fails Requirements" %]
- [% passregex = Param('password_complexity') %]
- Password must contain at least one:
- <ul>
- [% IF passregex.search('letters') %]
- <li>UPPERCASE letter</li>
- <li>lowercase letter</li>
- [% END %]
- [% IF passregex.search('numbers') %]
- <li>digit</li>
- [% END %]
- [% IF passregex.search('specialchars') %]
- <li>special character</li>
- [% END %]
- </ul>
-
[% ELSIF error == "product_access_denied" %]
[% title = "Product Access Denied" %]
Either the product