ifl/iflrandevu
1
1
Fork 0
forked from mirrors/easyappointments
Code Issues 6 Pull requests Releases 3 Activity

Replaced the use of the "hidden" class with the "hidden" attribute

Browse source
This commit is contained in:
Alex Tselegidis 2021-11-23 10:06:13 +01:00
parent 633cf0a722
commit 3808185ac9
5 changed files with 47 additions and 35 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

28
application/views/pages/settings/client_form/client_form_page.php
View file

@ -57,12 +57,12 @@
<div class="wrapper row"> <div class="wrapper row">
<div class="col-12 col-sm-3"> <div class="col-12 col-sm-3">
<div class="mb-3"> <div class="mb-3">
<label for="show-phone-number"> <label class="form-label" for="show-phone-number">
<?= lang('phone_number') ?> <?= lang('phone_number') ?>
</label> </label>
<button id="show-phone-number" data-field="show_phone_number" type="button" <button id="show-phone-number" data-field="show_phone_number" type="button"
class="hide-toggle form-control form-sub-button"> class="hide-toggle form-control form-sub-button">
<span class="hide-toggle-visible hidden"> <span class="hide-toggle-visible" hidden>
<img src="<?= base_url('assets/img/eye.svg') ?>" alt="eye"/> <img src="<?= base_url('assets/img/eye.svg') ?>" alt="eye"/>
<?= lang('visible') ?> <?= lang('visible') ?>
</span> </span>
@ -73,12 +73,12 @@
</button> </button>
</div> </div>
<div class="mb-3"> <div class="mb-3">
<label for="show-address"> <label class="form-label" for="show-address">
<?= lang('address') ?> <?= lang('address') ?>
</label> </label>
<button id="show-address" data-field="show_address" type="button" <button id="show-address" data-field="show_address" type="button"
class="hide-toggle form-control form-sub-button"> class="hide-toggle form-control form-sub-button">
<span class="hide-toggle-visible hidden"> <span class="hide-toggle-visible" hidden>
<img src="<?= base_url('assets/img/eye.svg') ?>" alt="eye"/> <img src="<?= base_url('assets/img/eye.svg') ?>" alt="eye"/>
<?= lang('visible') ?> <?= lang('visible') ?>
</span> </span>
@ -89,12 +89,12 @@
</button> </button>
</div> </div>
<div class="mb-3"> <div class="mb-3">
<label for="show-city"> <label class="form-label" for="show-city">
<?= lang('city') ?> <?= lang('city') ?>
</label> </label>
<button id="show-city" data-field="show_city" type="button" <button id="show-city" data-field="show_city" type="button"
class="hide-toggle form-control form-sub-button"> class="hide-toggle form-control form-sub-button">
<span class="hide-toggle-visible hidden"> <span class="hide-toggle-visible" hidden>
<img src="<?= base_url('assets/img/eye.svg') ?>" alt="eye"/> <img src="<?= base_url('assets/img/eye.svg') ?>" alt="eye"/>
<?= lang('visible') ?> <?= lang('visible') ?>
</span> </span>
@ -105,12 +105,12 @@
</button> </button>
</div> </div>
<div class="mb-3"> <div class="mb-3">
<label for="show-zip-code"> <label class="form-label" for="show-zip-code">
<?= lang('zip_code') ?> <?= lang('zip_code') ?>
</label> </label>
<button id="show-zip-code" data-field="show_zip_code" type="button" <button id="show-zip-code" data-field="show_zip_code" type="button"
class="hide-toggle form-control form-sub-button"> class="hide-toggle form-control form-sub-button">
<span class="hide-toggle-visible hidden"> <span class="hide-toggle-visible" hidden>
<img src="<?= base_url('assets/img/eye.svg') ?>" alt="eye"/> <img src="<?= base_url('assets/img/eye.svg') ?>" alt="eye"/>
<?= lang('visible') ?> <?= lang('visible') ?>
</span> </span>
@ -121,12 +121,12 @@
</button> </button>
</div> </div>
<div class="mb-3"> <div class="mb-3">
<label for="show-notes"> <label class="form-label" for="show-notes">
<?= lang('notes') ?> <?= lang('notes') ?>
</label> </label>
<button id="show-notes" data-field="show_notes" type="button" <button id="show-notes" data-field="show_notes" type="button"
class="hide-toggle form-control form-sub-button"> class="hide-toggle form-control form-sub-button">
<span class="hide-toggle-visible hidden"> <span class="hide-toggle-visible" hidden>
<img src="<?= base_url('assets/img/eye.svg') ?>" alt="eye"/> <img src="<?= base_url('assets/img/eye.svg') ?>" alt="eye"/>
<?= lang('visible') ?> <?= lang('visible') ?>
</span> </span>
@ -142,7 +142,7 @@
<div class="mb-3"> <div class="mb-3">
<div class="custom-control custom-switch"> <div class="custom-control custom-switch">
<input type="checkbox" class="custom-control-input" id="customer-notifications"> <input type="checkbox" class="custom-control-input" id="customer-notifications">
<label class="custom-form-label" for="customer-notifications"> <label class="form-label" class="custom-form-label" for="customer-notifications">
<?= lang('customer_notifications') ?> <?= lang('customer_notifications') ?>
</label> </label>
</div> </div>
@ -153,7 +153,7 @@
<div class="mb-3"> <div class="mb-3">
<div class="custom-control custom-switch"> <div class="custom-control custom-switch">
<input type="checkbox" class="custom-control-input" id="require-captcha"> <input type="checkbox" class="custom-control-input" id="require-captcha">
<label class="custom-form-label" for="require-captcha"> <label class="form-label" class="custom-form-label" for="require-captcha">
CAPTCHA CAPTCHA
</label> </label>
</div> </div>
@ -164,7 +164,7 @@
<div class="mb-3"> <div class="mb-3">
<div class="custom-control custom-switch"> <div class="custom-control custom-switch">
<input type="checkbox" class="custom-control-input" id="require-phone-number"> <input type="checkbox" class="custom-control-input" id="require-phone-number">
<label class="custom-form-label" for="require-phone-number"> <label class="form-label" class="custom-form-label" for="require-phone-number">
<?= lang('phone_number') ?> <?= lang('phone_number') ?>
</label> </label>
</div> </div>
@ -175,7 +175,7 @@
<div class="mb-3"> <div class="mb-3">
<div class="custom-control custom-switch"> <div class="custom-control custom-switch">
<input type="checkbox" class="custom-control-input" id="display-any-provider"> <input type="checkbox" class="custom-control-input" id="display-any-provider">
<label class="custom-form-label" for="display-any-provider"> <label class="form-label" class="custom-form-label" for="display-any-provider">
<?= lang('any_provider') ?> <?= lang('any_provider') ?>
</label> </label>
</div> </div>

