diff --git a/core/modules/user/css/user.module.css b/core/modules/user/css/user.module.css
index 6d2c51e..d48f14b 100644
--- a/core/modules/user/css/user.module.css
+++ b/core/modules/user/css/user.module.css
@@ -23,6 +23,7 @@
.password-strength {
width: 13em;
float: right; /* LTR */
+ margin-top: -0.3em;
}
[dir="rtl"] .password-strength {
float: left;
@@ -53,11 +54,19 @@ input.password-field {
margin-bottom: 0.4em;
float: left; /* LTR */
}
-div.password-confirm {
+.password-confirm {
float: right; /* LTR */
+ margin-top: 1.1em;
visibility: hidden;
width: 13em;
}
+.password-confirm-text {
+ float: right; /* LTR */
+ font-weight: bold;
+}
+[dir="rtl"] .password-confirm-text {
+ float: left;
+}
[dir="rtl"] input.password-confirm,
[dir="rtl"] input.password-field {
float: right;
diff --git a/core/modules/user/user.js b/core/modules/user/user.js
index 7b1ccfa..08d8d00 100644
--- a/core/modules/user/user.js
+++ b/core/modules/user/user.js
@@ -13,32 +13,37 @@ Drupal.behaviors.password = {
var passwordInput = $(this);
var innerWrapper = $(this).parent();
var outerWrapper = $(this).parent().parent();
+ var confirmInput = outerWrapper.find('input.password-confirm');
// Add identifying class to password element parent.
innerWrapper.addClass('password-parent');
- // Add the password confirmation layer.
- outerWrapper.find('input.password-confirm').parent().append('
' + translate.confirmTitle + '
').addClass('confirm-parent');
- var confirmInput = outerWrapper.find('input.password-confirm');
- var confirmResult = outerWrapper.find('div.password-confirm');
- var confirmChild = confirmResult.find('span');
-
// If the password strength indicator is enabled, add its markup.
if (settings.password.showStrengthIndicator) {
- var passwordMeter = '' + translate.strengthTitle + '
';
+ var passwordMeter = '' + translate.strengthTitle + '
';
confirmInput.parent().after('');
innerWrapper.append(passwordMeter);
var passwordDescription = outerWrapper.find('div.password-suggestions').hide();
}
+ // Add the password confirmation layer.
+ var passwordConfirm = '' + translate.confirmTitle + '
';
+ outerWrapper.find('input.password-confirm').parent().prepend(passwordConfirm).addClass('confirm-parent');
+ var confirmResult = outerWrapper.find('div.password-confirm');
+ var confirmChild = confirmResult.find('span');
+
// Check that password and confirmation inputs match.
var passwordCheckMatch = function (confirmInputVal) {
var success = passwordInput.val() === confirmInputVal;
var confirmClass = success ? 'ok' : 'error';
// Fill in the success message and set the class accordingly.
- confirmChild.html(translate['confirm' + (success ? 'Success' : 'Failure')])
- .removeClass('ok error').addClass(confirmClass);
+ if (confirmChild.html() != translate['confirm' + (success ? 'Success' : 'Failure')]) {
+ confirmChild.html(translate['confirm' + (success ? 'Success' : 'Failure')])
+ .removeClass('ok error').addClass(confirmClass);
+
+ Drupal.announce(Drupal.t(success ? 'Passwords match' : 'Passwords do not match'), 'assertive');
+ }
};
// Check the password strength.
@@ -61,6 +66,9 @@ Drupal.behaviors.password = {
.css('background-color', result.indicatorColor);
// Update the strength indication text.
+ if (innerWrapper.find('.password-strength-text').html() != result.indicatorText) {
+ Drupal.announce(Drupal.t(result.indicatorText + " password"), 'assertive');
+ }
innerWrapper.find('.password-strength-text').html(result.indicatorText);
}
diff --git a/core/modules/user/user.module b/core/modules/user/user.module
index 88862d5..cad2f70 100644
--- a/core/modules/user/user.module
+++ b/core/modules/user/user.module
@@ -1892,6 +1892,7 @@ function user_library_info() {
array('system', 'jquery'),
array('system', 'drupal'),
array('system', 'jquery.once'),
+ array('system', 'drupal.announce'),
),
);