TableList: add option disableHorizontalScroll and public methods addColumn, removeColumn, getVisibleColumns, setVisibleColumns and getColumnWidth, and add setColumnWidth as alias for resizeColumn; return that from public size method
This commit is contained in:
parent
62a67e7b1f
commit
2d109d103e
1 changed files with 70 additions and 14 deletions
|
@ -60,6 +60,7 @@ Ox.TableList = function(options, self) {
|
|||
columnsResizable: false,
|
||||
columnsVisible: false,
|
||||
columnWidth: [40, 800],
|
||||
disableHorizontalScroll: false,
|
||||
draggable: false,
|
||||
id: '',
|
||||
items: null,
|
||||
|
@ -77,6 +78,11 @@ Ox.TableList = function(options, self) {
|
|||
})
|
||||
.options(options || {})
|
||||
.update({
|
||||
disableHorizontalScroll: function() {
|
||||
self.options.disableHorizontalScroll
|
||||
? disableHorizontalScroll()
|
||||
: enableHorizontalScroll();
|
||||
},
|
||||
items: function() {
|
||||
that.$body.options({items: self.options.items});
|
||||
},
|
||||
|
@ -94,19 +100,11 @@ Ox.TableList = function(options, self) {
|
|||
that.$body.options({sort: self.options.sort});
|
||||
}
|
||||
})
|
||||
.addClass('OxTableList')
|
||||
.bindEvent({
|
||||
key_left: function() {
|
||||
var $element = that.$body.$element,
|
||||
scrollLeft = $element[0].scrollLeft - $element.width();
|
||||
$element.animate({scrollLeft: scrollLeft}, 250);
|
||||
},
|
||||
key_right: function() {
|
||||
var $element = that.$body.$element,
|
||||
scrollLeft = $element[0].scrollLeft + $element.width();
|
||||
$element.animate({scrollLeft: scrollLeft}, 250);
|
||||
}
|
||||
});
|
||||
.addClass('OxTableList');
|
||||
|
||||
if (!self.options.disableHorizontalScroll) {
|
||||
enableHorizontalScroll();
|
||||
}
|
||||
|
||||
self.options.columns.forEach(function(column) { // fixme: can this go into a generic ox.js function?
|
||||
// fixme: and can't these just remain undefined?
|
||||
|
@ -495,6 +493,11 @@ Ox.TableList = function(options, self) {
|
|||
return $item;
|
||||
}
|
||||
|
||||
function disableHorizontalScroll() {
|
||||
// fixme: is there a way to pass an array?
|
||||
that.unbindEvent('key_left').unbindEvent('key_right');
|
||||
}
|
||||
|
||||
function dragstartColumn(id, e) {
|
||||
self.drag = {
|
||||
columnOffsets: getColumnOffsets(),
|
||||
|
@ -596,6 +599,21 @@ Ox.TableList = function(options, self) {
|
|||
});
|
||||
}
|
||||
|
||||
function enableHorizontalScroll() {
|
||||
that.bindEvent({
|
||||
key_left: function () {
|
||||
var $element = that.$body.$element,
|
||||
scrollLeft = $element[0].scrollLeft - $element.width();
|
||||
$element.animate({scrollLeft: scrollLeft}, 250);
|
||||
},
|
||||
key_right: function() {
|
||||
var $element = that.$body.$element,
|
||||
scrollLeft = $element[0].scrollLeft + $element.width();
|
||||
$element.animate({scrollLeft: scrollLeft}, 250);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
function formatValue(key, value, data) {
|
||||
// fixme: this may be obscure...
|
||||
// since the format of a value may depend on another value,
|
||||
|
@ -832,6 +850,10 @@ Ox.TableList = function(options, self) {
|
|||
}
|
||||
}
|
||||
|
||||
that.addColumn = function(id) {
|
||||
addColumn(id);
|
||||
};
|
||||
|
||||
that.addItem = function(item) {
|
||||
/*
|
||||
self.options.items.push(item);
|
||||
|
@ -912,6 +934,18 @@ Ox.TableList = function(options, self) {
|
|||
return that;
|
||||
};
|
||||
|
||||
that.getColumnWidth = function(id) {
|
||||
var pos = getColumnPositionById(id);
|
||||
return self.columnWidths[pos];
|
||||
};
|
||||
|
||||
// FIXME: needed?
|
||||
that.getVisibleColumns = function() {
|
||||
return self.visibleColumns.map(function(column) {
|
||||
return column.id;
|
||||
});
|
||||
};
|
||||
|
||||
/*@
|
||||
hasFocus <f> hasFocus
|
||||
@*/
|
||||
|
@ -953,21 +987,43 @@ Ox.TableList = function(options, self) {
|
|||
return that;
|
||||
};
|
||||
|
||||
that.removeColumn = function(id) {
|
||||
removeColumn(id);
|
||||
};
|
||||
|
||||
/*@
|
||||
resizeColumn <f> resizeColumn
|
||||
(id, width) -> <o> resize column id to width
|
||||
@*/
|
||||
that.resizeColumn = function(id, width) {
|
||||
that.setColumnWidth = that.resizeColumn = function(id, width) {
|
||||
resizeColumn(id, width);
|
||||
return that;
|
||||
};
|
||||
|
||||
// FIXME: needed?
|
||||
that.setVisibleColumns = function(ids) {
|
||||
Ox.forEach(ids, function(id) {
|
||||
var index = getColumnIndexById(id);
|
||||
if (!self.options.columns[index].visible) {
|
||||
addColumn(id);
|
||||
}
|
||||
});
|
||||
Ox.forEach(self.visibleColumns, function(column) {
|
||||
if (ids.indexOf(column.id) == -1) {
|
||||
removeColumn(column.id);
|
||||
}
|
||||
});
|
||||
triggerColumnChangeEvent();
|
||||
return that;
|
||||
};
|
||||
|
||||
/*@
|
||||
size <f> size
|
||||
@*/
|
||||
that.size = function() {
|
||||
setWidth();
|
||||
that.$body.size();
|
||||
return that;
|
||||
};
|
||||
|
||||
// fixme: deprecated
|
||||
|
|
Loading…
Reference in a new issue