slightly faster rendering of events

This commit is contained in:
rolux 2011-05-28 01:06:48 +02:00
parent 2c82f51120
commit 37ecdd99ac

View file

@ -98,7 +98,6 @@ Ox.Calendar = function(options, self) {
event.rangeText = event.rangeText.split(' - ').shift() + ' - ...';
}
});
self.lineEvents = getLineEvents();
self.maxZoom = 32;
self.minLabelWidth = 80;
@ -413,6 +412,8 @@ Ox.Calendar = function(options, self) {
textAlign: 'center'
});
self.$lines = [];
self.lineEvents = getLineEvents();
renderCalendar();
function changeDate() {
@ -552,7 +553,8 @@ Ox.Calendar = function(options, self) {
)
.css({
left: getPosition(unit.date(value + i), zoom) + 'px',
width: (u == 0 ? 1 : width) + 'px'
width: (u == 0 ? 1 : width) + 'px',
height: self.contentHeight + 'px'
})
);
}
@ -776,7 +778,7 @@ Ox.Calendar = function(options, self) {
}
function panTo(date, line) {
var delta = (date - self.options.date) / 1000 * getPixelsPerSecond(),
var delta = Math.round((date - self.options.date) / 1000 * getPixelsPerSecond()),
// 250 ms for half the width of the visible area
ms = 250 * Math.min(Math.abs(delta) / (self.$content.width() / 2), 1);
self.$scalebar.stop().animate({
@ -811,6 +813,7 @@ Ox.Calendar = function(options, self) {
getBackgroundElements(self.options.zoom).forEach(function($element) {
$element.appendTo(self.$background);
});
}
function renderCalendar() {
@ -827,6 +830,7 @@ Ox.Calendar = function(options, self) {
function getLineEvents() {
var lineEvents = [];
self.$content.find('.OxLine').remove();
self.options.events.filter(function(event) {
// filter out events with types not shown
// and events outside the visible area <-- commented out to keep layout from changing
@ -867,9 +871,19 @@ Ox.Calendar = function(options, self) {
});
if (line == lineEvents.length) {
lineEvents[line] = [];
self.$lines[line] = new Ox.Element()
.addClass('OxLine')
.css({
top: (line * 16) + 'px'
})
.appendTo(self.$content);
}
lineEvents[line].push(event);
});
self.contentHeight = Math.max(
lineEvents.length * 16, self.$container.height()
);
self.$content.css({height: self.contentHeight + 'px'});
return lineEvents;
}
@ -877,27 +891,14 @@ Ox.Calendar = function(options, self) {
var calendarEvent = getCalendarEvent(),
height;
//types = ['date', 'place', 'person', 'other'];
self.$content.find('.OxLine').remove();
height = Math.max(self.lineEvents.length * 16, self.$container.height());
self.$background.$element.children().css({height: height + 'px'});
self.$content.css({height: height + 'px'});
self.lineEvents.forEach(function(events, line) {
var $line = new Ox.Element()
.addClass('OxLine')
.css({
top: (line * 16) + 'px'
})
.appendTo(self.$content);
events.sort(function(a, b) {
// sort events by start, ascending
return a.startTime - b.startTime;
}).forEach(function(event) {
events.forEach(function(event) {
// append if selected or visible
if (
event.id == self.options.selected
|| overlaps(event, calendarEvent)
) {
getEventElement(event).data({line: line}).appendTo($line);
getEventElement(event).data({line: line}).appendTo(self.$lines[line]);
}
});
});
@ -956,10 +957,9 @@ Ox.Calendar = function(options, self) {
function scrollTo(top, animate) {
var containerHeight = self.$container.height(),
contentHeight = self.$content.height(),
scrollTop = self.$container.$element[0].scrollTop,
min = 0,
max = Math.ceil(contentHeight - containerHeight / 2),
max = Math.ceil(self.contentHeight - containerHeight / 2),
top = Ox.limit(top, min, max),
delta = top - scrollTop,
ms = 250 * Math.min(Math.abs(delta) / (containerHeight / 2), 1);