wp/wp-admin/js/user-profile.js
changeset 16 a86126ab1dd4
parent 9 177826044cd9
child 18 be944660c56a
--- a/wp/wp-admin/js/user-profile.js	Tue Oct 22 16:11:46 2019 +0200
+++ b/wp/wp-admin/js/user-profile.js	Tue Dec 15 13:49:49 2020 +0100
@@ -2,15 +2,12 @@
  * @output wp-admin/js/user-profile.js
  */
 
-/* global ajaxurl, pwsL10n, userProfileL10n */
+/* global ajaxurl, pwsL10n */
 (function($) {
 	var updateLock = false,
-
+		__ = wp.i18n.__,
 		$pass1Row,
-		$pass1Wrap,
 		$pass1,
-		$pass1Text,
-		$pass1Label,
 		$pass2,
 		$weakRow,
 		$weakCheckbox,
@@ -36,40 +33,18 @@
 		}
 
 		if ( 1 !== parseInt( $toggleButton.data( 'start-masked' ), 10 ) ) {
-			$pass1Wrap.addClass( 'show-password' );
+			$pass1.attr( 'type', 'text' );
 		} else {
 			$toggleButton.trigger( 'click' );
 		}
 
 		// Once zxcvbn loads, passwords strength is known.
-		$( '#pw-weak-text-label' ).html( userProfileL10n.warnWeak );
+		$( '#pw-weak-text-label' ).text( __( 'Confirm use of weak password' ) );
 	}
 
 	function bindPass1() {
 		currentPass = $pass1.val();
 
-		$pass1Wrap = $pass1.parent();
-
-		$pass1Text = $( '<input type="text"/>' )
-			.attr( {
-				'id':           'pass1-text',
-				'name':         'pass1-text',
-				'autocomplete': 'off'
-			} )
-			.addClass( $pass1[0].className )
-			.data( 'pw', $pass1.data( 'pw' ) )
-			.val( $pass1.val() )
-			.on( 'input', function () {
-				if ( $pass1Text.val() === currentPass ) {
-					return;
-				}
-				$pass2.val( $pass1Text.val() );
-				$pass1.val( $pass1Text.val() ).trigger( 'pwupdate' );
-				currentPass = $pass1Text.val();
-			} );
-
-		$pass1.after( $pass1Text );
-
 		if ( 1 === parseInt( $pass1.data( 'reveal' ), 10 ) ) {
 			generatePassword();
 		}
@@ -80,64 +55,40 @@
 			}
 
 			currentPass = $pass1.val();
-			if ( $pass1Text.val() !== currentPass ) {
-				$pass1Text.val( currentPass );
-			}
-			$pass1.add( $pass1Text ).removeClass( 'short bad good strong' );
+
+			$pass1.removeClass( 'short bad good strong' );
 			showOrHideWeakPasswordCheckbox();
 		} );
 	}
 
