// Password visibility toggle (wp_login_form instance).
(function() {
const toggleButton = document.querySelectorAll('#pmpro_btn-password-toggle-5')[0];
const toggleWrapper = toggleButton.closest('.pmpro_form_field-password-toggle');
const loginForm = toggleWrapper.previousElementSibling;
const passwordParagraph = loginForm.querySelector('.login-password');
const passwordInput = loginForm.querySelector('#user_pass');
passwordParagraph.appendChild(toggleWrapper);
toggleButton.classList.remove('hide-if-no-js');
toggleButton.addEventListener('click', togglePassword);
function togglePassword() {
const status = this.getAttribute('data-toggle');
const passwordInputs = document.querySelectorAll('#user_pass');
const icon = this.getElementsByClassName('pmpro_icon')[0];
const state = this.getElementsByClassName('pmpro_form_field-password-toggle-state')[0];
if (parseInt(status, 10) === 0) {
this.setAttribute('data-toggle', 1);
passwordInput.setAttribute( 'type', 'text' );
icon.innerHTML = `
`;
state.textContent = 'Hide Password';
} else {
this.setAttribute('data-toggle', 0);
passwordInput.setAttribute( 'type', 'password' );
icon.innerHTML = `
`;
state.textContent = 'Show Password';
}
}
})();
Skip to content
