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

textlist improvements (keep selection after sort, make left/right arrows scroll left/right)

Browse source
This commit is contained in:
rolux 2011-05-24 15:44:02 +02:00
parent 32b2da184a
commit 187adae7e2
3 changed files with 64 additions and 17 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
source/Ox.UI/js/Form/Ox.Form.js
View file

@ -123,7 +123,7 @@ Ox.Form = function(options, self) {
} else {
Ox.forEach(arguments[0], function(value, key) {
var index = getItemIndexById(key);
index > -1 && Ox.print(':::::::', key, value)
//index > -1 && Ox.print(':::::::', key, value)
index > -1 && self.options.items[index].options({value: value});
});
return that;

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

@ -556,7 +556,7 @@ Ox.List = function(options, self) {
}
function getPositions(ids) {
Ox.print('getPositions', ids)
// Ox.print('getPositions', ids)
ids = ids || getSelectedIds();
Ox.print('getPositions', ids)
// fixme: optimize: send non-selected ids if more than half of the items are selected
@ -628,7 +628,7 @@ 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('....', pos, self.options.unique, self.$items[pos].options('data')[self.options.unique])
//Ox.print('2222', self.$items, pos)
return self.$items[pos].options('data')[self.options.unique];
});
@ -662,6 +662,7 @@ Ox.List = function(options, self) {
isSelected(pos) && self.$items[pos].addClass('OxSelected');
self.$items[pos].appendTo(that.$content);
});
self.selected.length && scrollToPosition(self.selected[0]);
}
function getPageLength(page) {
@ -1230,14 +1231,16 @@ Ox.List = function(options, self) {
function updateSort() {
Ox.print('start sort')
var key = self.options.sort[0].key,
operator = self.options.sort[0].operator,
map = self.options.sort[0].map,
operator = self.options.sort[0].operator,
selectedIds,
sort = {};
self.options.items.forEach(function(item) {
sort[item.id] = map ? map(item[key]) : item[key];
});
if (self.listLength > 1) {
if (Ox.isArray(self.options.items)) {
selectedIds = getSelectedIds();
self.options.items.forEach(function(item) {
sort[item.id] = map ? map(item[key]) : item[key];
});
self.options.items.sort(function(a, b) {
var aValue = sort[a.id],
bValue = sort[b.id],
@ -1249,6 +1252,14 @@ Ox.List = function(options, self) {
}
return ret;
});
if (selectedIds.length) {
self.selected = [];
self.options.items.forEach(function(item, i) {
if (selectedIds.indexOf(item.id) > -1) {
self.selected.push(i);
}
});
}
loadItems();
} else {
clear(); // fixme: bad function name

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

@ -58,7 +58,17 @@ Ox.TextList = function(options, self) {
sort: []
})
.options(options || {})
.addClass('OxTextList');
.addClass('OxTextList')
.bindEvent({
key_left: function() {
var $element = that.$body.$element;
$element[0].scrollLeft = $element[0].scrollLeft - $element.width();
},
key_right: function() {
var $element = that.$body.$element;
$element[0].scrollLeft = $element[0].scrollLeft + $element.width();
}
});
self.options.columns.forEach(function(v) { // fixme: can this go into a generic ox.js function?
// fixme: and can't these just remain undefined?
@ -254,15 +264,19 @@ Ox.TextList = function(options, self) {
Ox.print('clickColumn', id);
var i = getColumnIndexById(id),
isSelected = self.options.sort[0].key == self.options.columns[i].id;
that.$body.options({
sort: [{
key: self.options.columns[i].id,
operator: isSelected ?
(self.options.sort[0].operator == '+' ? '-' : '+') :
self.options.columns[i].operator,
map: self.options.columns[i].map
}]
});
self.options.sort = [{
key: self.options.columns[i].id,
operator: isSelected ?
(self.options.sort[0].operator == '+' ? '-' : '+') :
self.options.columns[i].operator,
map: self.options.columns[i].map
}]
updateColumn();
// fixme: strangely, sorting the list blocks updating the column,
// so we use a timeout for now
setTimeout(function() {
that.$body.options({sort: self.options.sort});
}, 10)
}
function constructHead() {
@ -622,6 +636,20 @@ Ox.TextList = function(options, self) {
});
}
function updateColumn() {
var columnId = self.options.columns[self.selectedColumn].id
isSelected = columnId == self.options.sort[0].key;
if (self.options.columnsVisible) {
if (isSelected) {
updateOrder(columnId);
} else {
toggleSelected(columnId);
self.selectedColumn = getColumnIndexById(self.options.sort[0].key);
toggleSelected(self.options.columns[self.selectedColumn].id);
}
}
}
function updateOrder(id) {
var pos = getColumnPositionById(id);
//Ox.print(id, pos)
@ -638,6 +666,9 @@ Ox.TextList = function(options, self) {
that.$body.options(key, value);
} else if (key == 'selected') {
that.$body.options(key, value);
} else if (key == 'sort') {
updateColumn();
that.$body.options(key, value);
}
};
@ -731,7 +762,9 @@ Ox.TextList = function(options, self) {
that.$body.size();
}
// fixme: deprecated
that.sortList = function(key, operator) {
Ox.print('$$$$ DEPRECATED $$$$')
var isSelected = key == self.options.sort[0].key;
self.options.sort = [{
key: key,
@ -750,11 +783,14 @@ Ox.TextList = function(options, self) {
// fixme: strangely, sorting the list blocks toggling the selection,
// so we use a timeout for now
setTimeout(function() {
that.$body.options({sort: self.options.sort});
/*
that.$body.sortList(
self.options.sort[0].key,
self.options.sort[0].operator,
self.options.sort[0].map
);
*/
}, 10);
return that;
};