6
assets/js/backend_calendar_working_plan_exceptions_modal.js
View file

@ -28,7 +28,7 @@ window.BackendCalendarWorkingPlanExceptionsModal = window.BackendCalendarWorking
* Stores the working plan exception changes or inserts a new record. * Stores the working plan exception changes or inserts a new record.
*/ */
$('#manage-working-plan-exceptions #save-working-plan-exception').on('click', function () { $('#manage-working-plan-exceptions #save-working-plan-exception').on('click', function () {
$('#manage-working-plan-exceptions .modal-message').addClass('hidden'); $('#manage-working-plan-exceptions .modal-message').prop('hidden', true);
$('#manage-working-plan-exceptions').find('.has-error').removeClass('has-error'); $('#manage-working-plan-exceptions').find('.has-error').removeClass('has-error');
@ -58,7 +58,7 @@ window.BackendCalendarWorkingPlanExceptionsModal = window.BackendCalendarWorking
$('#manage-working-plan-exceptions .modal-message') $('#manage-working-plan-exceptions .modal-message')
.text(EALang.start_date_before_end_error) .text(EALang.start_date_before_end_error)
.addClass('alert-danger') .addClass('alert-danger')
.removeClass('hidden'); .prop('hidden', false);
$('#working-plan-exception-start').addClass('has-error'); $('#working-plan-exception-start').addClass('has-error');
$('#working-plan-exception-end').addClass('has-error'); $('#working-plan-exception-end').addClass('has-error');
@ -76,7 +76,7 @@ window.BackendCalendarWorkingPlanExceptionsModal = window.BackendCalendarWorking
Backend.displayNotification(EALang.working_plan_exception_saved); Backend.displayNotification(EALang.working_plan_exception_saved);
// Close the modal modal and update the local provider. // Close the modal modal and update the local provider.
$('#manage-working-plan-exceptions .modal-message').addClass('hidden'); $('#manage-working-plan-exceptions .modal-message').prop('hidden', true);
$('#manage-working-plan-exceptions').modal('hide'); $('#manage-working-plan-exceptions').modal('hide');
var providerId = $('#working-plan-exception-provider').val(); var providerId = $('#working-plan-exception-provider').val();

40
assets/js/backend_settings_client_form.js
View file

@ -99,33 +99,45 @@ window.BackendSettingsClientForm = window.BackendSettingsClientForm || {};
* Change the state of the Visible/Hidden button * Change the state of the Visible/Hidden button
*/ */
$('.hide-toggle').on('click', function () { $('.hide-toggle').on('click', function () {
var $input = $(this); var $target = $(this);
$input.find('span').toggleClass('hidden');
$target.find('span').each(function (index, span) {
var $span = $(span);
var isHidden = $span.prop('hidden');
$span.prop('hidden', !isHidden);
});
}); });
/** /**
* set a Visible/Hidden toggle button to a certain state * Set a Visible/Hidden toggle button to a certain state.
*
* @argument $element for which jquery element to set the state for
* @argument isVisible a boolean which is true if the button should display 'visible' and false when the button should display 'hidden'
* *
* @param {jQuery} $target Target element selector.
* @param {Boolean} isVisible a boolean which is true if the button should display 'visible' and false when the button should display 'hidden'
*/ */
function setShowToggleValue($element, isVisible) { function setShowToggleValue($target, isVisible) {
if (getShowToggleValue($element) !== isVisible) { if (getShowToggleValue($target) !== isVisible) {
$element.find('span').toggleClass('hidden'); $target.find('span').each(function (index, span) {
var $span = $(span);
var isHidden = $span.prop('hidden');
$span.prop('hidden', !isHidden);
});
} }
} }
/** /**
* get the Visible/Hidden toggle button * Get the Visible/Hidden toggle button
* *
* @argument $element for which jquery element to set the state for * @param {jQuery} $target Target element selector.
* *
* @return the state of the button. True for visible, false for hidden. * @return the state of the button. True for visible, false for hidden.
*/ */
function getShowToggleValue($element) { function getShowToggleValue($target) {
var visiblePartArray = $element.find('.hide-toggle-visible'); var visiblePartArray = $target.find('.hide-toggle-visible');
return !visiblePartArray.hasClass('hidden'); return !visiblePartArray.prop('hidden');
} }
/** /**

2
assets/js/backend_settings_client_form_helper.js
View file

@ -57,7 +57,7 @@
var visiblePartArray = $element.find('.hide-toggle-visible'); var visiblePartArray = $element.find('.hide-toggle-visible');
var invisiblePartArray = $element.find('.hide-toggle-hidden'); var invisiblePartArray = $element.find('.hide-toggle-hidden');
if (!(visiblePartArray.length === 0 || invisiblePartArray.length === 0)) { if (!(visiblePartArray.length === 0 || invisiblePartArray.length === 0)) {
if (visiblePartArray.hasClass('hidden')) { if (visiblePartArray.prop('hidden')) {
//our button is currently invisible //our button is currently invisible
return '0'; //invisible return '0'; //invisible
} else { } else {

6
assets/js/installation.js
View file

@ -50,7 +50,7 @@ $(function () {
$alert $alert
.text('Easy!Appointments has been successfully installed!') .text('Easy!Appointments has been successfully installed!')
.addClass('alert-success') .addClass('alert-success')
.removeClass('hidden'); .prop('hidden', false);
setTimeout(function () { setTimeout(function () {
window.location.href = GlobalVariables.baseUrl + '/index.php/backend'; window.location.href = GlobalVariables.baseUrl + '/index.php/backend';
@ -67,7 +67,7 @@ $(function () {
*/ */
function validate() { function validate() {
try { try {
$alert.removeClass('alert-danger').addClass('hidden'); $alert.removeClass('alert-danger').prop('hidden', true);
$('input').closest('.form-group').removeClass('has-error'); $('input').closest('.form-group').removeClass('has-error');
// Check for empty fields. // Check for empty fields.
@ -109,7 +109,7 @@ $(function () {
return true; return true;
} catch (error) { } catch (error) {
$alert.addClass('alert-danger').text(error.message).removeClass('hidden'); $alert.addClass('alert-danger').text(error.message).prop('hidden', false);
return false; return false;
} }