slightly faster text list construction for cells that don't have tooltips; make calendar layout deterministic for events that have the same time span

This commit is contained in:
rlx 2011-10-11 06:32:20 +00:00
parent 5948d2c2ce
commit 527f75b009
4 changed files with 44 additions and 26 deletions

View file

@ -583,6 +583,7 @@ Ox.Calendar = function(options, self) {
event.id = Ox.isUndefined(event.id) ? Ox.uid() : event.id; event.id = Ox.isUndefined(event.id) ? Ox.uid() : event.id;
event.startTime = Ox.parseDate(event.start, true); event.startTime = Ox.parseDate(event.start, true);
event.endTime = Ox.parseDate(event.end, true); event.endTime = Ox.parseDate(event.end, true);
event.durationTime = event.endTime - event.startTime;
event.rangeText = Ox.formatDateRange(event.start, event.end, true); event.rangeText = Ox.formatDateRange(event.start, event.end, true);
event.durationText = Ox.formatDateRangeDuration(event.start, event.end, true); event.durationText = Ox.formatDateRangeDuration(event.start, event.end, true);
if (event.current) { if (event.current) {
@ -651,7 +652,8 @@ Ox.Calendar = function(options, self) {
// filter out events with types not shown // filter out events with types not shown
return self.options.showTypes.indexOf(event.type) > -1; return self.options.showTypes.indexOf(event.type) > -1;
}).sort(function(a, b) { }).sort(function(a, b) {
// sort events (dates first, people last, longer before shorter) // sort events (dates first, people last, longer before shorter,
// earlier before later, otherwise alphabetically by name)
if (a.type == 'date' && b.type != 'date') { if (a.type == 'date' && b.type != 'date') {
return -1; return -1;
} else if (a.type != 'date' && b.type == 'date') { } else if (a.type != 'date' && b.type == 'date') {
@ -660,10 +662,12 @@ Ox.Calendar = function(options, self) {
return 1; return 1;
} else if (a.type != 'person' && b.type == 'person') { } else if (a.type != 'person' && b.type == 'person') {
return -1; return -1;
} else if ((b.endTime - b.startTime) != (a.endTime - a.startTime)) { } else if (a.durationTime != b.durationTime) {
return (b.endTime - b.startTime) - (a.endTime - a.startTime); return b.durationTime - a.durationTime;
} else /*if (a.startTime < b.startTime || a.startTime > b.startTime)*/ { } else if (+a.startTime != +b.startTime) {
return a.startTime - b.startTime; return a.startTime - b.startTime;
} else {
return a.name < b.name ? -1 : 1;
} }
}).forEach(function(event, i) { }).forEach(function(event, i) {
var line = self.lineEvents.length; var line = self.lineEvents.length;
@ -1124,7 +1128,7 @@ Ox.Calendar = function(options, self) {
that.removeEvent = function() { that.removeEvent = function() {
Ox.print('REMOVE ... SELF.OPTIONS', self.options) Ox.print('REMOVE ... SELF.OPTIONS', self.options)
var index = Ox.getPositionById(self.options.events, self.selected); var index = Ox.getPositionById(self.options.events, self.options.selected);
self.options.events.splice(index, 1); self.options.events.splice(index, 1);
getLines(); getLines();
renderCalendar(); renderCalendar();

View file

@ -479,7 +479,9 @@ Ox.ListCalendar = function(options, self) {
self.options.addEvent(event, function(result) { self.options.addEvent(event, function(result) {
event.id = result.data.id; event.id = result.data.id;
self.options.events.push(event); self.options.events.push(event);
var time0 = +new Date()
self.$list.options({items: Ox.clone(self.options.events, true)}); self.$list.options({items: Ox.clone(self.options.events, true)});
Ox.print('TIME TO SET LIST OPTIONS:', +new Date() - time0);
self.$calendar.addEvent(event); self.$calendar.addEvent(event);
selectEvent(event); selectEvent(event);
}); });
@ -491,7 +493,9 @@ Ox.ListCalendar = function(options, self) {
data = {id: id}; data = {id: id};
self.options.events[index][key] = value; self.options.events[index][key] = value;
data[key] = value; data[key] = value;
var time0 = +new Date();
self.$list.options({items: Ox.clone(self.options.events, true)}); self.$list.options({items: Ox.clone(self.options.events, true)});
Ox.print('TIME TO SET LIST OPTIONS:', +new Date() - time0);
if (['name', 'type', 'start', 'end'].indexOf(key) > -1) { if (['name', 'type', 'start', 'end'].indexOf(key) > -1) {
self.$calendar.editEvent(id, key, value); self.$calendar.editEvent(id, key, value);
} }
@ -507,11 +511,9 @@ Ox.ListCalendar = function(options, self) {
) )
}); });
} }
self.options.editEvent(data, function(result) { self.options.editEvent(data, function(result) {
// ... // ...
}); });
} }
function initList(data) { function initList(data) {
@ -545,7 +547,9 @@ Ox.ListCalendar = function(options, self) {
var id = self.selectedEvent, var id = self.selectedEvent,
index = Ox.getPositionById(self.options.events, id); index = Ox.getPositionById(self.options.events, id);
self.options.events.splice(index, 1); self.options.events.splice(index, 1);
var time0 = +new Date();
self.$list.options({items: Ox.clone(self.options.events, true)}); self.$list.options({items: Ox.clone(self.options.events, true)});
Ox.print('TIME TO SET LIST OPTIONS:', +new Date() - time0);
self.$calendar.removeEvent(); self.$calendar.removeEvent();
selectEvent({}); selectEvent({});
self.options.removeEvent({id: id}, function(result) { self.options.removeEvent({id: id}, function(result) {

View file

@ -687,18 +687,24 @@ Ox.List = function(options, self) {
function loadItems() { function loadItems() {
self.$page.empty(); self.$page.empty();
self.$items = []; self.$items = [];
var timeC = 0, timeA = 0;
self.options.items.forEach(function(item, pos) { self.options.items.forEach(function(item, pos) {
// fixme: duplicated // fixme: duplicated
var time0 = +new Date();
self.$items[pos] = Ox.ListItem({ self.$items[pos] = Ox.ListItem({
construct: self.options.construct, construct: self.options.construct,
data: item, data: item,
position: pos, position: pos,
unique: self.options.unique unique: self.options.unique
}); });
timeC += +new Date() - time0;
isSelected(pos) && self.$items[pos].addClass('OxSelected'); isSelected(pos) && self.$items[pos].addClass('OxSelected');
var time0 = +new Date();
self.$items[pos].appendTo(self.$page); self.$items[pos].appendTo(self.$page);
timeA += +new Date() - time0;
}); });
self.selected.length && scrollToPosition(self.selected[0]); self.selected.length && scrollToPosition(self.selected[0]);
Ox.print('CONSTRUCT:', timeC, 'APPEND:', timeA);
// that.triggerEvent('init', {items: self.options.items.length}); // that.triggerEvent('init', {items: self.options.items.length});
// fixme: do sync lists need to trigger init? // fixme: do sync lists need to trigger init?
// will this only be reached in sync lists? // will this only be reached in sync lists?

View file

@ -404,30 +404,35 @@ Ox.TextList = function(options, self) {
self.visibleColumns.forEach(function(v, i) { self.visibleColumns.forEach(function(v, i) {
var clickable = Ox.isBoolean(v.clickable) ? v.clickable : v.clickable(data), var clickable = Ox.isBoolean(v.clickable) ? v.clickable : v.clickable(data),
editable = Ox.isBoolean(v.editable) ? v.editable : v.editable(data), editable = Ox.isBoolean(v.editable) ? v.editable : v.editable(data),
$cell;
if (v.tooltip) {
$cell = Ox.Element({ $cell = Ox.Element({
tooltip: v.tooltip ? function() { tooltip: function() {
return self.options.selected.indexOf(data[self.unique]) > -1 return self.options.selected.indexOf(data[self.unique]) > -1
? (Ox.isString(v.tooltip) ? v.tooltip : v.tooltip(data)) : ''; ? (Ox.isString(v.tooltip) ? v.tooltip : v.tooltip(data)) : '';
} : null }
}) });
.addClass( } else {
'OxCell OxColumn' + Ox.toTitleCase(v.id) + $cell = $('<div>');
(clickable ? ' OxClickable' : '') + }
(editable ? ' OxEditable' : '') $cell.addClass(
) 'OxCell OxColumn' + Ox.toTitleCase(v.id) +
.css({ (clickable ? ' OxClickable' : '') +
width: (self.columnWidths[i] - (self.options.columnsVisible ? 9 : 8)) + 'px', (editable ? ' OxEditable' : '')
borderRightWidth: (self.options.columnsVisible ? 1 : 0) + 'px', )
textAlign: v.align .css({
}) width: (self.columnWidths[i] - (self.options.columnsVisible ? 9 : 8)) + 'px',
.html(v.id in data ? formatValue(v.id, data[v.id], data) : '') borderRightWidth: (self.options.columnsVisible ? 1 : 0) + 'px',
.appendTo($item); textAlign: v.align
})
// if the column id is not in data, we're constructing an empty cell
.html(v.id in data ? formatValue(v.id, data[v.id], data) : '')
.appendTo($item);
}); });
return $item; return $item;
} }
function dragstartColumn(id, e) { function dragstartColumn(id, e) {
//Ox.print(that.$body.scrollLeft(), '??')
self.drag = { self.drag = {
columnOffsets: getColumnOffsets(), columnOffsets: getColumnOffsets(),
listOffset: that.$element.offset().left - that.$body.scrollLeft(), listOffset: that.$element.offset().left - that.$body.scrollLeft(),
@ -440,7 +445,6 @@ Ox.TextList = function(options, self) {
self.$heads[self.drag.startPos].addClass('OxDrag').css({ // fixme: why does the class not work? self.$heads[self.drag.startPos].addClass('OxDrag').css({ // fixme: why does the class not work?
cursor: 'move' cursor: 'move'
}); });
//Ox.print('columnOffsets', self.drag.columnOffsets)
} }
function dragColumn(id, e) { function dragColumn(id, e) {