Quick fix for the frontend unavailable dates issue (broken after jquery ui update).

This commit is contained in:
Alex Tselegidis 2016-07-18 23:23:53 +02:00
parent 6d074398d0
commit 9ef266b73c
2 changed files with 49 additions and 25 deletions

View file

@ -328,6 +328,13 @@ window.FrontendBook = window.FrontendBook || {};
$('.captcha-title small').click(function(event) {
$('.captcha-image').attr('src', GlobalVariables.baseUrl + '/index.php/captcha?' + Date.now());
});
$('#select-date').on('mousedown', '.ui-datepicker-calendar td', function(event) {
setTimeout(function() {
FrontendBookApi.applyPreviousUnavailableDates(); // New jQuery UI version will replace the td elements.
}, 300); // There is no draw event unfortunately.
})
};
/**

View file

@ -22,6 +22,9 @@ window.FrontendBookApi = window.FrontendBookApi || {};
'use strict';
var unavailableDatesBackup;
var selectedDateStringBackup;
/**
* Get Available Hours
*
@ -212,33 +215,47 @@ window.FrontendBookApi = window.FrontendBookApi || {};
dataType: 'json'
})
.done(function(response) {
// Select first enabled date.
var selectedDate = Date.parse(selectedDateString);
var numberOfDays = new Date(selectedDate.getFullYear(), selectedDate.getMonth() + 1, 0).getDate();
for (var i=1; i<=numberOfDays; i++) {
var currentDate = new Date(selectedDate.getFullYear(), selectedDate.getMonth(), i);
if ($.inArray(currentDate.toString('yyyy-MM-dd'), response) === -1) {
$('#select-date').datepicker('setDate', currentDate);
FrontendBookApi.getAvailableHours(currentDate.toString('yyyy-MM-dd'));
break;
}
}
// If all the days are unavailable then hide the appointments hours.
if (response.length === numberOfDays) {
$('#available-hours').text(EALang['no_available_hours']);
}
// Grey out unavailable dates.
$('#select-date .ui-datepicker-calendar td:not(.ui-datepicker-other-month)').each(function(index, td) {
selectedDate.set({day: index + 1});
if ($.inArray(selectedDate.toString('yyyy-MM-dd'), response) != -1) {
$(td).addClass('ui-datepicker-unselectable ui-state-disabled');
}
});
unavailableDatesBackup = response;
selectedDateStringBackup = selectedDateString;
_applyUnavailableDates(response, selectedDateString);
})
.fail(GeneralFunctions.ajaxFailureHandler);
};
exports.applyPreviousUnavailableDates = function() {
_applyUnavailableDates(unavailableDatesBackup, selectedDateStringBackup);
};
function _applyUnavailableDates(unavailableDates, selectedDateString, setDate) {
setDate = setDate || false;
// Select first enabled date.
var selectedDate = Date.parse(selectedDateString);
var numberOfDays = new Date(selectedDate.getFullYear(), selectedDate.getMonth() + 1, 0).getDate();
if (setDate) {
for (var i=1; i<=numberOfDays; i++) {
var currentDate = new Date(selectedDate.getFullYear(), selectedDate.getMonth(), i);
if ($.inArray(currentDate.toString('yyyy-MM-dd'), unavailableDates) === -1) {
$('#select-date').datepicker('setDate', currentDate);
FrontendBookApi.getAvailableHours(currentDate.toString('yyyy-MM-dd'));
break;
}
}
}
// If all the days are unavailable then hide the appointments hours.
if (unavailableDates.length === numberOfDays) {
$('#available-hours').text(EALang['no_available_hours']);
}
// Grey out unavailable dates.
$('#select-date .ui-datepicker-calendar td:not(.ui-datepicker-other-month)').each(function(index, td) {
selectedDate.set({day: index + 1});
if ($.inArray(selectedDate.toString('yyyy-MM-dd'), unavailableDates) != -1) {
$(td).addClass('ui-datepicker-unselectable ui-state-disabled');
}
});
}
})(window.FrontendBookApi);