-	function resetToggle() {
+	function resetToggle( show ) {
 		$toggleButton
-			.data( 'toggle', 0 )
 			.attr({
-				'aria-label': userProfileL10n.ariaHide
+				'aria-label': show ? __( 'Show password' ) : __( 'Hide password' )
 			})
 			.find( '.text' )
-				.text( userProfileL10n.hide )
+				.text( show ? __( 'Show' ) : __( 'Hide' ) )
 			.end()
 			.find( '.dashicons' )
-				.removeClass( 'dashicons-visibility' )
-				.addClass( 'dashicons-hidden' );
-
-		$pass1Text.focus();
-
-		$pass1Label.attr( 'for', 'pass1-text' );
+				.removeClass( show ? 'dashicons-hidden' : 'dashicons-visibility' )
+				.addClass( show ? 'dashicons-visibility' : 'dashicons-hidden' );
 	}
 
 	function bindToggleButton() {
 		$toggleButton = $pass1Row.find('.wp-hide-pw');
 		$toggleButton.show().on( 'click', function () {
-			if ( 1 === parseInt( $toggleButton.data( 'toggle' ), 10 ) ) {
-				$pass1Wrap.addClass( 'show-password' );
-
-				resetToggle();
-
-				if ( ! _.isUndefined( $pass1Text[0].setSelectionRange ) ) {
-					$pass1Text[0].setSelectionRange( 0, 100 );
-				}
+			if ( 'password' === $pass1.attr( 'type' ) ) {
+				$pass1.attr( 'type', 'text' );
+				resetToggle( false );
 			} else {
-				$pass1Wrap.removeClass( 'show-password' );
-				$toggleButton
-					.data( 'toggle', 1 )
-					.attr({
-						'aria-label': userProfileL10n.ariaShow
-					})
-					.find( '.text' )
-						.text( userProfileL10n.show )
-					.end()
-					.find( '.dashicons' )
-						.removeClass('dashicons-hidden')
-						.addClass('dashicons-visibility');
+				$pass1.attr( 'type', 'password' );
+				resetToggle( true );
+			}
 
-				$pass1.focus();
-
-				$pass1Label.attr( 'for', 'pass1' );
+			$pass1.focus();
 
-				if ( ! _.isUndefined( $pass1[0].setSelectionRange ) ) {
-					$pass1[0].setSelectionRange( 0, 100 );
-				}
+			if ( ! _.isUndefined( $pass1[0].setSelectionRange ) ) {
+				$pass1[0].setSelectionRange( 0, 100 );
 			}
 		});
 	}
@@ -147,10 +98,9 @@
 			$generateButton,
 			$cancelButton;
 
-		$pass1Row = $('.user-pass1-wrap');
-		$pass1Label = $pass1Row.find('th label').attr( 'for', 'pass1-text' );
+		$pass1Row = $( '.user-pass1-wrap, .user-pass-wrap' );
 
-		// hide this
+		// Hide the confirm password field when JavaScript support is enabled.
 		$('.user-pass2-wrap').hide();
 
 		$submitButton = $( '#submit, #wp-submit' ).on( 'click', function () {
@@ -168,6 +118,9 @@
 		$pass1 = $('#pass1');
 		if ( $pass1.length ) {
 			bindPass1();
+		} else {
+			// Password field for the login form.
+			$pass1 = $( '#user_pass' );
 		}
 
 		/**
@@ -189,7 +142,6 @@
 		if ( $pass1.is( ':hidden' ) ) {
 			$pass1.prop( 'disabled', true );
 			$pass2.prop( 'disabled', true );
-			$pass1Text.prop( 'disabled', true );
 		}
 
 		$passwordWrapper = $pass1Row.find( '.wp-pwd' );
@@ -211,18 +163,10 @@
 			// Enable the inputs when showing.
 			$pass1.attr( 'disabled', false );
 			$pass2.attr( 'disabled', false );
-			$pass1Text.attr( 'disabled', false );
 
-			if ( $pass1Text.val().length === 0 ) {
+			if ( $pass1.val().length === 0 ) {
 				generatePassword();
 			}
-
-			_.defer( function() {
-				$pass1Text.focus();
-				if ( ! _.isUndefined( $pass1Text[0].setSelectionRange ) ) {
-					$pass1Text[0].setSelectionRange( 0, 100 );
-				}
-			}, 0 );
 		} );
 
 		$cancelButton = $pass1Row.find( 'button.wp-cancel-pw' );
@@ -230,7 +174,7 @@
 			updateLock = false;
 
 			// Clear any entered password.
-			$pass1Text.val( '' );
+			$pass1.val( '' );
 
 			// Generate a new password.
 			wp.ajax.post( 'generate-password' )
@@ -248,12 +192,11 @@
 			// Disable the inputs when hiding to prevent autofill and submission.
 			$pass1.prop( 'disabled', true );
 			$pass2.prop( 'disabled', true );
-			$pass1Text.prop( 'disabled', true );
 
-			resetToggle();
+			resetToggle( false );
 
 			if ( $pass1Row.closest( 'form' ).is( '#your-profile' ) ) {
-				// Clear password field to prevent update
+				// Clear password field to prevent update.
 				$pass1.val( '' ).trigger( 'pwupdate' );
 				$submitButtons.prop( 'disabled', false );
 			}
@@ -265,20 +208,19 @@
 			$pass1.prop( 'disabled', false );
 			$pass2.prop( 'disabled', false );
 			$pass2.val( $pass1.val() );
-			$pass1Wrap.removeClass( 'show-password' );
 		});
 	}
 
 	function check_pass_strength() {
 		var pass1 = $('#pass1').val(), strength;
 
-		$('#pass-strength-result').removeClass('short bad good strong');
+		$('#pass-strength-result').removeClass('short bad good strong empty');
 		if ( ! pass1 ) {
-			$('#pass-strength-result').html( '&nbsp;' );
+			$( '#pass-strength-result' ).addClass( 'empty' ).html( '&nbsp;' );
 			return;
 		}
 
-		strength = wp.passwordStrength.meter( pass1, wp.passwordStrength.userInputBlacklist(), pass1 );
+		strength = wp.passwordStrength.meter( pass1, wp.passwordStrength.userInputDisallowedList(), pass1 );
 
 		switch ( strength ) {
 			case -1:
@@ -305,14 +247,19 @@
 		var passStrength = $('#pass-strength-result')[0];
 
 		if ( passStrength.className ) {
-			$pass1.add( $pass1Text ).addClass( passStrength.className );
+			$pass1.addClass( passStrength.className );
 			if ( $( passStrength ).is( '.short, .bad' ) ) {
 				if ( ! $weakCheckbox.prop( 'checked' ) ) {
 					$submitButtons.prop( 'disabled', true );
 				}
 				$weakRow.show();
 			} else {
-				$submitButtons.prop( 'disabled', false );
+				if ( $( passStrength ).is( '.empty' ) ) {
+					$submitButtons.prop( 'disabled', true );
+					$weakCheckbox.prop( 'checked', false );
+				} else {
+					$submitButtons.prop( 'disabled', false );
+				}
 				$weakRow.hide();
 			}
 		}
@@ -395,7 +342,7 @@
 			$this.siblings( '.selected' ).removeClass( 'selected' );
 			$this.addClass( 'selected' ).find( 'input[type="radio"]' ).prop( 'checked', true );
 
-			// Set color scheme
+			// Set color scheme.
 			if ( user_id === current_user_id ) {
 				// Load the colors stylesheet.
 				// The default color scheme won't have one, so we'll need to create an element.
@@ -404,7 +351,7 @@
 				}
 				$stylesheet.attr( 'href', $this.children( '.css_url' ).val() );
 
-				// repaint icons
+				// Repaint icons.
 				if ( typeof wp !== 'undefined' && wp.svgPainter ) {
 					try {
 						colors = $.parseJSON( $this.children( '.icon_colors' ).val() );
@@ -416,7 +363,7 @@
 					}
 				}
 
-				// update user option
+				// Update user option.
 				$.post( ajaxurl, {
 					action:       'save-user-color-scheme',
 					color_scheme: $this.children( 'input[name="admin_color"]' ).val(),
@@ -455,7 +402,7 @@
 	/* Warn the user if password was generated but not saved */
 	$( window ).on( 'beforeunload', function () {
 		if ( true === updateLock ) {
-			return userProfileL10n.warn;
+			return __( 'Your new password has not been saved.' );
 		}
 	} );