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

Improved the backend calendar rendering performance by reducing the number of calendar render cycles on each reload

Browse source
This commit is contained in:
Alex Tselegidis 2021-03-25 11:12:10 +01:00
parent b6a17d4e11
commit 3bf718050d
2 changed files with 32 additions and 23 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

32
assets/js/backend_calendar_default_view.js
View file

@ -1036,6 +1036,8 @@ window.BackendCalendarDefaultView = window.BackendCalendarDefaultView || {};
$('#loading').css('visibility', 'hidden'); $('#loading').css('visibility', 'hidden');
var calendarEventSource = [];
return $.post(url, data) return $.post(url, data)
.done(function (response) { .done(function (response) {
var $calendar = $('#calendar'); var $calendar = $('#calendar');
@ -1056,14 +1058,11 @@ window.BackendCalendarDefaultView = window.BackendCalendarDefaultView || {};
data: appointment // Store appointment data for later use. data: appointment // Store appointment data for later use.
}; };
appointmentEvents.push(appointmentEvent); calendarEventSource.push(appointmentEvent);
}); });
$calendar.fullCalendar('addEventSource', appointmentEvents);
// Add custom unavailable periods (they are always displayed on the calendar, even if the provider won't // Add custom unavailable periods (they are always displayed on the calendar, even if the provider won't
// work on that day). // work on that day).
var unavailabilityEvents = [];
response.unavailables.forEach(function (unavailable) { response.unavailables.forEach(function (unavailable) {
var notes = unavailable.notes ? ' - ' + unavailable.notes : ''; var notes = unavailable.notes ? ' - ' + unavailable.notes : '';
@ -1082,11 +1081,9 @@ window.BackendCalendarDefaultView = window.BackendCalendarDefaultView || {};
data: unavailable data: unavailable
}; };
unavailabilityEvents.push(unavailabilityEvent); calendarEventSource.push(unavailabilityEvent);
}); });
$calendar.fullCalendar('addEventSource', unavailabilityEvents);
var calendarView = $('#calendar').fullCalendar('getView'); var calendarView = $('#calendar').fullCalendar('getView');
if (filterType === FILTER_TYPE_PROVIDER && calendarView.name !== 'month') { if (filterType === FILTER_TYPE_PROVIDER && calendarView.name !== 'month') {
@ -1148,7 +1145,7 @@ window.BackendCalendarDefaultView = window.BackendCalendarDefaultView || {};
} }
}; };
$calendar.fullCalendar('renderEvent', workingPlanExceptionEvent, false); calendarEventSource.push(workingPlanExceptionEvent);
} }
// Non-working day. // Non-working day.
@ -1164,7 +1161,7 @@ window.BackendCalendarDefaultView = window.BackendCalendarDefaultView || {};
className: 'fc-unavailable' className: 'fc-unavailable'
}; };
$calendar.fullCalendar('renderEvent', unavailabilityEvent, false); calendarEventSource.push(unavailabilityEvent);
return; // Go to next loop. return; // Go to next loop.
} }
@ -1187,7 +1184,7 @@ window.BackendCalendarDefaultView = window.BackendCalendarDefaultView || {};
className: 'fc-unavailable' className: 'fc-unavailable'
}; };
$calendar.fullCalendar('renderEvent', unavailablePeriodBeforeWorkStarts, false); calendarEventSource.push(unavailablePeriodBeforeWorkStarts);
} }
// Add unavailable period after work ends. // Add unavailable period after work ends.
@ -1208,7 +1205,7 @@ window.BackendCalendarDefaultView = window.BackendCalendarDefaultView || {};
className: 'fc-unavailable' className: 'fc-unavailable'
}; };
$calendar.fullCalendar('renderEvent', unavailablePeriodAfterWorkEnds, false); calendarEventSource.push(unavailablePeriodAfterWorkEnds);
} }
// Add unavailable periods for breaks. // Add unavailable periods for breaks.
@ -1233,7 +1230,7 @@ window.BackendCalendarDefaultView = window.BackendCalendarDefaultView || {};
className: 'fc-unavailable fc-break' className: 'fc-unavailable fc-break'
}; };
$calendar.fullCalendar('renderEvent', unavailablePeriod, false); calendarEventSource.push(unavailablePeriod);
}); });
break; break;
@ -1268,7 +1265,7 @@ window.BackendCalendarDefaultView = window.BackendCalendarDefaultView || {};
} }
}; };
$calendar.fullCalendar('renderEvent', workingPlanExceptionEvent, false); calendarEventSource.push(workingPlanExceptionEvent);
} }
// Non-working day. // Non-working day.
@ -1284,7 +1281,7 @@ window.BackendCalendarDefaultView = window.BackendCalendarDefaultView || {};
className: 'fc-unavailable' className: 'fc-unavailable'
}; };
$calendar.fullCalendar('renderEvent', unavailabilityEvent, true); calendarEventSource.push(unavailabilityEvent);
calendarDate.add(1, 'day'); calendarDate.add(1, 'day');
@ -1308,7 +1305,7 @@ window.BackendCalendarDefaultView = window.BackendCalendarDefaultView || {};
className: 'fc-unavailable' className: 'fc-unavailable'
}; };
$calendar.fullCalendar('renderEvent', unavailabilityEvent, true); calendarEventSource.push(unavailabilityEvent);
} }
// Add unavailable period after work ends. // Add unavailable period after work ends.
@ -1328,7 +1325,7 @@ window.BackendCalendarDefaultView = window.BackendCalendarDefaultView || {};
className: 'fc-unavailable' className: 'fc-unavailable'
}; };
$calendar.fullCalendar('renderEvent', unavailabilityEvent, false); calendarEventSource.push(unavailabilityEvent);
} }
// Add unavailable periods during day breaks. // Add unavailable periods during day breaks.
@ -1353,7 +1350,7 @@ window.BackendCalendarDefaultView = window.BackendCalendarDefaultView || {};
className: 'fc-unavailable fc-break' className: 'fc-unavailable fc-break'
}; };
$calendar.fullCalendar('renderEvent', unavailabilityEvent, false); calendarEventSource.push(unavailabilityEvent);
}); });
calendarDate.add(1, 'day'); calendarDate.add(1, 'day');
@ -1365,6 +1362,7 @@ window.BackendCalendarDefaultView = window.BackendCalendarDefaultView || {};
}) })
.always(function () { .always(function () {
$('#loading').css('visibility', '') $('#loading').css('visibility', '')
$calendar.fullCalendar('addEventSource', calendarEventSource);
}); });
} }

