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:
parent
5948d2c2ce
commit
527f75b009
4 changed files with 44 additions and 26 deletions
|
@ -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();
|
||||||
|
|
|
@ -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) {
|
||||||
|
|
|
@ -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?
|
||||||
|
|
|
@ -404,13 +404,18 @@ 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 {
|
||||||
|
$cell = $('<div>');
|
||||||
|
}
|
||||||
|
$cell.addClass(
|
||||||
'OxCell OxColumn' + Ox.toTitleCase(v.id) +
|
'OxCell OxColumn' + Ox.toTitleCase(v.id) +
|
||||||
(clickable ? ' OxClickable' : '') +
|
(clickable ? ' OxClickable' : '') +
|
||||||
(editable ? ' OxEditable' : '')
|
(editable ? ' OxEditable' : '')
|
||||||
|
@ -420,6 +425,7 @@ Ox.TextList = function(options, self) {
|
||||||
borderRightWidth: (self.options.columnsVisible ? 1 : 0) + 'px',
|
borderRightWidth: (self.options.columnsVisible ? 1 : 0) + 'px',
|
||||||
textAlign: v.align
|
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) : '')
|
.html(v.id in data ? formatValue(v.id, data[v.id], data) : '')
|
||||||
.appendTo($item);
|
.appendTo($item);
|
||||||
});
|
});
|
||||||
|
@ -427,7 +433,6 @@ Ox.TextList = function(options, self) {
|
||||||
}
|
}
|
||||||
|
|
||||||
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) {
|
||||||
|
|
Loading…
Reference in a new issue