0x2620/oxjs
2
0
Fork 1
Code Issues 172 Pull requests Releases Wiki Activity

reform Ox.List to allow for scroll position staying the same after deleting an item

Browse source
This commit is contained in:
rolux 2011-05-29 18:05:29 +02:00
parent ccc4a743d8
commit 7b2a0cfef5
3 changed files with 57 additions and 43 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

94
source/Ox.UI/js/List/Ox.List.js
View file

@ -168,7 +168,7 @@ Ox.List = function(options, self) {
self.listLength = self.options.items.length;
loadItems();
} else {
updateQuery(self.options.selected);
updateQuery();
}
that.bindEvent(self.keyboardEvents);
//Ox.UI.$window.resize(that.size); // fixme: this is not the widget's job
@ -287,9 +287,8 @@ Ox.List = function(options, self) {
}
function copyItems() {
var ids = getSelectedIds();
ids.length && that.triggerEvent('copy', {
ids: ids
self.options.selected.length && that.triggerEvent('copy', {
ids: self.options.selected
});
/*
ids.length && self.options.copy && Ox.Clipboard.copy(
@ -308,9 +307,8 @@ Ox.List = function(options, self) {
}
function deleteItems() {
var ids = getSelectedIds();
ids.length && that.triggerEvent('delete', {
ids: ids
self.options.selected.length && that.triggerEvent('delete', {
ids: self.options.selected
});
}
@ -528,6 +526,14 @@ Ox.List = function(options, self) {
return parseInt(pos / self.options.pageLength);
}
function getPageByScrollPosition(pos) {
return getPageByPosition(pos / (
self.options.orientation == 'vertical'
? self.options.itemHeight
: self.options.itemWidth
));
}
function getPageCSS(page) {
return self.options.orientation == 'horizontal' ? {
left: (page * self.pageWidth + self.listMargin / 2) + 'px',
@ -556,26 +562,27 @@ Ox.List = function(options, self) {
return pos;
}
function getPositions(ids) {
ids = ids || getSelectedIds();
Ox.print('getPositions', ids)
function getPositions(callback) {
Ox.print('getPositions', self.options.selected);
// fixme: optimize: send non-selected ids if more than half of the items are selected
if (ids.length /*&& ids.length < self.listLength*/) {
if (self.options.selected.length /*&& ids.length < self.listLength*/) {
/*Ox.print('-------- request', {
ids: ids,
sort: self.options.sort
});*/
self.requests.push(self.options.items({
ids: ids,
ids: self.options.selected,
sort: self.options.sort
}, getPositionsCallback));
}, function(result) {
getPositionsCallback(result, callback);
}));
} else {
getPositionsCallback();
getPositionsCallback(null, callback);
}
}
function getPositionsCallback(result) {
Ox.print('getPositionsCallback', result)
function getPositionsCallback(result, callback) {
Ox.print('getPositionsCallback', result);
var pos = 0;
if (result) {
$.extend(self, {
@ -588,12 +595,13 @@ Ox.List = function(options, self) {
});
pos = Ox.min(self.selected);
self.page = getPageByPosition(pos);
} else if (self.stayAtPosition) {
self.page = getPageByScrollPosition(self.stayAtPosition);
}
// that.scrollTop(0);
that.$content.empty();
//Ox.print('self.selected', self.selected, 'self.page', self.page);
loadPages(self.page, function() {
scrollToPosition(pos, true);
callback && callback();
});
}
@ -627,11 +635,15 @@ Ox.List = function(options, self) {
function getSelectedIds() {
//Ox.print('gSI', self.selected, self.$items)
return $.map(self.selected, function(pos) {
//Ox.print('....', pos, self.options.unique, self.$items[pos].options('data')[self.options.unique])
Ox.print('gsI', pos)
return self.$items[pos].options('data')[self.options.unique];
});
if (self.$items.length == 0) {
return self.options.selected;
} else {
return $.map(self.selected, function(pos) {
//Ox.print('....', pos, self.options.unique, self.$items[pos].options('data')[self.options.unique])
Ox.print('gsI', pos)
return self.$items[pos].options('data')[self.options.unique];
});
}
}
function getWidth() {
@ -891,9 +903,8 @@ Ox.List = function(options, self) {
}
function open() {
var ids = getSelectedIds();
ids.length && that.triggerEvent('open', {
ids: ids
self.options.selected.length && that.triggerEvent('open', {
ids: self.options.selected
});
}
@ -902,12 +913,11 @@ Ox.List = function(options, self) {
}
function preview() {
var ids = getSelectedIds();
if (ids.length) {
if (self.options.selected.length) {
self.preview = !self.preview;
if (self.preview) {
that.triggerEvent('openpreview', {
ids: getSelectedIds()
ids: self.options.selected
});
} else {
that.triggerEvent('closepreview');
@ -1135,10 +1145,9 @@ Ox.List = function(options, self) {
}
function triggerSelectEvent() {
ids = self.options.selected = getSelectedIds();
self.options.selected = ids;
var ids = self.options.selected = getSelectedIds();
setTimeout(function() {
var ids_ = getSelectedIds();
var ids_ = self.options.selected = getSelectedIds();
Ox.print('ids', ids, 'ids after 100 msec', ids_, Ox.isEqual(ids, ids_))
if (Ox.isEqual(ids, ids_)) {
that.triggerEvent('select', {
@ -1156,7 +1165,7 @@ Ox.List = function(options, self) {
function triggerToggleEvent(expanded) {
that.triggerEvent('toggle', {
expanded: expanded,
ids: getSelectedIds()
ids: self.options.selected
});
}
@ -1206,11 +1215,9 @@ Ox.List = function(options, self) {
});
}
function updateQuery(ids) { // fixme: shouldn't this be setQuery?
// ids are the selcected ids
// (in case list is loaded with selection)
function updateQuery(callback) { // fixme: shouldn't this be setQuery?
Ox.print('updateQuery', self.options)
clear();
clear(); // fixme: bad function name ... clear what?
self.requests.push(self.options.items({}, function(result) {
var keys = {};
Ox.print('INIT!!!', result.data)
@ -1235,7 +1242,7 @@ Ox.List = function(options, self) {
self.options.orientation == 'horizontal' ? 'width' : 'height',
self.listSize + 'px'
);
getPositions(ids);
getPositions(callback);
}));
}
@ -1435,8 +1442,15 @@ Ox.List = function(options, self) {
reloadList <f> reload list contents
() -> <f> returns List Element
@*/
that.reloadList = function() {
updateQuery();
that.reloadList = function(stayAtPosition) {
if (stayAtPosition) {
var scrollTop = that.scrollTop();
updateQuery(function() {
that.scrollTop(scrollTop);
});
} else {
updateQuery();
}
return that;
};

4
source/Ox.UI/js/List/Ox.TextList.js
View file

@ -785,8 +785,8 @@ Ox.TextList = function(options, self) {
return that;
};
that.reloadList = function() {
that.$body.reloadList();
that.reloadList = function(stayAtPosition) {
that.$body.reloadList(stayAtPosition);
return that;
};

2
source/Ox.UI/js/Map/Ox.ListMap.js
View file

@ -569,7 +569,7 @@ Ox.ListMap = function(options, self) {
self.$placeButton.options({title: 'Add Place'});
that.triggerEvent('removeplace', {id: self.selectedPlace});
if (self.isAsync) {
self.$list.options({selected: []}).reloadList();
self.$list.options({selected: []}).reloadList(true);
}
}