23
assets/js/backend_calendar_table_view.js
View file

@ -817,6 +817,7 @@ window.BackendCalendarTableView = window.BackendCalendarTableView || {};
var end = view.end.clone(); var end = view.end.clone();
var selDayName = start.toDate().toString('dddd').toLowerCase(); var selDayName = start.toDate().toString('dddd').toLowerCase();
var selDayDate = start.format('YYYY-MM-DD'); var selDayDate = start.format('YYYY-MM-DD');
var calendarEventSource = [];
if (workingPlanExceptions[selDayDate]) { if (workingPlanExceptions[selDayDate]) {
workingPlan[selDayName] = workingPlanExceptions[selDayDate]; workingPlan[selDayName] = workingPlanExceptions[selDayDate];
@ -839,7 +840,7 @@ window.BackendCalendarTableView = window.BackendCalendarTableView || {};
} }
}; };
$calendar.fullCalendar('renderEvent', workingPlanExceptionEvent, false); calendarEventSource.push(workingPlanExceptionEvent);
} }
if (workingPlan[selDayName] === null) { if (workingPlan[selDayName] === null) {
@ -853,7 +854,9 @@ window.BackendCalendarTableView = window.BackendCalendarTableView || {};
className: 'fc-unavailable' className: 'fc-unavailable'
}; };
$calendar.fullCalendar('renderEvent', nonWorkingDay, true); calendarEventSource.push(nonWorkingDay);
$calendar.fullCalendar('addEventSource', calendarEventSource);
return; return;
} }
@ -870,7 +873,8 @@ window.BackendCalendarTableView = window.BackendCalendarTableView || {};
editable: false, editable: false,
className: 'fc-unavailable' className: 'fc-unavailable'
}; };
$calendar.fullCalendar('renderEvent', unavailablePeriod, false);
calendarEventSource.push(unavailablePeriod);
} }
// Add unavailable period after work ends. // Add unavailable period after work ends.
@ -886,7 +890,8 @@ window.BackendCalendarTableView = window.BackendCalendarTableView || {};
editable: false, editable: false,
className: 'fc-unavailable' className: 'fc-unavailable'
}; };
$calendar.fullCalendar('renderEvent', unavailablePeriod, false);
calendarEventSource.push(unavailablePeriod);
} }
// Add unavailable periods for breaks. // Add unavailable periods for breaks.
@ -907,8 +912,10 @@ window.BackendCalendarTableView = window.BackendCalendarTableView || {};
className: 'fc-unavailable fc-break' className: 'fc-unavailable fc-break'
}; };
$calendar.fullCalendar('renderEvent', unavailablePeriod, false); calendarEventSource.push(unavailablePeriod);
}); });
$calendar.fullCalendar('addEventSource', calendarEventSource);
} }
/** /**
@ -967,6 +974,8 @@ window.BackendCalendarTableView = window.BackendCalendarTableView || {};
return; return;
} }
var calendarEventSource = [];
for (var index in unavailabilityEvents) { for (var index in unavailabilityEvents) {
var unavailability = unavailabilityEvents[index]; var unavailability = unavailabilityEvents[index];
@ -985,8 +994,10 @@ window.BackendCalendarTableView = window.BackendCalendarTableView || {};
data: unavailability data: unavailability
}; };
$providerColumn.find('.calendar-wrapper').fullCalendar('renderEvent', event, false); calendarEventSource.push(event);
} }
$providerColumn.find('.calendar-wrapper').fullCalendar('addEventSource', calendarEventSource);
} }
/** /**