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

@@ -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')
+            .addClass('OxTableList');
-            .bindEvent({
+    
-                key_left: function() {
+    if (!self.options.disableHorizontalScroll) {
-                    var $element = that.$body.$element,
+        enableHorizontalScroll();
-                        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);
-                }
-            });
 
     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