File "user-profile.js"
Full Path: /home/fashionbridge/public_html/user/user-profile.js
File size: 12 KB
MIME-type: text/x-asm
Charset: utf-8
/**
* @output wp-admin/js/user-profile.js
*/
/* global ajaxurl, pwsL10n, userProfileL10n, ClipboardJS */
(function($) {
var updateLock = false,
isSubmitting = false,
__ = wp.i18n.__,
clipboard = new ClipboardJS( '.application-password-display .copy-button' ),
$pass1Row,
$pass1,
$pass2,
$weakRow,
$weakCheckbox,
$toggleButton,
$submitButtons,
$submitButton,
currentPass,
$form,
originalFormContent,
$passwordWrapper,
successTimeout,
isMac = window.navigator.platform ? window.navigator.platform.indexOf( 'Mac' ) !== -1 : false,
ua = navigator.userAgent.toLowerCase(),
isSafari = window.safari !== 'undefined' && typeof window.safari === 'object',
isFirefox = ua.indexOf( 'firefox' ) !== -1;
function generatePassword() {
if ( typeof zxcvbn !== 'function' ) {
setTimeout( generatePassword, 50 );
return;
} else if ( ! $pass1.val() || $passwordWrapper.hasClass( 'is-open' ) ) {
// zxcvbn loaded before user entered password, or generating new password.
$pass1.val( $pass1.data( 'pw' ) );
$pass1.trigger( 'pwupdate' );
showOrHideWeakPasswordCheckbox();
} else {
// zxcvbn loaded after the user entered password, check strength.
check_pass_strength();
showOrHideWeakPasswordCheckbox();
}
/*
* This works around a race condition when zxcvbn loads quickly and
* causes `generatePassword()` to run prior to the toggle button being
* bound.
*/
bindToggleButton();
// Install screen.
if ( 1 !== parseInt( $toggleButton.data( 'start-masked' ), 10 ) ) {
// Show the password not masked if admin_password hasn't been posted yet.
$pass1.attr( 'type', 'text' );
} else {
// Otherwise, mask the password.
$toggleButton.trigger( 'click' );
}
// Once zxcvbn loads, passwords strength is known.
$( '#pw-weak-text-label' ).text( __( 'Confirm use of weak password' ) );
// Focus the password field if not the install screen.
if ( 'mailserver_pass' !== $pass1.prop('id' ) && ! $('#weblog_title').length ) {
$( $pass1 ).trigger( 'focus' );
}
}
function bindPass1() {
currentPass = $pass1.val();
if ( 1 === parseInt( $pass1.data( 'reveal' ), 10 ) ) {
generatePassword();
}
$pass1.on( 'input' + ' pwupdate', function () {
if ( $pass1.val() === currentPass ) {
return;
}
currentPass = $pass1.val();
// Refresh password strength area.
$pass1.removeClass( 'short bad good strong' );
showOrHideWeakPasswordCheckbox();
} );
bindCapsLockWarning( $pass1 );
}
function resetToggle( show ) {
$toggleButton
.attr({
'aria-label': show ? __( 'Show password' ) : __( 'Hide password' )
})
.find( '.text' )
.text( show ? __( 'Show' ) : __( 'Hide' ) )
.end()
.find( '.dashicons' )
.removeClass( show ? 'dashicons-hidden' : 'dashicons-visibility' )
.addClass( show ? 'dashicons-visibility' : 'dashicons-hidden' );
}
function bindToggleButton() {
if ( !! $toggleButton ) {
// Do not rebind.
return;
}
$toggleButton = $pass1Row.find('.wp-hide-pw');
// Toggle between showing and hiding the password.
$toggleButton.show().on( 'click', function () {
if ( 'password' === $pass1.attr( 'type' ) ) {
$pass1.attr( 'type', 'text' );
resetToggle( false );
} else {
$pass1.attr( 'type', 'password' );
resetToggle( true );
}
});
// Ensure the password input type is set to password when the form is submitted.
$pass1Row.closest( 'form' ).on( 'submit', function() {
if ( $pass1.attr( 'type' ) === 'text' ) {
$pass1.attr( 'type', 'password' );
resetToggle( true );
}
} );
}
/**
* Handle the password reset button. Sets up an ajax callback to trigger sending
* a password reset email.
*/
function bindPasswordResetLink() {
$( '#generate-reset-link' ).on( 'click', function() {
var $this = $(this),
data = {
'user_id': userProfileL10n.user_id, // The user to send a reset to.
'nonce': userProfileL10n.nonce // Nonce to validate the action.
};
// Remove any previous error messages.
$this.parent().find( '.notice-error' ).remove();
// Send the reset request.
var resetAction = wp.ajax.post( 'send-password-reset', data );
// Handle reset success.
resetAction.done( function( response ) {
addInlineNotice( $this, true, response );
} );
// Handle reset failure.
resetAction.fail( function( response ) {
addInlineNotice( $this, false, response );
} );
});
}
/**
* Helper function to insert an inline notice of success or failure.
*
* @param {jQuery Object} $this The button element: the message will be inserted
* above this button
* @param {bool} success Whether the message is a success message.
* @param {string} message The message to insert.
*/
function addInlineNotice( $this, success, message ) {
var resultDiv = $( '<div />', {
role: 'alert'
} );
// Set up the notice div.
resultDiv.addClass( 'notice inline' );
// Add a class indicating success or failure.
resultDiv.addClass( 'notice-' + ( success ? 'success' : 'error' ) );
// Add the message, wrapping in a p tag, with a fadein to highlight each message.
resultDiv.text( $( $.parseHTML( message ) ).text() ).wrapInner( '<p />');
// Disable the button when the callback has succeeded.
$this.prop( 'disabled', success );
// Remove any previous notices.
$this.siblings( '.notice' ).remove();
// Insert the notice.
$this.before( resultDiv );
}
function bindPasswordForm() {
var $generateButton,
$cancelButton;
$pass1Row = $( '.user-pass1-wrap, .user-pass-wrap, .mailserver-pass-wrap, .reset-pass-submit' );
// Hide the confirm password field when JavaScript support is enabled.
$('.user-pass2-wrap').hide();
$submitButton = $( '#submit, #wp-submit' ).on( 'click', function () {
updateLock = false;
});
$submitButtons = $submitButton.add( ' #createusersub' );
$weakRow = $( '.pw-weak' );
$weakCheckbox = $weakRow.find( '.pw-checkbox' );
$weakCheckbox.on( 'change', function() {
$submitButtons.prop( 'disabled', ! $weakCheckbox.prop( 'checked' ) );
} );
$pass1 = $('#pass1, #mailserver_pass');
if ( $pass1.length ) {
bindPass1();
} else {
// Password field for the login form.
$pass1 = $( '#user_pass' );
bindCapsLockWarning( $pass1 );
}
/*
* Fix a LastPass mismatch issue, LastPass only changes pass2.
*
* This fixes the issue by copying any changes from the hidden
* pass2 field to the pass1 field, then running check_pass_strength.
*/
$pass2 = $( '#pass2' ).on( 'input', function () {
if ( $pass2.val().length > 0 ) {
$pass1.val( $pass2.val() );
$pass2.val('');
currentPass = '';
$pass1.trigger( 'pwupdate' );
}
} );
// Disable hidden inputs to prevent autofill and submission.
if ( $pass1.is( ':hidden' ) ) {
$pass1.prop( 'disabled', true );
$pass2.prop( 'disabled', true );
}
$passwordWrapper = $pass1Row.find( '.wp-pwd' );
$generateButton = $pass1Row.find( 'button.wp-generate-pw' );
bindToggleButton();
$generateButton.show();
$generateButton.on( 'click', function () {
updateLock = true;
// Make sure the password fields are shown.
$generateButton.not( '.skip-aria-expanded' ).attr( 'aria-expanded', 'true' );
$passwordWrapper
.show()
.addClass( 'is-open' );
// Enable the inputs when showing.
$pass1.attr( 'disabled', false );
$pass2.attr( 'disabled', false );
// Set the password to the generated value.
generatePassword();
// Show generated password in plaintext by default.
resetToggle ( false );
// Generate the next password and cache.
wp.ajax.post( 'generate-password' )
.done( function( data ) {
$pass1.data( 'pw', data );
} );
} );
$cancelButton = $pass1Row.find( 'button.wp-cancel-pw' );
$cancelButton.on( 'click', function () {
updateLock = false;
// Disable the inputs when hiding to prevent autofill and submission.
$pass1.prop( 'disabled', true );
$pass2.prop( 'disabled', true );
// Clear password field and update the UI.
$pass1.val( '' ).trigger( 'pwupdate' );
resetToggle( false );
// Hide password controls.
$passwordWrapper
.hide()
.removeClass( 'is-open' );
// Stop an empty password from being submitted as a change.
$submitButtons.prop( 'disabled', false );
$generateButton.attr( 'aria-expanded', 'false' );
} );
$pass1Row.closest( 'form' ).on( 'submit', function () {
updateLock = false;
$pass1.prop( 'disabled', false );
$pass2.prop( 'disabled', false );
$pass2.val( $pass1.val() );
});
}
function check_pass_strength() {
var pass1 = $('#pass1').val(), strength;
$('#pass-strength-result').removeClass('short bad good strong empty');
if ( ! pass1 || '' === pass1.trim() ) {
$( '#pass-strength-result' ).addClass( 'empty' ).html( ' ' );
return;
}
strength = wp.passwordStrength.meter( pass1, wp.passwordStrength.userInputDisallowedList(), pass1 );
switch ( strength ) {
case -1:
$( '#pass-strength-result' ).addClass( 'bad' ).html( pwsL10n.unknown );
break;
case 2:
$('#pass-strength-result').addClass('bad').html( pwsL10n.bad );
break;
case 3:
$('#pass-strength-result').addClass('good').html( pwsL10n.good );
break;
case 4:
$('#pass-strength-result').addClass('strong').html( pwsL10n.strong );
break;
case 5:
$('#pass-strength-result').addClass('short').html( pwsL10n.mismatch );
break;
default:
$('#pass-strength-result').addClass('short').html( pwsL10n.short );
}
}
/**
* Bind Caps Lock detection to a password input field.
*
* @param {jQuery} $input The password input field.
*/
function bindCapsLockWarning( $input ) {
var $capsWarning,
$capsIcon,
$capsText,
capsLockOn = false;
// Skip warning on macOS Safari + Firefox (they show native indicators).
if ( isMac && ( isSafari || isFirefox ) ) {
return;
}
$capsWarning = $( '<div id="caps-warning" class="caps-warning"></div>' );
$capsIcon = $( '<span class="caps-icon" aria-hidden="true"><svg viewBox="0 0 24 26" xmlns="http://www.w3.org/2000/svg" fill="#3c434a" stroke="#3c434a" stroke-width="0.5"><path d="M12 5L19 15H16V19H8V15H5L12 5Z"/><rect x="8" y="21" width="8" height="1.5" rx="0.75"/></svg></span>' );
$capsText = $( '<span>', { 'class': 'caps-warning-text', text: __( 'Caps lock is on.' ) } );
$capsWarning.append( $capsIcon, $capsText );
$input.parent( 'div' ).append( $capsWarning );
$input.on( 'keydown', function( jqEvent ) {
var event = jqEvent.originalEvent;
// Skip if key is not a printable character.
// Key length > 1 usually means non-printable (e.g., "Enter", "Tab").
if ( event.ctrlKey || event.metaKey || event.altKey || ! event.key || event.key.length !== 1 ) {
return;
}
var state = isCapsLockOn( event );
// React when the state changes or if caps lock is on when the user starts typing.
if ( state !== capsLockOn ) {
capsLockOn = state;
if ( capsLockOn ) {
$capsWarning.show();
// Don't duplicate existing screen reader Caps lock notifications.
if ( event.key !== 'CapsLock' ) {
wp.a11y.speak( __( 'Caps lock is on.' ), 'assertive' );
}
} else {
$capsWarning.hide();
}
}
} );
$input.on( 'blur', function() {
if ( ! document.hasFocus() ) {
return;
}
capsLockOn = false;
$capsWarning.hide();
} );
}
/**
* Determines if Caps Lock is currently enabled.
*
* On macOS Safari and Firefox, the native warning is preferred,
* so this function returns false to suppress custom warnings.
*
* @param {KeyboardEvent} e The keydown event object.
*
* @return {boolean} True if Caps Lock is on, false otherwise.
*/
function isCapsLockOn( event ) {
return event.getModifierState( 'CapsLock' );
}
function showOrHideWeakPasswordCheckbox() {
var passStrengthResult = $('#pass-strength-result');
if ( passStrengthResult.length ) {
var passStrength = passStrengthResult[0];
if ( passStrength.className ) {
$pass1.addClass( passStrength.className );
if ( $( passStrength ).is( '.short, .bad' ) ) {
if ( ! $weakCheckbox.prop( 'checked