maket/MaketRandevu
1
1
Fork 0
Code Issues 15 Pull requests Projects Releases 4 Packages Wiki Activity

Code refactoring and improvements for the booking HTTP client.

Browse source
This commit is contained in:
Alex Tselegidis 2022-01-17 05:14:36 +01:00
parent 04ec3adaa0
commit 63c81dc09c
1 changed files with 18 additions and 13 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

31
assets/js/http/booking_http_client.js
View file

@ -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.