7a246a189a
Reusable ``password_toggle.blade.php`` partial that wraps every ``input[type=password]`` with an eye icon button. Clicking it toggles between hidden and visible text. Handles Bootstrap modals via ``shown.bs.modal`` event. Applied on login, register, password change (shop + admin), password reset, and first login pages.
45 lines
1.8 KiB
PHP
45 lines
1.8 KiB
PHP
@if (!defined('LOAD_PASSWORD_TOGGLE'))
|
|
@push('js')
|
|
<script>
|
|
function initPasswordToggle(context) {
|
|
var $ctx = $(context || document);
|
|
$ctx.find('input[type="password"]').each(function() {
|
|
var $input = $(this);
|
|
if ($input.closest('.input-group').find('.password-toggle').length) {
|
|
return;
|
|
}
|
|
if (!$input.parent().hasClass('input-group')) {
|
|
$input.wrap('<div class="input-group"></div>');
|
|
}
|
|
var $btn = $('<div class="input-group-append">' +
|
|
'<button class="btn btn-outline-secondary password-toggle" type="button" tabindex="-1">' +
|
|
'<i class="fa fa-eye"></i>' +
|
|
'</button></div>');
|
|
$input.after($btn);
|
|
});
|
|
}
|
|
|
|
$(function() {
|
|
initPasswordToggle();
|
|
|
|
$(document).on('shown.bs.modal', function(e) {
|
|
initPasswordToggle(e.target);
|
|
});
|
|
|
|
$(document).on('click', '.password-toggle', function() {
|
|
var $btn = $(this);
|
|
var $input = $btn.closest('.input-group').find('input');
|
|
if ($input.attr('type') === 'password') {
|
|
$input.attr('type', 'text');
|
|
$btn.find('i').removeClass('fa-eye').addClass('fa-eye-slash');
|
|
} else {
|
|
$input.attr('type', 'password');
|
|
$btn.find('i').removeClass('fa-eye-slash').addClass('fa-eye');
|
|
}
|
|
});
|
|
});
|
|
</script>
|
|
@endpush
|
|
@php(define('LOAD_PASSWORD_TOGGLE', true))
|
|
@endif
|