wp/wp-admin/js/user-profile.js
changeset 21 48c4eec2b7e6
parent 19 3d72ae0968f4
child 22 8c2e4d02f4ef
equal deleted inserted replaced
20:7b1b88e27a20 21:48c4eec2b7e6
     3  */
     3  */
     4 
     4 
     5 /* global ajaxurl, pwsL10n, userProfileL10n */
     5 /* global ajaxurl, pwsL10n, userProfileL10n */
     6 (function($) {
     6 (function($) {
     7 	var updateLock = false,
     7 	var updateLock = false,
       
     8 		isSubmitting = false,
     8 		__ = wp.i18n.__,
     9 		__ = wp.i18n.__,
     9 		$pass1Row,
    10 		$pass1Row,
    10 		$pass1,
    11 		$pass1,
    11 		$pass2,
    12 		$pass2,
    12 		$weakRow,
    13 		$weakRow,
    13 		$weakCheckbox,
    14 		$weakCheckbox,
    14 		$toggleButton,
    15 		$toggleButton,
    15 		$submitButtons,
    16 		$submitButtons,
    16 		$submitButton,
    17 		$submitButton,
    17 		currentPass,
    18 		currentPass,
       
    19 		$form,
       
    20 		originalFormContent,
    18 		$passwordWrapper;
    21 		$passwordWrapper;
    19 
    22 
    20 	function generatePassword() {
    23 	function generatePassword() {
    21 		if ( typeof zxcvbn !== 'function' ) {
    24 		if ( typeof zxcvbn !== 'function' ) {
    22 			setTimeout( generatePassword, 50 );
    25 			setTimeout( generatePassword, 50 );
    50 
    53 
    51 		// Once zxcvbn loads, passwords strength is known.
    54 		// Once zxcvbn loads, passwords strength is known.
    52 		$( '#pw-weak-text-label' ).text( __( 'Confirm use of weak password' ) );
    55 		$( '#pw-weak-text-label' ).text( __( 'Confirm use of weak password' ) );
    53 
    56 
    54 		// Focus the password field.
    57 		// Focus the password field.
    55 		$( $pass1 ).trigger( 'focus' );
    58 		if ( 'mailserver_pass' !== $pass1.prop('id' ) ) {
       
    59 			$( $pass1 ).trigger( 'focus' );
       
    60 		}
    56 	}
    61 	}
    57 
    62 
    58 	function bindPass1() {
    63 	function bindPass1() {
    59 		currentPass = $pass1.val();
    64 		currentPass = $pass1.val();
    60 
    65 
   144 	 *                                above this button
   149 	 *                                above this button
   145 	 * @param {bool}          success Whether the message is a success message.
   150 	 * @param {bool}          success Whether the message is a success message.
   146 	 * @param {string}        message The message to insert.
   151 	 * @param {string}        message The message to insert.
   147 	 */
   152 	 */
   148 	function addInlineNotice( $this, success, message ) {
   153 	function addInlineNotice( $this, success, message ) {
   149 		var resultDiv = $( '<div />' );
   154 		var resultDiv = $( '<div />', {
       
   155 			role: 'alert'
       
   156 		} );
   150 
   157 
   151 		// Set up the notice div.
   158 		// Set up the notice div.
   152 		resultDiv.addClass( 'notice inline' );
   159 		resultDiv.addClass( 'notice inline' );
   153 
   160 
   154 		// Add a class indicating success or failure.
   161 		// Add a class indicating success or failure.
   169 
   176 
   170 	function bindPasswordForm() {
   177 	function bindPasswordForm() {
   171 		var $generateButton,
   178 		var $generateButton,
   172 			$cancelButton;
   179 			$cancelButton;
   173 
   180 
   174 		$pass1Row = $( '.user-pass1-wrap, .user-pass-wrap, .reset-pass-submit' );
   181 		$pass1Row = $( '.user-pass1-wrap, .user-pass-wrap, .mailserver-pass-wrap, .reset-pass-submit' );
   175 
   182 
   176 		// Hide the confirm password field when JavaScript support is enabled.
   183 		// Hide the confirm password field when JavaScript support is enabled.
   177 		$('.user-pass2-wrap').hide();
   184 		$('.user-pass2-wrap').hide();
   178 
   185 
   179 		$submitButton = $( '#submit, #wp-submit' ).on( 'click', function () {
   186 		$submitButton = $( '#submit, #wp-submit' ).on( 'click', function () {
   186 		$weakCheckbox = $weakRow.find( '.pw-checkbox' );
   193 		$weakCheckbox = $weakRow.find( '.pw-checkbox' );
   187 		$weakCheckbox.on( 'change', function() {
   194 		$weakCheckbox.on( 'change', function() {
   188 			$submitButtons.prop( 'disabled', ! $weakCheckbox.prop( 'checked' ) );
   195 			$submitButtons.prop( 'disabled', ! $weakCheckbox.prop( 'checked' ) );
   189 		} );
   196 		} );
   190 
   197 
   191 		$pass1 = $('#pass1');
   198 		$pass1 = $('#pass1, #mailserver_pass');
   192 		if ( $pass1.length ) {
   199 		if ( $pass1.length ) {
   193 			bindPass1();
   200 			bindPass1();
   194 		} else {
   201 		} else {
   195 			// Password field for the login form.
   202 			// Password field for the login form.
   196 			$pass1 = $( '#user_pass' );
   203 			$pass1 = $( '#user_pass' );
   307 				break;
   314 				break;
   308 			case 5:
   315 			case 5:
   309 				$('#pass-strength-result').addClass('short').html( pwsL10n.mismatch );
   316 				$('#pass-strength-result').addClass('short').html( pwsL10n.mismatch );
   310 				break;
   317 				break;
   311 			default:
   318 			default:
   312 				$('#pass-strength-result').addClass('short').html( pwsL10n['short'] );
   319 				$('#pass-strength-result').addClass('short').html( pwsL10n.short );
   313 		}
   320 		}
   314 	}
   321 	}
   315 
   322 
   316 	function showOrHideWeakPasswordCheckbox() {
   323 	function showOrHideWeakPasswordCheckbox() {
   317 		var passStrength = $('#pass-strength-result')[0];
   324 		var passStrengthResult = $('#pass-strength-result');
   318 
   325 
   319 		if ( passStrength.className ) {
   326 		if ( passStrengthResult.length ) {
   320 			$pass1.addClass( passStrength.className );
   327 			var passStrength = passStrengthResult[0];
   321 			if ( $( passStrength ).is( '.short, .bad' ) ) {
   328 
   322 				if ( ! $weakCheckbox.prop( 'checked' ) ) {
   329 			if ( passStrength.className ) {
   323 					$submitButtons.prop( 'disabled', true );
   330 				$pass1.addClass( passStrength.className );
       
   331 				if ( $( passStrength ).is( '.short, .bad' ) ) {
       
   332 					if ( ! $weakCheckbox.prop( 'checked' ) ) {
       
   333 						$submitButtons.prop( 'disabled', true );
       
   334 					}
       
   335 					$weakRow.show();
       
   336 				} else {
       
   337 					if ( $( passStrength ).is( '.empty' ) ) {
       
   338 						$submitButtons.prop( 'disabled', true );
       
   339 						$weakCheckbox.prop( 'checked', false );
       
   340 					} else {
       
   341 						$submitButtons.prop( 'disabled', false );
       
   342 					}
       
   343 					$weakRow.hide();
   324 				}
   344 				}
   325 				$weakRow.show();
       
   326 			} else {
       
   327 				if ( $( passStrength ).is( '.empty' ) ) {
       
   328 					$submitButtons.prop( 'disabled', true );
       
   329 					$weakCheckbox.prop( 'checked', false );
       
   330 				} else {
       
   331 					$submitButtons.prop( 'disabled', false );
       
   332 				}
       
   333 				$weakRow.hide();
       
   334 			}
   345 			}
   335 		}
   346 		}
   336 	}
   347 	}
   337 
   348 
   338 	$( function() {
   349 	$( function() {
   446 			}
   457 			}
   447 		});
   458 		});
   448 
   459 
   449 		bindPasswordForm();
   460 		bindPasswordForm();
   450 		bindPasswordResetLink();
   461 		bindPasswordResetLink();
       
   462 		$submitButtons.on( 'click', function() {
       
   463 			isSubmitting = true;
       
   464 		});
       
   465 
       
   466 		$form = $( '#your-profile, #createuser' );
       
   467 		originalFormContent = $form.serialize();
   451 	});
   468 	});
   452 
   469 
   453 	$( '#destroy-sessions' ).on( 'click', function( e ) {
   470 	$( '#destroy-sessions' ).on( 'click', function( e ) {
   454 		var $this = $(this);
   471 		var $this = $(this);
   455 
   472 
   457 			nonce: $( '#_wpnonce' ).val(),
   474 			nonce: $( '#_wpnonce' ).val(),
   458 			user_id: $( '#user_id' ).val()
   475 			user_id: $( '#user_id' ).val()
   459 		}).done( function( response ) {
   476 		}).done( function( response ) {
   460 			$this.prop( 'disabled', true );
   477 			$this.prop( 'disabled', true );
   461 			$this.siblings( '.notice' ).remove();
   478 			$this.siblings( '.notice' ).remove();
   462 			$this.before( '<div class="notice notice-success inline"><p>' + response.message + '</p></div>' );
   479 			$this.before( '<div class="notice notice-success inline" role="alert"><p>' + response.message + '</p></div>' );
   463 		}).fail( function( response ) {
   480 		}).fail( function( response ) {
   464 			$this.siblings( '.notice' ).remove();
   481 			$this.siblings( '.notice' ).remove();
   465 			$this.before( '<div class="notice notice-error inline"><p>' + response.message + '</p></div>' );
   482 			$this.before( '<div class="notice notice-error inline" role="alert"><p>' + response.message + '</p></div>' );
   466 		});
   483 		});
   467 
   484 
   468 		e.preventDefault();
   485 		e.preventDefault();
   469 	});
   486 	});
   470 
   487 
   473 	// Warn the user if password was generated but not saved.
   490 	// Warn the user if password was generated but not saved.
   474 	$( window ).on( 'beforeunload', function () {
   491 	$( window ).on( 'beforeunload', function () {
   475 		if ( true === updateLock ) {
   492 		if ( true === updateLock ) {
   476 			return __( 'Your new password has not been saved.' );
   493 			return __( 'Your new password has not been saved.' );
   477 		}
   494 		}
   478 	} );
   495 		if ( originalFormContent !== $form.serialize() && ! isSubmitting ) {
       
   496 			return __( 'The changes you made will be lost if you navigate away from this page.' );
       
   497 		}
       
   498 	});
   479 
   499 
   480 	/*
   500 	/*
   481 	 * We need to generate a password as soon as the Reset Password page is loaded,
   501 	 * We need to generate a password as soon as the Reset Password page is loaded,
   482 	 * to avoid double clicking the button to retrieve the first generated password.
   502 	 * to avoid double clicking the button to retrieve the first generated password.
   483 	 * See ticket #39638.
   503 	 * See ticket #39638.