mirrors/easyappointments
1
0
Fork 1
mirror of https://github.com/alextselegidis/easyappointments.git synced 2024-12-26 00:23:33 +03:00
Code Issues Projects Releases Packages Wiki Activity

Refactor the calendar related JS files so that they become standalone modules.

Browse source
This commit is contained in:
Alex Tselegidis 2022-01-12 11:22:54 +01:00
parent ddd252303e
commit 745f70848a
9 changed files with 921 additions and 870 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

35
application/controllers/Calendar.php
View file

@ -27,6 +27,7 @@ class Calendar extends EA_Controller {
parent::__construct();
$this->load->model('appointments_model');
$this->load->model('unavailabilities_model');
$this->load->model('customers_model');
$this->load->model('services_model');
$this->load->model('providers_model');
@ -86,15 +87,35 @@ class Calendar extends EA_Controller {
}
}
$privileges = $this->roles_model->get_permissions_by_slug($role_slug);
$available_providers = $this->providers_model->get_available_providers();
$available_services = $this->services_model->get_available_services();
script_vars([
'user_id' => $user_id,
'role_slug' => $role_slug,
'date_format' => setting('date_format'),
'time_format' => setting('time_format'),
'first_weekday' => setting('first_weekday'),
'timezones' => $this->timezones->to_array(),
'privileges' => $privileges,
'available_providers' => $available_providers,
'available_services' => $available_services,
'customers' => [], // TODO: Remove the use of the pre-rendered customer set and only work with asynchronously fetched customer records.
]);
html_vars([
'page_title' => lang('calendar'),
'active_menu' => PRIV_APPOINTMENTS,
'user_display_name' => $this->accounts->get_user_display_name($user_id),
'timezone' => session('timezone'),
'timezones' => $this->timezones->to_array(),
'privileges' => $this->roles_model->get_permissions_by_slug($role_slug),
'privileges' => $privileges,
'calendar_view' => request('view', $user['settings']['calendar_view']),
'available_providers' => $this->providers_model->get_available_providers(),
'available_services' => $this->services_model->get_available_services(),
'available_providers' => $available_providers,
'available_services' => $available_services,
'secretary_providers' => $secretary_providers,
'edit_appointment' => $edit_appointment,
'require_first_name' => setting('require_first_name'),
@ -134,7 +155,7 @@ class Calendar extends EA_Controller {
if ($customer_data)
{
$customer = json_decode($customer_data, TRUE);
$customer = $customer_data;
$required_permissions = ! empty($customer['id'])
? can('add', PRIV_CUSTOMERS)
@ -155,7 +176,7 @@ class Calendar extends EA_Controller {
if ($appointment_data)
{
$appointment = json_decode($appointment_data, TRUE);
$appointment = $appointment_data;
$required_permissions = ! empty($appointment['id'])
? can('add', PRIV_APPOINTMENTS)
@ -270,7 +291,7 @@ class Calendar extends EA_Controller {
try
{
// Check privileges
$unavailable = json_decode(request('unavailable'), TRUE);
$unavailable = request('unavailable');
$required_permissions = ( ! isset($unavailable['id']))
? can('add', PRIV_APPOINTMENTS)
@ -597,7 +618,7 @@ class Calendar extends EA_Controller {
AND is_unavailable = 1
';
$response['unavailables'] = $this->appointments_model->get($where_clause);
$response['unavailables'] = $this->unavailabilities_model->get($where_clause);
}
foreach ($response['unavailables'] as &$unavailable)

86
application/views/pages/calendar.php
View file

@ -16,6 +16,15 @@
* @var string $timezone
* @var string $role_slug
* @var array $privileges
* @var array $available_services
* @var array $timezones
* @var array $require_first_name
* @var array $require_last_name
* @var array $require_email
* @var array $require_phone_number
* @var array $require_address
* @var array $require_city
* @var array $require_zip_code
*/
?>
@ -33,39 +42,19 @@
<script src="<?= asset_url('assets/vendor/jquery-jeditable/jquery.jeditable.min.js') ?>"></script>
<script src="<?= asset_url('assets/vendor/jquery-ui-timepicker-addon/jquery-ui-timepicker-addon.min.js') ?>"></script>
<script src="<?= asset_url('assets/js/components/working_plan_exceptions_modal.js') ?>"></script>
<script src="<?= asset_url('assets/js/pages/backend_calendar.js') ?>"></script>
<script src="<?= asset_url('assets/js/pages/backend_calendar_default_view.js') ?>"></script>
<script src="<?= asset_url('assets/js/pages/backend_calendar_table_view.js') ?>"></script>
<script src="<?= asset_url('assets/js/pages/backend_calendar_google_sync.js') ?>"></script>
<script src="<?= asset_url('assets/js/pages/backend_calendar_appointments_modal.js') ?>"></script>
<script src="<?= asset_url('assets/js/pages/backend_calendar_unavailability_events_modal.js') ?>"></script>
<script src="<?= asset_url('assets/js/pages/backend_calendar_api.js') ?>"></script>
<script>
var GlobalVariables = {
csrfToken: <?= json_encode($this->security->get_csrf_hash()) ?>,
baseUrl: <?= json_encode(config('base_url')) ?>,
dateFormat: <?= json_encode(setting('date_format')) ?>,
timeFormat: <?= json_encode(setting('time_format')) ?>,
firstWeekday: <?= json_encode(setting('first_weekday')) ?>,
timezones: <?= json_encode($timezones) ?>,
availableProviders: <?= json_encode($available_providers) ?>,
availableServices: <?= json_encode($available_services) ?>,
secretaryProviders: <?= json_encode($secretary_providers) ?>,
calendarView: <?= json_encode($calendar_view) ?>,
editAppointment: <?= json_encode($edit_appointment) ?>,
user: {
id: <?= session('user_id') ?>,
email: <?= json_encode(session('user_email')) ?>,
timezone: <?= json_encode(session('timezone')) ?>,
role_slug: <?= json_encode(session('role_slug')) ?>,
privileges: <?= json_encode($privileges) ?>
}
};
$(function () {
BackendCalendar.initialize(GlobalVariables.calendarView);
});
</script>
<script src="<?= asset_url('assets/js/components/manage_appointments_modal.js') ?>"></script>
<script src="<?= asset_url('assets/js/components/manage_unavailabilities_modal.js') ?>"></script>
<script src="<?= asset_url('assets/js/utils/date.js') ?>"></script>
<script src="<?= asset_url('assets/js/utils/message.js') ?>"></script>
<script src="<?= asset_url('assets/js/utils/validation.js') ?>"></script>
<script src="<?= asset_url('assets/js/utils/url.js') ?>"></script>
<script src="<?= asset_url('assets/js/utils/calendar_default_view.js') ?>"></script>
<script src="<?= asset_url('assets/js/utils/calendar_table_view.js') ?>"></script>
<script src="<?= asset_url('assets/js/utils/calendar_google_sync.js') ?>"></script>
<script src="<?= asset_url('assets/js/utils/calendar_event_popover.js') ?>"></script>
<script src="<?= asset_url('assets/js/http/calendar_http_client.js') ?>"></script>
<script src="<?= asset_url('assets/js/http/customers_http_client.js') ?>"></script>
<script src="<?= asset_url('assets/js/pages/calendar.js') ?>"></script>
<?php section('scripts') ?>
@ -151,11 +140,34 @@
<!-- Page Components -->
<?php component('manage_appointment_modal', '', ['timezones' => $timezones]) ?>
<?php
component(
'manage_appointment_modal',
'',
[
'available_services' => $available_services,
'timezones' => $timezones,
'require_first_name' => $require_first_name,
'require_last_name' => $require_last_name,
'require_email' => $require_email,
'require_phone_number' => $require_phone_number,
'require_address' => $require_address,
'require_city' => $require_city,
'require_zip_code' => $require_zip_code
]
)
?>
<?php component('manage_appointment_modal') ?>
<?php component('manage_unavailable_modal') ?>
<?php
component(
'manage_unavailable_modal',
'',
[
'timezones' => $timezones,
'timezone' => $timezone
]
)
?>
<?php component('select_google_calendar_modal') ?>

253
assets/js/pages/backend_calendar_appointments_modal.js → assets/js/components/manage_appointments_modal.js
View file

@ -14,22 +14,18 @@
*
* This module implements the appointments modal functionality.
*
* @module BackendCalendarAppointmentsModal
* Old Module Name: BackendCalendarAppointmentsModal
*/
window.BackendCalendarAppointmentsModal = window.BackendCalendarAppointmentsModal || {};
(function (exports) {
'use strict';
App.Components.ManageAppointmentsModal = (function () {
function updateTimezone() {
var providerId = $('#select-provider').val();
const providerId = $('#select-provider').val();
var provider = GlobalVariables.availableProviders.find(function (availableProvider) {
const provider = App.Vars.available_providers.find(function (availableProvider) {
return Number(availableProvider.id) === Number(providerId);
});
if (provider && provider.timezone) {
$('.provider-timezone').text(GlobalVariables.timezones[provider.timezone]);
$('.provider-timezone').text(App.Vars.timezones[provider.timezone]);
}
}
@ -37,35 +33,35 @@ window.BackendCalendarAppointmentsModal = window.BackendCalendarAppointmentsModa
/**
* Event: Manage Appointments Dialog Save Button "Click"
*
* Stores the appointment changes or inserts a new appointment depending the dialog mode.
* Stores the appointment changes or inserts a new appointment depending on the dialog mode.
*/
$('#manage-appointment #save-appointment').on('click', function () {
$('#manage-appointment #save-appointment').on('click', () => {
// Before doing anything the appointment data need to be validated.
if (!validateAppointmentForm()) {
return;
}
// Prepare appointment data for AJAX request.
var $dialog = $('#manage-appointment');
const $dialog = $('#manage-appointment');
// ID must exist on the object in order for the model to update the record and not to perform
// an insert operation.
var startDatetime = moment($dialog.find('#start-datetime').datetimepicker('getDate')).format(
const startDatetime = moment($dialog.find('#start-datetime').datetimepicker('getDate')).format(
'YYYY-MM-DD HH:mm:ss'
);
var endDatetime = moment($dialog.find('#end-datetime').datetimepicker('getDate')).format(
const endDatetime = moment($dialog.find('#end-datetime').datetimepicker('getDate')).format(
'YYYY-MM-DD HH:mm:ss'
);
var appointment = {
const appointment = {
id_services: $dialog.find('#select-service').val(),
id_users_provider: $dialog.find('#select-provider').val(),
start_datetime: startDatetime,
end_datetime: endDatetime,
location: $dialog.find('#appointment-location').val(),
notes: $dialog.find('#appointment-notes').val(),
is_unavailable: false
is_unavailable: Number(false)
};
if ($dialog.find('#appointment-id').val() !== '') {
@ -73,7 +69,7 @@ window.BackendCalendarAppointmentsModal = window.BackendCalendarAppointmentsModa
appointment.id = $dialog.find('#appointment-id').val();
}
var customer = {
const customer = {
first_name: $dialog.find('#first-name').val(),
last_name: $dialog.find('#last-name').val(),
email: $dialog.find('#email').val(),
@ -91,7 +87,7 @@ window.BackendCalendarAppointmentsModal = window.BackendCalendarAppointmentsModa
}
// Define success callback.
var successCallback = function (response) {
const successCallback = function (response) {
// Display success message to the user.
Backend.displayNotification(App.Lang.appointment_saved);
@ -102,35 +98,36 @@ window.BackendCalendarAppointmentsModal = window.BackendCalendarAppointmentsModa
};
// Define error callback.
var errorCallback = function () {
const errorCallback = function () {
$dialog.find('.modal-message').text(App.Lang.service_communication_error);
$dialog.find('.modal-message').addClass('alert-danger').removeClass('d-none');
$dialog.find('.modal-body').scrollTop(0);
};
// Save appointment data.
BackendCalendarApi.saveAppointment(appointment, customer, successCallback, errorCallback);
App.Http.Calendar.saveAppointment(appointment, customer, successCallback, errorCallback);
});
/**
* Event: Insert Appointment Button "Click"
*
* When the user presses this button, the manage appointment dialog opens and lets the user to
* create a new appointment.
* When the user presses this button, the manage appointment dialog opens and lets the user create a new
* appointment.
*/
$('#insert-appointment').on('click', function () {
$('#insert-appointment').on('click', () => {
$('.popover').remove();
BackendCalendarAppointmentsModal.resetAppointmentDialog();
var $dialog = $('#manage-appointment');
resetAppointmentDialog();
const $dialog = $('#manage-appointment');
// Set the selected filter item and find the next appointment time as the default modal values.
if ($('#select-filter-item option:selected').attr('type') === 'provider') {
var providerId = $('#select-filter-item').val();
const providerId = $('#select-filter-item').val();
var providers = GlobalVariables.availableProviders.filter(function (provider) {
return Number(provider.id) === Number(providerId);
});
const providers = App.Vars.available_providers.filter(
(provider) => Number(provider.id) === Number(providerId)
);
if (providers.length) {
$dialog.find('#select-service').val(providers[0].services[0]).trigger('change');
@ -144,17 +141,17 @@ window.BackendCalendarAppointmentsModal = window.BackendCalendarAppointmentsModa
$dialog.find('#select-service option:first').prop('selected', true).trigger('change');
}
var serviceId = $dialog.find('#select-service').val();
const serviceId = $dialog.find('#select-service').val();
var service = GlobalVariables.availableServices.find(function (availableService) {
return Number(availableService.id) === Number(serviceId);
});
const service = App.Vars.available_services.find(
(availableService) => Number(availableService.id) === Number(serviceId)
);
var duration = service ? service.duration : 60;
const duration = service ? service.duration : 60;
var startMoment = moment();
const startMoment = moment();
var currentMin = parseInt(startMoment.format('mm'));
const currentMin = parseInt(startMoment.format('mm'));
if (currentMin > 0 && currentMin < 15) {
startMoment.set({minutes: 15});
@ -168,14 +165,15 @@ window.BackendCalendarAppointmentsModal = window.BackendCalendarAppointmentsModa
$dialog
.find('#start-datetime')
.val(GeneralFunctions.formatDate(startMoment.toDate(), GlobalVariables.dateFormat, true));
.val(App.Utils.Date.format(startMoment.toDate(), App.Vars.date_format, App.Vars.time_format, true));
$dialog
.find('#end-datetime')
.val(
GeneralFunctions.formatDate(
App.Utils.Date.format(
startMoment.add(duration, 'minutes').toDate(),
GlobalVariables.dateFormat,
App.Vars.date_format,
App.Vars.time_format,
true
)
);
@ -188,9 +186,11 @@ window.BackendCalendarAppointmentsModal = window.BackendCalendarAppointmentsModa
/**
* Event: Pick Existing Customer Button "Click"
*
* @param {jQuery.Event}
*/
$('#select-customer').on('click', function () {
var $list = $('#existing-customers-list');
$('#select-customer').on('click', (event) => {
const $list = $('#existing-customers-list');
if (!$list.is(':visible')) {
$(this).find('span').text(App.Lang.hide);
@ -198,7 +198,7 @@ window.BackendCalendarAppointmentsModal = window.BackendCalendarAppointmentsModa
$list.slideDown('slow');
$('#filter-existing-customers').fadeIn('slow');
$('#filter-existing-customers').val('');
GlobalVariables.customers.forEach(function (customer) {
App.Vars.customers.forEach(function (customer) {
$('<div/>', {
'data-id': customer.id,
'text': customer.first_name + ' ' + customer.last_name
@ -207,17 +207,17 @@ window.BackendCalendarAppointmentsModal = window.BackendCalendarAppointmentsModa
} else {
$list.slideUp('slow');
$('#filter-existing-customers').fadeOut('slow');
$(this).find('span').text(App.Lang.select);
$(event.target).find('span').text(App.Lang.select);
}
});
/**
* Event: Select Existing Customer From List "Click"
*/
$('#manage-appointment').on('click', '#existing-customers-list div', function () {
var customerId = $(this).attr('data-id');
$('#manage-appointment').on('click', '#existing-customers-list div', (event) => {
const customerId = $(event.target).attr('data-id');
var customer = GlobalVariables.customers.find(function (customer) {
const customer = App.Vars.customers.find(function (customer) {
return Number(customer.id) === Number(customerId);
});
@ -236,66 +236,58 @@ window.BackendCalendarAppointmentsModal = window.BackendCalendarAppointmentsModa
$('#select-customer').trigger('click'); // Hide the list.
});
var filterExistingCustomersTimeout = null;
let filterExistingCustomersTimeout = null;
/**
* Event: Filter Existing Customers "Change"
*/
$('#filter-existing-customers').on('keyup', function () {
$('#filter-existing-customers').on('keyup', (event) => {
if (filterExistingCustomersTimeout) {
clearTimeout(filterExistingCustomersTimeout);
}
var key = $(this).val().toLowerCase();
const keyword = $(event.target).val().toLowerCase();
filterExistingCustomersTimeout = setTimeout(function () {
var $list = $('#existing-customers-list');
var url = GlobalVariables.baseUrl + '/index.php/backend_api/ajax_filter_customers';
var data = {
csrf_token: GlobalVariables.csrfToken,
key: key
};
const $list = $('#existing-customers-list');
$('#loading').css('visibility', 'hidden');
// Try to get the updated customer list.
$.post(url, data)
.done(function (response) {
App.Http.Customers.search(keyword, 50)
.done((response) => {
$list.empty();
response.forEach(function (customer) {
response.forEach((customer) => {
$('<div/>', {
'data-id': customer.id,
'text': customer.first_name + ' ' + customer.last_name
}).appendTo($list);
// Verify if this customer is on the old customer list.
var result = GlobalVariables.customers.filter(function (globalVariablesCustomer) {
return Number(globalVariablesCustomer.id) === Number(customer.id);
const result = App.Vars.customers.filter((existingCustomer) => {
return Number(existingCustomer.id) === Number(customer.id);
});
// Add it to the customer list.
if (!result.length) {
GlobalVariables.customers.push(customer);
App.Vars.customers.push(customer);
}
});
})
.fail(function (jqXHR, textStatus, errorThrown) {
.fail(() => {
// If there is any error on the request, search by the local client database.
$list.empty();
GlobalVariables.customers.forEach(function (customer, index) {
App.Vars.customers.forEach(function (customer, index) {
if (
customer.first_name.toLowerCase().indexOf(key) !== -1 ||
customer.last_name.toLowerCase().indexOf(key) !== -1 ||
customer.email.toLowerCase().indexOf(key) !== -1 ||
customer.phone_number.toLowerCase().indexOf(key) !== -1 ||
customer.address.toLowerCase().indexOf(key) !== -1 ||
customer.city.toLowerCase().indexOf(key) !== -1 ||
customer.zip_code.toLowerCase().indexOf(key) !== -1 ||
customer.notes.toLowerCase().indexOf(key) !== -1
customer.first_name.toLowerCase().indexOf(keyword) !== -1 ||
customer.last_name.toLowerCase().indexOf(keyword) !== -1 ||
customer.email.toLowerCase().indexOf(keyword) !== -1 ||
customer.phone_number.toLowerCase().indexOf(keyword) !== -1 ||
customer.address.toLowerCase().indexOf(keyword) !== -1 ||
customer.city.toLowerCase().indexOf(keyword) !== -1 ||
customer.zip_code.toLowerCase().indexOf(keyword) !== -1 ||
customer.notes.toLowerCase().indexOf(keyword) !== -1
) {
$('<div/>', {
'data-id': customer.id,
@ -316,35 +308,32 @@ window.BackendCalendarAppointmentsModal = window.BackendCalendarAppointmentsModa
* When the user clicks on a service, its available providers should become visible. Also we need to
* update the start and end time of the appointment.
*/
$('#select-service').on('change', function () {
var serviceId = $('#select-service').val();
$('#select-service').on('change', () => {
const serviceId = $('#select-service').val();
$('#select-provider').empty();
// Automatically update the service duration.
var service = GlobalVariables.availableServices.find(function (availableService) {
const service = App.Vars.available_services.find((availableService) => {
return Number(availableService.id) === Number(serviceId);
});
var duration = service ? service.duration : 60;
const duration = service ? service.duration : 60;
var start = $('#start-datetime').datetimepicker('getDate');
const start = $('#start-datetime').datetimepicker('getDate');
$('#end-datetime').datetimepicker('setDate', new Date(start.getTime() + duration * 60000));
// Update the providers select box.
GlobalVariables.availableProviders.forEach(function (provider) {
provider.services.forEach(function (providerServiceId) {
if (
GlobalVariables.user.role_slug === Backend.DB_SLUG_PROVIDER &&
Number(provider.id) !== GlobalVariables.user.id
) {
App.Vars.available_providers.forEach((provider) => {
provider.services.forEach((providerServiceId) => {
if (App.Vars.role_slug === Backend.DB_SLUG_PROVIDER && Number(provider.id) !== App.Vars.user.id) {
return; // continue
}
if (
GlobalVariables.user.role_slug === Backend.DB_SLUG_SECRETARY &&
GlobalVariables.secretaryProviders.indexOf(provider.id) === -1
App.Vars.role_slug === Backend.DB_SLUG_SECRETARY &&
App.Vars.secretaryProviders.indexOf(provider.id) === -1
) {
return; // continue
}
@ -362,14 +351,14 @@ window.BackendCalendarAppointmentsModal = window.BackendCalendarAppointmentsModa
/**
* Event: Provider "Change"
*/
$('#select-provider').on('change', function () {
$('#select-provider').on('change', () => {
updateTimezone();
});
/**
* Event: Enter New Customer Button "Click"
*/
$('#new-customer').on('click', function () {
$('#new-customer').on('click', () => {
$('#manage-appointment')
.find(
'#customer-id, #first-name, #last-name, #email, ' +
@ -385,8 +374,8 @@ window.BackendCalendarAppointmentsModal = window.BackendCalendarAppointmentsModa
* This method resets the manage appointment dialog modal to its initial state. After that you can make
* any modification might be necessary in order to bring the dialog to the desired state.
*/
exports.resetAppointmentDialog = function () {
var $dialog = $('#manage-appointment');
function resetAppointmentDialog() {
const $dialog = $('#manage-appointment');
// Empty form fields.
$dialog.find('input, textarea').val('');
@ -395,21 +384,19 @@ window.BackendCalendarAppointmentsModal = window.BackendCalendarAppointmentsModa
// Prepare service and provider select boxes.
$dialog.find('#select-service').val($dialog.find('#select-service').eq(0).attr('value'));
// Fill the providers listbox with providers that can serve the appointment's
// service and then select the user's provider.
// Fill the providers list box with providers that can serve the appointment's service and then select the
// user's provider.
$dialog.find('#select-provider').empty();
GlobalVariables.availableProviders.forEach(function (provider, index) {
var canProvideService = false;
App.Vars.available_providers.forEach((provider) => {
const serviceId = $dialog.find('#select-service').val();
var serviceId = $dialog.find('#select-service').val();
var canProvideService =
provider.services.filter(function (providerServiceId) {
const canProvideService =
provider.services.filter((providerServiceId) => {
return Number(providerServiceId) === Number(serviceId);
}).length > 0;
if (canProvideService) {
// Add the provider to the listbox.
// Add the provider to the list box.
$dialog
.find('#select-provider')
.append(new Option(provider.first_name + ' ' + provider.last_name, provider.id));
@ -423,19 +410,17 @@ window.BackendCalendarAppointmentsModal = window.BackendCalendarAppointmentsModa
// Setup start and datetimepickers.
// Get the selected service duration. It will be needed in order to calculate the appointment end datetime.
var serviceId = $dialog.find('#select-service').val();
const serviceId = $dialog.find('#select-service').val();
var service = GlobalVariables.availableServices.forEach(function (service) {
return Number(service.id) === Number(serviceId);
});
const service = App.Vars.available_services.forEach((service) => Number(service.id) === Number(serviceId));
var duration = service ? service.duration : 0;
const duration = service ? service.duration : 0;
var startDatetime = new Date();
var endDatetime = moment().add(duration, 'minutes').toDate();
var dateFormat;
const startDatetime = new Date();
const endDatetime = moment().add(duration, 'minutes').toDate();
let dateFormat;
switch (GlobalVariables.dateFormat) {
switch (App.Vars.date_format) {
case 'DMY':
dateFormat = 'dd/mm/yy';
break;
@ -446,15 +431,16 @@ window.BackendCalendarAppointmentsModal = window.BackendCalendarAppointmentsModa
dateFormat = 'yy/mm/dd';
break;
default:
throw new Error('Invalid GlobalVariables.dateFormat value.');
throw new Error('Invalid App.Vars.date_format value.');
}
var firstWeekDay = GlobalVariables.firstWeekday;
var firstWeekDayNumber = GeneralFunctions.getWeekDayId(firstWeekDay);
const firstWeekDay = App.Vars.first_weekday;
const firstWeekDayNumber = App.Utils.Date.getWeekdayId(firstWeekDay);
$dialog.find('#start-datetime').datetimepicker({
dateFormat: dateFormat,
timeFormat: GlobalVariables.timeFormat === 'regular' ? 'h:mm tt' : 'HH:mm',
timeFormat: App.Vars.time_format === 'regular' ? 'h:mm tt' : 'HH:mm',
// Translation
dayNames: [
@ -508,14 +494,14 @@ window.BackendCalendarAppointmentsModal = window.BackendCalendarAppointmentsModa
minuteText: App.Lang.minutes,
firstDay: firstWeekDayNumber,
onClose: function () {
var serviceId = $('#select-service').val();
const serviceId = $('#select-service').val();
// Automatically update the #end-datetime DateTimePicker based on service duration.
var service = GlobalVariables.availableServices.find(function (availableService) {
return Number(availableService.id) === Number(serviceId);
});
const service = App.Vars.available_services.find(
(availableService) => Number(availableService.id) === Number(serviceId)
);
var start = $('#start-datetime').datetimepicker('getDate');
const start = $('#start-datetime').datetimepicker('getDate');
$('#end-datetime').datetimepicker('setDate', new Date(start.getTime() + service.duration * 60000));
}
});
@ -523,7 +509,7 @@ window.BackendCalendarAppointmentsModal = window.BackendCalendarAppointmentsModa
$dialog.find('#end-datetime').datetimepicker({
dateFormat: dateFormat,
timeFormat: GlobalVariables.timeFormat === 'regular' ? 'h:mm tt' : 'HH:mm',
timeFormat: App.Vars.time_format === 'regular' ? 'h:mm tt' : 'HH:mm',
// Translation
dayNames: [
@ -578,16 +564,17 @@ window.BackendCalendarAppointmentsModal = window.BackendCalendarAppointmentsModa
firstDay: firstWeekDayNumber
});
$dialog.find('#end-datetime').datetimepicker('setDate', endDatetime);
};
}
/**
* Validate the manage appointment dialog data. Validation checks need to
* run every time the data are going to be saved.
* Validate the manage appointment dialog data.
*
* Validation checks need to run every time the data are going to be saved.
*
* @return {Boolean} Returns the validation result.
*/
function validateAppointmentForm() {
var $dialog = $('#manage-appointment');
const $dialog = $('#manage-appointment');
// Reset previous validation css formatting.
$dialog.find('.is-invalid').removeClass('is-invalid');
@ -595,9 +582,9 @@ window.BackendCalendarAppointmentsModal = window.BackendCalendarAppointmentsModa
try {
// Check required fields.
var missingRequiredField = false;
let missingRequiredField = false;
$dialog.find('.required').each(function (index, requiredField) {
$dialog.find('.required').each((index, requiredField) => {
if ($(requiredField).val() === '' || $(requiredField).val() === null) {
$(requiredField).addClass('is-invalid');
missingRequiredField = true;
@ -609,14 +596,14 @@ window.BackendCalendarAppointmentsModal = window.BackendCalendarAppointmentsModa
}
// Check email address.
if (!GeneralFunctions.validateEmail($dialog.find('#email').val())) {
if (!App.Utils.Validation.email($dialog.find('#email').val())) {
$dialog.find('#email').addClass('is-invalid');
throw new Error(App.Lang.invalid_email);
}
// Check appointment start and end time.
var start = $('#start-datetime').datetimepicker('getDate');
var end = $('#end-datetime').datetimepicker('getDate');
const start = $('#start-datetime').datetimepicker('getDate');
const end = $('#end-datetime').datetimepicker('getDate');
if (start > end) {
$dialog.find('#start-datetime, #end-datetime').addClass('is-invalid');
throw new Error(App.Lang.start_date_before_end_error);
@ -629,7 +616,13 @@ window.BackendCalendarAppointmentsModal = window.BackendCalendarAppointmentsModa
}
}
exports.initialize = function () {
function initialize() {
bindEventHandlers();
}
return {
resetAppointmentDialog,
bindEventHandlers,
initialize
};
})(window.BackendCalendarAppointmentsModal);
})();

89
assets/js/pages/backend_calendar_unavailability_events_modal.js → assets/js/components/manage_unavailabilities_modal.js
View file

@ -14,25 +14,21 @@
*
* This module implements the unavailability events modal functionality.
*
* @module BackendCalendarUnavailabilityEventsModal
* Old Module Name: BackendCalendarUnavailabilityEventsModal
*/
window.BackendCalendarUnavailabilityEventsModal = window.BackendCalendarUnavailabilityEventsModal || {};
(function (exports) {
'use strict';
App.Components.ManageUnavailabilitiesModal = (function () {
function bindEventHandlers() {
/**
* Event: Manage Unavailable Dialog Save Button "Click"
*
* Stores the unavailable period changes or inserts a new record.
*/
$('#manage-unavailable #save-unavailable').on('click', function () {
var $dialog = $('#manage-unavailable');
$('#manage-unavailable #save-unavailable').on('click', () => {
const $dialog = $('#manage-unavailable');
$dialog.find('.modal-message').addClass('d-none');
$dialog.find('.is-invalid').removeClass('is-invalid');
var startMoment = moment($dialog.find('#unavailable-start').datetimepicker('getDate'));
const startMoment = moment($dialog.find('#unavailable-start').datetimepicker('getDate'));
if (!startMoment.isValid()) {
$dialog.find('#unavailable-start').addClass('is-invalid');
@ -40,7 +36,7 @@ window.BackendCalendarUnavailabilityEventsModal = window.BackendCalendarUnavaila
return;
}
var endMoment = moment($dialog.find('#unavailable-end').datetimepicker('getDate'));
const endMoment = moment($dialog.find('#unavailable-end').datetimepicker('getDate'));
if (!endMoment.isValid()) {
$dialog.find('#unavailable-end').addClass('is-invalid');
@ -62,7 +58,7 @@ window.BackendCalendarUnavailabilityEventsModal = window.BackendCalendarUnavaila
}
// Unavailable period records go to the appointments table.
var unavailable = {
const unavailable = {
start_datetime: startMoment.format('YYYY-MM-DD HH:mm:ss'),
end_datetime: endMoment.format('YYYY-MM-DD HH:mm:ss'),
notes: $dialog.find('#unavailable-notes').val(),
@ -74,7 +70,7 @@ window.BackendCalendarUnavailabilityEventsModal = window.BackendCalendarUnavaila
unavailable.id = $dialog.find('#unavailable-id').val();
}
var successCallback = function () {
const successCallback = () => {
// Display success message to the user.
Backend.displayNotification(App.Lang.unavailable_saved);
@ -86,7 +82,7 @@ window.BackendCalendarUnavailabilityEventsModal = window.BackendCalendarUnavaila
$('#select-filter-item').trigger('change');
};
BackendCalendarApi.saveUnavailable(unavailable, successCallback, null);
App.Http.Calendar.saveUnavailable(unavailable, successCallback, null);
});
/**
@ -95,14 +91,15 @@ window.BackendCalendarUnavailabilityEventsModal = window.BackendCalendarUnavaila
* When the user clicks this button a popup dialog appears and the use can set a time period where
* he cannot accept any appointments.
*/
$('#insert-unavailable').on('click', function () {
BackendCalendarUnavailabilityEventsModal.resetUnavailableDialog();
var $dialog = $('#manage-unavailable');
$('#insert-unavailable').on('click', () => {
resetUnavailableDialog();
const $dialog = $('#manage-unavailable');
// Set the default datetime values.
var startMoment = moment();
const startMoment = moment();
var currentMin = parseInt(startMoment.format('mm'));
const currentMin = parseInt(startMoment.format('mm'));
if (currentMin > 0 && currentMin < 15) {
startMoment.set({minutes: 15});
@ -120,11 +117,16 @@ window.BackendCalendarUnavailabilityEventsModal = window.BackendCalendarUnavaila
$dialog
.find('#unavailable-start')
.val(GeneralFunctions.formatDate(startMoment.toDate(), GlobalVariables.dateFormat, true));
.val(App.Utils.Date.format(startMoment.toDate(), App.Vars.date_format, App.Vars.time_format, true));
$dialog
.find('#unavailable-end')
.val(
GeneralFunctions.formatDate(startMoment.add(1, 'hour').toDate(), GlobalVariables.dateFormat, true)
App.Utils.Date.format(
startMoment.add(1, 'hour').toDate(),
App.Vars.date_format,
App.Vars.time_format,
true
)
);
$dialog.find('.modal-header h3').text(App.Lang.new_unavailable_title);
$dialog.modal('show');
@ -137,19 +139,24 @@ window.BackendCalendarUnavailabilityEventsModal = window.BackendCalendarUnavaila
* Reset the "#manage-unavailable" dialog. Use this method to bring the dialog to the initial state
* before it becomes visible to the user.
*/
exports.resetUnavailableDialog = function () {
var $dialog = $('#manage-unavailable');
function resetUnavailableDialog() {
const $dialog = $('#manage-unavailable');
$dialog.find('#unavailable-id').val('');
// Set default time values
var start = GeneralFunctions.formatDate(moment().toDate(), GlobalVariables.dateFormat, true);
const start = App.Utils.Date.format(moment().toDate(), App.Vars.date_format, App.Vars.time_format, true);
var end = GeneralFunctions.formatDate(moment().add(1, 'hour').toDate(), GlobalVariables.dateFormat, true);
const end = App.Utils.Date.format(
moment().add(1, 'hour').toDate(),
App.Vars.date_format,
App.Vars.time_format,
true
);
var dateFormat;
let dateFormat;
switch (GlobalVariables.dateFormat) {
switch (App.Vars.date_format) {
case 'DMY':
dateFormat = 'dd/mm/yy';
break;
@ -161,12 +168,13 @@ window.BackendCalendarUnavailabilityEventsModal = window.BackendCalendarUnavaila
break;
}
var fDay = GlobalVariables.firstWeekday;
var fDaynum = GeneralFunctions.getWeekDayId(fDay);
const firstWeekday = App.Vars.first_weekday;
const firstWeekdayId = App.Utils.Date.getWeekdayId(firstWeekday);
$dialog.find('#unavailable-start').datetimepicker({
dateFormat: dateFormat,
timeFormat: GlobalVariables.timeFormat === 'regular' ? 'h:mm tt' : 'HH:mm',
timeFormat: App.Vars.time_format === 'regular' ? 'h:mm tt' : 'HH:mm',
// Translation
dayNames: [
@ -218,13 +226,13 @@ window.BackendCalendarUnavailabilityEventsModal = window.BackendCalendarUnavaila
timeText: App.Lang.time,
hourText: App.Lang.hour,
minuteText: App.Lang.minutes,
firstDay: fDaynum
firstDay: firstWeekdayId
});
$dialog.find('#unavailable-start').val(start);
$dialog.find('#unavailable-end').datetimepicker({
dateFormat: dateFormat,
timeFormat: GlobalVariables.timeFormat === 'regular' ? 'h:mm tt' : 'HH:mm',
timeFormat: App.Vars.time_format === 'regular' ? 'h:mm tt' : 'HH:mm',
// Translation
dayNames: [
@ -276,23 +284,28 @@ window.BackendCalendarUnavailabilityEventsModal = window.BackendCalendarUnavaila
timeText: App.Lang.time,
hourText: App.Lang.hour,
minuteText: App.Lang.minutes,
firstDay: fDaynum
firstDay: firstWeekdayId
});
$dialog.find('#unavailable-end').val(end);
// Clear the unavailable notes field.
$dialog.find('#unavailable-notes').val('');
};
}
exports.initialize = function () {
var $unavailabilityProvider = $('#unavailable-provider');
function initialize() {
const $unavailabilityProvider = $('#unavailable-provider');
for (var index in GlobalVariables.availableProviders) {
var provider = GlobalVariables.availableProviders[index];
for (const index in App.Vars.available_providers) {
const provider = App.Vars.available_providers[index];
$unavailabilityProvider.append(new Option(provider.first_name + ' ' + provider.last_name, provider.id));
}
bindEventHandlers();
}
return {
resetUnavailableDialog,
initialize
};
})(window.BackendCalendarUnavailabilityEventsModal);
})();

97
assets/js/pages/backend_calendar_api.js → assets/js/http/calendar_http_client.js
View file

@ -10,52 +10,46 @@
* ---------------------------------------------------------------------------- */
/**
* Backend Calendar API
* Calendar HTTP Client
*
* This module implements the AJAX requests for the calendar page.
*
* @module BackendCalendarApi
* Old Module Name: BackendCalendarApi
*/
window.BackendCalendarApi = window.BackendCalendarApi || {};
(function (exports) {
'use strict';
App.Http.Calendar = (function () {
/**
* Save Appointment
*
* This method stores the changes of an already registered appointment into the database, via an ajax call.
*
* @param {Object} appointment Contain the new appointment data. The ID of the appointment MUST be already included.
* @param {Object} appointment Contain the new appointment data. The ID of the appointment must be already included.
* The rest values must follow the database structure.
* @param {Object} [customer] Optional, contains the customer data.
* @param {Function} [successCallback] Optional, if defined, this function is going to be executed on post success.
* @param {Function} [errorCallback] Optional, if defined, this function is going to be executed on post failure.
*/
exports.saveAppointment = function (appointment, customer, successCallback, errorCallback) {
var url = GlobalVariables.baseUrl + '/index.php/calendar/ajax_save_appointment';
function saveAppointment(appointment, customer, successCallback, errorCallback) {
const url = App.Utils.Url.siteUrl('calendar/ajax_save_appointment');
var data = {
csrf_token: GlobalVariables.csrfToken,
appointment_data: JSON.stringify(appointment)
const data = {
csrf_token: App.Vars.csrf_token,
appointment_data: appointment
};
if (customer) {
data.customer_data = JSON.stringify(customer);
data.customer_data = customer;
}
$.post(url, data)
.done(function (response) {
return $.post(url, data)
.done((response) => {
if (successCallback) {
successCallback(response);
}
})
.fail(function (jqXHR, textStatus, errorThrown) {
.fail(() => {
if (errorCallback) {
errorCallback();
}
});
};
}
/**
* Save unavailable period to database.
@ -64,26 +58,26 @@ window.BackendCalendarApi = window.BackendCalendarApi || {};
* @param {Function} successCallback The ajax success callback function.
* @param {Function} errorCallback The ajax failure callback function.
*/
exports.saveUnavailable = function (unavailable, successCallback, errorCallback) {
var url = GlobalVariables.baseUrl + '/index.php/calendar/ajax_save_unavailable';
function saveUnavailable(unavailable, successCallback, errorCallback) {
const url = App.Utils.Url.siteUrl('calendar/ajax_save_unavailable');
var data = {
csrf_token: GlobalVariables.csrfToken,
unavailable: JSON.stringify(unavailable)
const data = {
csrf_token: App.Vars.csrf_token,
unavailable: unavailable
};
$.post(url, data)
.done(function (response) {
return $.post(url, data)
.done((response) => {
if (successCallback) {
successCallback(response);
}
})
.fail(function (jqXHR, textStatus, errorThrown) {
.fail(() => {
if (errorCallback) {
errorCallback();
}
});
};
}
/**
* Save working plan exception of work to database.
@ -94,54 +88,55 @@ window.BackendCalendarApi = window.BackendCalendarApi || {};
* @param {Function} successCallback The ajax success callback function.
* @param {Function} errorCallback The ajax failure callback function.
*/
exports.saveWorkingPlanException = function (
date,
workingPlanException,
providerId,
successCallback,
errorCallback
) {
var url = GlobalVariables.baseUrl + '/index.php/calendar/ajax_save_working_plan_exception';
function saveWorkingPlanException(date, workingPlanException, providerId, successCallback, errorCallback) {
const url = App.Utils.Url.siteUrl('calendar/ajax_save_working_plan_exception');
var data = {
csrf_token: GlobalVariables.csrfToken,
const data = {
csrf_token: App.Vars.csrf_token,
date: date,
working_plan_exception: workingPlanException,
provider_id: providerId
};
$.post(url, data)
.done(function (response) {
return $.post(url, data)
.done((response) => {
if (successCallback) {
successCallback(response);
}
})
.fail(function (jqXHR, textStatus, errorThrown) {
.fail(() => {
if (errorCallback) {
errorCallback();
}
});
};
}
exports.deleteWorkingPlanException = function (date, providerId, successCallback, errorCallback) {
var url = GlobalVariables.baseUrl + '/index.php/calendar/ajax_delete_working_plan_exception';
function deleteWorkingPlanException(date, providerId, successCallback, errorCallback) {
const url = App.Utils.Url.siteUrl('calendar/ajax_delete_working_plan_exception');
var data = {
csrf_token: GlobalVariables.csrfToken,
const data = {
csrf_token: App.Vars.csrf_token,
date: date,
provider_id: providerId
};
$.post(url, data)
.done(function (response) {
return $.post(url, data)
.done((response) => {
if (successCallback) {
successCallback(response);
}
})
.fail(function (jqXHR, textStatus, errorThrown) {
.fail(() => {
if (errorCallback) {
errorCallback();
}
});
}
return {
saveAppointment,
saveUnavailable,
saveWorkingPlanException,
deleteWorkingPlanException
};
})(window.BackendCalendarApi);
})();

62
assets/js/pages/backend_calendar.js → assets/js/pages/calendar.js
View file

@ -10,27 +10,21 @@
* ---------------------------------------------------------------------------- */
/**
* Backend Calendar
* Calendar Page
*
* This module contains functions that are used by the backend calendar page.
*
* @module BackendCalendar
*/
window.BackendCalendar = window.BackendCalendar || {};
(function (exports) {
'use strict';
App.Pages.Calendar = (function () {
/**
* Bind common event handlers.
*/
function bindEventHandlers() {
var $calendarPage = $('#calendar-page');
const $calendarPage = $('#calendar-page');
$calendarPage.on('click', '#toggle-fullscreen', function () {
var $toggleFullscreen = $(this);
var element = document.documentElement;
var isFullScreen = document.fullScreenElement || document.mozFullScreen || document.webkitIsFullScreen;
$calendarPage.on('click', '#toggle-fullscreen', (event) => {
const $toggleFullscreen = $(event.target);
const element = document.documentElement;
const isFullScreen = document.fullScreenElement || document.mozFullScreen || document.webkitIsFullScreen;
if (isFullScreen) {
// Exit fullscreen mode.
@ -60,10 +54,10 @@ window.BackendCalendar = window.BackendCalendar || {};
}
});
$('#insert-working-plan-exception').on('click', function () {
var providerId = $('#select-filter-item').val();
$('#insert-working-plan-exception').on('click', () => {
const providerId = $('#select-filter-item').val();
var provider = GlobalVariables.availableProviders.find(function (availableProvider) {
const provider = App.Vars.available_providers.find((availableProvider) => {
return Number(availableProvider.id) === Number(providerId);
});
@ -71,19 +65,19 @@ window.BackendCalendar = window.BackendCalendar || {};
throw new Error('Provider could not be found: ' + providerId);
}
App.Components.WorkingPlanExceptionsModal.add().done(function (date, workingPlanException) {
var successCallback = function () {
App.Components.WorkingPlanExceptionsModal.add().done((date, workingPlanException) => {
const successCallback = () => {
Backend.displayNotification(App.Lang.working_plan_exception_saved);
var workingPlanExceptions = JSON.parse(provider.settings.working_plan_exceptions) || {};
const workingPlanExceptions = JSON.parse(provider.settings.working_plan_exceptions) || {};
workingPlanExceptions[date] = workingPlanException;
for (var index in GlobalVariables.availableProviders) {
var availableProvider = GlobalVariables.availableProviders[index];
for (let index in App.Vars.available_providers) {
const availableProvider = App.Vars.available_providers[index];
if (Number(availableProvider.id) === Number(providerId)) {
GlobalVariables.availableProviders[index].settings.working_plan_exceptions =
App.Vars.available_providers[index].settings.working_plan_exceptions =
JSON.stringify(workingPlanExceptions);
break;
}
@ -92,7 +86,7 @@ window.BackendCalendar = window.BackendCalendar || {};
$('#select-filter-item').trigger('change'); // Update the calendar.
};
BackendCalendarApi.saveWorkingPlanException(
App.Http.Calendar.saveWorkingPlanException(
date,
workingPlanException,
providerId,
@ -111,18 +105,26 @@ window.BackendCalendar = window.BackendCalendar || {};
*
* @param {String} view Optional (default), the calendar view to be loaded.
*/
exports.initialize = function (view) {
BackendCalendarGoogleSync.initialize();
BackendCalendarAppointmentsModal.initialize();
BackendCalendarUnavailabilityEventsModal.initialize();
function initialize(view) {
App.Utils.CalendarGoogleSync.initialize();
App.Components.ManageAppointmentsModal.initialize();
App.Components.ManageUnavailabilitiesModal.initialize();
// Load and initialize the calendar view.
if (view === 'table') {
BackendCalendarTableView.initialize();
App.Utils.CalendarTableView.initialize();
} else {
BackendCalendarDefaultView.initialize();
App.Utils.CalendarDefaultView.initialize();
}
bindEventHandlers();
}
document.addEventListener('DOMContentLoaded', initialize);
return {
initialize
};
})(window.BackendCalendar);
})();

488
assets/js/pages/backend_calendar_default_view.js → assets/js/utils/calendar_default_view.js
View file

File diff suppressed because it is too large Load diff

82
assets/js/pages/backend_calendar_google_sync.js → assets/js/utils/calendar_google_sync.js
View file

@ -14,13 +14,9 @@
*
* This module implements the Google Calendar sync operations.
*
* @module BackendCalendarGoogleSync
* Old Name: BackendCalendarGoogleSync
*/
window.BackendCalendarGoogleSync = window.BackendCalendarGoogleSync || {};
(function (exports) {
'use strict';
App.Utils.CalendarGoogleSync = (function () {
/**
* Bind event handlers.
*/
@ -31,19 +27,19 @@ window.BackendCalendarGoogleSync = window.BackendCalendarGoogleSync || {};
* When the user clicks on the "Enable Sync" button, a popup should appear
* that is going to follow the web server authorization flow of OAuth.
*/
$('#enable-sync').on('click', function () {
$('#enable-sync').on('click', () => {
if ($('#enable-sync').hasClass('enabled') === false) {
// Enable synchronization for selected provider.
var authUrl = GlobalVariables.baseUrl + '/index.php/google/oauth/' + $('#select-filter-item').val();
const authUrl = App.Utils.Url.siteUrl('google/oauth/' + $('#select-filter-item').val());
var redirectUrl = GlobalVariables.baseUrl + '/index.php/google/oauth_callback';
const redirectUrl = App.Utils.Url.siteUrl('google/oauth_callback');
var windowHandle = window.open(authUrl, 'Authorize Easy!Appointments', 'width=800, height=600');
const windowHandle = window.open(authUrl, 'Authorize Easy!Appointments', 'width=800, height=600');
var authInterval = window.setInterval(function () {
// When the browser redirects to the google user consent page the "window.document" variable
const authInterval = window.setInterval(() => {
// When the browser redirects to the google user consent page the "window.document" constiable
// becomes "undefined" and when it comes back to the redirect URL it changes back. So check
// whether the variable is undefined to avoid javascript errors.
// whether the constiable is undefined to avoid javascript errors.
try {
if (windowHandle.document) {
if (windowHandle.document.URL.indexOf(redirectUrl) !== -1) {
@ -58,17 +54,17 @@ window.BackendCalendarGoogleSync = window.BackendCalendarGoogleSync || {};
// Display the calendar selection dialog. First we will get a list of the available
// user's calendars and then we will display a selection modal so the user can select
// the sync calendar.
var url = GlobalVariables.baseUrl + '/index.php/backend_api/ajax_get_google_calendars';
const url = App.Utils.Url.siteUrl('backend_api/ajax_get_google_calendars');
var data = {
csrf_token: GlobalVariables.csrfToken,
const data = {
csrf_token: App.Vars.csrf_token,
provider_id: $('#select-filter-item').val()
};
$.post(url, data).done(function (response) {
$.post(url, data).done((response) => {
$('#google-calendar').empty();
response.forEach(function (calendar) {
response.forEach((calendar) => {
$('#google-calendar').append(new Option(calendar.summary, calendar.id));
});
@ -83,22 +79,22 @@ window.BackendCalendarGoogleSync = window.BackendCalendarGoogleSync || {};
}
}, 100);
} else {
var buttons = [
const buttons = [
{
text: App.Lang.cancel,
click: function () {
click: () => {
$('#message-box').dialog('close');
}
},
{
text: 'OK',
click: function () {
click: () => {
// Disable synchronization for selected provider.
var providerId = $('#select-filter-item').val();
const providerId = $('#select-filter-item').val();
var provider = GlobalVariables.availableProviders.find(function (availableProvider) {
return Number(availableProvider.id) === Number(providerId);
});
const provider = App.Vars.available_providers.find(
(availableProvider) => Number(availableProvider.id) === Number(providerId)
);
if (!provider) {
throw new Error('Provider not found: ' + providerId);
@ -119,22 +115,22 @@ window.BackendCalendarGoogleSync = window.BackendCalendarGoogleSync || {};
}
];
GeneralFunctions.displayMessageBox(App.Lang.disable_sync, App.Lang.disable_sync_prompt, buttons);
App.Utils.Message.show(App.Lang.disable_sync, App.Lang.disable_sync_prompt, buttons);
}
});
/**
* Event: Select Google Calendar "Click"
*/
$('#select-calendar').on('click', function () {
var url = GlobalVariables.baseUrl + '/index.php/backend_api/ajax_select_google_calendar';
$('#select-calendar').on('click', () => {
const url = App.Utils.Url.siteUrl('backend_api/ajax_select_google_calendar');
var data = {
csrf_token: GlobalVariables.csrfToken,
const data = {
csrf_token: App.Vars.csrf_token,
provider_id: $('#select-filter-item').val(),
calendar_id: $('#google-calendar').val()
};
$.post(url, data).done(function () {
$.post(url, data).done(() => {
Backend.displayNotification(App.Lang.google_calendar_selected);
$('#select-google-calendar').modal('hide');
});
@ -145,19 +141,19 @@ window.BackendCalendarGoogleSync = window.BackendCalendarGoogleSync || {};
*
* Trigger the synchronization algorithm.
*/
$('#google-sync').on('click', function () {
var url = GlobalVariables.baseUrl + '/index.php/google/sync/' + $('#select-filter-item').val();
$('#google-sync').on('click', () => {
const url = App.Utils.Url.siteUrl('google/sync/' + $('#select-filter-item').val());
$.ajax({
url: url,
type: 'GET',
dataType: 'json'
})
.done(function (response) {
.done(() => {
Backend.displayNotification(App.Lang.google_sync_completed);
$('#reload-appointments').trigger('click');
})
.fail(function (jqXHR, textStatus, errorThrown) {
.fail(() => {
Backend.displayNotification(App.Lang.google_sync_failed);
});
});
@ -166,23 +162,27 @@ window.BackendCalendarGoogleSync = window.BackendCalendarGoogleSync || {};
/**
* Disable Provider Sync
*
* This method disables the google synchronization for a specific provider.
* This method disables the Google synchronization for a specific provider.
*
* @param {Number} providerId The selected provider record ID.
*/
function disableProviderSync(providerId) {
// Make an ajax call to the server in order to disable the setting from the database.
var url = GlobalVariables.baseUrl + '/index.php/backend_api/ajax_disable_provider_sync';
const url = App.Utils.Url.siteUrl('backend_api/ajax_disable_provider_sync');
var data = {
csrf_token: GlobalVariables.csrfToken,
const data = {
csrf_token: App.Vars.csrf_token,
provider_id: providerId
};
$.post(url, data);
}
exports.initialize = function () {
function initialize() {
bindEventHandlers();
}
return {
initialize
};
})(window.BackendCalendarGoogleSync);
})();

565
assets/js/pages/backend_calendar_table_view.js → assets/js/utils/calendar_table_view.js
View file

File diff suppressed because it is too large Load diff