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

The booking zone supports timezones.

Browse source
This commit is contained in:
Alex Tselegidis 2020-03-29 16:20:30 +02:00
parent 8798813606
commit 88bbe06548
6 changed files with 59 additions and 8 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

6
application/controllers/Appointments.php
View file

@ -68,6 +68,7 @@ class Appointments extends CI_Controller {
$this->load->model('services_model');
$this->load->model('customers_model');
$this->load->model('settings_model');
$this->load->model('timezones_model');
try
{
@ -84,6 +85,7 @@ class Appointments extends CI_Controller {
$terms_and_conditions_content = $this->settings_model->get_setting('terms_and_conditions_content');
$display_privacy_policy = $this->settings_model->get_setting('display_privacy_policy');
$privacy_policy_content = $this->settings_model->get_setting('privacy_policy_content');
$timezones = $this->timezones_model->to_array();
// Remove the data that are not needed inside the $available_providers array.
foreach ($available_providers as $index => $provider)
@ -92,7 +94,8 @@ class Appointments extends CI_Controller {
'id' => $provider['id'],
'first_name' => $provider['first_name'],
'last_name' => $provider['last_name'],
'services' => $provider['services']
'services' => $provider['services'],
'timezone' => $provider['timezone']
];
$available_providers[$index] = $stripped_data;
}
@ -160,6 +163,7 @@ class Appointments extends CI_Controller {
'terms_and_conditions_content' => $terms_and_conditions_content,
'display_privacy_policy' => $display_privacy_policy,
'privacy_policy_content' => $privacy_policy_content,
'timezones' => $timezones,
];
}
catch (Exception $exc)

5
application/views/appointments/book.php
View file

@ -182,6 +182,9 @@
</div>
<div class="col-xs-12 col-sm-6">
<label for="select-timezone"><?= lang('timezone') ?></label>
<?= render_timezone_dropdown('id="select-timezone" class="form-control" value="UTC"'); ?>
<div id="available-hours"></div>
</div>
</div>
@ -391,6 +394,8 @@
<script src="<?= asset_url('assets/ext/cookieconsent/cookieconsent.min.js') ?>"></script>
<script src="<?= asset_url('assets/ext/bootstrap/js/bootstrap.min.js') ?>"></script>
<script src="<?= asset_url('assets/ext/datejs/date.min.js') ?>"></script>
<script src="<?= asset_url('assets/ext/moment/moment.min.js') ?>"></script>
<script src="<?= asset_url('assets/ext/moment/moment-timezone-with-data.min.js') ?>"></script>
<script src="<?= asset_url('assets/js/frontend_book_api.js') ?>"></script>
<script src="<?= asset_url('assets/js/frontend_book.js') ?>"></script>

4
assets/css/frontend.css
View file

@ -162,6 +162,10 @@ body {
min-width: 270px; /* This is especially needed for ie8 */
}
#book-appointment-wizard #select-timezone {
margin-bottom: 15px;
}
#book-appointment-wizard #appointment-details p,
#book-appointment-wizard #customer-details p {
font-size: 16px;

1
assets/ext/moment/moment-timezone-with-data.min.js vendored Normal file
View file

File diff suppressed because one or more lines are too long

28
assets/js/frontend_book.js
View file

@ -61,7 +61,7 @@ window.FrontendBook = window.FrontendBook || {};
window.console = function () {
}; // IE compatibility
}
if (GlobalVariables.displayCookieNotice) {
cookieconsent.initialise({
palette: {
@ -144,6 +144,8 @@ window.FrontendBook = window.FrontendBook || {};
}
});
$('#select-timezone').val(Intl.DateTimeFormat().resolvedOptions().timeZone);
// Bind the event handlers (might not be necessary every time we use this class).
if (bindEventHandlers) {
_bindEventHandlers();
@ -166,11 +168,11 @@ window.FrontendBook = window.FrontendBook || {};
$selectService.trigger('change'); // Load the available hours.
// Check if a specific provider was selected.
// Check if a specific provider was selected.
var selectedProviderId = GeneralFunctions.getUrlParameter(location.href, 'provider');
if (selectedProviderId && $selectProvider.find('option[value="' + selectedProviderId + '"]').length === 0) {
// Select a service of this provider in order to make the provider available in the select box.
// Select a service of this provider in order to make the provider available in the select box.
for (var index in GlobalVariables.availableProviders) {
var provider = GlobalVariables.availableProviders[index];
@ -195,6 +197,21 @@ window.FrontendBook = window.FrontendBook || {};
* This method binds the necessary event handlers for the book appointments page.
*/
function _bindEventHandlers() {
/**
* Event: Timezone "Changed"
*/
$('#select-timezone').on('change', function () {
var date = $('#select-date').datepicker('getDate');
if (!date) {
return;
}
FrontendBookApi.getAvailableHours(date.toString('yyyy-MM-dd'));
FrontendBook.updateConfirmFrame();
});
/**
* Event: Selected Provider "Changed"
*
@ -517,7 +534,7 @@ window.FrontendBook = window.FrontendBook || {};
'<p>'
+ '<strong class="text-primary">'
+ $('#select-provider option:selected').text() + '<br>'
+ selectedDate + ' ' + $('.selected-hour').text()
+ selectedDate + ' ' + $('.selected-hour').text() + '<br>' + $('#select-timezone option:selected').text()
+ servicePrice + ' ' + serviceCurrency
+ '</strong>' +
'</p>';
@ -560,7 +577,8 @@ window.FrontendBook = window.FrontendBook || {};
phone_number: $('#phone-number').val(),
address: $('#address').val(),
city: $('#city').val(),
zip_code: $('#zip-code').val()
zip_code: $('#zip-code').val(),
timezone: $('#select-timezone').val()
};
postData.appointment = {

23
assets/js/frontend_book_api.js
View file

@ -68,10 +68,25 @@ window.FrontendBookApi = window.FrontendBookApi || {};
// The response contains the available hours for the selected provider and
// service. Fill the available hours div with response data.
if (response.length > 0) {
var providerId = $('#select-provider').val();
var provider = GlobalVariables.availableProviders.filter(function(availableProvider) {
return providerId == availableProvider.id;
}).shift();
if (!provider) {
throw new Error('Could not find provider.');
}
var providerTimezone = provider.timezone;
var selectedTimezone = $('#select-timezone').val();
var currColumn = 1;
$('#available-hours').html('<div style="width:80px; float:left;"></div>');
var timeFormat = GlobalVariables.timeFormat === 'regular' ? 'h:mm tt' : 'HH:mm';
var timeFormat = GlobalVariables.timeFormat === 'regular' ? 'h:mm a' : 'HH:mm';
$.each(response, function (index, availableHour) {
if ((currColumn * 10) < (index + 1)) {
@ -79,8 +94,12 @@ window.FrontendBookApi = window.FrontendBookApi || {};
$('#available-hours').append('<div style="width:80px; float:left;"></div>');
}
var availableHourMoment = moment
.tz(selDate + ' ' + availableHour + ':00', providerTimezone)
.tz(selectedTimezone);
$('#available-hours div:eq(' + (currColumn - 1) + ')').append(
'<span class="available-hour">' + Date.parse(availableHour).toString(timeFormat) + '</span><br/>');
'<span class="available-hour">' + availableHourMoment.format(timeFormat) + '</span><br/>');
});
if (FrontendBook.manageMode) {