mirror of
https://github.com/alextselegidis/easyappointments.git
synced 2024-11-09 17:42:21 +03:00
Improved the backend calendar rendering performance by reducing the number of calendar render cycles on each reload
This commit is contained in:
parent
b6a17d4e11
commit
3bf718050d
2 changed files with 32 additions and 23 deletions
|
@ -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);
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -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);
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
|
|
Loading…
Reference in a new issue