From 2d109d103e74e291d11c99df0d35c7a1f4def316 Mon Sep 17 00:00:00 2001 From: rolux Date: Fri, 31 Aug 2012 00:16:09 +0200 Subject: [PATCH] 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 --- source/Ox.UI/js/List/TableList.js | 84 +++++++++++++++++++++++++------ 1 file changed, 70 insertions(+), 14 deletions(-) diff --git a/source/Ox.UI/js/List/TableList.js b/source/Ox.UI/js/List/TableList.js index 7880e46e..687badd1 100644 --- a/source/Ox.UI/js/List/TableList.js +++ b/source/Ox.UI/js/List/TableList.js @@ -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 hasFocus @*/ @@ -953,21 +987,43 @@ Ox.TableList = function(options, self) { return that; }; + that.removeColumn = function(id) { + removeColumn(id); + }; + /*@ resizeColumn resizeColumn (id, width) -> 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 size @*/ that.size = function() { setWidth(); that.$body.size(); + return that; }; // fixme: deprecated