sergiotarxz/Wordpress
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

Passwords: Add password strength meter feedback for screen readers.

Browse Source 
Also gives context to the show/hide button.

Props rianrietveld, afercia.
Fixes #33032.



git-svn-id: https://develop.svn.wordpress.org/trunk@33353 602fd350-edb4-49c9-b593-d223f7449a82
This commit is contained in:
Konstantin Obenland 2015-07-22 00:14:37 +00:00
parent 7527a5c65e
commit 2ab769b1b9
6 changed files with 17 additions and 17 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
src/wp-admin/install.php
View File

@ -140,12 +140,12 @@ function display_setup_form( $error = null ) {
<button type="button" class="button button-secondary wp-generate-pw hide-if-no-js"><?php _e( 'Show password' ); ?></button> <button type="button" class="button button-secondary wp-generate-pw hide-if-no-js"><?php _e( 'Show password' ); ?></button>
<div class="wp-pwd hide-if-js"> <div class="wp-pwd hide-if-js">
<?php $initial_password = wp_generate_password( 24 ); ?> <?php $initial_password = wp_generate_password( 24 ); ?>
<input type="password" name="admin_password" id="pass1" class="regular-text" autocomplete="off" data-reveal="1" data-pw="<?php echo esc_attr( $initial_password ); ?>" /> <input type="password" name="admin_password" id="pass1" class="regular-text" autocomplete="off" data-reveal="1" data-pw="<?php echo esc_attr( $initial_password ); ?>" aria-describedby="pass-strength-result" />
<button type="button" class="button button-secondary wp-hide-pw hide-if-no-js" data-toggle="0"> <button type="button" class="button button-secondary wp-hide-pw hide-if-no-js" data-toggle="0" aria-label="<?php esc_attr_e( 'Hide password' ); ?>">
<span class="dashicons dashicons-visibility"></span> <span class="dashicons dashicons-visibility"></span>
<span class="text"><?php _e( 'Hide' ); ?></span> <span class="text"><?php _e( 'Hide' ); ?></span>
</button> </button>
<div id="pass-strength-result"></div> <div id="pass-strength-result" aria-live="polite"></div>
</div> </div>
<p><span class="description hide-if-no-js"><?php _e( 'A password reset link will be sent to you via email.' ); ?></span></p> <p><span class="description hide-if-no-js"><?php _e( 'A password reset link will be sent to you via email.' ); ?></span></p>
</td> </td>

10
src/wp-admin/js/user-profile.js
View File

@ -94,15 +94,13 @@
var show = pw_togglebtn.attr( 'data-toggle' ); var show = pw_togglebtn.attr( 'data-toggle' );
if ( show == 1 ) { if ( show == 1 ) {
pw_field.attr( 'type', 'text' ); pw_field.attr( 'type', 'text' );
pw_togglebtn.attr( 'data-toggle', 0 ) pw_togglebtn.attr({ 'data-toggle': 0, 'aria-label': userProfileL10n.ariaHide })
.find( '.text' ) .find( '.text' ).text( userProfileL10n.hide )
.text( userProfileL10n.hide )
; ;
} else { } else {
pw_field.attr( 'type', 'password' ); pw_field.attr( 'type', 'password' );
pw_togglebtn.attr( 'data-toggle', 1 ) pw_togglebtn.attr({ 'data-toggle': 1, 'aria-label': userProfileL10n.ariaShow })
.find( '.text' ) .find( '.text' ).text( userProfileL10n.show )
.text( userProfileL10n.show )
; ;
} }
pw_field.focus(); pw_field.focus();

6
src/wp-admin/user-edit.php
View File

@ -464,12 +464,12 @@ if ( $show_password_fields ) :
<input class="hidden" value=" " /><!-- #24364 workaround --> <input class="hidden" value=" " /><!-- #24364 workaround -->
<button type="button" class="button button-secondary wp-generate-pw hide-if-no-js"><?php _e( 'Generate new password' ); ?></button> <button type="button" class="button button-secondary wp-generate-pw hide-if-no-js"><?php _e( 'Generate new password' ); ?></button>
<div class="wp-pwd hide-if-js"> <div class="wp-pwd hide-if-js">
<input type="password" name="pass1" id="pass1" class="regular-text" value="" autocomplete="off" data-pw="<?php echo esc_attr( wp_generate_password( 24 ) ); ?>" /> <input type="password" name="pass1" id="pass1" class="regular-text" value="" autocomplete="off" data-pw="<?php echo esc_attr( wp_generate_password( 24 ) ); ?>" aria-describedby="pass-strength-result" />
<button type="button" class="button button-secondary wp-hide-pw hide-if-no-js" data-toggle="0"> <button type="button" class="button button-secondary wp-hide-pw hide-if-no-js" data-toggle="0" aria-label="<?php esc_attr_e( 'Hide password' ); ?>">
<span class="dashicons dashicons-visibility"></span> <span class="dashicons dashicons-visibility"></span>
<span class="text"><?php _e( 'Hide' ); ?></span> <span class="text"><?php _e( 'Hide' ); ?></span>
</button> </button>
<div style="display:none" id="pass-strength-result"></div> <div style="display:none" id="pass-strength-result" aria-live="polite"></div>
</div> </div>
</td> </td>
</tr> </tr>

6
src/wp-admin/user-new.php
View File

@ -402,12 +402,12 @@ if ( apply_filters( 'show_password_fields', true ) ) : ?>
<button type="button" class="button button-secondary wp-generate-pw hide-if-no-js"><?php _e( 'Show password' ); ?></button> <button type="button" class="button button-secondary wp-generate-pw hide-if-no-js"><?php _e( 'Show password' ); ?></button>
<div class="wp-pwd hide-if-js"> <div class="wp-pwd hide-if-js">
<?php $initial_password = wp_generate_password( 24 ); ?> <?php $initial_password = wp_generate_password( 24 ); ?>
<input type="password" name="pass1" id="pass1" class="regular-text" autocomplete="off" data-reveal="1" data-pw="<?php echo esc_attr( $initial_password ); ?>" /> <input type="password" name="pass1" id="pass1" class="regular-text" autocomplete="off" data-reveal="1" data-pw="<?php echo esc_attr( $initial_password ); ?>" aria-describedby="pass-strength-result" />
<button type="button" class="button button-secondary wp-hide-pw hide-if-no-js" data-toggle="0"> <button type="button" class="button button-secondary wp-hide-pw hide-if-no-js" data-toggle="0" aria-label="<?php esc_attr_e( 'Hide password' ); ?>">
<span class="dashicons dashicons-visibility"></span> <span class="dashicons dashicons-visibility"></span>
<span class="text"><?php _e( 'Hide' ); ?></span> <span class="text"><?php _e( 'Hide' ); ?></span>
</button> </button>
<div style="display:none" id="pass-strength-result"></div> <div style="display:none" id="pass-strength-result" aria-live="polite"></div>
</div> </div>
<p><span class="description"><?php _e( 'A password reset link will be sent to the user via email.' ); ?></span></p> <p><span class="description"><?php _e( 'A password reset link will be sent to the user via email.' ); ?></span></p>
</td> </td>

2
src/wp-includes/script-loader.php
View File

@ -376,6 +376,8 @@ function wp_default_scripts( &$scripts ) {
did_action( 'init' ) && $scripts->localize( 'user-profile', 'userProfileL10n', array( did_action( 'init' ) && $scripts->localize( 'user-profile', 'userProfileL10n', array(
'show' => __( 'Show' ), 'show' => __( 'Show' ),
'hide' => __( 'Hide' ), 'hide' => __( 'Hide' ),
'ariaShow' => esc_attr__( 'Show password' ),
'ariaHide' => esc_attr__( 'Hide password' ),
) ); ) );
$scripts->add( 'language-chooser', "/wp-admin/js/language-chooser$suffix.js", array( 'jquery' ), false, 1 ); $scripts->add( 'language-chooser', "/wp-admin/js/language-chooser$suffix.js", array( 'jquery' ), false, 1 );

4
src/wp-login.php
View File

@ -655,8 +655,8 @@ case 'rp' :
<p class="user-pass1-wrap"> <p class="user-pass1-wrap">
<label for="pass1"><?php _e('New password') ?></label><br /> <label for="pass1"><?php _e('New password') ?></label><br />
<div class="wp-pwd"> <div class="wp-pwd">
<input type="password" data-reveal="1" data-pw="<?php echo esc_attr( wp_generate_password( 24 ) ); ?>" name="pass1" id="pass1" class="input" size="20" value="" autocomplete="off" /> <input type="password" data-reveal="1" data-pw="<?php echo esc_attr( wp_generate_password( 24 ) ); ?>" name="pass1" id="pass1" class="input" size="20" value="" autocomplete="off" aria-describedby="pass-strength-result" />
<div id="pass-strength-result" class="hide-if-no-js"><?php _e( 'Strength indicator' ); ?></div> <div id="pass-strength-result" class="hide-if-no-js" aria-live="polite"><?php _e( 'Strength indicator' ); ?></div>
</div> </div>
</p> </p>
<p class="user-pass2-wrap"> <p class="user-pass2-wrap">