mirror of
https://github.com/alextselegidis/easyappointments.git
synced 2024-12-26 16:42:27 +03:00
Code refactoring and improvements for the booking HTTP client.
This commit is contained in:
parent
04ec3adaa0
commit
63c81dc09c
1 changed files with 18 additions and 13 deletions
|
@ -17,6 +17,11 @@
|
||||||
* Old Name: FrontendBookApi
|
* Old Name: FrontendBookApi
|
||||||
*/
|
*/
|
||||||
App.Http.Booking = (function () {
|
App.Http.Booking = (function () {
|
||||||
|
const $selectService = $('#select-service');
|
||||||
|
const $selectProvider = $('#select-provider');
|
||||||
|
const $availableHours = $('#available-hours');
|
||||||
|
const $captchaHint = $('#captcha-hint');
|
||||||
|
const $captchaTitle = $('.captcha-title');
|
||||||
let unavailableDatesBackup;
|
let unavailableDatesBackup;
|
||||||
let selectedDateStringBackup;
|
let selectedDateStringBackup;
|
||||||
let processingUnavailabilities = false;
|
let processingUnavailabilities = false;
|
||||||
|
@ -30,10 +35,10 @@ App.Http.Booking = (function () {
|
||||||
* @param {String} selectedDate The selected date of the available hours we need.
|
* @param {String} selectedDate The selected date of the available hours we need.
|
||||||
*/
|
*/
|
||||||
function getAvailableHours(selectedDate) {
|
function getAvailableHours(selectedDate) {
|
||||||
$('#available-hours').empty();
|
$availableHours.empty();
|
||||||
|
|
||||||
// Find the selected service duration (it is going to be send within the "data" object).
|
// Find the selected service duration (it is going to be send within the "data" object).
|
||||||
const serviceId = $('#select-service').val();
|
const serviceId = $selectService.val();
|
||||||
|
|
||||||
// Default value of duration (in minutes).
|
// Default value of duration (in minutes).
|
||||||
let serviceDuration = 15;
|
let serviceDuration = 15;
|
||||||
|
@ -54,8 +59,8 @@ App.Http.Booking = (function () {
|
||||||
|
|
||||||
const data = {
|
const data = {
|
||||||
csrf_token: App.Vars.csrf_token,
|
csrf_token: App.Vars.csrf_token,
|
||||||
service_id: $('#select-service').val(),
|
service_id: $selectService.val(),
|
||||||
provider_id: $('#select-provider').val(),
|
provider_id: $selectProvider.val(),
|
||||||
selected_date: selectedDate,
|
selected_date: selectedDate,
|
||||||
service_duration: serviceDuration,
|
service_duration: serviceDuration,
|
||||||
manage_mode: App.Pages.Booking.manageMode,
|
manage_mode: App.Pages.Booking.manageMode,
|
||||||
|
@ -66,7 +71,7 @@ App.Http.Booking = (function () {
|
||||||
// The response contains the available hours for the selected provider and service. Fill the available
|
// The response contains the available hours for the selected provider and service. Fill the available
|
||||||
// hours div with response data.
|
// hours div with response data.
|
||||||
if (response.length > 0) {
|
if (response.length > 0) {
|
||||||
let providerId = $('#select-provider').val();
|
let providerId = $selectProvider.val();
|
||||||
|
|
||||||
if (providerId === 'any-provider') {
|
if (providerId === 'any-provider') {
|
||||||
for (const availableProvider of App.Vars.available_providers) {
|
for (const availableProvider of App.Vars.available_providers) {
|
||||||
|
@ -98,7 +103,7 @@ App.Http.Booking = (function () {
|
||||||
return; // Due to the selected timezone the available hour belongs to another date.
|
return; // Due to the selected timezone the available hour belongs to another date.
|
||||||
}
|
}
|
||||||
|
|
||||||
$('#available-hours').append(
|
$availableHours.append(
|
||||||
$('<button/>', {
|
$('<button/>', {
|
||||||
'class': 'btn btn-outline-secondary w-100 shadow-none available-hour',
|
'class': 'btn btn-outline-secondary w-100 shadow-none available-hour',
|
||||||
'data': {
|
'data': {
|
||||||
|
@ -127,8 +132,8 @@ App.Http.Booking = (function () {
|
||||||
App.Pages.Booking.updateConfirmFrame();
|
App.Pages.Booking.updateConfirmFrame();
|
||||||
}
|
}
|
||||||
|
|
||||||
if (!$('.available-hour').length) {
|
if (!$availableHours.find('.available-hour').length) {
|
||||||
$('#available-hours').text(App.Lang.no_available_hours);
|
$availableHours.text(App.Lang.no_available_hours);
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
@ -188,13 +193,13 @@ App.Http.Booking = (function () {
|
||||||
})
|
})
|
||||||
.done((response) => {
|
.done((response) => {
|
||||||
if (response.captcha_verification === false) {
|
if (response.captcha_verification === false) {
|
||||||
$('#captcha-hint').text(App.Lang.captcha_is_wrong).fadeTo(400, 1);
|
$captchaHint.text(App.Lang.captcha_is_wrong).fadeTo(400, 1);
|
||||||
|
|
||||||
setTimeout(() => {
|
setTimeout(() => {
|
||||||
$('#captcha-hint').fadeTo(400, 0);
|
$captchaHint.fadeTo(400, 0);
|
||||||
}, 3000);
|
}, 3000);
|
||||||
|
|
||||||
$('.captcha-title button').trigger('click');
|
$captchaTitle.find('button').trigger('click');
|
||||||
|
|
||||||
$captchaText.addClass('is-invalid');
|
$captchaText.addClass('is-invalid');
|
||||||
|
|
||||||
|
@ -204,7 +209,7 @@ App.Http.Booking = (function () {
|
||||||
window.location.href = App.Utils.Url.siteUrl('booking_confirmation/of/' + response.appointment_hash);
|
window.location.href = App.Utils.Url.siteUrl('booking_confirmation/of/' + response.appointment_hash);
|
||||||
})
|
})
|
||||||
.fail(() => {
|
.fail(() => {
|
||||||
$('.captcha-title button').trigger('click');
|
$captchaTitle.find('button').trigger('click');
|
||||||
})
|
})
|
||||||
.always(() => {
|
.always(() => {
|
||||||
$layer.remove();
|
$layer.remove();
|
||||||
|
@ -283,7 +288,7 @@ App.Http.Booking = (function () {
|
||||||
|
|
||||||
// If all the days are unavailable then hide the appointments hours.
|
// If all the days are unavailable then hide the appointments hours.
|
||||||
if (unavailableDates.length === numberOfDays) {
|
if (unavailableDates.length === numberOfDays) {
|
||||||
$('#available-hours').text(App.Lang.no_available_hours);
|
$availableHours.text(App.Lang.no_available_hours);
|
||||||
}
|
}
|
||||||
|
|
||||||
// Grey out unavailable dates.
|
// Grey out unavailable dates.
|
||||||
|
|
Loading…
Reference in a new issue