Added dynamic date formats to backend/calendar page (not finished yet).

This commit is contained in:
Alex Tselegidis 2015-12-11 00:04:40 +01:00
parent 8dd6a4a4e3
commit e7b9b80264
2 changed files with 47 additions and 30 deletions

View File

@ -203,12 +203,12 @@ var BackendCalendar = {
// Set the start and end datetime of the appointment.
var startDatetime = Date.parseExact(appointment['start_datetime'],
'yyyy-MM-dd HH:mm:ss').toString('dd/MM/yyyy HH:mm');
$dialog.find('#start-datetime').val(startDatetime);
'yyyy-MM-dd HH:mm:ss');
$dialog.find('#start-datetime').val(GeneralFunctions.formatDate(startDatetime, GlobalVariables.dateFormat, true));
var endDatetime = Date.parseExact(appointment['end_datetime'],
'yyyy-MM-dd HH:mm:ss').toString('dd/MM/yyyy HH:mm');
$dialog.find('#end-datetime').val(endDatetime);
'yyyy-MM-dd HH:mm:ss');
$dialog.find('#end-datetime').val(GeneralFunctions.formatDate(endDatetime, GlobalVariables.dateFormat, true));
var customer = appointment['customer'];
$dialog.find('#customer-id').val(appointment['id_users_customer']);
@ -275,8 +275,7 @@ var BackendCalendar = {
$('#calendar').fullCalendar('getView').visStart,
$('#calendar').fullCalendar('getView').visEnd);
// If current value is service, then the sync buttons must be
// disabled.
// If current value is service, then the sync buttons must be disabled.
if ($('#select-filter-item option:selected').attr('type')
=== BackendCalendar.FILTER_TYPE_SERVICE) {
$('#google-sync, #enable-sync, #insert-appointment, #insert-unavailable')
@ -382,12 +381,12 @@ var BackendCalendar = {
// Set the start and end datetime of the appointment.
var startDatetime = Date.parseExact(appointment['start_datetime'],
'yyyy-MM-dd HH:mm:ss').toString('dd/MM/yyyy HH:mm');
$dialog.find('#start-datetime').val(startDatetime);
'yyyy-MM-dd HH:mm:ss');
$dialog.find('#start-datetime').val(GeneralFunctions.formatDate(startDatetime, GlobalVariables.dateFormat, true));
var endDatetime = Date.parseExact(appointment['end_datetime'],
'yyyy-MM-dd HH:mm:ss').toString('dd/MM/yyyy HH:mm');
$dialog.find('#end-datetime').val(endDatetime);
'yyyy-MM-dd HH:mm:ss');
$dialog.find('#end-datetime').val(GeneralFunctions.formatDate(endDatetime, GlobalVariables.dateFormat, true));
var customer = appointment['customer'];
$dialog.find('#customer-id').val(appointment['id_users_customer']);
@ -538,9 +537,9 @@ var BackendCalendar = {
// Id must exist on the object in order for the model to update
// the record and not to perform an insert operation.
var startDatetime = Date.parseExact($dialog.find('#start-datetime').val(),
var startDatetime = Date.parse($dialog.find('#start-datetime').val(),
'dd/MM/yyyy HH:mm').toString('yyyy-MM-dd HH:mm:ss');
var endDatetime = Date.parseExact($dialog.find('#end-datetime').val(),
var endDatetime = Date.parse($dialog.find('#end-datetime').val(),
'dd/MM/yyyy HH:mm').toString('yyyy-MM-dd HH:mm:ss');
var appointment = {
@ -836,8 +835,9 @@ var BackendCalendar = {
else
start.addHours(1).set({ 'minute': 0 });
$dialog.find('#start-datetime').val(start.toString('dd/MM/yyyy HH:mm'));
$dialog.find('#end-datetime').val(start.addMinutes(serviceDuration).toString('dd/MM/yyyy HH:mm'));
$dialog.find('#start-datetime').val(GeneralFunctions.formatDate(start, GlobalVariables.dateFormat, true));
$dialog.find('#end-datetime').val(GeneralFunctions.formatDate(start.addMinutes(serviceDuration),
GlobalVariables.dateFormat, true));
// Display modal form.
$dialog.find('.modal-header h3').text(EALang['new_appointment_title']);
@ -1910,13 +1910,28 @@ var BackendCalendar = {
}
});
var startDatetime = new Date().addMinutes(GlobalVariables.bookAdvanceTimeout)
.toString('dd/MM/yyyy HH:mm');
var startDatetime = new Date().addMinutes(GlobalVariables.bookAdvanceTimeout),
formattedStartDatetime = GeneralFunctions.formatDate(startDatetime, GlobalVariables.dateFormat, true);
var endDatetime = new Date().addMinutes(GlobalVariables.bookAdvanceTimeout)
.addMinutes(serviceDuration).toString('dd/MM/yyyy HH:mm');
.addMinutes(serviceDuration),
formattedEndDatetime = GeneralFunctions.formatDate(endDatetime, GlobalVariables.dateFormat, true);
var dateFormat;
switch(GlobalVariables.dateFormat) {
case 'DMY':
dateFormat = 'dd/mm/yy';
break;
case 'MDY':
dateFormat = 'mm/dd/yy';
break;
case 'YMD':
dateFormat = 'yy/mm/dd';
break;
}
$dialog.find('#start-datetime').datetimepicker({
'dateFormat': 'dd/mm/yy',
'dateFormat': dateFormat,
// Translation
dayNames: [EALang['sunday'], EALang['monday'], EALang['tuesday'], EALang['wednesday'],
EALang['thursday'], EALang['friday'], EALang['saturday']],
@ -1941,10 +1956,10 @@ var BackendCalendar = {
minuteText: EALang['minutes'],
firstDay: 1
});
$dialog.find('#start-datetime').val(startDatetime);
$dialog.find('#start-datetime').val(formattedStartDatetime);
$dialog.find('#end-datetime').datetimepicker({
'dateFormat': 'dd/mm/yy',
'dateFormat': dateFormat,
// Translation
dayNames: [EALang['sunday'], EALang['monday'], EALang['tuesday'], EALang['wednesday'],
EALang['thursday'], EALang['friday'], EALang['saturday']],
@ -1969,7 +1984,7 @@ var BackendCalendar = {
minuteText: EALang['minutes'],
firstDay: 1
});
$dialog.find('#end-datetime').val(endDatetime);
$dialog.find('#end-datetime').val(formattedEndDatetime);
},
/**
@ -2005,8 +2020,8 @@ var BackendCalendar = {
}
// :: CHECK APPOINTMENT START AND END TIME
var start = Date.parseExact($('#start-datetime').val(), 'dd/MM/yyyy HH:mm');
var end = Date.parseExact($('#end-datetime').val(), 'dd/MM/yyyy HH:mm');
var start = Date.parse($('#start-datetime').val(), 'dd/MM/yyyy HH:mm');
var end = Date.parse($('#end-datetime').val(), 'dd/MM/yyyy HH:mm');
if (start > end) {
$dialog.find('#start-datetime').parents().eq(1).addClass('error');
$dialog.find('#end-datetime').parents().eq(1).addClass('error');

View File

@ -369,23 +369,25 @@ var GeneralFunctions = {
/**
* Format a given date according to the date format setting.
*
* @param {Date]} date The date to be formatted.
* @param {string} dateFormatSetting The setting provided by PHP must be one of
* @param {Date]} date The date to be formatted.
* @param {string} dateFormatSetting The setting provided by PHP must be one of
* the "DMY", "MDY" or "YMD".
* @param {bool} addHours (optional) Whether to add hours to the result.
* @returns {string} Returns the formatted date string.
*/
formatDate: function(date, dateFormatSetting) {
var result;
formatDate: function(date, dateFormatSetting, addHours) {
var format, result,
hours = addHours ? ' HH:mm' : '';
switch(dateFormatSetting) {
case 'DMY':
result = Date.parse(date).toString('dd/MM/yyyy');
result = Date.parse(date).toString('dd/MM/yyyy' + hours);
break;
case 'MDY':
result = Date.parse(date).toString('MM/dd/yyyy');
result = Date.parse(date).toString('MM/dd/yyyy' + hours);
break;
case 'YMD':
result = Date.parse(date).toString('yyyy/MM/dd');
result = Date.parse(date).toString('yyyy/MM/dd' + hours);
break;
default:
throw new Error('Invalid date format setting provided!', dateFormatSetting);