slickgrid added to third-party
authorThierry Parmentelat <thierry.parmentelat@inria.fr>
Fri, 29 Nov 2013 17:13:36 +0000 (18:13 +0100)
committerThierry Parmentelat <thierry.parmentelat@inria.fr>
Fri, 29 Nov 2013 17:13:36 +0000 (18:13 +0100)
23 files changed:
third-party/slickgrid-2.1/MIT-LICENSE.txt [new file with mode: 0644]
third-party/slickgrid-2.1/README.md [new file with mode: 0644]
third-party/slickgrid-2.1/README.myslice [new file with mode: 0644]
third-party/slickgrid-2.1/plugins/slick.autotooltips.js [new file with mode: 0644]
third-party/slickgrid-2.1/plugins/slick.cellcopymanager.js [new file with mode: 0644]
third-party/slickgrid-2.1/plugins/slick.cellrangedecorator.js [new file with mode: 0644]
third-party/slickgrid-2.1/plugins/slick.cellrangeselector.js [new file with mode: 0644]
third-party/slickgrid-2.1/plugins/slick.cellselectionmodel.js [new file with mode: 0644]
third-party/slickgrid-2.1/plugins/slick.checkboxselectcolumn.js [new file with mode: 0644]
third-party/slickgrid-2.1/plugins/slick.headerbuttons.css [new file with mode: 0644]
third-party/slickgrid-2.1/plugins/slick.headerbuttons.js [new file with mode: 0644]
third-party/slickgrid-2.1/plugins/slick.headermenu.css [new file with mode: 0644]
third-party/slickgrid-2.1/plugins/slick.headermenu.js [new file with mode: 0644]
third-party/slickgrid-2.1/plugins/slick.rowmovemanager.js [new file with mode: 0644]
third-party/slickgrid-2.1/plugins/slick.rowselectionmodel.js [new file with mode: 0644]
third-party/slickgrid-2.1/slick.core.js [new file with mode: 0644]
third-party/slickgrid-2.1/slick.dataview.js [new file with mode: 0644]
third-party/slickgrid-2.1/slick.editors.js [new file with mode: 0644]
third-party/slickgrid-2.1/slick.formatters.js [new file with mode: 0644]
third-party/slickgrid-2.1/slick.grid.css [new file with mode: 0644]
third-party/slickgrid-2.1/slick.grid.js [new file with mode: 0644]
third-party/slickgrid-2.1/slick.groupitemmetadataprovider.js [new file with mode: 0644]
third-party/slickgrid-2.1/slick.remotemodel.js [new file with mode: 0644]

diff --git a/third-party/slickgrid-2.1/MIT-LICENSE.txt b/third-party/slickgrid-2.1/MIT-LICENSE.txt
new file mode 100644 (file)
index 0000000..60f6542
--- /dev/null
@@ -0,0 +1,20 @@
+Copyright (c) 2010 Michael Leibman, http://github.com/mleibman/slickgrid
+
+Permission is hereby granted, free of charge, to any person obtaining
+a copy of this software and associated documentation files (the
+"Software"), to deal in the Software without restriction, including
+without limitation the rights to use, copy, modify, merge, publish,
+distribute, sublicense, and/or sell copies of the Software, and to
+permit persons to whom the Software is furnished to do so, subject to
+the following conditions:
+
+The above copyright notice and this permission notice shall be
+included in all copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
+EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF
+MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND
+NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE
+LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION
+OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION
+WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
\ No newline at end of file
diff --git a/third-party/slickgrid-2.1/README.md b/third-party/slickgrid-2.1/README.md
new file mode 100644 (file)
index 0000000..7994a27
--- /dev/null
@@ -0,0 +1,22 @@
+# Welcome to SlickGrid
+
+Find documentation and examples in [the wiki](https://github.com/mleibman/SlickGrid/wiki).
+
+## SlickGrid is an advanced JavaScript grid/spreadsheet component
+
+Some highlights:
+
+* Adaptive virtual scrolling (handle hundreds of thousands of rows with extreme responsiveness)
+* Extremely fast rendering speed
+* Supports jQuery UI Themes
+* Background post-rendering for richer cells
+* Configurable & customizable
+* Full keyboard navigation
+* Column resize/reorder/show/hide
+* Column autosizing & force-fit
+* Pluggable cell formatters & editors
+* Support for editing and creating new rows.
+* Grouping, filtering, custom aggregators, and more!
+* Advanced detached & multi-field editors with undo/redo support.
+* “GlobalEditorLock” to manage concurrent edits in cases where multiple Views on a page can edit the same data.
+* Support for [millions of rows](http://stackoverflow.com/a/2569488/1269037)
diff --git a/third-party/slickgrid-2.1/README.myslice b/third-party/slickgrid-2.1/README.myslice
new file mode 100644 (file)
index 0000000..cd46603
--- /dev/null
@@ -0,0 +1,2 @@
+I'm adding parts of the slickgrid download manually
+so as to avoid any conflicts with the rest of our third-party stuff
diff --git a/third-party/slickgrid-2.1/plugins/slick.autotooltips.js b/third-party/slickgrid-2.1/plugins/slick.autotooltips.js
new file mode 100644 (file)
index 0000000..955684f
--- /dev/null
@@ -0,0 +1,83 @@
+(function ($) {
+  // Register namespace
+  $.extend(true, window, {
+    "Slick": {
+      "AutoTooltips": AutoTooltips
+    }
+  });
+
+  /**
+   * AutoTooltips plugin to show/hide tooltips when columns are too narrow to fit content.
+   * @constructor
+   * @param {boolean} [options.enableForCells=true]        - Enable tooltip for grid cells
+   * @param {boolean} [options.enableForHeaderCells=false] - Enable tooltip for header cells
+   * @param {number}  [options.maxToolTipLength=null]      - The maximum length for a tooltip
+   */
+  function AutoTooltips(options) {
+    var _grid;
+    var _self = this;
+    var _defaults = {
+      enableForCells: true,
+      enableForHeaderCells: false,
+      maxToolTipLength: null
+    };
+    
+    /**
+     * Initialize plugin.
+     */
+    function init(grid) {
+      options = $.extend(true, {}, _defaults, options);
+      _grid = grid;
+      if (options.enableForCells) _grid.onMouseEnter.subscribe(handleMouseEnter);
+      if (options.enableForHeaderCells) _grid.onHeaderMouseEnter.subscribe(handleHeaderMouseEnter);
+    }
+    
+    /**
+     * Destroy plugin.
+     */
+    function destroy() {
+      if (options.enableForCells) _grid.onMouseEnter.unsubscribe(handleMouseEnter);
+      if (options.enableForHeaderCells) _grid.onHeaderMouseEnter.unsubscribe(handleHeaderMouseEnter);
+    }
+    
+    /**
+     * Handle mouse entering grid cell to add/remove tooltip.
+     * @param {jQuery.Event} e - The event
+     */
+    function handleMouseEnter(e) {
+      var cell = _grid.getCellFromEvent(e);
+      if (cell) {
+        var $node = $(_grid.getCellNode(cell.row, cell.cell));
+        var text;
+        if ($node.innerWidth() < $node[0].scrollWidth) {
+          text = $.trim($node.text());
+          if (options.maxToolTipLength && text.length > options.maxToolTipLength) {
+            text = text.substr(0, options.maxToolTipLength - 3) + "...";
+          }
+        } else {
+          text = "";
+        }
+        $node.attr("title", text);
+      }
+    }
+    
+    /**
+     * Handle mouse entering header cell to add/remove tooltip.
+     * @param {jQuery.Event} e     - The event
+     * @param {object} args.column - The column definition
+     */
+    function handleHeaderMouseEnter(e, args) {
+      var column = args.column,
+          $node = $(e.target).closest(".slick-header-column");
+      if (!column.toolTip) {
+        $node.attr("title", ($node.innerWidth() < $node[0].scrollWidth) ? column.name : "");
+      }
+    }
+    
+    // Public API
+    $.extend(this, {
+      "init": init,
+      "destroy": destroy
+    });
+  }
+})(jQuery);
\ No newline at end of file
diff --git a/third-party/slickgrid-2.1/plugins/slick.cellcopymanager.js b/third-party/slickgrid-2.1/plugins/slick.cellcopymanager.js
new file mode 100644 (file)
index 0000000..c74018d
--- /dev/null
@@ -0,0 +1,86 @@
+(function ($) {
+  // register namespace
+  $.extend(true, window, {
+    "Slick": {
+      "CellCopyManager": CellCopyManager
+    }
+  });
+
+
+  function CellCopyManager() {
+    var _grid;
+    var _self = this;
+    var _copiedRanges;
+
+    function init(grid) {
+      _grid = grid;
+      _grid.onKeyDown.subscribe(handleKeyDown);
+    }
+
+    function destroy() {
+      _grid.onKeyDown.unsubscribe(handleKeyDown);
+    }
+
+    function handleKeyDown(e, args) {
+      var ranges;
+      if (!_grid.getEditorLock().isActive()) {
+        if (e.which == $.ui.keyCode.ESCAPE) {
+          if (_copiedRanges) {
+            e.preventDefault();
+            clearCopySelection();
+            _self.onCopyCancelled.notify({ranges: _copiedRanges});
+            _copiedRanges = null;
+          }
+        }
+
+        if (e.which == 67 && (e.ctrlKey || e.metaKey)) {
+          ranges = _grid.getSelectionModel().getSelectedRanges();
+          if (ranges.length != 0) {
+            e.preventDefault();
+            _copiedRanges = ranges;
+            markCopySelection(ranges);
+            _self.onCopyCells.notify({ranges: ranges});
+          }
+        }
+
+        if (e.which == 86 && (e.ctrlKey || e.metaKey)) {
+          if (_copiedRanges) {
+            e.preventDefault();
+            clearCopySelection();
+            ranges = _grid.getSelectionModel().getSelectedRanges();
+            _self.onPasteCells.notify({from: _copiedRanges, to: ranges});
+            _copiedRanges = null;
+          }
+        }
+      }
+    }
+
+    function markCopySelection(ranges) {
+      var columns = _grid.getColumns();
+      var hash = {};
+      for (var i = 0; i < ranges.length; i++) {
+        for (var j = ranges[i].fromRow; j <= ranges[i].toRow; j++) {
+          hash[j] = {};
+          for (var k = ranges[i].fromCell; k <= ranges[i].toCell; k++) {
+            hash[j][columns[k].id] = "copied";
+          }
+        }
+      }
+      _grid.setCellCssStyles("copy-manager", hash);
+    }
+
+    function clearCopySelection() {
+      _grid.removeCellCssStyles("copy-manager");
+    }
+
+    $.extend(this, {
+      "init": init,
+      "destroy": destroy,
+      "clearCopySelection": clearCopySelection,
+
+      "onCopyCells": new Slick.Event(),
+      "onCopyCancelled": new Slick.Event(),
+      "onPasteCells": new Slick.Event()
+    });
+  }
+})(jQuery);
\ No newline at end of file
diff --git a/third-party/slickgrid-2.1/plugins/slick.cellrangedecorator.js b/third-party/slickgrid-2.1/plugins/slick.cellrangedecorator.js
new file mode 100644 (file)
index 0000000..a511a59
--- /dev/null
@@ -0,0 +1,64 @@
+(function ($) {
+  // register namespace
+  $.extend(true, window, {
+    "Slick": {
+      "CellRangeDecorator": CellRangeDecorator
+    }
+  });
+
+  /***
+   * Displays an overlay on top of a given cell range.
+   *
+   * TODO:
+   * Currently, it blocks mouse events to DOM nodes behind it.
+   * Use FF and WebKit-specific "pointer-events" CSS style, or some kind of event forwarding.
+   * Could also construct the borders separately using 4 individual DIVs.
+   *
+   * @param {Grid} grid
+   * @param {Object} options
+   */
+  function CellRangeDecorator(grid, options) {
+    var _elem;
+    var _defaults = {
+      selectionCss: {
+        "zIndex": "9999",
+        "border": "2px dashed red"
+      }
+    };
+
+    options = $.extend(true, {}, _defaults, options);
+
+
+    function show(range) {
+      if (!_elem) {
+        _elem = $("<div></div>", {css: options.selectionCss})
+            .css("position", "absolute")
+            .appendTo(grid.getCanvasNode());
+      }
+
+      var from = grid.getCellNodeBox(range.fromRow, range.fromCell);
+      var to = grid.getCellNodeBox(range.toRow, range.toCell);
+
+      _elem.css({
+        top: from.top - 1,
+        left: from.left - 1,
+        height: to.bottom - from.top - 2,
+        width: to.right - from.left - 2
+      });
+
+      return _elem;
+    }
+
+    function hide() {
+      if (_elem) {
+        _elem.remove();
+        _elem = null;
+      }
+    }
+
+    $.extend(this, {
+      "show": show,
+      "hide": hide
+    });
+  }
+})(jQuery);
\ No newline at end of file
diff --git a/third-party/slickgrid-2.1/plugins/slick.cellrangeselector.js b/third-party/slickgrid-2.1/plugins/slick.cellrangeselector.js
new file mode 100644 (file)
index 0000000..520b17f
--- /dev/null
@@ -0,0 +1,113 @@
+(function ($) {
+  // register namespace
+  $.extend(true, window, {
+    "Slick": {
+      "CellRangeSelector": CellRangeSelector
+    }
+  });
+
+
+  function CellRangeSelector(options) {
+    var _grid;
+    var _canvas;
+    var _dragging;
+    var _decorator;
+    var _self = this;
+    var _handler = new Slick.EventHandler();
+    var _defaults = {
+      selectionCss: {
+        "border": "2px dashed blue"
+      }
+    };
+
+
+    function init(grid) {
+      options = $.extend(true, {}, _defaults, options);
+      _decorator = new Slick.CellRangeDecorator(grid, options);
+      _grid = grid;
+      _canvas = _grid.getCanvasNode();
+      _handler
+        .subscribe(_grid.onDragInit, handleDragInit)
+        .subscribe(_grid.onDragStart, handleDragStart)
+        .subscribe(_grid.onDrag, handleDrag)
+        .subscribe(_grid.onDragEnd, handleDragEnd);
+    }
+
+    function destroy() {
+      _handler.unsubscribeAll();
+    }
+
+    function handleDragInit(e, dd) {
+      // prevent the grid from cancelling drag'n'drop by default
+      e.stopImmediatePropagation();
+    }
+
+    function handleDragStart(e, dd) {
+      var cell = _grid.getCellFromEvent(e);
+      if (_self.onBeforeCellRangeSelected.notify(cell) !== false) {
+        if (_grid.canCellBeSelected(cell.row, cell.cell)) {
+          _dragging = true;
+          e.stopImmediatePropagation();
+        }
+      }
+      if (!_dragging) {
+        return;
+      }
+
+      _grid.focus();
+
+      var start = _grid.getCellFromPoint(
+          dd.startX - $(_canvas).offset().left,
+          dd.startY - $(_canvas).offset().top);
+
+      dd.range = {start: start, end: {}};
+
+      return _decorator.show(new Slick.Range(start.row, start.cell));
+    }
+
+    function handleDrag(e, dd) {
+      if (!_dragging) {
+        return;
+      }
+      e.stopImmediatePropagation();
+
+      var end = _grid.getCellFromPoint(
+          e.pageX - $(_canvas).offset().left,
+          e.pageY - $(_canvas).offset().top);
+
+      if (!_grid.canCellBeSelected(end.row, end.cell)) {
+        return;
+      }
+
+      dd.range.end = end;
+      _decorator.show(new Slick.Range(dd.range.start.row, dd.range.start.cell, end.row, end.cell));
+    }
+
+    function handleDragEnd(e, dd) {
+      if (!_dragging) {
+        return;
+      }
+
+      _dragging = false;
+      e.stopImmediatePropagation();
+
+      _decorator.hide();
+      _self.onCellRangeSelected.notify({
+        range: new Slick.Range(
+            dd.range.start.row,
+            dd.range.start.cell,
+            dd.range.end.row,
+            dd.range.end.cell
+        )
+      });
+    }
+
+    $.extend(this, {
+      "init": init,
+      "destroy": destroy,
+
+      "onBeforeCellRangeSelected": new Slick.Event(),
+      "onCellRangeSelected": new Slick.Event()
+    });
+  }
+})(jQuery);
\ No newline at end of file
diff --git a/third-party/slickgrid-2.1/plugins/slick.cellselectionmodel.js b/third-party/slickgrid-2.1/plugins/slick.cellselectionmodel.js
new file mode 100644 (file)
index 0000000..74bc3eb
--- /dev/null
@@ -0,0 +1,154 @@
+(function ($) {
+  // register namespace
+  $.extend(true, window, {
+    "Slick": {
+      "CellSelectionModel": CellSelectionModel
+    }
+  });
+
+
+  function CellSelectionModel(options) {
+    var _grid;
+    var _canvas;
+    var _ranges = [];
+    var _self = this;
+    var _selector = new Slick.CellRangeSelector({
+      "selectionCss": {
+        "border": "2px solid black"
+      }
+    });
+    var _options;
+    var _defaults = {
+      selectActiveCell: true
+    };
+
+
+    function init(grid) {
+      _options = $.extend(true, {}, _defaults, options);
+      _grid = grid;
+      _canvas = _grid.getCanvasNode();
+      _grid.onActiveCellChanged.subscribe(handleActiveCellChange);
+      _grid.onKeyDown.subscribe(handleKeyDown);
+      grid.registerPlugin(_selector);
+      _selector.onCellRangeSelected.subscribe(handleCellRangeSelected);
+      _selector.onBeforeCellRangeSelected.subscribe(handleBeforeCellRangeSelected);
+    }
+
+    function destroy() {
+      _grid.onActiveCellChanged.unsubscribe(handleActiveCellChange);
+      _grid.onKeyDown.unsubscribe(handleKeyDown);
+      _selector.onCellRangeSelected.unsubscribe(handleCellRangeSelected);
+      _selector.onBeforeCellRangeSelected.unsubscribe(handleBeforeCellRangeSelected);
+      _grid.unregisterPlugin(_selector);
+    }
+
+    function removeInvalidRanges(ranges) {
+      var result = [];
+
+      for (var i = 0; i < ranges.length; i++) {
+        var r = ranges[i];
+        if (_grid.canCellBeSelected(r.fromRow, r.fromCell) && _grid.canCellBeSelected(r.toRow, r.toCell)) {
+          result.push(r);
+        }
+      }
+
+      return result;
+    }
+
+    function setSelectedRanges(ranges) {
+      _ranges = removeInvalidRanges(ranges);
+      _self.onSelectedRangesChanged.notify(_ranges);
+    }
+
+    function getSelectedRanges() {
+      return _ranges;
+    }
+
+    function handleBeforeCellRangeSelected(e, args) {
+      if (_grid.getEditorLock().isActive()) {
+        e.stopPropagation();
+        return false;
+      }
+    }
+
+    function handleCellRangeSelected(e, args) {
+      setSelectedRanges([args.range]);
+    }
+
+    function handleActiveCellChange(e, args) {
+      if (_options.selectActiveCell && args.row != null && args.cell != null) {
+        setSelectedRanges([new Slick.Range(args.row, args.cell)]);
+      }
+    }
+    
+    function handleKeyDown(e) {
+      /***
+       * Кey codes
+       * 37 left
+       * 38 up
+       * 39 right
+       * 40 down                     
+       */                                         
+      var ranges, last;
+      var active = _grid.getActiveCell(); 
+
+      if ( active && e.shiftKey && !e.ctrlKey && !e.altKey && 
+          (e.which == 37 || e.which == 39 || e.which == 38 || e.which == 40) ) {
+      
+        ranges = getSelectedRanges();
+        if (!ranges.length)
+         ranges.push(new Slick.Range(active.row, active.cell));
+         
+        // keyboard can work with last range only          
+        last = ranges.pop();
+        
+        // can't handle selection out of active cell
+        if (!last.contains(active.row, active.cell))
+          last = new Slick.Range(active.row, active.cell);
+        
+        var dRow = last.toRow - last.fromRow,
+            dCell = last.toCell - last.fromCell,
+            // walking direction
+            dirRow = active.row == last.fromRow ? 1 : -1,
+            dirCell = active.cell == last.fromCell ? 1 : -1;
+                 
+        if (e.which == 37) {
+          dCell -= dirCell; 
+        } else if (e.which == 39) {
+          dCell += dirCell ; 
+        } else if (e.which == 38) {
+          dRow -= dirRow; 
+        } else if (e.which == 40) {
+          dRow += dirRow; 
+        }
+        
+        // define new selection range 
+        var new_last = new Slick.Range(active.row, active.cell, active.row + dirRow*dRow, active.cell + dirCell*dCell);
+        if (removeInvalidRanges([new_last]).length) {
+          ranges.push(new_last);
+          var viewRow = dirRow > 0 ? new_last.toRow : new_last.fromRow;
+          var viewCell = dirCell > 0 ? new_last.toCell : new_last.fromCell;
+         _grid.scrollRowIntoView(viewRow);
+         _grid.scrollCellIntoView(viewRow, viewCell);
+        }
+        else 
+          ranges.push(last);
+
+        setSelectedRanges(ranges);  
+       
+        e.preventDefault();
+        e.stopPropagation();        
+      }           
+    }
+
+    $.extend(this, {
+      "getSelectedRanges": getSelectedRanges,
+      "setSelectedRanges": setSelectedRanges,
+
+      "init": init,
+      "destroy": destroy,
+
+      "onSelectedRangesChanged": new Slick.Event()
+    });
+  }
+})(jQuery);
diff --git a/third-party/slickgrid-2.1/plugins/slick.checkboxselectcolumn.js b/third-party/slickgrid-2.1/plugins/slick.checkboxselectcolumn.js
new file mode 100644 (file)
index 0000000..83d8d50
--- /dev/null
@@ -0,0 +1,153 @@
+(function ($) {
+  // register namespace
+  $.extend(true, window, {
+    "Slick": {
+      "CheckboxSelectColumn": CheckboxSelectColumn
+    }
+  });
+
+
+  function CheckboxSelectColumn(options) {
+    var _grid;
+    var _self = this;
+    var _handler = new Slick.EventHandler();
+    var _selectedRowsLookup = {};
+    var _defaults = {
+      columnId: "_checkbox_selector",
+      cssClass: null,
+      toolTip: "Select/Deselect All",
+      width: 30
+    };
+
+    var _options = $.extend(true, {}, _defaults, options);
+
+    function init(grid) {
+      _grid = grid;
+      _handler
+        .subscribe(_grid.onSelectedRowsChanged, handleSelectedRowsChanged)
+        .subscribe(_grid.onClick, handleClick)
+        .subscribe(_grid.onHeaderClick, handleHeaderClick)
+        .subscribe(_grid.onKeyDown, handleKeyDown);
+    }
+
+    function destroy() {
+      _handler.unsubscribeAll();
+    }
+
+    function handleSelectedRowsChanged(e, args) {
+      var selectedRows = _grid.getSelectedRows();
+      var lookup = {}, row, i;
+      for (i = 0; i < selectedRows.length; i++) {
+        row = selectedRows[i];
+        lookup[row] = true;
+        if (lookup[row] !== _selectedRowsLookup[row]) {
+          _grid.invalidateRow(row);
+          delete _selectedRowsLookup[row];
+        }
+      }
+      for (i in _selectedRowsLookup) {
+        _grid.invalidateRow(i);
+      }
+      _selectedRowsLookup = lookup;
+      _grid.render();
+
+      if (selectedRows.length && selectedRows.length == _grid.getDataLength()) {
+        _grid.updateColumnHeader(_options.columnId, "<input type='checkbox' checked='checked'>", _options.toolTip);
+      } else {
+        _grid.updateColumnHeader(_options.columnId, "<input type='checkbox'>", _options.toolTip);
+      }
+    }
+
+    function handleKeyDown(e, args) {
+      if (e.which == 32) {
+        if (_grid.getColumns()[args.cell].id === _options.columnId) {
+          // if editing, try to commit
+          if (!_grid.getEditorLock().isActive() || _grid.getEditorLock().commitCurrentEdit()) {
+            toggleRowSelection(args.row);
+          }
+          e.preventDefault();
+          e.stopImmediatePropagation();
+        }
+      }
+    }
+
+    function handleClick(e, args) {
+      // clicking on a row select checkbox
+      if (_grid.getColumns()[args.cell].id === _options.columnId && $(e.target).is(":checkbox")) {
+        // if editing, try to commit
+        if (_grid.getEditorLock().isActive() && !_grid.getEditorLock().commitCurrentEdit()) {
+          e.preventDefault();
+          e.stopImmediatePropagation();
+          return;
+        }
+
+        toggleRowSelection(args.row);
+        e.stopPropagation();
+        e.stopImmediatePropagation();
+      }
+    }
+
+    function toggleRowSelection(row) {
+      if (_selectedRowsLookup[row]) {
+        _grid.setSelectedRows($.grep(_grid.getSelectedRows(), function (n) {
+          return n != row
+        }));
+      } else {
+        _grid.setSelectedRows(_grid.getSelectedRows().concat(row));
+      }
+    }
+
+    function handleHeaderClick(e, args) {
+      if (args.column.id == _options.columnId && $(e.target).is(":checkbox")) {
+        // if editing, try to commit
+        if (_grid.getEditorLock().isActive() && !_grid.getEditorLock().commitCurrentEdit()) {
+          e.preventDefault();
+          e.stopImmediatePropagation();
+          return;
+        }
+
+        if ($(e.target).is(":checked")) {
+          var rows = [];
+          for (var i = 0; i < _grid.getDataLength(); i++) {
+            rows.push(i);
+          }
+          _grid.setSelectedRows(rows);
+        } else {
+          _grid.setSelectedRows([]);
+        }
+        e.stopPropagation();
+        e.stopImmediatePropagation();
+      }
+    }
+
+    function getColumnDefinition() {
+      return {
+        id: _options.columnId,
+        name: "<input type='checkbox'>",
+        toolTip: _options.toolTip,
+        field: "sel",
+        width: _options.width,
+        resizable: false,
+        sortable: false,
+        cssClass: _options.cssClass,
+        formatter: checkboxSelectionFormatter
+      };
+    }
+
+    function checkboxSelectionFormatter(row, cell, value, columnDef, dataContext) {
+      if (dataContext) {
+        return _selectedRowsLookup[row]
+            ? "<input type='checkbox' checked='checked'>"
+            : "<input type='checkbox'>";
+      }
+      return null;
+    }
+
+    $.extend(this, {
+      "init": init,
+      "destroy": destroy,
+
+      "getColumnDefinition": getColumnDefinition
+    });
+  }
+})(jQuery);
\ No newline at end of file
diff --git a/third-party/slickgrid-2.1/plugins/slick.headerbuttons.css b/third-party/slickgrid-2.1/plugins/slick.headerbuttons.css
new file mode 100644 (file)
index 0000000..0ba79ea
--- /dev/null
@@ -0,0 +1,39 @@
+.slick-column-name,
+.slick-sort-indicator {
+  /**
+   * This makes all "float:right" elements after it that spill over to the next line
+   * display way below the lower boundary of the column thus hiding them.
+   */
+  display: inline-block;
+  float: left;
+  margin-bottom: 100px;
+}
+
+.slick-header-button {
+  display: inline-block;
+  float: right;
+  vertical-align: top;
+  margin: 1px;
+  /**
+  * This makes all "float:right" elements after it that spill over to the next line
+  * display way below the lower boundary of the column thus hiding them.
+  */
+  margin-bottom: 100px;
+  height: 15px;
+  width: 15px;
+  background-repeat: no-repeat;
+  background-position: center center;
+  cursor: pointer;
+}
+
+.slick-header-button-hidden {
+  width: 0;
+
+  -webkit-transition: 0.2s width;
+  -ms-transition: 0.2s width;
+  transition: 0.2s width;
+}
+
+.slick-header-column:hover > .slick-header-button {
+  width: 15px;
+}
\ No newline at end of file
diff --git a/third-party/slickgrid-2.1/plugins/slick.headerbuttons.js b/third-party/slickgrid-2.1/plugins/slick.headerbuttons.js
new file mode 100644 (file)
index 0000000..8e61273
--- /dev/null
@@ -0,0 +1,177 @@
+(function ($) {
+  // register namespace
+  $.extend(true, window, {
+    "Slick": {
+      "Plugins": {
+        "HeaderButtons": HeaderButtons
+      }
+    }
+  });
+
+
+  /***
+   * A plugin to add custom buttons to column headers.
+   *
+   * USAGE:
+   *
+   * Add the plugin .js & .css files and register it with the grid.
+   *
+   * To specify a custom button in a column header, extend the column definition like so:
+   *
+   *   var columns = [
+   *     {
+   *       id: 'myColumn',
+   *       name: 'My column',
+   *
+   *       // This is the relevant part
+   *       header: {
+   *          buttons: [
+   *              {
+   *                // button options
+   *              },
+   *              {
+   *                // button options
+   *              }
+   *          ]
+   *       }
+   *     }
+   *   ];
+   *
+   * Available button options:
+   *    cssClass:     CSS class to add to the button.
+   *    image:        Relative button image path.
+   *    tooltip:      Button tooltip.
+   *    showOnHover:  Only show the button on hover.
+   *    handler:      Button click handler.
+   *    command:      A command identifier to be passed to the onCommand event handlers.
+   *
+   * The plugin exposes the following events:
+   *    onCommand:    Fired on button click for buttons with 'command' specified.
+   *        Event args:
+   *            grid:     Reference to the grid.
+   *            column:   Column definition.
+   *            command:  Button command identified.
+   *            button:   Button options.  Note that you can change the button options in your
+   *                      event handler, and the column header will be automatically updated to
+   *                      reflect them.  This is useful if you want to implement something like a
+   *                      toggle button.
+   *
+   *
+   * @param options {Object} Options:
+   *    buttonCssClass:   a CSS class to use for buttons (default 'slick-header-button')
+   * @class Slick.Plugins.HeaderButtons
+   * @constructor
+   */
+  function HeaderButtons(options) {
+    var _grid;
+    var _self = this;
+    var _handler = new Slick.EventHandler();
+    var _defaults = {
+      buttonCssClass: "slick-header-button"
+    };
+
+
+    function init(grid) {
+      options = $.extend(true, {}, _defaults, options);
+      _grid = grid;
+      _handler
+        .subscribe(_grid.onHeaderCellRendered, handleHeaderCellRendered)
+        .subscribe(_grid.onBeforeHeaderCellDestroy, handleBeforeHeaderCellDestroy);
+
+      // Force the grid to re-render the header now that the events are hooked up.
+      _grid.setColumns(_grid.getColumns());
+    }
+
+
+    function destroy() {
+      _handler.unsubscribeAll();
+    }
+
+
+    function handleHeaderCellRendered(e, args) {
+      var column = args.column;
+
+      if (column.header && column.header.buttons) {
+        // Append buttons in reverse order since they are floated to the right.
+        var i = column.header.buttons.length;
+        while (i--) {
+          var button = column.header.buttons[i];
+          var btn = $("<div></div>")
+            .addClass(options.buttonCssClass)
+            .data("column", column)
+            .data("button", button);
+
+          if (button.showOnHover) {
+            btn.addClass("slick-header-button-hidden");
+          }
+
+          if (button.image) {
+            btn.css("backgroundImage", "url(" + button.image + ")");
+          }
+
+          if (button.cssClass) {
+            btn.addClass(button.cssClass);
+          }
+
+          if (button.tooltip) {
+            btn.attr("title", button.tooltip);
+          }
+
+          if (button.command) {
+            btn.data("command", button.command);
+          }
+
+          if (button.handler) {
+            btn.bind("click", button.handler);
+          }
+
+          btn
+            .bind("click", handleButtonClick)
+            .appendTo(args.node);
+        }
+      }
+    }
+
+
+    function handleBeforeHeaderCellDestroy(e, args) {
+      var column = args.column;
+
+      if (column.header && column.header.buttons) {
+        // Removing buttons via jQuery will also clean up any event handlers and data.
+        // NOTE: If you attach event handlers directly or using a different framework,
+        //       you must also clean them up here to avoid memory leaks.
+        $(args.node).find("." + options.buttonCssClass).remove();
+      }
+    }
+
+
+    function handleButtonClick(e) {
+      var command = $(this).data("command");
+      var columnDef = $(this).data("column");
+      var button = $(this).data("button");
+
+      if (command != null) {
+        _self.onCommand.notify({
+            "grid": _grid,
+            "column": columnDef,
+            "command": command,
+            "button": button
+          }, e, _self);
+
+        // Update the header in case the user updated the button definition in the handler.
+        _grid.updateColumnHeader(columnDef.id);
+      }
+
+      // Stop propagation so that it doesn't register as a header click event.
+      e.preventDefault();
+      e.stopPropagation();
+    }
+
+    $.extend(this, {
+      "init": init,
+      "destroy": destroy,
+
+      "onCommand": new Slick.Event()
+    });
+  }
+})(jQuery);
\ No newline at end of file
diff --git a/third-party/slickgrid-2.1/plugins/slick.headermenu.css b/third-party/slickgrid-2.1/plugins/slick.headermenu.css
new file mode 100644 (file)
index 0000000..8b0b6a9
--- /dev/null
@@ -0,0 +1,59 @@
+/* Menu button */
+.slick-header-menubutton {
+  position: absolute;
+  right: 0;
+  top: 0;
+  bottom: 0;
+  width: 14px;
+  background-repeat: no-repeat;
+  background-position: left center;
+  background-image: url(../images/down.gif);
+  cursor: pointer;
+
+  display: none;
+  border-left: thin ridge silver;
+}
+
+.slick-header-column:hover > .slick-header-menubutton,
+.slick-header-column-active .slick-header-menubutton {
+  display: inline-block;
+}
+
+/* Menu */
+.slick-header-menu {
+  position: absolute;
+  display: inline-block;
+  margin: 0;
+  padding: 2px;
+  cursor: default;
+}
+
+
+/* Menu items */
+.slick-header-menuitem {
+  list-style: none;
+  margin: 0;
+  padding: 0;
+  cursor: pointer;
+}
+
+.slick-header-menuicon {
+  display: inline-block;
+  width: 16px;
+  height: 16px;
+  vertical-align: middle;
+  margin-right: 4px;
+  background-repeat: no-repeat;
+  background-position: center center;
+}
+
+.slick-header-menucontent {
+  display: inline-block;
+  vertical-align: middle;
+}
+
+
+/* Disabled */
+.slick-header-menuitem-disabled {
+  color: silver;
+}
diff --git a/third-party/slickgrid-2.1/plugins/slick.headermenu.js b/third-party/slickgrid-2.1/plugins/slick.headermenu.js
new file mode 100644 (file)
index 0000000..ec8244d
--- /dev/null
@@ -0,0 +1,275 @@
+(function ($) {
+  // register namespace
+  $.extend(true, window, {
+    "Slick": {
+      "Plugins": {
+        "HeaderMenu": HeaderMenu
+      }
+    }
+  });
+
+
+  /***
+   * A plugin to add drop-down menus to column headers.
+   *
+   * USAGE:
+   *
+   * Add the plugin .js & .css files and register it with the grid.
+   *
+   * To specify a menu in a column header, extend the column definition like so:
+   *
+   *   var columns = [
+   *     {
+   *       id: 'myColumn',
+   *       name: 'My column',
+   *
+   *       // This is the relevant part
+   *       header: {
+   *          menu: {
+   *              items: [
+   *                {
+   *                  // menu item options
+   *                },
+   *                {
+   *                  // menu item options
+   *                }
+   *              ]
+   *          }
+   *       }
+   *     }
+   *   ];
+   *
+   *
+   * Available menu options:
+   *    tooltip:      Menu button tooltip.
+   *
+   *
+   * Available menu item options:
+   *    title:        Menu item text.
+   *    disabled:     Whether the item is disabled.
+   *    tooltip:      Item tooltip.
+   *    command:      A command identifier to be passed to the onCommand event handlers.
+   *    iconCssClass: A CSS class to be added to the menu item icon.
+   *    iconImage:    A url to the icon image.
+   *
+   *
+   * The plugin exposes the following events:
+   *    onBeforeMenuShow:   Fired before the menu is shown.  You can customize the menu or dismiss it by returning false.
+   *        Event args:
+   *            grid:     Reference to the grid.
+   *            column:   Column definition.
+   *            menu:     Menu options.  Note that you can change the menu items here.
+   *
+   *    onCommand:    Fired on menu item click for buttons with 'command' specified.
+   *        Event args:
+   *            grid:     Reference to the grid.
+   *            column:   Column definition.
+   *            command:  Button command identified.
+   *            button:   Button options.  Note that you can change the button options in your
+   *                      event handler, and the column header will be automatically updated to
+   *                      reflect them.  This is useful if you want to implement something like a
+   *                      toggle button.
+   *
+   *
+   * @param options {Object} Options:
+   *    buttonCssClass:   an extra CSS class to add to the menu button
+   *    buttonImage:      a url to the menu button image (default '../images/down.gif')
+   * @class Slick.Plugins.HeaderButtons
+   * @constructor
+   */
+  function HeaderMenu(options) {
+    var _grid;
+    var _self = this;
+    var _handler = new Slick.EventHandler();
+    var _defaults = {
+      buttonCssClass: null,
+      buttonImage: null
+    };
+    var $menu;
+    var $activeHeaderColumn;
+
+
+    function init(grid) {
+      options = $.extend(true, {}, _defaults, options);
+      _grid = grid;
+      _handler
+        .subscribe(_grid.onHeaderCellRendered, handleHeaderCellRendered)
+        .subscribe(_grid.onBeforeHeaderCellDestroy, handleBeforeHeaderCellDestroy);
+
+      // Force the grid to re-render the header now that the events are hooked up.
+      _grid.setColumns(_grid.getColumns());
+
+      // Hide the menu on outside click.
+      $(document.body).bind("mousedown", handleBodyMouseDown);
+    }
+
+
+    function destroy() {
+      _handler.unsubscribeAll();
+      $(document.body).unbind("mousedown", handleBodyMouseDown);
+    }
+
+
+    function handleBodyMouseDown(e) {
+      if ($menu && $menu[0] != e.target && !$.contains($menu[0], e.target)) {
+        hideMenu();
+      }
+    }
+
+
+    function hideMenu() {
+      if ($menu) {
+        $menu.remove();
+        $menu = null;
+        $activeHeaderColumn
+          .removeClass("slick-header-column-active");
+      }
+    }
+
+    function handleHeaderCellRendered(e, args) {
+      var column = args.column;
+      var menu = column.header && column.header.menu;
+
+      if (menu) {
+        var $el = $("<div></div>")
+          .addClass("slick-header-menubutton")
+          .data("column", column)
+          .data("menu", menu);
+
+        if (options.buttonCssClass) {
+          $el.addClass(options.buttonCssClass);
+        }
+
+        if (options.buttonImage) {
+          $el.css("background-image", "url(" + options.buttonImage + ")");
+        }
+
+        if (menu.tooltip) {
+          $el.attr("title", menu.tooltip);
+        }
+
+        $el
+          .bind("click", showMenu)
+          .appendTo(args.node);
+      }
+    }
+
+
+    function handleBeforeHeaderCellDestroy(e, args) {
+      var column = args.column;
+
+      if (column.header && column.header.menu) {
+        $(args.node).find(".slick-header-menubutton").remove();
+      }
+    }
+
+
+    function showMenu(e) {
+      var $menuButton = $(this);
+      var menu = $menuButton.data("menu");
+      var columnDef = $menuButton.data("column");
+
+      // Let the user modify the menu or cancel altogether,
+      // or provide alternative menu implementation.
+      if (_self.onBeforeMenuShow.notify({
+          "grid": _grid,
+          "column": columnDef,
+          "menu": menu
+        }, e, _self) == false) {
+        return;
+      }
+
+
+      if (!$menu) {
+        $menu = $("<div class='slick-header-menu'></div>")
+          .appendTo(_grid.getContainerNode());
+      }
+      $menu.empty();
+
+
+      // Construct the menu items.
+      for (var i = 0; i < menu.items.length; i++) {
+        var item = menu.items[i];
+
+        var $li = $("<div class='slick-header-menuitem'></div>")
+          .data("command", item.command || '')
+          .data("column", columnDef)
+          .data("item", item)
+          .bind("click", handleMenuItemClick)
+          .appendTo($menu);
+
+        if (item.disabled) {
+          $li.addClass("slick-header-menuitem-disabled");
+        }
+
+        if (item.tooltip) {
+          $li.attr("title", item.tooltip);
+        }
+
+        var $icon = $("<div class='slick-header-menuicon'></div>")
+          .appendTo($li);
+
+        if (item.iconCssClass) {
+          $icon.addClass(item.iconCssClass);
+        }
+
+        if (item.iconImage) {
+          $icon.css("background-image", "url(" + item.iconImage + ")");
+        }
+
+        $("<span class='slick-header-menucontent'></span>")
+          .text(item.title)
+          .appendTo($li);
+      }
+
+
+      // Position the menu.
+      $menu
+        .offset({ top: $(this).offset().top + $(this).height(), left: $(this).offset().left });
+
+
+      // Mark the header as active to keep the highlighting.
+      $activeHeaderColumn = $menuButton.closest(".slick-header-column");
+      $activeHeaderColumn
+        .addClass("slick-header-column-active");
+
+      // Stop propagation so that it doesn't register as a header click event.
+      e.preventDefault();
+      e.stopPropagation();
+    }
+
+
+    function handleMenuItemClick(e) {
+      var command = $(this).data("command");
+      var columnDef = $(this).data("column");
+      var item = $(this).data("item");
+
+      if (item.disabled) {
+        return;
+      }
+
+      hideMenu();
+
+      if (command != null && command != '') {
+        _self.onCommand.notify({
+            "grid": _grid,
+            "column": columnDef,
+            "command": command,
+            "item": item
+          }, e, _self);
+      }
+
+      // Stop propagation so that it doesn't register as a header click event.
+      e.preventDefault();
+      e.stopPropagation();
+    }
+
+    $.extend(this, {
+      "init": init,
+      "destroy": destroy,
+
+      "onBeforeMenuShow": new Slick.Event(),
+      "onCommand": new Slick.Event()
+    });
+  }
+})(jQuery);
diff --git a/third-party/slickgrid-2.1/plugins/slick.rowmovemanager.js b/third-party/slickgrid-2.1/plugins/slick.rowmovemanager.js
new file mode 100644 (file)
index 0000000..5f87a1e
--- /dev/null
@@ -0,0 +1,138 @@
+(function ($) {
+  // register namespace
+  $.extend(true, window, {
+    "Slick": {
+      "RowMoveManager": RowMoveManager
+    }
+  });
+
+  function RowMoveManager(options) {
+    var _grid;
+    var _canvas;
+    var _dragging;
+    var _self = this;
+    var _handler = new Slick.EventHandler();
+    var _defaults = {
+      cancelEditOnDrag: false
+    };
+
+    function init(grid) {
+      options = $.extend(true, {}, _defaults, options);
+      _grid = grid;
+      _canvas = _grid.getCanvasNode();
+      _handler
+        .subscribe(_grid.onDragInit, handleDragInit)
+        .subscribe(_grid.onDragStart, handleDragStart)
+        .subscribe(_grid.onDrag, handleDrag)
+        .subscribe(_grid.onDragEnd, handleDragEnd);
+    }
+
+    function destroy() {
+      _handler.unsubscribeAll();
+    }
+
+    function handleDragInit(e, dd) {
+      // prevent the grid from cancelling drag'n'drop by default
+      e.stopImmediatePropagation();
+    }
+
+    function handleDragStart(e, dd) {
+      var cell = _grid.getCellFromEvent(e);
+
+      if (options.cancelEditOnDrag && _grid.getEditorLock().isActive()) {
+        _grid.getEditorLock().cancelCurrentEdit();
+      }
+
+      if (_grid.getEditorLock().isActive() || !/move|selectAndMove/.test(_grid.getColumns()[cell.cell].behavior)) {
+        return false;
+      }
+
+      _dragging = true;
+      e.stopImmediatePropagation();
+
+      var selectedRows = _grid.getSelectedRows();
+
+      if (selectedRows.length == 0 || $.inArray(cell.row, selectedRows) == -1) {
+        selectedRows = [cell.row];
+        _grid.setSelectedRows(selectedRows);
+      }
+
+      var rowHeight = _grid.getOptions().rowHeight;
+
+      dd.selectedRows = selectedRows;
+
+      dd.selectionProxy = $("<div class='slick-reorder-proxy'/>")
+          .css("position", "absolute")
+          .css("zIndex", "99999")
+          .css("width", $(_canvas).innerWidth())
+          .css("height", rowHeight * selectedRows.length)
+          .appendTo(_canvas);
+
+      dd.guide = $("<div class='slick-reorder-guide'/>")
+          .css("position", "absolute")
+          .css("zIndex", "99998")
+          .css("width", $(_canvas).innerWidth())
+          .css("top", -1000)
+          .appendTo(_canvas);
+
+      dd.insertBefore = -1;
+    }
+
+    function handleDrag(e, dd) {
+      if (!_dragging) {
+        return;
+      }
+
+      e.stopImmediatePropagation();
+
+      var top = e.pageY - $(_canvas).offset().top;
+      dd.selectionProxy.css("top", top - 5);
+
+      var insertBefore = Math.max(0, Math.min(Math.round(top / _grid.getOptions().rowHeight), _grid.getDataLength()));
+      if (insertBefore !== dd.insertBefore) {
+        var eventData = {
+          "rows": dd.selectedRows,
+          "insertBefore": insertBefore
+        };
+
+        if (_self.onBeforeMoveRows.notify(eventData) === false) {
+          dd.guide.css("top", -1000);
+          dd.canMove = false;
+        } else {
+          dd.guide.css("top", insertBefore * _grid.getOptions().rowHeight);
+          dd.canMove = true;
+        }
+
+        dd.insertBefore = insertBefore;
+      }
+    }
+
+    function handleDragEnd(e, dd) {
+      if (!_dragging) {
+        return;
+      }
+      _dragging = false;
+      e.stopImmediatePropagation();
+
+      dd.guide.remove();
+      dd.selectionProxy.remove();
+
+      if (dd.canMove) {
+        var eventData = {
+          "rows": dd.selectedRows,
+          "insertBefore": dd.insertBefore
+        };
+        // TODO:  _grid.remapCellCssClasses ?
+        _self.onMoveRows.notify(eventData);
+      }
+    }
+
+    $.extend(this, {
+      "onBeforeMoveRows": new Slick.Event(),
+      "onMoveRows": new Slick.Event(),
+
+      "init": init,
+      "destroy": destroy
+    });
+  }
+})(jQuery);
\ No newline at end of file
diff --git a/third-party/slickgrid-2.1/plugins/slick.rowselectionmodel.js b/third-party/slickgrid-2.1/plugins/slick.rowselectionmodel.js
new file mode 100644 (file)
index 0000000..28e7e43
--- /dev/null
@@ -0,0 +1,187 @@
+(function ($) {
+  // register namespace
+  $.extend(true, window, {
+    "Slick": {
+      "RowSelectionModel": RowSelectionModel
+    }
+  });
+
+  function RowSelectionModel(options) {
+    var _grid;
+    var _ranges = [];
+    var _self = this;
+    var _handler = new Slick.EventHandler();
+    var _inHandler;
+    var _options;
+    var _defaults = {
+      selectActiveRow: true
+    };
+
+    function init(grid) {
+      _options = $.extend(true, {}, _defaults, options);
+      _grid = grid;
+      _handler.subscribe(_grid.onActiveCellChanged,
+          wrapHandler(handleActiveCellChange));
+      _handler.subscribe(_grid.onKeyDown,
+          wrapHandler(handleKeyDown));
+      _handler.subscribe(_grid.onClick,
+          wrapHandler(handleClick));
+    }
+
+    function destroy() {
+      _handler.unsubscribeAll();
+    }
+
+    function wrapHandler(handler) {
+      return function () {
+        if (!_inHandler) {
+          _inHandler = true;
+          handler.apply(this, arguments);
+          _inHandler = false;
+        }
+      };
+    }
+
+    function rangesToRows(ranges) {
+      var rows = [];
+      for (var i = 0; i < ranges.length; i++) {
+        for (var j = ranges[i].fromRow; j <= ranges[i].toRow; j++) {
+          rows.push(j);
+        }
+      }
+      return rows;
+    }
+
+    function rowsToRanges(rows) {
+      var ranges = [];
+      var lastCell = _grid.getColumns().length - 1;
+      for (var i = 0; i < rows.length; i++) {
+        ranges.push(new Slick.Range(rows[i], 0, rows[i], lastCell));
+      }
+      return ranges;
+    }
+
+    function getRowsRange(from, to) {
+      var i, rows = [];
+      for (i = from; i <= to; i++) {
+        rows.push(i);
+      }
+      for (i = to; i < from; i++) {
+        rows.push(i);
+      }
+      return rows;
+    }
+
+    function getSelectedRows() {
+      return rangesToRows(_ranges);
+    }
+
+    function setSelectedRows(rows) {
+      setSelectedRanges(rowsToRanges(rows));
+    }
+
+    function setSelectedRanges(ranges) {
+      _ranges = ranges;
+      _self.onSelectedRangesChanged.notify(_ranges);
+    }
+
+    function getSelectedRanges() {
+      return _ranges;
+    }
+
+    function handleActiveCellChange(e, data) {
+      if (_options.selectActiveRow && data.row != null) {
+        setSelectedRanges([new Slick.Range(data.row, 0, data.row, _grid.getColumns().length - 1)]);
+      }
+    }
+
+    function handleKeyDown(e) {
+      var activeRow = _grid.getActiveCell();
+      if (activeRow && e.shiftKey && !e.ctrlKey && !e.altKey && !e.metaKey && (e.which == 38 || e.which == 40)) {
+        var selectedRows = getSelectedRows();
+        selectedRows.sort(function (x, y) {
+          return x - y
+        });
+
+        if (!selectedRows.length) {
+          selectedRows = [activeRow.row];
+        }
+
+        var top = selectedRows[0];
+        var bottom = selectedRows[selectedRows.length - 1];
+        var active;
+
+        if (e.which == 40) {
+          active = activeRow.row < bottom || top == bottom ? ++bottom : ++top;
+        } else {
+          active = activeRow.row < bottom ? --bottom : --top;
+        }
+
+        if (active >= 0 && active < _grid.getDataLength()) {
+          _grid.scrollRowIntoView(active);
+          _ranges = rowsToRanges(getRowsRange(top, bottom));
+          setSelectedRanges(_ranges);
+        }
+
+        e.preventDefault();
+        e.stopPropagation();
+      }
+    }
+
+    function handleClick(e) {
+      var cell = _grid.getCellFromEvent(e);
+      if (!cell || !_grid.canCellBeActive(cell.row, cell.cell)) {
+        return false;
+      }
+
+      var selection = rangesToRows(_ranges);
+      var idx = $.inArray(cell.row, selection);
+
+      if (!e.ctrlKey && !e.shiftKey && !e.metaKey) {
+        return false;
+      }
+      else if (_grid.getOptions().multiSelect) {
+        if (idx === -1 && (e.ctrlKey || e.metaKey)) {
+          selection.push(cell.row);
+          _grid.setActiveCell(cell.row, cell.cell);
+        } else if (idx !== -1 && (e.ctrlKey || e.metaKey)) {
+          selection = $.grep(selection, function (o, i) {
+            return (o !== cell.row);
+          });
+          _grid.setActiveCell(cell.row, cell.cell);
+        } else if (selection.length && e.shiftKey) {
+          var last = selection.pop();
+          var from = Math.min(cell.row, last);
+          var to = Math.max(cell.row, last);
+          selection = [];
+          for (var i = from; i <= to; i++) {
+            if (i !== last) {
+              selection.push(i);
+            }
+          }
+          selection.push(last);
+          _grid.setActiveCell(cell.row, cell.cell);
+        }
+      }
+
+      _ranges = rowsToRanges(selection);
+      setSelectedRanges(_ranges);
+      e.stopImmediatePropagation();
+
+      return true;
+    }
+
+    $.extend(this, {
+      "getSelectedRows": getSelectedRows,
+      "setSelectedRows": setSelectedRows,
+
+      "getSelectedRanges": getSelectedRanges,
+      "setSelectedRanges": setSelectedRanges,
+
+      "init": init,
+      "destroy": destroy,
+
+      "onSelectedRangesChanged": new Slick.Event()
+    });
+  }
+})(jQuery);
\ No newline at end of file
diff --git a/third-party/slickgrid-2.1/slick.core.js b/third-party/slickgrid-2.1/slick.core.js
new file mode 100644 (file)
index 0000000..5c4c695
--- /dev/null
@@ -0,0 +1,458 @@
+/***
+ * Contains core SlickGrid classes.
+ * @module Core
+ * @namespace Slick
+ */
+
+(function ($) {
+  // register namespace
+  $.extend(true, window, {
+    "Slick": {
+      "Event": Event,
+      "EventData": EventData,
+      "EventHandler": EventHandler,
+      "Range": Range,
+      "NonDataRow": NonDataItem,
+      "Group": Group,
+      "GroupTotals": GroupTotals,
+      "EditorLock": EditorLock,
+
+      /***
+       * A global singleton editor lock.
+       * @class GlobalEditorLock
+       * @static
+       * @constructor
+       */
+      "GlobalEditorLock": new EditorLock()
+    }
+  });
+
+  /***
+   * An event object for passing data to event handlers and letting them control propagation.
+   * <p>This is pretty much identical to how W3C and jQuery implement events.</p>
+   * @class EventData
+   * @constructor
+   */
+  function EventData() {
+    var isPropagationStopped = false;
+    var isImmediatePropagationStopped = false;
+
+    /***
+     * Stops event from propagating up the DOM tree.
+     * @method stopPropagation
+     */
+    this.stopPropagation = function () {
+      isPropagationStopped = true;
+    };
+
+    /***
+     * Returns whether stopPropagation was called on this event object.
+     * @method isPropagationStopped
+     * @return {Boolean}
+     */
+    this.isPropagationStopped = function () {
+      return isPropagationStopped;
+    };
+
+    /***
+     * Prevents the rest of the handlers from being executed.
+     * @method stopImmediatePropagation
+     */
+    this.stopImmediatePropagation = function () {
+      isImmediatePropagationStopped = true;
+    };
+
+    /***
+     * Returns whether stopImmediatePropagation was called on this event object.\
+     * @method isImmediatePropagationStopped
+     * @return {Boolean}
+     */
+    this.isImmediatePropagationStopped = function () {
+      return isImmediatePropagationStopped;
+    }
+  }
+
+  /***
+   * A simple publisher-subscriber implementation.
+   * @class Event
+   * @constructor
+   */
+  function Event() {
+    var handlers = [];
+
+    /***
+     * Adds an event handler to be called when the event is fired.
+     * <p>Event handler will receive two arguments - an <code>EventData</code> and the <code>data</code>
+     * object the event was fired with.<p>
+     * @method subscribe
+     * @param fn {Function} Event handler.
+     */
+    this.subscribe = function (fn) {
+      handlers.push(fn);
+    };
+
+    /***
+     * Removes an event handler added with <code>subscribe(fn)</code>.
+     * @method unsubscribe
+     * @param fn {Function} Event handler to be removed.
+     */
+    this.unsubscribe = function (fn) {
+      for (var i = handlers.length - 1; i >= 0; i--) {
+        if (handlers[i] === fn) {
+          handlers.splice(i, 1);
+        }
+      }
+    };
+
+    /***
+     * Fires an event notifying all subscribers.
+     * @method notify
+     * @param args {Object} Additional data object to be passed to all handlers.
+     * @param e {EventData}
+     *      Optional.
+     *      An <code>EventData</code> object to be passed to all handlers.
+     *      For DOM events, an existing W3C/jQuery event object can be passed in.
+     * @param scope {Object}
+     *      Optional.
+     *      The scope ("this") within which the handler will be executed.
+     *      If not specified, the scope will be set to the <code>Event</code> instance.
+     */
+    this.notify = function (args, e, scope) {
+      e = e || new EventData();
+      scope = scope || this;
+
+      var returnValue;
+      for (var i = 0; i < handlers.length && !(e.isPropagationStopped() || e.isImmediatePropagationStopped()); i++) {
+        returnValue = handlers[i].call(scope, e, args);
+      }
+
+      return returnValue;
+    };
+  }
+
+  function EventHandler() {
+    var handlers = [];
+
+    this.subscribe = function (event, handler) {
+      handlers.push({
+        event: event,
+        handler: handler
+      });
+      event.subscribe(handler);
+
+      return this;  // allow chaining
+    };
+
+    this.unsubscribe = function (event, handler) {
+      var i = handlers.length;
+      while (i--) {
+        if (handlers[i].event === event &&
+            handlers[i].handler === handler) {
+          handlers.splice(i, 1);
+          event.unsubscribe(handler);
+          return;
+        }
+      }
+
+      return this;  // allow chaining
+    };
+
+    this.unsubscribeAll = function () {
+      var i = handlers.length;
+      while (i--) {
+        handlers[i].event.unsubscribe(handlers[i].handler);
+      }
+      handlers = [];
+
+      return this;  // allow chaining
+    }
+  }
+
+  /***
+   * A structure containing a range of cells.
+   * @class Range
+   * @constructor
+   * @param fromRow {Integer} Starting row.
+   * @param fromCell {Integer} Starting cell.
+   * @param toRow {Integer} Optional. Ending row. Defaults to <code>fromRow</code>.
+   * @param toCell {Integer} Optional. Ending cell. Defaults to <code>fromCell</code>.
+   */
+  function Range(fromRow, fromCell, toRow, toCell) {
+    if (toRow === undefined && toCell === undefined) {
+      toRow = fromRow;
+      toCell = fromCell;
+    }
+
+    /***
+     * @property fromRow
+     * @type {Integer}
+     */
+    this.fromRow = Math.min(fromRow, toRow);
+
+    /***
+     * @property fromCell
+     * @type {Integer}
+     */
+    this.fromCell = Math.min(fromCell, toCell);
+
+    /***
+     * @property toRow
+     * @type {Integer}
+     */
+    this.toRow = Math.max(fromRow, toRow);
+
+    /***
+     * @property toCell
+     * @type {Integer}
+     */
+    this.toCell = Math.max(fromCell, toCell);
+
+    /***
+     * Returns whether a range represents a single row.
+     * @method isSingleRow
+     * @return {Boolean}
+     */
+    this.isSingleRow = function () {
+      return this.fromRow == this.toRow;
+    };
+
+    /***
+     * Returns whether a range represents a single cell.
+     * @method isSingleCell
+     * @return {Boolean}
+     */
+    this.isSingleCell = function () {
+      return this.fromRow == this.toRow && this.fromCell == this.toCell;
+    };
+
+    /***
+     * Returns whether a range contains a given cell.
+     * @method contains
+     * @param row {Integer}
+     * @param cell {Integer}
+     * @return {Boolean}
+     */
+    this.contains = function (row, cell) {
+      return row >= this.fromRow && row <= this.toRow &&
+          cell >= this.fromCell && cell <= this.toCell;
+    };
+
+    /***
+     * Returns a readable representation of a range.
+     * @method toString
+     * @return {String}
+     */
+    this.toString = function () {
+      if (this.isSingleCell()) {
+        return "(" + this.fromRow + ":" + this.fromCell + ")";
+      }
+      else {
+        return "(" + this.fromRow + ":" + this.fromCell + " - " + this.toRow + ":" + this.toCell + ")";
+      }
+    }
+  }
+
+
+  /***
+   * A base class that all special / non-data rows (like Group and GroupTotals) derive from.
+   * @class NonDataItem
+   * @constructor
+   */
+  function NonDataItem() {
+    this.__nonDataRow = true;
+  }
+
+
+  /***
+   * Information about a group of rows.
+   * @class Group
+   * @extends Slick.NonDataItem
+   * @constructor
+   */
+  function Group() {
+    this.__group = true;
+
+    /**
+     * Grouping level, starting with 0.
+     * @property level
+     * @type {Number}
+     */
+    this.level = 0;
+
+    /***
+     * Number of rows in the group.
+     * @property count
+     * @type {Integer}
+     */
+    this.count = 0;
+
+    /***
+     * Grouping value.
+     * @property value
+     * @type {Object}
+     */
+    this.value = null;
+
+    /***
+     * Formatted display value of the group.
+     * @property title
+     * @type {String}
+     */
+    this.title = null;
+
+    /***
+     * Whether a group is collapsed.
+     * @property collapsed
+     * @type {Boolean}
+     */
+    this.collapsed = false;
+
+    /***
+     * GroupTotals, if any.
+     * @property totals
+     * @type {GroupTotals}
+     */
+    this.totals = null;
+
+    /**
+     * Rows that are part of the group.
+     * @property rows
+     * @type {Array}
+     */
+    this.rows = [];
+
+    /**
+     * Sub-groups that are part of the group.
+     * @property groups
+     * @type {Array}
+     */
+    this.groups = null;
+
+    /**
+     * A unique key used to identify the group.  This key can be used in calls to DataView
+     * collapseGroup() or expandGroup().
+     * @property groupingKey
+     * @type {Object}
+     */
+    this.groupingKey = null;
+  }
+
+  Group.prototype = new NonDataItem();
+
+  /***
+   * Compares two Group instances.
+   * @method equals
+   * @return {Boolean}
+   * @param group {Group} Group instance to compare to.
+   */
+  Group.prototype.equals = function (group) {
+    return this.value === group.value &&
+        this.count === group.count &&
+        this.collapsed === group.collapsed;
+  };
+
+  /***
+   * Information about group totals.
+   * An instance of GroupTotals will be created for each totals row and passed to the aggregators
+   * so that they can store arbitrary data in it.  That data can later be accessed by group totals
+   * formatters during the display.
+   * @class GroupTotals
+   * @extends Slick.NonDataItem
+   * @constructor
+   */
+  function GroupTotals() {
+    this.__groupTotals = true;
+
+    /***
+     * Parent Group.
+     * @param group
+     * @type {Group}
+     */
+    this.group = null;
+  }
+
+  GroupTotals.prototype = new NonDataItem();
+
+  /***
+   * A locking helper to track the active edit controller and ensure that only a single controller
+   * can be active at a time.  This prevents a whole class of state and validation synchronization
+   * issues.  An edit controller (such as SlickGrid) can query if an active edit is in progress
+   * and attempt a commit or cancel before proceeding.
+   * @class EditorLock
+   * @constructor
+   */
+  function EditorLock() {
+    var activeEditController = null;
+
+    /***
+     * Returns true if a specified edit controller is active (has the edit lock).
+     * If the parameter is not specified, returns true if any edit controller is active.
+     * @method isActive
+     * @param editController {EditController}
+     * @return {Boolean}
+     */
+    this.isActive = function (editController) {
+      return (editController ? activeEditController === editController : activeEditController !== null);
+    };
+
+    /***
+     * Sets the specified edit controller as the active edit controller (acquire edit lock).
+     * If another edit controller is already active, and exception will be thrown.
+     * @method activate
+     * @param editController {EditController} edit controller acquiring the lock
+     */
+    this.activate = function (editController) {
+      if (editController === activeEditController) { // already activated?
+        return;
+      }
+      if (activeEditController !== null) {
+        throw "SlickGrid.EditorLock.activate: an editController is still active, can't activate another editController";
+      }
+      if (!editController.commitCurrentEdit) {
+        throw "SlickGrid.EditorLock.activate: editController must implement .commitCurrentEdit()";
+      }
+      if (!editController.cancelCurrentEdit) {
+        throw "SlickGrid.EditorLock.activate: editController must implement .cancelCurrentEdit()";
+      }
+      activeEditController = editController;
+    };
+
+    /***
+     * Unsets the specified edit controller as the active edit controller (release edit lock).
+     * If the specified edit controller is not the active one, an exception will be thrown.
+     * @method deactivate
+     * @param editController {EditController} edit controller releasing the lock
+     */
+    this.deactivate = function (editController) {
+      if (activeEditController !== editController) {
+        throw "SlickGrid.EditorLock.deactivate: specified editController is not the currently active one";
+      }
+      activeEditController = null;
+    };
+
+    /***
+     * Attempts to commit the current edit by calling "commitCurrentEdit" method on the active edit
+     * controller and returns whether the commit attempt was successful (commit may fail due to validation
+     * errors, etc.).  Edit controller's "commitCurrentEdit" must return true if the commit has succeeded
+     * and false otherwise.  If no edit controller is active, returns true.
+     * @method commitCurrentEdit
+     * @return {Boolean}
+     */
+    this.commitCurrentEdit = function () {
+      return (activeEditController ? activeEditController.commitCurrentEdit() : true);
+    };
+
+    /***
+     * Attempts to cancel the current edit by calling "cancelCurrentEdit" method on the active edit
+     * controller and returns whether the edit was successfully cancelled.  If no edit controller is
+     * active, returns true.
+     * @method cancelCurrentEdit
+     * @return {Boolean}
+     */
+    this.cancelCurrentEdit = function cancelCurrentEdit() {
+      return (activeEditController ? activeEditController.cancelCurrentEdit() : true);
+    };
+  }
+})(jQuery);
+
+
diff --git a/third-party/slickgrid-2.1/slick.dataview.js b/third-party/slickgrid-2.1/slick.dataview.js
new file mode 100644 (file)
index 0000000..5bee4ff
--- /dev/null
@@ -0,0 +1,1063 @@
+(function ($) {
+  $.extend(true, window, {
+    Slick: {
+      Data: {
+        DataView: DataView,
+        Aggregators: {
+          Avg: AvgAggregator,
+          Min: MinAggregator,
+          Max: MaxAggregator,
+          Sum: SumAggregator
+        }
+      }
+    }
+  });
+
+
+  /***
+   * A sample Model implementation.
+   * Provides a filtered view of the underlying data.
+   *
+   * Relies on the data item having an "id" property uniquely identifying it.
+   */
+  function DataView(options) {
+    var self = this;
+
+    var defaults = {
+      groupItemMetadataProvider: null,
+      inlineFilters: false
+    };
+
+
+    // private
+    var idProperty = "id";  // property holding a unique row id
+    var items = [];         // data by index
+    var rows = [];          // data by row
+    var idxById = {};       // indexes by id
+    var rowsById = null;    // rows by id; lazy-calculated
+    var filter = null;      // filter function
+    var updated = null;     // updated item ids
+    var suspend = false;    // suspends the recalculation
+    var sortAsc = true;
+    var fastSortField;
+    var sortComparer;
+    var refreshHints = {};
+    var prevRefreshHints = {};
+    var filterArgs;
+    var filteredItems = [];
+    var compiledFilter;
+    var compiledFilterWithCaching;
+    var filterCache = [];
+
+    // grouping
+    var groupingInfoDefaults = {
+      getter: null,
+      formatter: null,
+      comparer: function(a, b) { return a.value - b.value; },
+      predefinedValues: [],
+      aggregators: [],
+      aggregateEmpty: false,
+      aggregateCollapsed: false,
+      aggregateChildGroups: false,
+      collapsed: false,
+      displayTotalsRow: true
+    };
+    var groupingInfos = [];
+    var groups = [];
+    var toggledGroupsByLevel = [];
+    var groupingDelimiter = ':|:';
+
+    var pagesize = 0;
+    var pagenum = 0;
+    var totalRows = 0;
+
+    // events
+    var onRowCountChanged = new Slick.Event();
+    var onRowsChanged = new Slick.Event();
+    var onPagingInfoChanged = new Slick.Event();
+
+    options = $.extend(true, {}, defaults, options);
+
+
+    function beginUpdate() {
+      suspend = true;
+    }
+
+    function endUpdate() {
+      suspend = false;
+      refresh();
+    }
+
+    function setRefreshHints(hints) {
+      refreshHints = hints;
+    }
+
+    function setFilterArgs(args) {
+      filterArgs = args;
+    }
+
+    function updateIdxById(startingIndex) {
+      startingIndex = startingIndex || 0;
+      var id;
+      for (var i = startingIndex, l = items.length; i < l; i++) {
+        id = items[i][idProperty];
+        if (id === undefined) {
+          throw "Each data element must implement a unique 'id' property";
+        }
+        idxById[id] = i;
+      }
+    }
+
+    function ensureIdUniqueness() {
+      var id;
+      for (var i = 0, l = items.length; i < l; i++) {
+        id = items[i][idProperty];
+        if (id === undefined || idxById[id] !== i) {
+          throw "Each data element must implement a unique 'id' property";
+        }
+      }
+    }
+
+    function getItems() {
+      return items;
+    }
+
+    function setItems(data, objectIdProperty) {
+      if (objectIdProperty !== undefined) {
+        idProperty = objectIdProperty;
+      }
+      items = filteredItems = data;
+      idxById = {};
+      updateIdxById();
+      ensureIdUniqueness();
+      refresh();
+    }
+
+    function setPagingOptions(args) {
+      if (args.pageSize != undefined) {
+        pagesize = args.pageSize;
+        pagenum = pagesize ? Math.min(pagenum, Math.max(0, Math.ceil(totalRows / pagesize) - 1)) : 0;
+      }
+
+      if (args.pageNum != undefined) {
+        pagenum = Math.min(args.pageNum, Math.max(0, Math.ceil(totalRows / pagesize) - 1));
+      }
+
+      onPagingInfoChanged.notify(getPagingInfo(), null, self);
+
+      refresh();
+    }
+
+    function getPagingInfo() {
+      var totalPages = pagesize ? Math.max(1, Math.ceil(totalRows / pagesize)) : 1;
+      return {pageSize: pagesize, pageNum: pagenum, totalRows: totalRows, totalPages: totalPages};
+    }
+
+    function sort(comparer, ascending) {
+      sortAsc = ascending;
+      sortComparer = comparer;
+      fastSortField = null;
+      if (ascending === false) {
+        items.reverse();
+      }
+      items.sort(comparer);
+      if (ascending === false) {
+        items.reverse();
+      }
+      idxById = {};
+      updateIdxById();
+      refresh();
+    }
+
+    /***
+     * Provides a workaround for the extremely slow sorting in IE.
+     * Does a [lexicographic] sort on a give column by temporarily overriding Object.prototype.toString
+     * to return the value of that field and then doing a native Array.sort().
+     */
+    function fastSort(field, ascending) {
+      sortAsc = ascending;
+      fastSortField = field;
+      sortComparer = null;
+      var oldToString = Object.prototype.toString;
+      Object.prototype.toString = (typeof field == "function") ? field : function () {
+        return this[field]
+      };
+      // an extra reversal for descending sort keeps the sort stable
+      // (assuming a stable native sort implementation, which isn't true in some cases)
+      if (ascending === false) {
+        items.reverse();
+      }
+      items.sort();
+      Object.prototype.toString = oldToString;
+      if (ascending === false) {
+        items.reverse();
+      }
+      idxById = {};
+      updateIdxById();
+      refresh();
+    }
+
+    function reSort() {
+      if (sortComparer) {
+        sort(sortComparer, sortAsc);
+      } else if (fastSortField) {
+        fastSort(fastSortField, sortAsc);
+      }
+    }
+
+    function setFilter(filterFn) {
+      filter = filterFn;
+      if (options.inlineFilters) {
+        compiledFilter = compileFilter();
+        compiledFilterWithCaching = compileFilterWithCaching();
+      }
+      refresh();
+    }
+
+    function getGrouping() {
+      return groupingInfos;
+    }
+
+    function setGrouping(groupingInfo) {
+      if (!options.groupItemMetadataProvider) {
+        options.groupItemMetadataProvider = new Slick.Data.GroupItemMetadataProvider();
+      }
+
+      groups = [];
+      toggledGroupsByLevel = [];
+      groupingInfo = groupingInfo || [];
+      groupingInfos = (groupingInfo instanceof Array) ? groupingInfo : [groupingInfo];
+
+      for (var i = 0; i < groupingInfos.length; i++) {
+        var gi = groupingInfos[i] = $.extend(true, {}, groupingInfoDefaults, groupingInfos[i]);
+        gi.getterIsAFn = typeof gi.getter === "function";
+
+        // pre-compile accumulator loops
+        gi.compiledAccumulators = [];
+        var idx = gi.aggregators.length;
+        while (idx--) {
+          gi.compiledAccumulators[idx] = compileAccumulatorLoop(gi.aggregators[idx]);
+        }
+
+        toggledGroupsByLevel[i] = {};
+      }
+
+      refresh();
+    }
+
+    /**
+     * @deprecated Please use {@link setGrouping}.
+     */
+    function groupBy(valueGetter, valueFormatter, sortComparer) {
+      if (valueGetter == null) {
+        setGrouping([]);
+        return;
+      }
+
+      setGrouping({
+        getter: valueGetter,
+        formatter: valueFormatter,
+        comparer: sortComparer
+      });
+    }
+
+    /**
+     * @deprecated Please use {@link setGrouping}.
+     */
+    function setAggregators(groupAggregators, includeCollapsed) {
+      if (!groupingInfos.length) {
+        throw new Error("At least one grouping must be specified before calling setAggregators().");
+      }
+
+      groupingInfos[0].aggregators = groupAggregators;
+      groupingInfos[0].aggregateCollapsed = includeCollapsed;
+
+      setGrouping(groupingInfos);
+    }
+
+    function getItemByIdx(i) {
+      return items[i];
+    }
+
+    function getIdxById(id) {
+      return idxById[id];
+    }
+
+    function ensureRowsByIdCache() {
+      if (!rowsById) {
+        rowsById = {};
+        for (var i = 0, l = rows.length; i < l; i++) {
+          rowsById[rows[i][idProperty]] = i;
+        }
+      }
+    }
+
+    function getRowById(id) {
+      ensureRowsByIdCache();
+      return rowsById[id];
+    }
+
+    function getItemById(id) {
+      return items[idxById[id]];
+    }
+
+    function mapIdsToRows(idArray) {
+      var rows = [];
+      ensureRowsByIdCache();
+      for (var i = 0; i < idArray.length; i++) {
+        var row = rowsById[idArray[i]];
+        if (row != null) {
+          rows[rows.length] = row;
+        }
+      }
+      return rows;
+    }
+
+    function mapRowsToIds(rowArray) {
+      var ids = [];
+      for (var i = 0; i < rowArray.length; i++) {
+        if (rowArray[i] < rows.length) {
+          ids[ids.length] = rows[rowArray[i]][idProperty];
+        }
+      }
+      return ids;
+    }
+
+    function updateItem(id, item) {
+      if (idxById[id] === undefined || id !== item[idProperty]) {
+        throw "Invalid or non-matching id";
+      }
+      items[idxById[id]] = item;
+      if (!updated) {
+        updated = {};
+      }
+      updated[id] = true;
+      refresh();
+    }
+
+    function insertItem(insertBefore, item) {
+      items.splice(insertBefore, 0, item);
+      updateIdxById(insertBefore);
+      refresh();
+    }
+
+    function addItem(item) {
+      items.push(item);
+      updateIdxById(items.length - 1);
+      refresh();
+    }
+
+    function deleteItem(id) {
+      var idx = idxById[id];
+      if (idx === undefined) {
+        throw "Invalid id";
+      }
+      delete idxById[id];
+      items.splice(idx, 1);
+      updateIdxById(idx);
+      refresh();
+    }
+
+    function getLength() {
+      return rows.length;
+    }
+
+    function getItem(i) {
+      return rows[i];
+    }
+
+    function getItemMetadata(i) {
+      var item = rows[i];
+      if (item === undefined) {
+        return null;
+      }
+
+      // overrides for grouping rows
+      if (item.__group) {
+        return options.groupItemMetadataProvider.getGroupRowMetadata(item);
+      }
+
+      // overrides for totals rows
+      if (item.__groupTotals) {
+        return options.groupItemMetadataProvider.getTotalsRowMetadata(item);
+      }
+
+      return null;
+    }
+
+    function expandCollapseAllGroups(level, collapse) {
+      if (level == null) {
+        for (var i = 0; i < groupingInfos.length; i++) {
+          toggledGroupsByLevel[i] = {};
+          groupingInfos[i].collapsed = collapse;
+        }
+      } else {
+        toggledGroupsByLevel[level] = {};
+        groupingInfos[level].collapsed = collapse;
+      }
+      refresh();
+    }
+
+    /**
+     * @param level {Number} Optional level to collapse.  If not specified, applies to all levels.
+     */
+    function collapseAllGroups(level) {
+      expandCollapseAllGroups(level, true);
+    }
+
+    /**
+     * @param level {Number} Optional level to expand.  If not specified, applies to all levels.
+     */
+    function expandAllGroups(level) {
+      expandCollapseAllGroups(level, false);
+    }
+
+    function expandCollapseGroup(level, groupingKey, collapse) {
+      toggledGroupsByLevel[level][groupingKey] = groupingInfos[level].collapsed ^ collapse;
+      refresh();
+    }
+
+    /**
+     * @param varArgs Either a Slick.Group's "groupingKey" property, or a
+     *     variable argument list of grouping values denoting a unique path to the row.  For
+     *     example, calling collapseGroup('high', '10%') will collapse the '10%' subgroup of
+     *     the 'high' setGrouping.
+     */
+    function collapseGroup(varArgs) {
+      var args = Array.prototype.slice.call(arguments);
+      var arg0 = args[0];
+      if (args.length == 1 && arg0.indexOf(groupingDelimiter) != -1) {
+        expandCollapseGroup(arg0.split(groupingDelimiter).length - 1, arg0, true);
+      } else {
+        expandCollapseGroup(args.length - 1, args.join(groupingDelimiter), true);
+      }
+    }
+
+    /**
+     * @param varArgs Either a Slick.Group's "groupingKey" property, or a
+     *     variable argument list of grouping values denoting a unique path to the row.  For
+     *     example, calling expandGroup('high', '10%') will expand the '10%' subgroup of
+     *     the 'high' setGrouping.
+     */
+    function expandGroup(varArgs) {
+      var args = Array.prototype.slice.call(arguments);
+      var arg0 = args[0];
+      if (args.length == 1 && arg0.indexOf(groupingDelimiter) != -1) {
+        expandCollapseGroup(arg0.split(groupingDelimiter).length - 1, arg0, false);
+      } else {
+        expandCollapseGroup(args.length - 1, args.join(groupingDelimiter), false);
+      }
+    }
+
+    function getGroups() {
+      return groups;
+    }
+
+    function extractGroups(rows, parentGroup) {
+      var group;
+      var val;
+      var groups = [];
+      var groupsByVal = [];
+      var r;
+      var level = parentGroup ? parentGroup.level + 1 : 0;
+      var gi = groupingInfos[level];
+
+      for (var i = 0, l = gi.predefinedValues.length; i < l; i++) {
+        val = gi.predefinedValues[i];
+        group = groupsByVal[val];
+        if (!group) {
+          group = new Slick.Group();
+          group.value = val;
+          group.level = level;
+          group.groupingKey = (parentGroup ? parentGroup.groupingKey + groupingDelimiter : '') + val;
+          groups[groups.length] = group;
+          groupsByVal[val] = group;
+        }
+      }
+
+      for (var i = 0, l = rows.length; i < l; i++) {
+        r = rows[i];
+        val = gi.getterIsAFn ? gi.getter(r) : r[gi.getter];
+        group = groupsByVal[val];
+        if (!group) {
+          group = new Slick.Group();
+          group.value = val;
+          group.level = level;
+          group.groupingKey = (parentGroup ? parentGroup.groupingKey + groupingDelimiter : '') + val;
+          groups[groups.length] = group;
+          groupsByVal[val] = group;
+        }
+
+        group.rows[group.count++] = r;
+      }
+
+      if (level < groupingInfos.length - 1) {
+        for (var i = 0; i < groups.length; i++) {
+          group = groups[i];
+          group.groups = extractGroups(group.rows, group);
+        }
+      }      
+
+      groups.sort(groupingInfos[level].comparer);
+
+      return groups;
+    }
+
+    // TODO:  lazy totals calculation
+    function calculateGroupTotals(group) {
+      // TODO:  try moving iterating over groups into compiled accumulator
+      var gi = groupingInfos[group.level];
+      var isLeafLevel = (group.level == groupingInfos.length);
+      var totals = new Slick.GroupTotals();
+      var agg, idx = gi.aggregators.length;
+      while (idx--) {
+        agg = gi.aggregators[idx];
+        agg.init();
+        gi.compiledAccumulators[idx].call(agg,
+            (!isLeafLevel && gi.aggregateChildGroups) ? group.groups : group.rows);
+        agg.storeResult(totals);
+      }
+      totals.group = group;
+      group.totals = totals;
+    }
+
+    function calculateTotals(groups, level) {
+      level = level || 0;
+      var gi = groupingInfos[level];
+      var idx = groups.length, g;
+      while (idx--) {
+        g = groups[idx];
+
+        if (g.collapsed && !gi.aggregateCollapsed) {
+          continue;
+        }
+
+        // Do a depth-first aggregation so that parent setGrouping aggregators can access subgroup totals.
+        if (g.groups) {
+          calculateTotals(g.groups, level + 1);
+        }
+
+        if (gi.aggregators.length && (
+            gi.aggregateEmpty || g.rows.length || (g.groups && g.groups.length))) {
+          calculateGroupTotals(g);
+        }
+      }
+    }
+
+    function finalizeGroups(groups, level) {
+      level = level || 0;
+      var gi = groupingInfos[level];
+      var groupCollapsed = gi.collapsed;
+      var toggledGroups = toggledGroupsByLevel[level];
+      var idx = groups.length, g;
+      while (idx--) {
+        g = groups[idx];
+        g.collapsed = groupCollapsed ^ toggledGroups[g.groupingKey];
+        g.title = gi.formatter ? gi.formatter(g) : g.value;
+
+        if (g.groups) {
+          finalizeGroups(g.groups, level + 1);
+          // Let the non-leaf setGrouping rows get garbage-collected.
+          // They may have been used by aggregates that go over all of the descendants,
+          // but at this point they are no longer needed.
+          g.rows = [];
+        }
+      }
+    }
+
+    function flattenGroupedRows(groups, level) {
+      level = level || 0;
+      var gi = groupingInfos[level];
+      var groupedRows = [], rows, gl = 0, g;
+      for (var i = 0, l = groups.length; i < l; i++) {
+        g = groups[i];
+        groupedRows[gl++] = g;
+
+        if (!g.collapsed) {
+          rows = g.groups ? flattenGroupedRows(g.groups, level + 1) : g.rows;
+          for (var j = 0, jj = rows.length; j < jj; j++) {
+            groupedRows[gl++] = rows[j];
+          }
+        }
+
+        if (g.totals && gi.displayTotalsRow && (!g.collapsed || gi.aggregateCollapsed)) {
+          groupedRows[gl++] = g.totals;
+        }
+      }
+      return groupedRows;
+    }
+
+    function getFunctionInfo(fn) {
+      var fnRegex = /^function[^(]*\(([^)]*)\)\s*{([\s\S]*)}$/;
+      var matches = fn.toString().match(fnRegex);
+      return {
+        params: matches[1].split(","),
+        body: matches[2]
+      };
+    }
+
+    function compileAccumulatorLoop(aggregator) {
+      var accumulatorInfo = getFunctionInfo(aggregator.accumulate);
+      var fn = new Function(
+          "_items",
+          "for (var " + accumulatorInfo.params[0] + ", _i=0, _il=_items.length; _i<_il; _i++) {" +
+              accumulatorInfo.params[0] + " = _items[_i]; " +
+              accumulatorInfo.body +
+          "}"
+      );
+      fn.displayName = fn.name = "compiledAccumulatorLoop";
+      return fn;
+    }
+
+    function compileFilter() {
+      var filterInfo = getFunctionInfo(filter);
+
+      var filterBody = filterInfo.body
+          .replace(/return false\s*([;}]|$)/gi, "{ continue _coreloop; }$1")
+          .replace(/return true\s*([;}]|$)/gi, "{ _retval[_idx++] = $item$; continue _coreloop; }$1")
+          .replace(/return ([^;}]+?)\s*([;}]|$)/gi,
+          "{ if ($1) { _retval[_idx++] = $item$; }; continue _coreloop; }$2");
+
+      // This preserves the function template code after JS compression,
+      // so that replace() commands still work as expected.
+      var tpl = [
+        //"function(_items, _args) { ",
+        "var _retval = [], _idx = 0; ",
+        "var $item$, $args$ = _args; ",
+        "_coreloop: ",
+        "for (var _i = 0, _il = _items.length; _i < _il; _i++) { ",
+        "$item$ = _items[_i]; ",
+        "$filter$; ",
+        "} ",
+        "return _retval; "
+        //"}"
+      ].join("");
+      tpl = tpl.replace(/\$filter\$/gi, filterBody);
+      tpl = tpl.replace(/\$item\$/gi, filterInfo.params[0]);
+      tpl = tpl.replace(/\$args\$/gi, filterInfo.params[1]);
+
+      var fn = new Function("_items,_args", tpl);
+      fn.displayName = fn.name = "compiledFilter";
+      return fn;
+    }
+
+    function compileFilterWithCaching() {
+      var filterInfo = getFunctionInfo(filter);
+
+      var filterBody = filterInfo.body
+          .replace(/return false\s*([;}]|$)/gi, "{ continue _coreloop; }$1")
+          .replace(/return true\s*([;}]|$)/gi, "{ _cache[_i] = true;_retval[_idx++] = $item$; continue _coreloop; }$1")
+          .replace(/return ([^;}]+?)\s*([;}]|$)/gi,
+          "{ if ((_cache[_i] = $1)) { _retval[_idx++] = $item$; }; continue _coreloop; }$2");
+
+      // This preserves the function template code after JS compression,
+      // so that replace() commands still work as expected.
+      var tpl = [
+        //"function(_items, _args, _cache) { ",
+        "var _retval = [], _idx = 0; ",
+        "var $item$, $args$ = _args; ",
+        "_coreloop: ",
+        "for (var _i = 0, _il = _items.length; _i < _il; _i++) { ",
+        "$item$ = _items[_i]; ",
+        "if (_cache[_i]) { ",
+        "_retval[_idx++] = $item$; ",
+        "continue _coreloop; ",
+        "} ",
+        "$filter$; ",
+        "} ",
+        "return _retval; "
+        //"}"
+      ].join("");
+      tpl = tpl.replace(/\$filter\$/gi, filterBody);
+      tpl = tpl.replace(/\$item\$/gi, filterInfo.params[0]);
+      tpl = tpl.replace(/\$args\$/gi, filterInfo.params[1]);
+
+      var fn = new Function("_items,_args,_cache", tpl);
+      fn.displayName = fn.name = "compiledFilterWithCaching";
+      return fn;
+    }
+
+    function uncompiledFilter(items, args) {
+      var retval = [], idx = 0;
+
+      for (var i = 0, ii = items.length; i < ii; i++) {
+        if (filter(items[i], args)) {
+          retval[idx++] = items[i];
+        }
+      }
+
+      return retval;
+    }
+
+    function uncompiledFilterWithCaching(items, args, cache) {
+      var retval = [], idx = 0, item;
+
+      for (var i = 0, ii = items.length; i < ii; i++) {
+        item = items[i];
+        if (cache[i]) {
+          retval[idx++] = item;
+        } else if (filter(item, args)) {
+          retval[idx++] = item;
+          cache[i] = true;
+        }
+      }
+
+      return retval;
+    }
+
+    function getFilteredAndPagedItems(items) {
+      if (filter) {
+        var batchFilter = options.inlineFilters ? compiledFilter : uncompiledFilter;
+        var batchFilterWithCaching = options.inlineFilters ? compiledFilterWithCaching : uncompiledFilterWithCaching;
+
+        if (refreshHints.isFilterNarrowing) {
+          filteredItems = batchFilter(filteredItems, filterArgs);
+        } else if (refreshHints.isFilterExpanding) {
+          filteredItems = batchFilterWithCaching(items, filterArgs, filterCache);
+        } else if (!refreshHints.isFilterUnchanged) {
+          filteredItems = batchFilter(items, filterArgs);
+        }
+      } else {
+        // special case:  if not filtering and not paging, the resulting
+        // rows collection needs to be a copy so that changes due to sort
+        // can be caught
+        filteredItems = pagesize ? items : items.concat();
+      }
+
+      // get the current page
+      var paged;
+      if (pagesize) {
+        if (filteredItems.length < pagenum * pagesize) {
+          pagenum = Math.floor(filteredItems.length / pagesize);
+        }
+        paged = filteredItems.slice(pagesize * pagenum, pagesize * pagenum + pagesize);
+      } else {
+        paged = filteredItems;
+      }
+
+      return {totalRows: filteredItems.length, rows: paged};
+    }
+
+    function getRowDiffs(rows, newRows) {
+      var item, r, eitherIsNonData, diff = [];
+      var from = 0, to = newRows.length;
+
+      if (refreshHints && refreshHints.ignoreDiffsBefore) {
+        from = Math.max(0,
+            Math.min(newRows.length, refreshHints.ignoreDiffsBefore));
+      }
+
+      if (refreshHints && refreshHints.ignoreDiffsAfter) {
+        to = Math.min(newRows.length,
+            Math.max(0, refreshHints.ignoreDiffsAfter));
+      }
+
+      for (var i = from, rl = rows.length; i < to; i++) {
+        if (i >= rl) {
+          diff[diff.length] = i;
+        } else {
+          item = newRows[i];
+          r = rows[i];
+
+          if ((groupingInfos.length && (eitherIsNonData = (item.__nonDataRow) || (r.__nonDataRow)) &&
+              item.__group !== r.__group ||
+              item.__group && !item.equals(r))
+              || (eitherIsNonData &&
+              // no good way to compare totals since they are arbitrary DTOs
+              // deep object comparison is pretty expensive
+              // always considering them 'dirty' seems easier for the time being
+              (item.__groupTotals || r.__groupTotals))
+              || item[idProperty] != r[idProperty]
+              || (updated && updated[item[idProperty]])
+              ) {
+            diff[diff.length] = i;
+          }
+        }
+      }
+      return diff;
+    }
+
+    function recalc(_items) {
+      rowsById = null;
+
+      if (refreshHints.isFilterNarrowing != prevRefreshHints.isFilterNarrowing ||
+          refreshHints.isFilterExpanding != prevRefreshHints.isFilterExpanding) {
+        filterCache = [];
+      }
+
+      var filteredItems = getFilteredAndPagedItems(_items);
+      totalRows = filteredItems.totalRows;
+      var newRows = filteredItems.rows;
+
+      groups = [];
+      if (groupingInfos.length) {
+        groups = extractGroups(newRows);
+        if (groups.length) {
+          calculateTotals(groups);
+          finalizeGroups(groups);
+          newRows = flattenGroupedRows(groups);
+        }
+      }
+
+      var diff = getRowDiffs(rows, newRows);
+
+      rows = newRows;
+
+      return diff;
+    }
+
+    function refresh() {
+      if (suspend) {
+        return;
+      }
+
+      var countBefore = rows.length;
+      var totalRowsBefore = totalRows;
+
+      var diff = recalc(items, filter); // pass as direct refs to avoid closure perf hit
+
+      // if the current page is no longer valid, go to last page and recalc
+      // we suffer a performance penalty here, but the main loop (recalc) remains highly optimized
+      if (pagesize && totalRows < pagenum * pagesize) {
+        pagenum = Math.max(0, Math.ceil(totalRows / pagesize) - 1);
+        diff = recalc(items, filter);
+      }
+
+      updated = null;
+      prevRefreshHints = refreshHints;
+      refreshHints = {};
+
+      if (totalRowsBefore != totalRows) {
+        onPagingInfoChanged.notify(getPagingInfo(), null, self);
+      }
+      if (countBefore != rows.length) {
+        onRowCountChanged.notify({previous: countBefore, current: rows.length}, null, self);
+      }
+      if (diff.length > 0) {
+        onRowsChanged.notify({rows: diff}, null, self);
+      }
+    }
+
+    function syncGridSelection(grid, preserveHidden) {
+      var self = this;
+      var selectedRowIds = self.mapRowsToIds(grid.getSelectedRows());;
+      var inHandler;
+
+      function update() {
+        if (selectedRowIds.length > 0) {
+          inHandler = true;
+          var selectedRows = self.mapIdsToRows(selectedRowIds);
+          if (!preserveHidden) {
+            selectedRowIds = self.mapRowsToIds(selectedRows);
+          }
+          grid.setSelectedRows(selectedRows);
+          inHandler = false;
+        }
+      }
+
+      grid.onSelectedRowsChanged.subscribe(function(e, args) {
+        if (inHandler) { return; }
+        selectedRowIds = self.mapRowsToIds(grid.getSelectedRows());
+      });
+
+      this.onRowsChanged.subscribe(update);
+
+      this.onRowCountChanged.subscribe(update);
+    }
+
+    function syncGridCellCssStyles(grid, key) {
+      var hashById;
+      var inHandler;
+
+      // since this method can be called after the cell styles have been set,
+      // get the existing ones right away
+      storeCellCssStyles(grid.getCellCssStyles(key));
+
+      function storeCellCssStyles(hash) {
+        hashById = {};
+        for (var row in hash) {
+          var id = rows[row][idProperty];
+          hashById[id] = hash[row];
+        }
+      }
+
+      function update() {
+        if (hashById) {
+          inHandler = true;
+          ensureRowsByIdCache();
+          var newHash = {};
+          for (var id in hashById) {
+            var row = rowsById[id];
+            if (row != undefined) {
+              newHash[row] = hashById[id];
+            }
+          }
+          grid.setCellCssStyles(key, newHash);
+          inHandler = false;
+        }
+      }
+
+      grid.onCellCssStylesChanged.subscribe(function(e, args) {
+        if (inHandler) { return; }
+        if (key != args.key) { return; }
+        if (args.hash) {
+          storeCellCssStyles(args.hash);
+        }
+      });
+
+      this.onRowsChanged.subscribe(update);
+
+      this.onRowCountChanged.subscribe(update);
+    }
+
+    $.extend(this, {
+      // methods
+      "beginUpdate": beginUpdate,
+      "endUpdate": endUpdate,
+      "setPagingOptions": setPagingOptions,
+      "getPagingInfo": getPagingInfo,
+      "getItems": getItems,
+      "setItems": setItems,
+      "setFilter": setFilter,
+      "sort": sort,
+      "fastSort": fastSort,
+      "reSort": reSort,
+      "setGrouping": setGrouping,
+      "getGrouping": getGrouping,
+      "groupBy": groupBy,
+      "setAggregators": setAggregators,
+      "collapseAllGroups": collapseAllGroups,
+      "expandAllGroups": expandAllGroups,
+      "collapseGroup": collapseGroup,
+      "expandGroup": expandGroup,
+      "getGroups": getGroups,
+      "getIdxById": getIdxById,
+      "getRowById": getRowById,
+      "getItemById": getItemById,
+      "getItemByIdx": getItemByIdx,
+      "mapRowsToIds": mapRowsToIds,
+      "mapIdsToRows": mapIdsToRows,
+      "setRefreshHints": setRefreshHints,
+      "setFilterArgs": setFilterArgs,
+      "refresh": refresh,
+      "updateItem": updateItem,
+      "insertItem": insertItem,
+      "addItem": addItem,
+      "deleteItem": deleteItem,
+      "syncGridSelection": syncGridSelection,
+      "syncGridCellCssStyles": syncGridCellCssStyles,
+
+      // data provider methods
+      "getLength": getLength,
+      "getItem": getItem,
+      "getItemMetadata": getItemMetadata,
+
+      // events
+      "onRowCountChanged": onRowCountChanged,
+      "onRowsChanged": onRowsChanged,
+      "onPagingInfoChanged": onPagingInfoChanged
+    });
+  }
+
+  function AvgAggregator(field) {
+    this.field_ = field;
+
+    this.init = function () {
+      this.count_ = 0;
+      this.nonNullCount_ = 0;
+      this.sum_ = 0;
+    };
+
+    this.accumulate = function (item) {
+      var val = item[this.field_];
+      this.count_++;
+      if (val != null && val !== "" && val !== NaN) {
+        this.nonNullCount_++;
+        this.sum_ += parseFloat(val);
+      }
+    };
+
+    this.storeResult = function (groupTotals) {
+      if (!groupTotals.avg) {
+        groupTotals.avg = {};
+      }
+      if (this.nonNullCount_ != 0) {
+        groupTotals.avg[this.field_] = this.sum_ / this.nonNullCount_;
+      }
+    };
+  }
+
+  function MinAggregator(field) {
+    this.field_ = field;
+
+    this.init = function () {
+      this.min_ = null;
+    };
+
+    this.accumulate = function (item) {
+      var val = item[this.field_];
+      if (val != null && val !== "" && val !== NaN) {
+        if (this.min_ == null || val < this.min_) {
+          this.min_ = val;
+        }
+      }
+    };
+
+    this.storeResult = function (groupTotals) {
+      if (!groupTotals.min) {
+        groupTotals.min = {};
+      }
+      groupTotals.min[this.field_] = this.min_;
+    }
+  }
+
+  function MaxAggregator(field) {
+    this.field_ = field;
+
+    this.init = function () {
+      this.max_ = null;
+    };
+
+    this.accumulate = function (item) {
+      var val = item[this.field_];
+      if (val != null && val !== "" && val !== NaN) {
+        if (this.max_ == null || val > this.max_) {
+          this.max_ = val;
+        }
+      }
+    };
+
+    this.storeResult = function (groupTotals) {
+      if (!groupTotals.max) {
+        groupTotals.max = {};
+      }
+      groupTotals.max[this.field_] = this.max_;
+    }
+  }
+
+  function SumAggregator(field) {
+    this.field_ = field;
+
+    this.init = function () {
+      this.sum_ = null;
+    };
+
+    this.accumulate = function (item) {
+      var val = item[this.field_];
+      if (val != null && val !== "" && val !== NaN) {
+        this.sum_ += parseFloat(val);
+      }
+    };
+
+    this.storeResult = function (groupTotals) {
+      if (!groupTotals.sum) {
+        groupTotals.sum = {};
+      }
+      groupTotals.sum[this.field_] = this.sum_;
+    }
+  }
+
+  // TODO:  add more built-in aggregators
+  // TODO:  merge common aggregators in one to prevent needles iterating
+
+})(jQuery);
diff --git a/third-party/slickgrid-2.1/slick.editors.js b/third-party/slickgrid-2.1/slick.editors.js
new file mode 100644 (file)
index 0000000..f3ef8e9
--- /dev/null
@@ -0,0 +1,512 @@
+/***
+ * Contains basic SlickGrid editors.
+ * @module Editors
+ * @namespace Slick
+ */
+
+(function ($) {
+  // register namespace
+  $.extend(true, window, {
+    "Slick": {
+      "Editors": {
+        "Text": TextEditor,
+        "Integer": IntegerEditor,
+        "Date": DateEditor,
+        "YesNoSelect": YesNoSelectEditor,
+        "Checkbox": CheckboxEditor,
+        "PercentComplete": PercentCompleteEditor,
+        "LongText": LongTextEditor
+      }
+    }
+  });
+
+  function TextEditor(args) {
+    var $input;
+    var defaultValue;
+    var scope = this;
+
+    this.init = function () {
+      $input = $("<INPUT type=text class='editor-text' />")
+          .appendTo(args.container)
+          .bind("keydown.nav", function (e) {
+            if (e.keyCode === $.ui.keyCode.LEFT || e.keyCode === $.ui.keyCode.RIGHT) {
+              e.stopImmediatePropagation();
+            }
+          })
+          .focus()
+          .select();
+    };
+
+    this.destroy = function () {
+      $input.remove();
+    };
+
+    this.focus = function () {
+      $input.focus();
+    };
+
+    this.getValue = function () {
+      return $input.val();
+    };
+
+    this.setValue = function (val) {
+      $input.val(val);
+    };
+
+    this.loadValue = function (item) {
+      defaultValue = item[args.column.field] || "";
+      $input.val(defaultValue);
+      $input[0].defaultValue = defaultValue;
+      $input.select();
+    };
+
+    this.serializeValue = function () {
+      return $input.val();
+    };
+
+    this.applyValue = function (item, state) {
+      item[args.column.field] = state;
+    };
+
+    this.isValueChanged = function () {
+      return (!($input.val() == "" && defaultValue == null)) && ($input.val() != defaultValue);
+    };
+
+    this.validate = function () {
+      if (args.column.validator) {
+        var validationResults = args.column.validator($input.val());
+        if (!validationResults.valid) {
+          return validationResults;
+        }
+      }
+
+      return {
+        valid: true,
+        msg: null
+      };
+    };
+
+    this.init();
+  }
+
+  function IntegerEditor(args) {
+    var $input;
+    var defaultValue;
+    var scope = this;
+
+    this.init = function () {
+      $input = $("<INPUT type=text class='editor-text' />");
+
+      $input.bind("keydown.nav", function (e) {
+        if (e.keyCode === $.ui.keyCode.LEFT || e.keyCode === $.ui.keyCode.RIGHT) {
+          e.stopImmediatePropagation();
+        }
+      });
+
+      $input.appendTo(args.container);
+      $input.focus().select();
+    };
+
+    this.destroy = function () {
+      $input.remove();
+    };
+
+    this.focus = function () {
+      $input.focus();
+    };
+
+    this.loadValue = function (item) {
+      defaultValue = item[args.column.field];
+      $input.val(defaultValue);
+      $input[0].defaultValue = defaultValue;
+      $input.select();
+    };
+
+    this.serializeValue = function () {
+      return parseInt($input.val(), 10) || 0;
+    };
+
+    this.applyValue = function (item, state) {
+      item[args.column.field] = state;
+    };
+
+    this.isValueChanged = function () {
+      return (!($input.val() == "" && defaultValue == null)) && ($input.val() != defaultValue);
+    };
+
+    this.validate = function () {
+      if (isNaN($input.val())) {
+        return {
+          valid: false,
+          msg: "Please enter a valid integer"
+        };
+      }
+
+      return {
+        valid: true,
+        msg: null
+      };
+    };
+
+    this.init();
+  }
+
+  function DateEditor(args) {
+    var $input;
+    var defaultValue;
+    var scope = this;
+    var calendarOpen = false;
+
+    this.init = function () {
+      $input = $("<INPUT type=text class='editor-text' />");
+      $input.appendTo(args.container);
+      $input.focus().select();
+      $input.datepicker({
+        showOn: "button",
+        buttonImageOnly: true,
+        buttonImage: "../images/calendar.gif",
+        beforeShow: function () {
+          calendarOpen = true
+        },
+        onClose: function () {
+          calendarOpen = false
+        }
+      });
+      $input.width($input.width() - 18);
+    };
+
+    this.destroy = function () {
+      $.datepicker.dpDiv.stop(true, true);
+      $input.datepicker("hide");
+      $input.datepicker("destroy");
+      $input.remove();
+    };
+
+    this.show = function () {
+      if (calendarOpen) {
+        $.datepicker.dpDiv.stop(true, true).show();
+      }
+    };
+
+    this.hide = function () {
+      if (calendarOpen) {
+        $.datepicker.dpDiv.stop(true, true).hide();
+      }
+    };
+
+    this.position = function (position) {
+      if (!calendarOpen) {
+        return;
+      }
+      $.datepicker.dpDiv
+          .css("top", position.top + 30)
+          .css("left", position.left);
+    };
+
+    this.focus = function () {
+      $input.focus();
+    };
+
+    this.loadValue = function (item) {
+      defaultValue = item[args.column.field];
+      $input.val(defaultValue);
+      $input[0].defaultValue = defaultValue;
+      $input.select();
+    };
+
+    this.serializeValue = function () {
+      return $input.val();
+    };
+
+    this.applyValue = function (item, state) {
+      item[args.column.field] = state;
+    };
+
+    this.isValueChanged = function () {
+      return (!($input.val() == "" && defaultValue == null)) && ($input.val() != defaultValue);
+    };
+
+    this.validate = function () {
+      return {
+        valid: true,
+        msg: null
+      };
+    };
+
+    this.init();
+  }
+
+  function YesNoSelectEditor(args) {
+    var $select;
+    var defaultValue;
+    var scope = this;
+
+    this.init = function () {
+      $select = $("<SELECT tabIndex='0' class='editor-yesno'><OPTION value='yes'>Yes</OPTION><OPTION value='no'>No</OPTION></SELECT>");
+      $select.appendTo(args.container);
+      $select.focus();
+    };
+
+    this.destroy = function () {
+      $select.remove();
+    };
+
+    this.focus = function () {
+      $select.focus();
+    };
+
+    this.loadValue = function (item) {
+      $select.val((defaultValue = item[args.column.field]) ? "yes" : "no");
+      $select.select();
+    };
+
+    this.serializeValue = function () {
+      return ($select.val() == "yes");
+    };
+
+    this.applyValue = function (item, state) {
+      item[args.column.field] = state;
+    };
+
+    this.isValueChanged = function () {
+      return ($select.val() != defaultValue);
+    };
+
+    this.validate = function () {
+      return {
+        valid: true,
+        msg: null
+      };
+    };
+
+    this.init();
+  }
+
+  function CheckboxEditor(args) {
+    var $select;
+    var defaultValue;
+    var scope = this;
+
+    this.init = function () {
+      $select = $("<INPUT type=checkbox value='true' class='editor-checkbox' hideFocus>");
+      $select.appendTo(args.container);
+      $select.focus();
+    };
+
+    this.destroy = function () {
+      $select.remove();
+    };
+
+    this.focus = function () {
+      $select.focus();
+    };
+
+    this.loadValue = function (item) {
+      defaultValue = !!item[args.column.field];
+      if (defaultValue) {
+        $select.attr("checked", "checked");
+      } else {
+        $select.removeAttr("checked");
+      }
+    };
+
+    this.serializeValue = function () {
+      return !!$select.attr("checked");
+    };
+
+    this.applyValue = function (item, state) {
+      item[args.column.field] = state;
+    };
+
+    this.isValueChanged = function () {
+      return (this.serializeValue() !== defaultValue);
+    };
+
+    this.validate = function () {
+      return {
+        valid: true,
+        msg: null
+      };
+    };
+
+    this.init();
+  }
+
+  function PercentCompleteEditor(args) {
+    var $input, $picker;
+    var defaultValue;
+    var scope = this;
+
+    this.init = function () {
+      $input = $("<INPUT type=text class='editor-percentcomplete' />");
+      $input.width($(args.container).innerWidth() - 25);
+      $input.appendTo(args.container);
+
+      $picker = $("<div class='editor-percentcomplete-picker' />").appendTo(args.container);
+      $picker.append("<div class='editor-percentcomplete-helper'><div class='editor-percentcomplete-wrapper'><div class='editor-percentcomplete-slider' /><div class='editor-percentcomplete-buttons' /></div></div>");
+
+      $picker.find(".editor-percentcomplete-buttons").append("<button val=0>Not started</button><br/><button val=50>In Progress</button><br/><button val=100>Complete</button>");
+
+      $input.focus().select();
+
+      $picker.find(".editor-percentcomplete-slider").slider({
+        orientation: "vertical",
+        range: "min",
+        value: defaultValue,
+        slide: function (event, ui) {
+          $input.val(ui.value)
+        }
+      });
+
+      $picker.find(".editor-percentcomplete-buttons button").bind("click", function (e) {
+        $input.val($(this).attr("val"));
+        $picker.find(".editor-percentcomplete-slider").slider("value", $(this).attr("val"));
+      })
+    };
+
+    this.destroy = function () {
+      $input.remove();
+      $picker.remove();
+    };
+
+    this.focus = function () {
+      $input.focus();
+    };
+
+    this.loadValue = function (item) {
+      $input.val(defaultValue = item[args.column.field]);
+      $input.select();
+    };
+
+    this.serializeValue = function () {
+      return parseInt($input.val(), 10) || 0;
+    };
+
+    this.applyValue = function (item, state) {
+      item[args.column.field] = state;
+    };
+
+    this.isValueChanged = function () {
+      return (!($input.val() == "" && defaultValue == null)) && ((parseInt($input.val(), 10) || 0) != defaultValue);
+    };
+
+    this.validate = function () {
+      if (isNaN(parseInt($input.val(), 10))) {
+        return {
+          valid: false,
+          msg: "Please enter a valid positive number"
+        };
+      }
+
+      return {
+        valid: true,
+        msg: null
+      };
+    };
+
+    this.init();
+  }
+
+  /*
+   * An example of a "detached" editor.
+   * The UI is added onto document BODY and .position(), .show() and .hide() are implemented.
+   * KeyDown events are also handled to provide handling for Tab, Shift-Tab, Esc and Ctrl-Enter.
+   */
+  function LongTextEditor(args) {
+    var $input, $wrapper;
+    var defaultValue;
+    var scope = this;
+
+    this.init = function () {
+      var $container = $("body");
+
+      $wrapper = $("<DIV style='z-index:10000;position:absolute;background:white;padding:5px;border:3px solid gray; -moz-border-radius:10px; border-radius:10px;'/>")
+          .appendTo($container);
+
+      $input = $("<TEXTAREA hidefocus rows=5 style='backround:white;width:250px;height:80px;border:0;outline:0'>")
+          .appendTo($wrapper);
+
+      $("<DIV style='text-align:right'><BUTTON>Save</BUTTON><BUTTON>Cancel</BUTTON></DIV>")
+          .appendTo($wrapper);
+
+      $wrapper.find("button:first").bind("click", this.save);
+      $wrapper.find("button:last").bind("click", this.cancel);
+      $input.bind("keydown", this.handleKeyDown);
+
+      scope.position(args.position);
+      $input.focus().select();
+    };
+
+    this.handleKeyDown = function (e) {
+      if (e.which == $.ui.keyCode.ENTER && e.ctrlKey) {
+        scope.save();
+      } else if (e.which == $.ui.keyCode.ESCAPE) {
+        e.preventDefault();
+        scope.cancel();
+      } else if (e.which == $.ui.keyCode.TAB && e.shiftKey) {
+        e.preventDefault();
+        args.grid.navigatePrev();
+      } else if (e.which == $.ui.keyCode.TAB) {
+        e.preventDefault();
+        args.grid.navigateNext();
+      }
+    };
+
+    this.save = function () {
+      args.commitChanges();
+    };
+
+    this.cancel = function () {
+      $input.val(defaultValue);
+      args.cancelChanges();
+    };
+
+    this.hide = function () {
+      $wrapper.hide();
+    };
+
+    this.show = function () {
+      $wrapper.show();
+    };
+
+    this.position = function (position) {
+      $wrapper
+          .css("top", position.top - 5)
+          .css("left", position.left - 5)
+    };
+
+    this.destroy = function () {
+      $wrapper.remove();
+    };
+
+    this.focus = function () {
+      $input.focus();
+    };
+
+    this.loadValue = function (item) {
+      $input.val(defaultValue = item[args.column.field]);
+      $input.select();
+    };
+
+    this.serializeValue = function () {
+      return $input.val();
+    };
+
+    this.applyValue = function (item, state) {
+      item[args.column.field] = state;
+    };
+
+    this.isValueChanged = function () {
+      return (!($input.val() == "" && defaultValue == null)) && ($input.val() != defaultValue);
+    };
+
+    this.validate = function () {
+      return {
+        valid: true,
+        msg: null
+      };
+    };
+
+    this.init();
+  }
+})(jQuery);
diff --git a/third-party/slickgrid-2.1/slick.formatters.js b/third-party/slickgrid-2.1/slick.formatters.js
new file mode 100644 (file)
index 0000000..a31aaf9
--- /dev/null
@@ -0,0 +1,59 @@
+/***
+ * Contains basic SlickGrid formatters.
+ * 
+ * NOTE:  These are merely examples.  You will most likely need to implement something more
+ *        robust/extensible/localizable/etc. for your use!
+ * 
+ * @module Formatters
+ * @namespace Slick
+ */
+
+(function ($) {
+  // register namespace
+  $.extend(true, window, {
+    "Slick": {
+      "Formatters": {
+        "PercentComplete": PercentCompleteFormatter,
+        "PercentCompleteBar": PercentCompleteBarFormatter,
+        "YesNo": YesNoFormatter,
+        "Checkmark": CheckmarkFormatter
+      }
+    }
+  });
+
+  function PercentCompleteFormatter(row, cell, value, columnDef, dataContext) {
+    if (value == null || value === "") {
+      return "-";
+    } else if (value < 50) {
+      return "<span style='color:red;font-weight:bold;'>" + value + "%</span>";
+    } else {
+      return "<span style='color:green'>" + value + "%</span>";
+    }
+  }
+
+  function PercentCompleteBarFormatter(row, cell, value, columnDef, dataContext) {
+    if (value == null || value === "") {
+      return "";
+    }
+
+    var color;
+
+    if (value < 30) {
+      color = "red";
+    } else if (value < 70) {
+      color = "silver";
+    } else {
+      color = "green";
+    }
+
+    return "<span class='percent-complete-bar' style='background:" + color + ";width:" + value + "%'></span>";
+  }
+
+  function YesNoFormatter(row, cell, value, columnDef, dataContext) {
+    return value ? "Yes" : "No";
+  }
+
+  function CheckmarkFormatter(row, cell, value, columnDef, dataContext) {
+    return value ? "<img src='../images/tick.png'>" : "";
+  }
+})(jQuery);
diff --git a/third-party/slickgrid-2.1/slick.grid.css b/third-party/slickgrid-2.1/slick.grid.css
new file mode 100644 (file)
index 0000000..6a416db
--- /dev/null
@@ -0,0 +1,157 @@
+/*
+IMPORTANT:
+In order to preserve the uniform grid appearance, all cell styles need to have padding, margin and border sizes.
+No built-in (selected, editable, highlight, flashing, invalid, loading, :focus) or user-specified CSS
+classes should alter those!
+*/
+
+.slick-header.ui-state-default, .slick-headerrow.ui-state-default {
+  width: 100%;
+  overflow: hidden;
+  border-left: 0px;
+}
+
+.slick-header-columns, .slick-headerrow-columns {
+  position: relative;
+  white-space: nowrap;
+  cursor: default;
+  overflow: hidden;
+}
+
+.slick-header-column.ui-state-default {
+  position: relative;
+  display: inline-block;
+  overflow: hidden;
+  -o-text-overflow: ellipsis;
+  text-overflow: ellipsis;
+  height: 16px;
+  line-height: 16px;
+  margin: 0;
+  padding: 4px;
+  border-right: 1px solid silver;
+  border-left: 0px;
+  border-top: 0px;
+  border-bottom: 0px;
+  float: left;
+}
+
+.slick-headerrow-column.ui-state-default {
+  padding: 4px;
+}
+
+.slick-header-column-sorted {
+  font-style: italic;
+}
+
+.slick-sort-indicator {
+  display: inline-block;
+  width: 8px;
+  height: 5px;
+  margin-left: 4px;
+  margin-top: 6px;
+  float: left;
+}
+
+.slick-sort-indicator-desc {
+  background: url(images/sort-desc.gif);
+}
+
+.slick-sort-indicator-asc {
+  background: url(images/sort-asc.gif);
+}
+
+.slick-resizable-handle {
+  position: absolute;
+  font-size: 0.1px;
+  display: block;
+  cursor: col-resize;
+  width: 4px;
+  right: 0px;
+  top: 0;
+  height: 100%;
+}
+
+.slick-sortable-placeholder {
+  background: silver;
+}
+
+.grid-canvas {
+  position: relative;
+  outline: 0;
+}
+
+.slick-row.ui-widget-content, .slick-row.ui-state-active {
+  position: absolute;
+  border: 0px;
+  width: 100%;
+}
+
+.slick-cell, .slick-headerrow-column {
+  position: absolute;
+  border: 1px solid transparent;
+  border-right: 1px dotted silver;
+  border-bottom-color: silver;
+  overflow: hidden;
+  -o-text-overflow: ellipsis;
+  text-overflow: ellipsis;
+  vertical-align: middle;
+  z-index: 1;
+  padding: 1px 2px 2px 1px;
+  margin: 0;
+  white-space: nowrap;
+  cursor: default;
+}
+
+.slick-group {
+}
+
+.slick-group-toggle {
+  display: inline-block;
+}
+
+.slick-cell.highlighted {
+  background: lightskyblue;
+  background: rgba(0, 0, 255, 0.2);
+  -webkit-transition: all 0.5s;
+  -moz-transition: all 0.5s;
+  -o-transition: all 0.5s;
+  transition: all 0.5s;
+}
+
+.slick-cell.flashing {
+  border: 1px solid red !important;
+}
+
+.slick-cell.editable {
+  z-index: 11;
+  overflow: visible;
+  background: white;
+  border-color: black;
+  border-style: solid;
+}
+
+.slick-cell:focus {
+  outline: none;
+}
+
+.slick-reorder-proxy {
+  display: inline-block;
+  background: blue;
+  opacity: 0.15;
+  filter: alpha(opacity = 15);
+  cursor: move;
+}
+
+.slick-reorder-guide {
+  display: inline-block;
+  height: 2px;
+  background: blue;
+  opacity: 0.7;
+  filter: alpha(opacity = 70);
+}
+
+.slick-selection {
+  z-index: 10;
+  position: absolute;
+  border: 2px dashed black;
+}
diff --git a/third-party/slickgrid-2.1/slick.grid.js b/third-party/slickgrid-2.1/slick.grid.js
new file mode 100644 (file)
index 0000000..6fdbdba
--- /dev/null
@@ -0,0 +1,3309 @@
+/**\r
+ * @license\r
+ * (c) 2009-2012 Michael Leibman\r
+ * michael{dot}leibman{at}gmail{dot}com\r
+ * http://github.com/mleibman/slickgrid\r
+ *\r
+ * Distributed under MIT license.\r
+ * All rights reserved.\r
+ *\r
+ * SlickGrid v2.1\r
+ *\r
+ * NOTES:\r
+ *     Cell/row DOM manipulations are done directly bypassing jQuery's DOM manipulation methods.\r
+ *     This increases the speed dramatically, but can only be done safely because there are no event handlers\r
+ *     or data associated with any cell/row DOM nodes.  Cell editors must make sure they implement .destroy()\r
+ *     and do proper cleanup.\r
+ */\r
+\r
+// make sure required JavaScript modules are loaded\r
+if (typeof jQuery === "undefined") {\r
+  throw "SlickGrid requires jquery module to be loaded";\r
+}\r
+if (!jQuery.fn.drag) {\r
+  throw "SlickGrid requires jquery.event.drag module to be loaded";\r
+}\r
+if (typeof Slick === "undefined") {\r
+  throw "slick.core.js not loaded";\r
+}\r
+\r
+\r
+(function ($) {\r
+  // Slick.Grid\r
+  $.extend(true, window, {\r
+    Slick: {\r
+      Grid: SlickGrid\r
+    }\r
+  });\r
+\r
+  // shared across all grids on the page\r
+  var scrollbarDimensions;\r
+  var maxSupportedCssHeight;  // browser's breaking point\r
+\r
+  //////////////////////////////////////////////////////////////////////////////////////////////\r
+  // SlickGrid class implementation (available as Slick.Grid)\r
+\r
+  /**\r
+   * Creates a new instance of the grid.\r
+   * @class SlickGrid\r
+   * @constructor\r
+   * @param {Node}              container   Container node to create the grid in.\r
+   * @param {Array,Object}      data        An array of objects for databinding.\r
+   * @param {Array}             columns     An array of column definitions.\r
+   * @param {Object}            options     Grid options.\r
+   **/\r
+  function SlickGrid(container, data, columns, options) {\r
+    // settings\r
+    var defaults = {\r
+      explicitInitialization: false,\r
+      rowHeight: 25,\r
+      defaultColumnWidth: 80,\r
+      enableAddRow: false,\r
+      leaveSpaceForNewRows: false,\r
+      editable: false,\r
+      autoEdit: true,\r
+      enableCellNavigation: true,\r
+      enableColumnReorder: true,\r
+      asyncEditorLoading: false,\r
+      asyncEditorLoadDelay: 100,\r
+      forceFitColumns: false,\r
+      enableAsyncPostRender: false,\r
+      asyncPostRenderDelay: 50,\r
+      autoHeight: false,\r
+      editorLock: Slick.GlobalEditorLock,\r
+      showHeaderRow: false,\r
+      headerRowHeight: 25,\r
+      showTopPanel: false,\r
+      topPanelHeight: 25,\r
+      formatterFactory: null,\r
+      editorFactory: null,\r
+      cellFlashingCssClass: "flashing",\r
+      selectedCellCssClass: "selected",\r
+      multiSelect: true,\r
+      enableTextSelectionOnCells: false,\r
+      dataItemColumnValueExtractor: null,\r
+      fullWidthRows: false,\r
+      multiColumnSort: false,\r
+      defaultFormatter: defaultFormatter,\r
+      forceSyncScrolling: false\r
+    };\r
+\r
+    var columnDefaults = {\r
+      name: "",\r
+      resizable: true,\r
+      sortable: false,\r
+      minWidth: 30,\r
+      rerenderOnResize: false,\r
+      headerCssClass: null,\r
+      defaultSortAsc: true,\r
+      focusable: true,\r
+      selectable: true\r
+    };\r
+\r
+    // scroller\r
+    var th;   // virtual height\r
+    var h;    // real scrollable height\r
+    var ph;   // page height\r
+    var n;    // number of pages\r
+    var cj;   // "jumpiness" coefficient\r
+\r
+    var page = 0;       // current page\r
+    var offset = 0;     // current page offset\r
+    var vScrollDir = 1;\r
+\r
+    // private\r
+    var initialized = false;\r
+    var $container;\r
+    var uid = "slickgrid_" + Math.round(1000000 * Math.random());\r
+    var self = this;\r
+    var $focusSink, $focusSink2;\r
+    var $headerScroller;\r
+    var $headers;\r
+    var $headerRow, $headerRowScroller, $headerRowSpacer;\r
+    var $topPanelScroller;\r
+    var $topPanel;\r
+    var $viewport;\r
+    var $canvas;\r
+    var $style;\r
+    var $boundAncestors;\r
+    var stylesheet, columnCssRulesL, columnCssRulesR;\r
+    var viewportH, viewportW;\r
+    var canvasWidth;\r
+    var viewportHasHScroll, viewportHasVScroll;\r
+    var headerColumnWidthDiff = 0, headerColumnHeightDiff = 0, // border+padding\r
+        cellWidthDiff = 0, cellHeightDiff = 0;\r
+    var absoluteColumnMinWidth;\r
+    var numberOfRows = 0;\r
+\r
+    var tabbingDirection = 1;\r
+    var activePosX;\r
+    var activeRow, activeCell;\r
+    var activeCellNode = null;\r
+    var currentEditor = null;\r
+    var serializedEditorValue;\r
+    var editController;\r
+\r
+    var rowsCache = {};\r
+    var renderedRows = 0;\r
+    var numVisibleRows;\r
+    var prevScrollTop = 0;\r
+    var scrollTop = 0;\r
+    var lastRenderedScrollTop = 0;\r
+    var lastRenderedScrollLeft = 0;\r
+    var prevScrollLeft = 0;\r
+    var scrollLeft = 0;\r
+\r
+    var selectionModel;\r
+    var selectedRows = [];\r
+\r
+    var plugins = [];\r
+    var cellCssClasses = {};\r
+\r
+    var columnsById = {};\r
+    var sortColumns = [];\r
+    var columnPosLeft = [];\r
+    var columnPosRight = [];\r
+\r
+\r
+    // async call handles\r
+    var h_editorLoader = null;\r
+    var h_render = null;\r
+    var h_postrender = null;\r
+    var postProcessedRows = {};\r
+    var postProcessToRow = null;\r
+    var postProcessFromRow = null;\r
+\r
+    // perf counters\r
+    var counter_rows_rendered = 0;\r
+    var counter_rows_removed = 0;\r
+\r
+\r
+    //////////////////////////////////////////////////////////////////////////////////////////////\r
+    // Initialization\r
+\r
+    function init() {\r
+      $container = $(container);\r
+      if ($container.length < 1) {\r
+        throw new Error("SlickGrid requires a valid container, " + container + " does not exist in the DOM.");\r
+      }\r
+\r
+      // calculate these only once and share between grid instances\r
+      maxSupportedCssHeight = maxSupportedCssHeight || getMaxSupportedCssHeight();\r
+      scrollbarDimensions = scrollbarDimensions || measureScrollbar();\r
+\r
+      options = $.extend({}, defaults, options);\r
+      validateAndEnforceOptions();\r
+      columnDefaults.width = options.defaultColumnWidth;\r
+\r
+      columnsById = {};\r
+      for (var i = 0; i < columns.length; i++) {\r
+        var m = columns[i] = $.extend({}, columnDefaults, columns[i]);\r
+        columnsById[m.id] = i;\r
+        if (m.minWidth && m.width < m.minWidth) {\r
+          m.width = m.minWidth;\r
+        }\r
+        if (m.maxWidth && m.width > m.maxWidth) {\r
+          m.width = m.maxWidth;\r
+        }\r
+      }\r
+\r
+      // validate loaded JavaScript modules against requested options\r
+      if (options.enableColumnReorder && !$.fn.sortable) {\r
+        throw new Error("SlickGrid's 'enableColumnReorder = true' option requires jquery-ui.sortable module to be loaded");\r
+      }\r
+\r
+      editController = {\r
+        "commitCurrentEdit": commitCurrentEdit,\r
+        "cancelCurrentEdit": cancelCurrentEdit\r
+      };\r
+\r
+      $container\r
+          .empty()\r
+          .css("overflow", "hidden")\r
+          .css("outline", 0)\r
+          .addClass(uid)\r
+          .addClass("ui-widget");\r
+\r
+      // set up a positioning container if needed\r
+      if (!/relative|absolute|fixed/.test($container.css("position"))) {\r
+        $container.css("position", "relative");\r
+      }\r
+\r
+      $focusSink = $("<div tabIndex='0' hideFocus style='position:fixed;width:0;height:0;top:0;left:0;outline:0;'></div>").appendTo($container);\r
+\r
+      $headerScroller = $("<div class='slick-header ui-state-default' style='overflow:hidden;position:relative;' />").appendTo($container);\r
+      $headers = $("<div class='slick-header-columns' style='left:-1000px' />").appendTo($headerScroller);\r
+      $headers.width(getHeadersWidth());\r
+\r
+      $headerRowScroller = $("<div class='slick-headerrow ui-state-default' style='overflow:hidden;position:relative;' />").appendTo($container);\r
+      $headerRow = $("<div class='slick-headerrow-columns' />").appendTo($headerRowScroller);\r
+      $headerRowSpacer = $("<div style='display:block;height:1px;position:absolute;top:0;left:0;'></div>")\r
+          .css("width", getCanvasWidth() + scrollbarDimensions.width + "px")\r
+          .appendTo($headerRowScroller);\r
+\r
+      $topPanelScroller = $("<div class='slick-top-panel-scroller ui-state-default' style='overflow:hidden;position:relative;' />").appendTo($container);\r
+      $topPanel = $("<div class='slick-top-panel' style='width:10000px' />").appendTo($topPanelScroller);\r
+\r
+      if (!options.showTopPanel) {\r
+        $topPanelScroller.hide();\r
+      }\r
+\r
+      if (!options.showHeaderRow) {\r
+        $headerRowScroller.hide();\r
+      }\r
+\r
+      $viewport = $("<div class='slick-viewport' style='width:100%;overflow:auto;outline:0;position:relative;;'>").appendTo($container);\r
+      $viewport.css("overflow-y", options.autoHeight ? "hidden" : "auto");\r
+\r
+      $canvas = $("<div class='grid-canvas' />").appendTo($viewport);\r
+\r
+      $focusSink2 = $focusSink.clone().appendTo($container);\r
+\r
+      if (!options.explicitInitialization) {\r
+        finishInitialization();\r
+      }\r
+    }\r
+\r
+    function finishInitialization() {\r
+      if (!initialized) {\r
+        initialized = true;\r
+\r
+        viewportW = parseFloat($.css($container[0], "width", true));\r
+\r
+        // header columns and cells may have different padding/border skewing width calculations (box-sizing, hello?)\r
+        // calculate the diff so we can set consistent sizes\r
+        measureCellPaddingAndBorder();\r
+\r
+        // for usability reasons, all text selection in SlickGrid is disabled\r
+        // with the exception of input and textarea elements (selection must\r
+        // be enabled there so that editors work as expected); note that\r
+        // selection in grid cells (grid body) is already unavailable in\r
+        // all browsers except IE\r
+        disableSelection($headers); // disable all text selection in header (including input and textarea)\r
+\r
+        if (!options.enableTextSelectionOnCells) {\r
+          // disable text selection in grid cells except in input and textarea elements\r
+          // (this is IE-specific, because selectstart event will only fire in IE)\r
+          $viewport.bind("selectstart.ui", function (event) {\r
+            return $(event.target).is("input,textarea");\r
+          });\r
+        }\r
+\r
+        updateColumnCaches();\r
+        createColumnHeaders();\r
+        setupColumnSort();\r
+        createCssRules();\r
+        resizeCanvas();\r
+        bindAncestorScrollEvents();\r
+\r
+        $container\r
+            .bind("resize.slickgrid", resizeCanvas);\r
+        $viewport\r
+            .bind("scroll", handleScroll);\r
+        $headerScroller\r
+            .bind("contextmenu", handleHeaderContextMenu)\r
+            .bind("click", handleHeaderClick)\r
+            .delegate(".slick-header-column", "mouseenter", handleHeaderMouseEnter)\r
+            .delegate(".slick-header-column", "mouseleave", handleHeaderMouseLeave);\r
+        $headerRowScroller\r
+            .bind("scroll", handleHeaderRowScroll);\r
+        $focusSink.add($focusSink2)\r
+            .bind("keydown", handleKeyDown);\r
+        $canvas\r
+            .bind("keydown", handleKeyDown)\r
+            .bind("click", handleClick)\r
+            .bind("dblclick", handleDblClick)\r
+            .bind("contextmenu", handleContextMenu)\r
+            .bind("draginit", handleDragInit)\r
+            .bind("dragstart", {distance: 3}, handleDragStart)\r
+            .bind("drag", handleDrag)\r
+            .bind("dragend", handleDragEnd)\r
+            .delegate(".slick-cell", "mouseenter", handleMouseEnter)\r
+            .delegate(".slick-cell", "mouseleave", handleMouseLeave);\r
+      }\r
+    }\r
+\r
+    function registerPlugin(plugin) {\r
+      plugins.unshift(plugin);\r
+      plugin.init(self);\r
+    }\r
+\r
+    function unregisterPlugin(plugin) {\r
+      for (var i = plugins.length; i >= 0; i--) {\r
+        if (plugins[i] === plugin) {\r
+          if (plugins[i].destroy) {\r
+            plugins[i].destroy();\r
+          }\r
+          plugins.splice(i, 1);\r
+          break;\r
+        }\r
+      }\r
+    }\r
+\r
+    function setSelectionModel(model) {\r
+      if (selectionModel) {\r
+        selectionModel.onSelectedRangesChanged.unsubscribe(handleSelectedRangesChanged);\r
+        if (selectionModel.destroy) {\r
+          selectionModel.destroy();\r
+        }\r
+      }\r
+\r
+      selectionModel = model;\r
+      if (selectionModel) {\r
+        selectionModel.init(self);\r
+        selectionModel.onSelectedRangesChanged.subscribe(handleSelectedRangesChanged);\r
+      }\r
+    }\r
+\r
+    function getSelectionModel() {\r
+      return selectionModel;\r
+    }\r
+\r
+    function getCanvasNode() {\r
+      return $canvas[0];\r
+    }\r
+\r
+    function measureScrollbar() {\r
+      var $c = $("<div style='position:absolute; top:-10000px; left:-10000px; width:100px; height:100px; overflow:scroll;'></div>").appendTo("body");\r
+      var dim = {\r
+        width: $c.width() - $c[0].clientWidth,\r
+        height: $c.height() - $c[0].clientHeight\r
+      };\r
+      $c.remove();\r
+      return dim;\r
+    }\r
+\r
+    function getHeadersWidth() {\r
+      var headersWidth = 0;\r
+      for (var i = 0, ii = columns.length; i < ii; i++) {\r
+        var width = columns[i].width;\r
+        headersWidth += width;\r
+      }\r
+      headersWidth += scrollbarDimensions.width;\r
+      return Math.max(headersWidth, viewportW) + 1000;\r
+    }\r
+\r
+    function getCanvasWidth() {\r
+      var availableWidth = viewportHasVScroll ? viewportW - scrollbarDimensions.width : viewportW;\r
+      var rowWidth = 0;\r
+      var i = columns.length;\r
+      while (i--) {\r
+        rowWidth += columns[i].width;\r
+      }\r
+      return options.fullWidthRows ? Math.max(rowWidth, availableWidth) : rowWidth;\r
+    }\r
+\r
+    function updateCanvasWidth(forceColumnWidthsUpdate) {\r
+      var oldCanvasWidth = canvasWidth;\r
+      canvasWidth = getCanvasWidth();\r
+\r
+      if (canvasWidth != oldCanvasWidth) {\r
+        $canvas.width(canvasWidth);\r
+        $headerRow.width(canvasWidth);\r
+        $headers.width(getHeadersWidth());\r
+        viewportHasHScroll = (canvasWidth > viewportW - scrollbarDimensions.width);\r
+      }\r
+\r
+      $headerRowSpacer.width(canvasWidth + (viewportHasVScroll ? scrollbarDimensions.width : 0));\r
+\r
+      if (canvasWidth != oldCanvasWidth || forceColumnWidthsUpdate) {\r
+        applyColumnWidths();\r
+      }\r
+    }\r
+\r
+    function disableSelection($target) {\r
+      if ($target && $target.jquery) {\r
+        $target\r
+            .attr("unselectable", "on")\r
+            .css("MozUserSelect", "none")\r
+            .bind("selectstart.ui", function () {\r
+              return false;\r
+            }); // from jquery:ui.core.js 1.7.2\r
+      }\r
+    }\r
+\r
+    function getMaxSupportedCssHeight() {\r
+      var supportedHeight = 1000000;\r
+      // FF reports the height back but still renders blank after ~6M px\r
+      var testUpTo = navigator.userAgent.toLowerCase().match(/firefox/) ? 6000000 : 1000000000;\r
+      var div = $("<div style='display:none' />").appendTo(document.body);\r
+\r
+      while (true) {\r
+        var test = supportedHeight * 2;\r
+        div.css("height", test);\r
+        if (test > testUpTo || div.height() !== test) {\r
+          break;\r
+        } else {\r
+          supportedHeight = test;\r
+        }\r
+      }\r
+\r
+      div.remove();\r
+      return supportedHeight;\r
+    }\r
+\r
+    // TODO:  this is static.  need to handle page mutation.\r
+    function bindAncestorScrollEvents() {\r
+      var elem = $canvas[0];\r
+      while ((elem = elem.parentNode) != document.body && elem != null) {\r
+        // bind to scroll containers only\r
+        if (elem == $viewport[0] || elem.scrollWidth != elem.clientWidth || elem.scrollHeight != elem.clientHeight) {\r
+          var $elem = $(elem);\r
+          if (!$boundAncestors) {\r
+            $boundAncestors = $elem;\r
+          } else {\r
+            $boundAncestors = $boundAncestors.add($elem);\r
+          }\r
+          $elem.bind("scroll." + uid, handleActiveCellPositionChange);\r
+        }\r
+      }\r
+    }\r
+\r
+    function unbindAncestorScrollEvents() {\r
+      if (!$boundAncestors) {\r
+        return;\r
+      }\r
+      $boundAncestors.unbind("scroll." + uid);\r
+      $boundAncestors = null;\r
+    }\r
+\r
+    function updateColumnHeader(columnId, title, toolTip) {\r
+      if (!initialized) { return; }\r
+      var idx = getColumnIndex(columnId);\r
+      if (idx == null) {\r
+        return;\r
+      }\r
+\r
+      var columnDef = columns[idx];\r
+      var $header = $headers.children().eq(idx);\r
+      if ($header) {\r
+        if (title !== undefined) {\r
+          columns[idx].name = title;\r
+        }\r
+        if (toolTip !== undefined) {\r
+          columns[idx].toolTip = toolTip;\r
+        }\r
+\r
+        trigger(self.onBeforeHeaderCellDestroy, {\r
+          "node": $header[0],\r
+          "column": columnDef\r
+        });\r
+\r
+        $header\r
+            .attr("title", toolTip || "")\r
+            .children().eq(0).html(title);\r
+\r
+        trigger(self.onHeaderCellRendered, {\r
+          "node": $header[0],\r
+          "column": columnDef\r
+        });\r
+      }\r
+    }\r
+\r
+    function getHeaderRow() {\r
+      return $headerRow[0];\r
+    }\r
+\r
+    function getHeaderRowColumn(columnId) {\r
+      var idx = getColumnIndex(columnId);\r
+      var $header = $headerRow.children().eq(idx);\r
+      return $header && $header[0];\r
+    }\r
+\r
+    function createColumnHeaders() {\r
+      function onMouseEnter() {\r
+        $(this).addClass("ui-state-hover");\r
+      }\r
+\r
+      function onMouseLeave() {\r
+        $(this).removeClass("ui-state-hover");\r
+      }\r
+\r
+      $headers.find(".slick-header-column")\r
+        .each(function() {\r
+          var columnDef = $(this).data("column");\r
+          if (columnDef) {\r
+            trigger(self.onBeforeHeaderCellDestroy, {\r
+              "node": this,\r
+              "column": columnDef\r
+            });\r
+          }\r
+        });\r
+      $headers.empty();\r
+      $headers.width(getHeadersWidth());\r
+\r
+      $headerRow.find(".slick-headerrow-column")\r
+        .each(function() {\r
+          var columnDef = $(this).data("column");\r
+          if (columnDef) {\r
+            trigger(self.onBeforeHeaderRowCellDestroy, {\r
+              "node": this,\r
+              "column": columnDef\r
+            });\r
+          }\r
+        });\r
+      $headerRow.empty();\r
+\r
+      for (var i = 0; i < columns.length; i++) {\r
+        var m = columns[i];\r
+\r
+        var header = $("<div class='ui-state-default slick-header-column' />")\r
+            .html("<span class='slick-column-name'>" + m.name + "</span>")\r
+            .width(m.width - headerColumnWidthDiff)\r
+            .attr("id", "" + uid + m.id)\r
+            .attr("title", m.toolTip || "")\r
+            .data("column", m)\r
+            .addClass(m.headerCssClass || "")\r
+            .appendTo($headers);\r
+\r
+        if (options.enableColumnReorder || m.sortable) {\r
+          header\r
+            .on('mouseenter', onMouseEnter)\r
+            .on('mouseleave', onMouseLeave);\r
+        }\r
+\r
+        if (m.sortable) {\r
+          header.addClass("slick-header-sortable");\r
+          header.append("<span class='slick-sort-indicator' />");\r
+        }\r
+\r
+        trigger(self.onHeaderCellRendered, {\r
+          "node": header[0],\r
+          "column": m\r
+        });\r
+\r
+        if (options.showHeaderRow) {\r
+          var headerRowCell = $("<div class='ui-state-default slick-headerrow-column l" + i + " r" + i + "'></div>")\r
+              .data("column", m)\r
+              .appendTo($headerRow);\r
+\r
+          trigger(self.onHeaderRowCellRendered, {\r
+            "node": headerRowCell[0],\r
+            "column": m\r
+          });\r
+        }\r
+      }\r
+\r
+      setSortColumns(sortColumns);\r
+      setupColumnResize();\r
+      if (options.enableColumnReorder) {\r
+        setupColumnReorder();\r
+      }\r
+    }\r
+\r
+    function setupColumnSort() {\r
+      $headers.click(function (e) {\r
+        // temporary workaround for a bug in jQuery 1.7.1 (http://bugs.jquery.com/ticket/11328)\r
+        e.metaKey = e.metaKey || e.ctrlKey;\r
+\r
+        if ($(e.target).hasClass("slick-resizable-handle")) {\r
+          return;\r
+        }\r
+\r
+        var $col = $(e.target).closest(".slick-header-column");\r
+        if (!$col.length) {\r
+          return;\r
+        }\r
+\r
+        var column = $col.data("column");\r
+        if (column.sortable) {\r
+          if (!getEditorLock().commitCurrentEdit()) {\r
+            return;\r
+          }\r
+\r
+          var sortOpts = null;\r
+          var i = 0;\r
+          for (; i < sortColumns.length; i++) {\r
+            if (sortColumns[i].columnId == column.id) {\r
+              sortOpts = sortColumns[i];\r
+              sortOpts.sortAsc = !sortOpts.sortAsc;\r
+              break;\r
+            }\r
+          }\r
+\r
+          if (e.metaKey && options.multiColumnSort) {\r
+            if (sortOpts) {\r
+              sortColumns.splice(i, 1);\r
+            }\r
+          }\r
+          else {\r
+            if ((!e.shiftKey && !e.metaKey) || !options.multiColumnSort) {\r
+              sortColumns = [];\r
+            }\r
+\r
+            if (!sortOpts) {\r
+              sortOpts = { columnId: column.id, sortAsc: column.defaultSortAsc };\r
+              sortColumns.push(sortOpts);\r
+            } else if (sortColumns.length == 0) {\r
+              sortColumns.push(sortOpts);\r
+            }\r
+          }\r
+\r
+          setSortColumns(sortColumns);\r
+\r
+          if (!options.multiColumnSort) {\r
+            trigger(self.onSort, {\r
+              multiColumnSort: false,\r
+              sortCol: column,\r
+              sortAsc: sortOpts.sortAsc}, e);\r
+          } else {\r
+            trigger(self.onSort, {\r
+              multiColumnSort: true,\r
+              sortCols: $.map(sortColumns, function(col) {\r
+                return {sortCol: columns[getColumnIndex(col.columnId)], sortAsc: col.sortAsc };\r
+              })}, e);\r
+          }\r
+        }\r
+      });\r
+    }\r
+\r
+    function setupColumnReorder() {\r
+      $headers.filter(":ui-sortable").sortable("destroy");\r
+      $headers.sortable({\r
+        containment: "parent",\r
+        distance: 3,\r
+        axis: "x",\r
+        cursor: "default",\r
+        tolerance: "intersection",\r
+        helper: "clone",\r
+        placeholder: "slick-sortable-placeholder ui-state-default slick-header-column",\r
+        forcePlaceholderSize: true,\r
+        start: function (e, ui) {\r
+          $(ui.helper).addClass("slick-header-column-active");\r
+        },\r
+        beforeStop: function (e, ui) {\r
+          $(ui.helper).removeClass("slick-header-column-active");\r
+        },\r
+        stop: function (e) {\r
+          if (!getEditorLock().commitCurrentEdit()) {\r
+            $(this).sortable("cancel");\r
+            return;\r
+          }\r
+\r
+          var reorderedIds = $headers.sortable("toArray");\r
+          var reorderedColumns = [];\r
+          for (var i = 0; i < reorderedIds.length; i++) {\r
+            reorderedColumns.push(columns[getColumnIndex(reorderedIds[i].replace(uid, ""))]);\r
+          }\r
+          setColumns(reorderedColumns);\r
+\r
+          trigger(self.onColumnsReordered, {});\r
+          e.stopPropagation();\r
+          setupColumnResize();\r
+        }\r
+      });\r
+    }\r
+\r
+    function setupColumnResize() {\r
+      var $col, j, c, pageX, columnElements, minPageX, maxPageX, firstResizable, lastResizable;\r
+      columnElements = $headers.children();\r
+      columnElements.find(".slick-resizable-handle").remove();\r
+      columnElements.each(function (i, e) {\r
+        if (columns[i].resizable) {\r
+          if (firstResizable === undefined) {\r
+            firstResizable = i;\r
+          }\r
+          lastResizable = i;\r
+        }\r
+      });\r
+      if (firstResizable === undefined) {\r
+        return;\r
+      }\r
+      columnElements.each(function (i, e) {\r
+        if (i < firstResizable || (options.forceFitColumns && i >= lastResizable)) {\r
+          return;\r
+        }\r
+        $col = $(e);\r
+        $("<div class='slick-resizable-handle' />")\r
+            .appendTo(e)\r
+            .bind("dragstart", function (e, dd) {\r
+              if (!getEditorLock().commitCurrentEdit()) {\r
+                return false;\r
+              }\r
+              pageX = e.pageX;\r
+              $(this).parent().addClass("slick-header-column-active");\r
+              var shrinkLeewayOnRight = null, stretchLeewayOnRight = null;\r
+              // lock each column's width option to current width\r
+              columnElements.each(function (i, e) {\r
+                columns[i].previousWidth = $(e).outerWidth();\r
+              });\r
+              if (options.forceFitColumns) {\r
+                shrinkLeewayOnRight = 0;\r
+                stretchLeewayOnRight = 0;\r
+                // colums on right affect maxPageX/minPageX\r
+                for (j = i + 1; j < columnElements.length; j++) {\r
+                  c = columns[j];\r
+                  if (c.resizable) {\r
+                    if (stretchLeewayOnRight !== null) {\r
+                      if (c.maxWidth) {\r
+                        stretchLeewayOnRight += c.maxWidth - c.previousWidth;\r
+                      } else {\r
+                        stretchLeewayOnRight = null;\r
+                      }\r
+                    }\r
+                    shrinkLeewayOnRight += c.previousWidth - Math.max(c.minWidth || 0, absoluteColumnMinWidth);\r
+                  }\r
+                }\r
+              }\r
+              var shrinkLeewayOnLeft = 0, stretchLeewayOnLeft = 0;\r
+              for (j = 0; j <= i; j++) {\r
+                // columns on left only affect minPageX\r
+                c = columns[j];\r
+                if (c.resizable) {\r
+                  if (stretchLeewayOnLeft !== null) {\r
+                    if (c.maxWidth) {\r
+                      stretchLeewayOnLeft += c.maxWidth - c.previousWidth;\r
+                    } else {\r
+                      stretchLeewayOnLeft = null;\r
+                    }\r
+                  }\r
+                  shrinkLeewayOnLeft += c.previousWidth - Math.max(c.minWidth || 0, absoluteColumnMinWidth);\r
+                }\r
+              }\r
+              if (shrinkLeewayOnRight === null) {\r
+                shrinkLeewayOnRight = 100000;\r
+              }\r
+              if (shrinkLeewayOnLeft === null) {\r
+                shrinkLeewayOnLeft = 100000;\r
+              }\r
+              if (stretchLeewayOnRight === null) {\r
+                stretchLeewayOnRight = 100000;\r
+              }\r
+              if (stretchLeewayOnLeft === null) {\r
+                stretchLeewayOnLeft = 100000;\r
+              }\r
+              maxPageX = pageX + Math.min(shrinkLeewayOnRight, stretchLeewayOnLeft);\r
+              minPageX = pageX - Math.min(shrinkLeewayOnLeft, stretchLeewayOnRight);\r
+            })\r
+            .bind("drag", function (e, dd) {\r
+              var actualMinWidth, d = Math.min(maxPageX, Math.max(minPageX, e.pageX)) - pageX, x;\r
+              if (d < 0) { // shrink column\r
+                x = d;\r
+                for (j = i; j >= 0; j--) {\r
+                  c = columns[j];\r
+                  if (c.resizable) {\r
+                    actualMinWidth = Math.max(c.minWidth || 0, absoluteColumnMinWidth);\r
+                    if (x && c.previousWidth + x < actualMinWidth) {\r
+                      x += c.previousWidth - actualMinWidth;\r
+                      c.width = actualMinWidth;\r
+                    } else {\r
+                      c.width = c.previousWidth + x;\r
+                      x = 0;\r
+                    }\r
+                  }\r
+                }\r
+\r
+                if (options.forceFitColumns) {\r
+                  x = -d;\r
+                  for (j = i + 1; j < columnElements.length; j++) {\r
+                    c = columns[j];\r
+                    if (c.resizable) {\r
+                      if (x && c.maxWidth && (c.maxWidth - c.previousWidth < x)) {\r
+                        x -= c.maxWidth - c.previousWidth;\r
+                        c.width = c.maxWidth;\r
+                      } else {\r
+                        c.width = c.previousWidth + x;\r
+                        x = 0;\r
+                      }\r
+                    }\r
+                  }\r
+                }\r
+              } else { // stretch column\r
+                x = d;\r
+                for (j = i; j >= 0; j--) {\r
+                  c = columns[j];\r
+                  if (c.resizable) {\r
+                    if (x && c.maxWidth && (c.maxWidth - c.previousWidth < x)) {\r
+                      x -= c.maxWidth - c.previousWidth;\r
+                      c.width = c.maxWidth;\r
+                    } else {\r
+                      c.width = c.previousWidth + x;\r
+                      x = 0;\r
+                    }\r
+                  }\r
+                }\r
+\r
+                if (options.forceFitColumns) {\r
+                  x = -d;\r
+                  for (j = i + 1; j < columnElements.length; j++) {\r
+                    c = columns[j];\r
+                    if (c.resizable) {\r
+                      actualMinWidth = Math.max(c.minWidth || 0, absoluteColumnMinWidth);\r
+                      if (x && c.previousWidth + x < actualMinWidth) {\r
+                        x += c.previousWidth - actualMinWidth;\r
+                        c.width = actualMinWidth;\r
+                      } else {\r
+                        c.width = c.previousWidth + x;\r
+                        x = 0;\r
+                      }\r
+                    }\r
+                  }\r
+                }\r
+              }\r
+              applyColumnHeaderWidths();\r
+              if (options.syncColumnCellResize) {\r
+                applyColumnWidths();\r
+              }\r
+            })\r
+            .bind("dragend", function (e, dd) {\r
+              var newWidth;\r
+              $(this).parent().removeClass("slick-header-column-active");\r
+              for (j = 0; j < columnElements.length; j++) {\r
+                c = columns[j];\r
+                newWidth = $(columnElements[j]).outerWidth();\r
+\r
+                if (c.previousWidth !== newWidth && c.rerenderOnResize) {\r
+                  invalidateAllRows();\r
+                }\r
+              }\r
+              updateCanvasWidth(true);\r
+              render();\r
+              trigger(self.onColumnsResized, {});\r
+            });\r
+      });\r
+    }\r
+\r
+    function getVBoxDelta($el) {\r
+      var p = ["borderTopWidth", "borderBottomWidth", "paddingTop", "paddingBottom"];\r
+      var delta = 0;\r
+      $.each(p, function (n, val) {\r
+        delta += parseFloat($el.css(val)) || 0;\r
+      });\r
+      return delta;\r
+    }\r
+\r
+    function measureCellPaddingAndBorder() {\r
+      var el;\r
+      var h = ["borderLeftWidth", "borderRightWidth", "paddingLeft", "paddingRight"];\r
+      var v = ["borderTopWidth", "borderBottomWidth", "paddingTop", "paddingBottom"];\r
+\r
+      el = $("<div class='ui-state-default slick-header-column' style='visibility:hidden'>-</div>").appendTo($headers);\r
+      headerColumnWidthDiff = headerColumnHeightDiff = 0;\r
+      $.each(h, function (n, val) {\r
+        headerColumnWidthDiff += parseFloat(el.css(val)) || 0;\r
+      });\r
+      $.each(v, function (n, val) {\r
+        headerColumnHeightDiff += parseFloat(el.css(val)) || 0;\r
+      });\r
+      el.remove();\r
+\r
+      var r = $("<div class='slick-row' />").appendTo($canvas);\r
+      el = $("<div class='slick-cell' id='' style='visibility:hidden'>-</div>").appendTo(r);\r
+      cellWidthDiff = cellHeightDiff = 0;\r
+      $.each(h, function (n, val) {\r
+        cellWidthDiff += parseFloat(el.css(val)) || 0;\r
+      });\r
+      $.each(v, function (n, val) {\r
+        cellHeightDiff += parseFloat(el.css(val)) || 0;\r
+      });\r
+      r.remove();\r
+\r
+      absoluteColumnMinWidth = Math.max(headerColumnWidthDiff, cellWidthDiff);\r
+    }\r
+\r
+    function createCssRules() {\r
+      $style = $("<style type='text/css' rel='stylesheet' />").appendTo($("head"));\r
+      var rowHeight = (options.rowHeight - cellHeightDiff);\r
+      var rules = [\r
+        "." + uid + " .slick-header-column { left: 1000px; }",\r
+        "." + uid + " .slick-top-panel { height:" + options.topPanelHeight + "px; }",\r
+        "." + uid + " .slick-headerrow-columns { height:" + options.headerRowHeight + "px; }",\r
+        "." + uid + " .slick-cell { height:" + rowHeight + "px; }",\r
+        "." + uid + " .slick-row { height:" + options.rowHeight + "px; }"\r
+      ];\r
+\r
+      for (var i = 0; i < columns.length; i++) {\r
+        rules.push("." + uid + " .l" + i + " { }");\r
+        rules.push("." + uid + " .r" + i + " { }");\r
+      }\r
+\r
+      if ($style[0].styleSheet) { // IE\r
+        $style[0].styleSheet.cssText = rules.join(" ");\r
+      } else {\r
+        $style[0].appendChild(document.createTextNode(rules.join(" ")));\r
+      }\r
+    }\r
+\r
+    function getColumnCssRules(idx) {\r
+      if (!stylesheet) {\r
+        var sheets = document.styleSheets;\r
+        for (var i = 0; i < sheets.length; i++) {\r
+          if ((sheets[i].ownerNode || sheets[i].owningElement) == $style[0]) {\r
+            stylesheet = sheets[i];\r
+            break;\r
+          }\r
+        }\r
+\r
+        if (!stylesheet) {\r
+          throw new Error("Cannot find stylesheet.");\r
+        }\r
+\r
+        // find and cache column CSS rules\r
+        columnCssRulesL = [];\r
+        columnCssRulesR = [];\r
+        var cssRules = (stylesheet.cssRules || stylesheet.rules);\r
+        var matches, columnIdx;\r
+        for (var i = 0; i < cssRules.length; i++) {\r
+          var selector = cssRules[i].selectorText;\r
+          if (matches = /\.l\d+/.exec(selector)) {\r
+            columnIdx = parseInt(matches[0].substr(2, matches[0].length - 2), 10);\r
+            columnCssRulesL[columnIdx] = cssRules[i];\r
+          } else if (matches = /\.r\d+/.exec(selector)) {\r
+            columnIdx = parseInt(matches[0].substr(2, matches[0].length - 2), 10);\r
+            columnCssRulesR[columnIdx] = cssRules[i];\r
+          }\r
+        }\r
+      }\r
+\r
+      return {\r
+        "left": columnCssRulesL[idx],\r
+        "right": columnCssRulesR[idx]\r
+      };\r
+    }\r
+\r
+    function removeCssRules() {\r
+      $style.remove();\r
+      stylesheet = null;\r
+    }\r
+\r
+    function destroy() {\r
+      getEditorLock().cancelCurrentEdit();\r
+\r
+      trigger(self.onBeforeDestroy, {});\r
+\r
+      var i = plugins.length;\r
+      while(i--) {\r
+        unregisterPlugin(plugins[i]);\r
+      }\r
+\r
+      if (options.enableColumnReorder) {\r
+          $headers.filter(":ui-sortable").sortable("destroy");\r
+      }\r
+\r
+      unbindAncestorScrollEvents();\r
+      $container.unbind(".slickgrid");\r
+      removeCssRules();\r
+\r
+      $canvas.unbind("draginit dragstart dragend drag");\r
+      $container.empty().removeClass(uid);\r
+    }\r
+\r
+\r
+    //////////////////////////////////////////////////////////////////////////////////////////////\r
+    // General\r
+\r
+    function trigger(evt, args, e) {\r
+      e = e || new Slick.EventData();\r
+      args = args || {};\r
+      args.grid = self;\r
+      return evt.notify(args, e, self);\r
+    }\r
+\r
+    function getEditorLock() {\r
+      return options.editorLock;\r
+    }\r
+\r
+    function getEditController() {\r
+      return editController;\r
+    }\r
+\r
+    function getColumnIndex(id) {\r
+      return columnsById[id];\r
+    }\r
+\r
+    function autosizeColumns() {\r
+      var i, c,\r
+          widths = [],\r
+          shrinkLeeway = 0,\r
+          total = 0,\r
+          prevTotal,\r
+          availWidth = viewportHasVScroll ? viewportW - scrollbarDimensions.width : viewportW;\r
+\r
+      for (i = 0; i < columns.length; i++) {\r
+        c = columns[i];\r
+        widths.push(c.width);\r
+        total += c.width;\r
+        if (c.resizable) {\r
+          shrinkLeeway += c.width - Math.max(c.minWidth, absoluteColumnMinWidth);\r
+        }\r
+      }\r
+\r
+      // shrink\r
+      prevTotal = total;\r
+      while (total > availWidth && shrinkLeeway) {\r
+        var shrinkProportion = (total - availWidth) / shrinkLeeway;\r
+        for (i = 0; i < columns.length && total > availWidth; i++) {\r
+          c = columns[i];\r
+          var width = widths[i];\r
+          if (!c.resizable || width <= c.minWidth || width <= absoluteColumnMinWidth) {\r
+            continue;\r
+          }\r
+          var absMinWidth = Math.max(c.minWidth, absoluteColumnMinWidth);\r
+          var shrinkSize = Math.floor(shrinkProportion * (width - absMinWidth)) || 1;\r
+          shrinkSize = Math.min(shrinkSize, width - absMinWidth);\r
+          total -= shrinkSize;\r
+          shrinkLeeway -= shrinkSize;\r
+          widths[i] -= shrinkSize;\r
+        }\r
+        if (prevTotal == total) {  // avoid infinite loop\r
+          break;\r
+        }\r
+        prevTotal = total;\r
+      }\r
+\r
+      // grow\r
+      prevTotal = total;\r
+      while (total < availWidth) {\r
+        var growProportion = availWidth / total;\r
+        for (i = 0; i < columns.length && total < availWidth; i++) {\r
+          c = columns[i];\r
+          if (!c.resizable || c.maxWidth <= c.width) {\r
+            continue;\r
+          }\r
+          var growSize = Math.min(Math.floor(growProportion * c.width) - c.width, (c.maxWidth - c.width) || 1000000) || 1;\r
+          total += growSize;\r
+          widths[i] += growSize;\r
+        }\r
+        if (prevTotal == total) {  // avoid infinite loop\r
+          break;\r
+        }\r
+        prevTotal = total;\r
+      }\r
+\r
+      var reRender = false;\r
+      for (i = 0; i < columns.length; i++) {\r
+        if (columns[i].rerenderOnResize && columns[i].width != widths[i]) {\r
+          reRender = true;\r
+        }\r
+        columns[i].width = widths[i];\r
+      }\r
+\r
+      applyColumnHeaderWidths();\r
+      updateCanvasWidth(true);\r
+      if (reRender) {\r
+        invalidateAllRows();\r
+        render();\r
+      }\r
+    }\r
+\r
+    function applyColumnHeaderWidths() {\r
+      if (!initialized) { return; }\r
+      var h;\r
+      for (var i = 0, headers = $headers.children(), ii = headers.length; i < ii; i++) {\r
+        h = $(headers[i]);\r
+        if (h.width() !== columns[i].width - headerColumnWidthDiff) {\r
+          h.width(columns[i].width - headerColumnWidthDiff);\r
+        }\r
+      }\r
+\r
+      updateColumnCaches();\r
+    }\r
+\r
+    function applyColumnWidths() {\r
+      var x = 0, w, rule;\r
+      for (var i = 0; i < columns.length; i++) {\r
+        w = columns[i].width;\r
+\r
+        rule = getColumnCssRules(i);\r
+        rule.left.style.left = x + "px";\r
+        rule.right.style.right = (canvasWidth - x - w) + "px";\r
+\r
+        x += columns[i].width;\r
+      }\r
+    }\r
+\r
+    function setSortColumn(columnId, ascending) {\r
+      setSortColumns([{ columnId: columnId, sortAsc: ascending}]);\r
+    }\r
+\r
+    function setSortColumns(cols) {\r
+      sortColumns = cols;\r
+\r
+      var headerColumnEls = $headers.children();\r
+      headerColumnEls\r
+          .removeClass("slick-header-column-sorted")\r
+          .find(".slick-sort-indicator")\r
+              .removeClass("slick-sort-indicator-asc slick-sort-indicator-desc");\r
+\r
+      $.each(sortColumns, function(i, col) {\r
+        if (col.sortAsc == null) {\r
+          col.sortAsc = true;\r
+        }\r
+        var columnIndex = getColumnIndex(col.columnId);\r
+        if (columnIndex != null) {\r
+          headerColumnEls.eq(columnIndex)\r
+              .addClass("slick-header-column-sorted")\r
+              .find(".slick-sort-indicator")\r
+                  .addClass(col.sortAsc ? "slick-sort-indicator-asc" : "slick-sort-indicator-desc");\r
+        }\r
+      });\r
+    }\r
+\r
+    function getSortColumns() {\r
+      return sortColumns;\r
+    }\r
+\r
+    function handleSelectedRangesChanged(e, ranges) {\r
+      selectedRows = [];\r
+      var hash = {};\r
+      for (var i = 0; i < ranges.length; i++) {\r
+        for (var j = ranges[i].fromRow; j <= ranges[i].toRow; j++) {\r
+          if (!hash[j]) {  // prevent duplicates\r
+            selectedRows.push(j);\r
+            hash[j] = {};\r
+          }\r
+          for (var k = ranges[i].fromCell; k <= ranges[i].toCell; k++) {\r
+            if (canCellBeSelected(j, k)) {\r
+              hash[j][columns[k].id] = options.selectedCellCssClass;\r
+            }\r
+          }\r
+        }\r
+      }\r
+\r
+      setCellCssStyles(options.selectedCellCssClass, hash);\r
+\r
+      trigger(self.onSelectedRowsChanged, {rows: getSelectedRows()}, e);\r
+    }\r
+\r
+    function getColumns() {\r
+      return columns;\r
+    }\r
+\r
+    function updateColumnCaches() {\r
+      // Pre-calculate cell boundaries.\r
+      columnPosLeft = [];\r
+      columnPosRight = [];\r
+      var x = 0;\r
+      for (var i = 0, ii = columns.length; i < ii; i++) {\r
+        columnPosLeft[i] = x;\r
+        columnPosRight[i] = x + columns[i].width;\r
+        x += columns[i].width;\r
+      }\r
+    }\r
+\r
+    function setColumns(columnDefinitions) {\r
+      columns = columnDefinitions;\r
+\r
+      columnsById = {};\r
+      for (var i = 0; i < columns.length; i++) {\r
+        var m = columns[i] = $.extend({}, columnDefaults, columns[i]);\r
+        columnsById[m.id] = i;\r
+        if (m.minWidth && m.width < m.minWidth) {\r
+          m.width = m.minWidth;\r
+        }\r
+        if (m.maxWidth && m.width > m.maxWidth) {\r
+          m.width = m.maxWidth;\r
+        }\r
+      }\r
+\r
+      updateColumnCaches();\r
+\r
+      if (initialized) {\r
+        invalidateAllRows();\r
+        createColumnHeaders();\r
+        removeCssRules();\r
+        createCssRules();\r
+        resizeCanvas();\r
+        applyColumnWidths();\r
+        handleScroll();\r
+      }\r
+    }\r
+\r
+    function getOptions() {\r
+      return options;\r
+    }\r
+\r
+    function setOptions(args) {\r
+      if (!getEditorLock().commitCurrentEdit()) {\r
+        return;\r
+      }\r
+\r
+      makeActiveCellNormal();\r
+\r
+      if (options.enableAddRow !== args.enableAddRow) {\r
+        invalidateRow(getDataLength());\r
+      }\r
+\r
+      options = $.extend(options, args);\r
+      validateAndEnforceOptions();\r
+\r
+      $viewport.css("overflow-y", options.autoHeight ? "hidden" : "auto");\r
+      render();\r
+    }\r
+\r
+    function validateAndEnforceOptions() {\r
+      if (options.autoHeight) {\r
+        options.leaveSpaceForNewRows = false;\r
+      }\r
+    }\r
+\r
+    function setData(newData, scrollToTop) {\r
+      data = newData;\r
+      invalidateAllRows();\r
+      updateRowCount();\r
+      if (scrollToTop) {\r
+        scrollTo(0);\r
+      }\r
+    }\r
+\r
+    function getData() {\r
+      return data;\r
+    }\r
+\r
+    function getDataLength() {\r
+      if (data.getLength) {\r
+        return data.getLength();\r
+      } else {\r
+        return data.length;\r
+      }\r
+    }\r
+\r
+    function getDataItem(i) {\r
+      if (data.getItem) {\r
+        return data.getItem(i);\r
+      } else {\r
+        return data[i];\r
+      }\r
+    }\r
+\r
+    function getTopPanel() {\r
+      return $topPanel[0];\r
+    }\r
+\r
+    function setTopPanelVisibility(visible) {\r
+      if (options.showTopPanel != visible) {\r
+        options.showTopPanel = visible;\r
+        if (visible) {\r
+          $topPanelScroller.slideDown("fast", resizeCanvas);\r
+        } else {\r
+          $topPanelScroller.slideUp("fast", resizeCanvas);\r
+        }\r
+      }\r
+    }\r
+\r
+    function setHeaderRowVisibility(visible) {\r
+      if (options.showHeaderRow != visible) {\r
+        options.showHeaderRow = visible;\r
+        if (visible) {\r
+          $headerRowScroller.slideDown("fast", resizeCanvas);\r
+        } else {\r
+          $headerRowScroller.slideUp("fast", resizeCanvas);\r
+        }\r
+      }\r
+    }\r
+\r
+    function getContainerNode() {\r
+      return $container.get(0);\r
+    }\r
+\r
+    //////////////////////////////////////////////////////////////////////////////////////////////\r
+    // Rendering / Scrolling\r
+\r
+    function getRowTop(row) {\r
+      return options.rowHeight * row - offset;\r
+    }\r
+\r
+    function getRowFromPosition(y) {\r
+      return Math.floor((y + offset) / options.rowHeight);\r
+    }\r
+\r
+    function scrollTo(y) {\r
+      y = Math.max(y, 0);\r
+      y = Math.min(y, th - viewportH + (viewportHasHScroll ? scrollbarDimensions.height : 0));\r
+\r
+      var oldOffset = offset;\r
+\r
+      page = Math.min(n - 1, Math.floor(y / ph));\r
+      offset = Math.round(page * cj);\r
+      var newScrollTop = y - offset;\r
+\r
+      if (offset != oldOffset) {\r
+        var range = getVisibleRange(newScrollTop);\r
+        cleanupRows(range);\r
+        updateRowPositions();\r
+      }\r
+\r
+      if (prevScrollTop != newScrollTop) {\r
+        vScrollDir = (prevScrollTop + oldOffset < newScrollTop + offset) ? 1 : -1;\r
+        $viewport[0].scrollTop = (lastRenderedScrollTop = scrollTop = prevScrollTop = newScrollTop);\r
+\r
+        trigger(self.onViewportChanged, {});\r
+      }\r
+    }\r
+\r
+    function defaultFormatter(row, cell, value, columnDef, dataContext) {\r
+      if (value == null) {\r
+        return "";\r
+      } else {\r
+        return (value + "").replace(/&/g,"&amp;").replace(/</g,"&lt;").replace(/>/g,"&gt;");\r
+      }\r
+    }\r
+\r
+    function getFormatter(row, column) {\r
+      var rowMetadata = data.getItemMetadata && data.getItemMetadata(row);\r
+\r
+      // look up by id, then index\r
+      var columnOverrides = rowMetadata &&\r
+          rowMetadata.columns &&\r
+          (rowMetadata.columns[column.id] || rowMetadata.columns[getColumnIndex(column.id)]);\r
+\r
+      return (columnOverrides && columnOverrides.formatter) ||\r
+          (rowMetadata && rowMetadata.formatter) ||\r
+          column.formatter ||\r
+          (options.formatterFactory && options.formatterFactory.getFormatter(column)) ||\r
+          options.defaultFormatter;\r
+    }\r
+\r
+    function getEditor(row, cell) {\r
+      var column = columns[cell];\r
+      var rowMetadata = data.getItemMetadata && data.getItemMetadata(row);\r
+      var columnMetadata = rowMetadata && rowMetadata.columns;\r
+\r
+      if (columnMetadata && columnMetadata[column.id] && columnMetadata[column.id].editor !== undefined) {\r
+        return columnMetadata[column.id].editor;\r
+      }\r
+      if (columnMetadata && columnMetadata[cell] && columnMetadata[cell].editor !== undefined) {\r
+        return columnMetadata[cell].editor;\r
+      }\r
+\r
+      return column.editor || (options.editorFactory && options.editorFactory.getEditor(column));\r
+    }\r
+\r
+    function getDataItemValueForColumn(item, columnDef) {\r
+      if (options.dataItemColumnValueExtractor) {\r
+        return options.dataItemColumnValueExtractor(item, columnDef);\r
+      }\r
+      return item[columnDef.field];\r
+    }\r
+\r
+    function appendRowHtml(stringArray, row, range, dataLength) {\r
+      var d = getDataItem(row);\r
+      var dataLoading = row < dataLength && !d;\r
+      var rowCss = "slick-row" +\r
+          (dataLoading ? " loading" : "") +\r
+          (row === activeRow ? " active" : "") +\r
+          (row % 2 == 1 ? " odd" : " even");\r
+\r
+      var metadata = data.getItemMetadata && data.getItemMetadata(row);\r
+\r
+      if (metadata && metadata.cssClasses) {\r
+        rowCss += " " + metadata.cssClasses;\r
+      }\r
+\r
+      stringArray.push("<div class='ui-widget-content " + rowCss + "' style='top:" + getRowTop(row) + "px'>");\r
+\r
+      var colspan, m;\r
+      for (var i = 0, ii = columns.length; i < ii; i++) {\r
+        m = columns[i];\r
+        colspan = 1;\r
+        if (metadata && metadata.columns) {\r
+          var columnData = metadata.columns[m.id] || metadata.columns[i];\r
+          colspan = (columnData && columnData.colspan) || 1;\r
+          if (colspan === "*") {\r
+            colspan = ii - i;\r
+          }\r
+        }\r
+\r
+        // Do not render cells outside of the viewport.\r
+        if (columnPosRight[Math.min(ii - 1, i + colspan - 1)] > range.leftPx) {\r
+          if (columnPosLeft[i] > range.rightPx) {\r
+            // All columns to the right are outside the range.\r
+            break;\r
+          }\r
+\r
+          appendCellHtml(stringArray, row, i, colspan, d);\r
+        }\r
+\r
+        if (colspan > 1) {\r
+          i += (colspan - 1);\r
+        }\r
+      }\r
+\r
+      stringArray.push("</div>");\r
+    }\r
+\r
+    function appendCellHtml(stringArray, row, cell, colspan, item) {\r
+      var m = columns[cell];\r
+      var cellCss = "slick-cell l" + cell + " r" + Math.min(columns.length - 1, cell + colspan - 1) +\r
+          (m.cssClass ? " " + m.cssClass : "");\r
+      if (row === activeRow && cell === activeCell) {\r
+        cellCss += (" active");\r
+      }\r
+\r
+      // TODO:  merge them together in the setter\r
+      for (var key in cellCssClasses) {\r
+        if (cellCssClasses[key][row] && cellCssClasses[key][row][m.id]) {\r
+          cellCss += (" " + cellCssClasses[key][row][m.id]);\r
+        }\r
+      }\r
+\r
+      stringArray.push("<div class='" + cellCss + "'>");\r
+\r
+      // if there is a corresponding row (if not, this is the Add New row or this data hasn't been loaded yet)\r
+      if (item) {\r
+        var value = getDataItemValueForColumn(item, m);\r
+        stringArray.push(getFormatter(row, m)(row, cell, value, m, item));\r
+      }\r
+\r
+      stringArray.push("</div>");\r
+\r
+      rowsCache[row].cellRenderQueue.push(cell);\r
+      rowsCache[row].cellColSpans[cell] = colspan;\r
+    }\r
+\r
+\r
+    function cleanupRows(rangeToKeep) {\r
+      for (var i in rowsCache) {\r
+        if (((i = parseInt(i, 10)) !== activeRow) && (i < rangeToKeep.top || i > rangeToKeep.bottom)) {\r
+          removeRowFromCache(i);\r
+        }\r
+      }\r
+    }\r
+\r
+    function invalidate() {\r
+      updateRowCount();\r
+      invalidateAllRows();\r
+      render();\r
+    }\r
+\r
+    function invalidateAllRows() {\r
+      if (currentEditor) {\r
+        makeActiveCellNormal();\r
+      }\r
+      for (var row in rowsCache) {\r
+        removeRowFromCache(row);\r
+      }\r
+    }\r
+\r
+    function removeRowFromCache(row) {\r
+      var cacheEntry = rowsCache[row];\r
+      if (!cacheEntry) {\r
+        return;\r
+      }\r
+      $canvas[0].removeChild(cacheEntry.rowNode);\r
+      delete rowsCache[row];\r
+      delete postProcessedRows[row];\r
+      renderedRows--;\r
+      counter_rows_removed++;\r
+    }\r
+\r
+    function invalidateRows(rows) {\r
+      var i, rl;\r
+      if (!rows || !rows.length) {\r
+        return;\r
+      }\r
+      vScrollDir = 0;\r
+      for (i = 0, rl = rows.length; i < rl; i++) {\r
+        if (currentEditor && activeRow === rows[i]) {\r
+          makeActiveCellNormal();\r
+        }\r
+        if (rowsCache[rows[i]]) {\r
+          removeRowFromCache(rows[i]);\r
+        }\r
+      }\r
+    }\r
+\r
+    function invalidateRow(row) {\r
+      invalidateRows([row]);\r
+    }\r
+\r
+    function updateCell(row, cell) {\r
+      var cellNode = getCellNode(row, cell);\r
+      if (!cellNode) {\r
+        return;\r
+      }\r
+\r
+      var m = columns[cell], d = getDataItem(row);\r
+      if (currentEditor && activeRow === row && activeCell === cell) {\r
+        currentEditor.loadValue(d);\r
+      } else {\r
+        cellNode.innerHTML = d ? getFormatter(row, m)(row, cell, getDataItemValueForColumn(d, m), m, d) : "";\r
+        invalidatePostProcessingResults(row);\r
+      }\r
+    }\r
+\r
+    function updateRow(row) {\r
+      var cacheEntry = rowsCache[row];\r
+      if (!cacheEntry) {\r
+        return;\r
+      }\r
+\r
+      ensureCellNodesInRowsCache(row);\r
+\r
+      var d = getDataItem(row);\r
+\r
+      for (var columnIdx in cacheEntry.cellNodesByColumnIdx) {\r
+        if (!cacheEntry.cellNodesByColumnIdx.hasOwnProperty(columnIdx)) {\r
+          continue;\r
+        }\r
+\r
+        columnIdx = columnIdx | 0;\r
+        var m = columns[columnIdx],\r
+            node = cacheEntry.cellNodesByColumnIdx[columnIdx];\r
+\r
+        if (row === activeRow && columnIdx === activeCell && currentEditor) {\r
+          currentEditor.loadValue(d);\r
+        } else if (d) {\r
+          node.innerHTML = getFormatter(row, m)(row, columnIdx, getDataItemValueForColumn(d, m), m, d);\r
+        } else {\r
+          node.innerHTML = "";\r
+        }\r
+      }\r
+\r
+      invalidatePostProcessingResults(row);\r
+    }\r
+\r
+    function getViewportHeight() {\r
+      return parseFloat($.css($container[0], "height", true)) -\r
+          parseFloat($.css($container[0], "paddingTop", true)) -\r
+          parseFloat($.css($container[0], "paddingBottom", true)) -\r
+          parseFloat($.css($headerScroller[0], "height")) - getVBoxDelta($headerScroller) -\r
+          (options.showTopPanel ? options.topPanelHeight + getVBoxDelta($topPanelScroller) : 0) -\r
+          (options.showHeaderRow ? options.headerRowHeight + getVBoxDelta($headerRowScroller) : 0);\r
+    }\r
+\r
+    function resizeCanvas() {\r
+      if (!initialized) { return; }\r
+      if (options.autoHeight) {\r
+        viewportH = options.rowHeight * (getDataLength() + (options.enableAddRow ? 1 : 0));\r
+      } else {\r
+        viewportH = getViewportHeight();\r
+      }\r
+\r
+      numVisibleRows = Math.ceil(viewportH / options.rowHeight);\r
+      viewportW = parseFloat($.css($container[0], "width", true));\r
+      if (!options.autoHeight) {\r
+        $viewport.height(viewportH);\r
+      }\r
+\r
+      if (options.forceFitColumns) {\r
+        autosizeColumns();\r
+      }\r
+\r
+      updateRowCount();\r
+      handleScroll();\r
+      render();\r
+    }\r
+\r
+    function updateRowCount() {\r
+      var dataLength = getDataLength();\r
+      if (!initialized) { return; }\r
+      numberOfRows = dataLength +\r
+          (options.enableAddRow ? 1 : 0) +\r
+          (options.leaveSpaceForNewRows ? numVisibleRows - 1 : 0);\r
+\r
+      var oldViewportHasVScroll = viewportHasVScroll;\r
+      // with autoHeight, we do not need to accommodate the vertical scroll bar\r
+      viewportHasVScroll = !options.autoHeight && (numberOfRows * options.rowHeight > viewportH);\r
+\r
+      // remove the rows that are now outside of the data range\r
+      // this helps avoid redundant calls to .removeRow() when the size of the data decreased by thousands of rows\r
+      var l = options.enableAddRow ? dataLength : dataLength - 1;\r
+      for (var i in rowsCache) {\r
+        if (i >= l) {\r
+          removeRowFromCache(i);\r
+        }\r
+      }\r
+\r
+      if (activeCellNode && activeRow > l) {\r
+        resetActiveCell();\r
+      }\r
+\r
+      var oldH = h;\r
+      th = Math.max(options.rowHeight * numberOfRows, viewportH - scrollbarDimensions.height);\r
+      if (th < maxSupportedCssHeight) {\r
+        // just one page\r
+        h = ph = th;\r
+        n = 1;\r
+        cj = 0;\r
+      } else {\r
+        // break into pages\r
+        h = maxSupportedCssHeight;\r
+        ph = h / 100;\r
+        n = Math.floor(th / ph);\r
+        cj = (th - h) / (n - 1);\r
+      }\r
+\r
+      if (h !== oldH) {\r
+        $canvas.css("height", h);\r
+        scrollTop = $viewport[0].scrollTop;\r
+      }\r
+\r
+      var oldScrollTopInRange = (scrollTop + offset <= th - viewportH);\r
+\r
+      if (th == 0 || scrollTop == 0) {\r
+        page = offset = 0;\r
+      } else if (oldScrollTopInRange) {\r
+        // maintain virtual position\r
+        scrollTo(scrollTop + offset);\r
+      } else {\r
+        // scroll to bottom\r
+        scrollTo(th - viewportH);\r
+      }\r
+\r
+      if (h != oldH && options.autoHeight) {\r
+        resizeCanvas();\r
+      }\r
+\r
+      if (options.forceFitColumns && oldViewportHasVScroll != viewportHasVScroll) {\r
+        autosizeColumns();\r
+      }\r
+      updateCanvasWidth(false);\r
+    }\r
+\r
+    function getVisibleRange(viewportTop, viewportLeft) {\r
+      if (viewportTop == null) {\r
+        viewportTop = scrollTop;\r
+      }\r
+      if (viewportLeft == null) {\r
+        viewportLeft = scrollLeft;\r
+      }\r
+\r
+      return {\r
+        top: getRowFromPosition(viewportTop),\r
+        bottom: getRowFromPosition(viewportTop + viewportH) + 1,\r
+        leftPx: viewportLeft,\r
+        rightPx: viewportLeft + viewportW\r
+      };\r
+    }\r
+\r
+    function getRenderedRange(viewportTop, viewportLeft) {\r
+      var range = getVisibleRange(viewportTop, viewportLeft);\r
+      var buffer = Math.round(viewportH / options.rowHeight);\r
+      var minBuffer = 3;\r
+\r
+      if (vScrollDir == -1) {\r
+        range.top -= buffer;\r
+        range.bottom += minBuffer;\r
+      } else if (vScrollDir == 1) {\r
+        range.top -= minBuffer;\r
+        range.bottom += buffer;\r
+      } else {\r
+        range.top -= minBuffer;\r
+        range.bottom += minBuffer;\r
+      }\r
+\r
+      range.top = Math.max(0, range.top);\r
+      range.bottom = Math.min(options.enableAddRow ? getDataLength() : getDataLength() - 1, range.bottom);\r
+\r
+      range.leftPx -= viewportW;\r
+      range.rightPx += viewportW;\r
+\r
+      range.leftPx = Math.max(0, range.leftPx);\r
+      range.rightPx = Math.min(canvasWidth, range.rightPx);\r
+\r
+      return range;\r
+    }\r
+\r
+    function ensureCellNodesInRowsCache(row) {\r
+      var cacheEntry = rowsCache[row];\r
+      if (cacheEntry) {\r
+        if (cacheEntry.cellRenderQueue.length) {\r
+          var lastChild = cacheEntry.rowNode.lastChild;\r
+          while (cacheEntry.cellRenderQueue.length) {\r
+            var columnIdx = cacheEntry.cellRenderQueue.pop();\r
+            cacheEntry.cellNodesByColumnIdx[columnIdx] = lastChild;\r
+            lastChild = lastChild.previousSibling;\r
+          }\r
+        }\r
+      }\r
+    }\r
+\r
+    function cleanUpCells(range, row) {\r
+      var totalCellsRemoved = 0;\r
+      var cacheEntry = rowsCache[row];\r
+\r
+      // Remove cells outside the range.\r
+      var cellsToRemove = [];\r
+      for (var i in cacheEntry.cellNodesByColumnIdx) {\r
+        // I really hate it when people mess with Array.prototype.\r
+        if (!cacheEntry.cellNodesByColumnIdx.hasOwnProperty(i)) {\r
+          continue;\r
+        }\r
+\r
+        // This is a string, so it needs to be cast back to a number.\r
+        i = i | 0;\r
+\r
+        var colspan = cacheEntry.cellColSpans[i];\r
+        if (columnPosLeft[i] > range.rightPx ||\r
+          columnPosRight[Math.min(columns.length - 1, i + colspan - 1)] < range.leftPx) {\r
+          if (!(row == activeRow && i == activeCell)) {\r
+            cellsToRemove.push(i);\r
+          }\r
+        }\r
+      }\r
+\r
+      var cellToRemove;\r
+      while ((cellToRemove = cellsToRemove.pop()) != null) {\r
+        cacheEntry.rowNode.removeChild(cacheEntry.cellNodesByColumnIdx[cellToRemove]);\r
+        delete cacheEntry.cellColSpans[cellToRemove];\r
+        delete cacheEntry.cellNodesByColumnIdx[cellToRemove];\r
+        if (postProcessedRows[row]) {\r
+          delete postProcessedRows[row][cellToRemove];\r
+        }\r
+        totalCellsRemoved++;\r
+      }\r
+    }\r
+\r
+    function cleanUpAndRenderCells(range) {\r
+      var cacheEntry;\r
+      var stringArray = [];\r
+      var processedRows = [];\r
+      var cellsAdded;\r
+      var totalCellsAdded = 0;\r
+      var colspan;\r
+\r
+      for (var row = range.top, btm = range.bottom; row <= btm; row++) {\r
+        cacheEntry = rowsCache[row];\r
+        if (!cacheEntry) {\r
+          continue;\r
+        }\r
+\r
+        // cellRenderQueue populated in renderRows() needs to be cleared first\r
+        ensureCellNodesInRowsCache(row);\r
+\r
+        cleanUpCells(range, row);\r
+\r
+        // Render missing cells.\r
+        cellsAdded = 0;\r
+\r
+        var metadata = data.getItemMetadata && data.getItemMetadata(row);\r
+        metadata = metadata && metadata.columns;\r
+\r
+        var d = getDataItem(row);\r
+\r
+        // TODO:  shorten this loop (index? heuristics? binary search?)\r
+        for (var i = 0, ii = columns.length; i < ii; i++) {\r
+          // Cells to the right are outside the range.\r
+          if (columnPosLeft[i] > range.rightPx) {\r
+            break;\r
+          }\r
+\r
+          // Already rendered.\r
+          if ((colspan = cacheEntry.cellColSpans[i]) != null) {\r
+            i += (colspan > 1 ? colspan - 1 : 0);\r
+            continue;\r
+          }\r
+\r
+          colspan = 1;\r
+          if (metadata) {\r
+            var columnData = metadata[columns[i].id] || metadata[i];\r
+            colspan = (columnData && columnData.colspan) || 1;\r
+            if (colspan === "*") {\r
+              colspan = ii - i;\r
+            }\r
+          }\r
+\r
+          if (columnPosRight[Math.min(ii - 1, i + colspan - 1)] > range.leftPx) {\r
+            appendCellHtml(stringArray, row, i, colspan, d);\r
+            cellsAdded++;\r
+          }\r
+\r
+          i += (colspan > 1 ? colspan - 1 : 0);\r
+        }\r
+\r
+        if (cellsAdded) {\r
+          totalCellsAdded += cellsAdded;\r
+          processedRows.push(row);\r
+        }\r
+      }\r
+\r
+      if (!stringArray.length) {\r
+        return;\r
+      }\r
+\r
+      var x = document.createElement("div");\r
+      x.innerHTML = stringArray.join("");\r
+\r
+      var processedRow;\r
+      var node;\r
+      while ((processedRow = processedRows.pop()) != null) {\r
+        cacheEntry = rowsCache[processedRow];\r
+        var columnIdx;\r
+        while ((columnIdx = cacheEntry.cellRenderQueue.pop()) != null) {\r
+          node = x.lastChild;\r
+          cacheEntry.rowNode.appendChild(node);\r
+          cacheEntry.cellNodesByColumnIdx[columnIdx] = node;\r
+        }\r
+      }\r
+    }\r
+\r
+    function renderRows(range) {\r
+      var parentNode = $canvas[0],\r
+          stringArray = [],\r
+          rows = [],\r
+          needToReselectCell = false,\r
+          dataLength = getDataLength();\r
+\r
+      for (var i = range.top, ii = range.bottom; i <= ii; i++) {\r
+        if (rowsCache[i]) {\r
+          continue;\r
+        }\r
+        renderedRows++;\r
+        rows.push(i);\r
+\r
+        // Create an entry right away so that appendRowHtml() can\r
+        // start populatating it.\r
+        rowsCache[i] = {\r
+          "rowNode": null,\r
+\r
+          // ColSpans of rendered cells (by column idx).\r
+          // Can also be used for checking whether a cell has been rendered.\r
+          "cellColSpans": [],\r
+\r
+          // Cell nodes (by column idx).  Lazy-populated by ensureCellNodesInRowsCache().\r
+          "cellNodesByColumnIdx": [],\r
+\r
+          // Column indices of cell nodes that have been rendered, but not yet indexed in\r
+          // cellNodesByColumnIdx.  These are in the same order as cell nodes added at the\r
+          // end of the row.\r
+          "cellRenderQueue": []\r
+        };\r
+\r
+        appendRowHtml(stringArray, i, range, dataLength);\r
+        if (activeCellNode && activeRow === i) {\r
+          needToReselectCell = true;\r
+        }\r
+        counter_rows_rendered++;\r
+      }\r
+\r
+      if (!rows.length) { return; }\r
+\r
+      var x = document.createElement("div");\r
+      x.innerHTML = stringArray.join("");\r
+\r
+      for (var i = 0, ii = rows.length; i < ii; i++) {\r
+        rowsCache[rows[i]].rowNode = parentNode.appendChild(x.firstChild);\r
+      }\r
+\r
+      if (needToReselectCell) {\r
+        activeCellNode = getCellNode(activeRow, activeCell);\r
+      }\r
+    }\r
+\r
+    function startPostProcessing() {\r
+      if (!options.enableAsyncPostRender) {\r
+        return;\r
+      }\r
+      clearTimeout(h_postrender);\r
+      h_postrender = setTimeout(asyncPostProcessRows, options.asyncPostRenderDelay);\r
+    }\r
+\r
+    function invalidatePostProcessingResults(row) {\r
+      delete postProcessedRows[row];\r
+      postProcessFromRow = Math.min(postProcessFromRow, row);\r
+      postProcessToRow = Math.max(postProcessToRow, row);\r
+      startPostProcessing();\r
+    }\r
+\r
+    function updateRowPositions() {\r
+      for (var row in rowsCache) {\r
+        rowsCache[row].rowNode.style.top = getRowTop(row) + "px";\r
+      }\r
+    }\r
+\r
+    function render() {\r
+      if (!initialized) { return; }\r
+      var visible = getVisibleRange();\r
+      var rendered = getRenderedRange();\r
+\r
+      // remove rows no longer in the viewport\r
+      cleanupRows(rendered);\r
+\r
+      // add new rows & missing cells in existing rows\r
+      if (lastRenderedScrollLeft != scrollLeft) {\r
+        cleanUpAndRenderCells(rendered);\r
+      }\r
+\r
+      // render missing rows\r
+      renderRows(rendered);\r
+\r
+      postProcessFromRow = visible.top;\r
+      postProcessToRow = Math.min(options.enableAddRow ? getDataLength() : getDataLength() - 1, visible.bottom);\r
+      startPostProcessing();\r
+\r
+      lastRenderedScrollTop = scrollTop;\r
+      lastRenderedScrollLeft = scrollLeft;\r
+      h_render = null;\r
+    }\r
+\r
+    function handleHeaderRowScroll() {\r
+      var scrollLeft = $headerRowScroller[0].scrollLeft;\r
+      if (scrollLeft != $viewport[0].scrollLeft) {\r
+        $viewport[0].scrollLeft = scrollLeft;\r
+      }\r
+    }\r
+\r
+    function handleScroll() {\r
+      scrollTop = $viewport[0].scrollTop;\r
+      scrollLeft = $viewport[0].scrollLeft;\r
+      var vScrollDist = Math.abs(scrollTop - prevScrollTop);\r
+      var hScrollDist = Math.abs(scrollLeft - prevScrollLeft);\r
+\r
+      if (hScrollDist) {\r
+        prevScrollLeft = scrollLeft;\r
+        $headerScroller[0].scrollLeft = scrollLeft;\r
+        $topPanelScroller[0].scrollLeft = scrollLeft;\r
+        $headerRowScroller[0].scrollLeft = scrollLeft;\r
+      }\r
+\r
+      if (vScrollDist) {\r
+        vScrollDir = prevScrollTop < scrollTop ? 1 : -1;\r
+        prevScrollTop = scrollTop;\r
+\r
+        // switch virtual pages if needed\r
+        if (vScrollDist < viewportH) {\r
+          scrollTo(scrollTop + offset);\r
+        } else {\r
+          var oldOffset = offset;\r
+          if (h == viewportH) {\r
+            page = 0;\r
+          } else {\r
+            page = Math.min(n - 1, Math.floor(scrollTop * ((th - viewportH) / (h - viewportH)) * (1 / ph)));\r
+          }\r
+          offset = Math.round(page * cj);\r
+          if (oldOffset != offset) {\r
+            invalidateAllRows();\r
+          }\r
+        }\r
+      }\r
+\r
+      if (hScrollDist || vScrollDist) {\r
+        if (h_render) {\r
+          clearTimeout(h_render);\r
+        }\r
+\r
+        if (Math.abs(lastRenderedScrollTop - scrollTop) > 20 ||\r
+            Math.abs(lastRenderedScrollLeft - scrollLeft) > 20) {\r
+          if (options.forceSyncScrolling || (\r
+              Math.abs(lastRenderedScrollTop - scrollTop) < viewportH &&\r
+              Math.abs(lastRenderedScrollLeft - scrollLeft) < viewportW)) {\r
+            render();\r
+          } else {\r
+            h_render = setTimeout(render, 50);\r
+          }\r
+\r
+          trigger(self.onViewportChanged, {});\r
+        }\r
+      }\r
+\r
+      trigger(self.onScroll, {scrollLeft: scrollLeft, scrollTop: scrollTop});\r
+    }\r
+\r
+    function asyncPostProcessRows() {\r
+      while (postProcessFromRow <= postProcessToRow) {\r
+        var row = (vScrollDir >= 0) ? postProcessFromRow++ : postProcessToRow--;\r
+        var cacheEntry = rowsCache[row];\r
+        if (!cacheEntry || row >= getDataLength()) {\r
+          continue;\r
+        }\r
+\r
+        if (!postProcessedRows[row]) {\r
+          postProcessedRows[row] = {};\r
+        }\r
+\r
+        ensureCellNodesInRowsCache(row);\r
+        for (var columnIdx in cacheEntry.cellNodesByColumnIdx) {\r
+          if (!cacheEntry.cellNodesByColumnIdx.hasOwnProperty(columnIdx)) {\r
+            continue;\r
+          }\r
+\r
+          columnIdx = columnIdx | 0;\r
+\r
+          var m = columns[columnIdx];\r
+          if (m.asyncPostRender && !postProcessedRows[row][columnIdx]) {\r
+            var node = cacheEntry.cellNodesByColumnIdx[columnIdx];\r
+            if (node) {\r
+              m.asyncPostRender(node, row, getDataItem(row), m);\r
+            }\r
+            postProcessedRows[row][columnIdx] = true;\r
+          }\r
+        }\r
+\r
+        h_postrender = setTimeout(asyncPostProcessRows, options.asyncPostRenderDelay);\r
+        return;\r
+      }\r
+    }\r
+\r
+    function updateCellCssStylesOnRenderedRows(addedHash, removedHash) {\r
+      var node, columnId, addedRowHash, removedRowHash;\r
+      for (var row in rowsCache) {\r
+        removedRowHash = removedHash && removedHash[row];\r
+        addedRowHash = addedHash && addedHash[row];\r
+\r
+        if (removedRowHash) {\r
+          for (columnId in removedRowHash) {\r
+            if (!addedRowHash || removedRowHash[columnId] != addedRowHash[columnId]) {\r
+              node = getCellNode(row, getColumnIndex(columnId));\r
+              if (node) {\r
+                $(node).removeClass(removedRowHash[columnId]);\r
+              }\r
+            }\r
+          }\r
+        }\r
+\r
+        if (addedRowHash) {\r
+          for (columnId in addedRowHash) {\r
+            if (!removedRowHash || removedRowHash[columnId] != addedRowHash[columnId]) {\r
+              node = getCellNode(row, getColumnIndex(columnId));\r
+              if (node) {\r
+                $(node).addClass(addedRowHash[columnId]);\r
+              }\r
+            }\r
+          }\r
+        }\r
+      }\r
+    }\r
+\r
+    function addCellCssStyles(key, hash) {\r
+      if (cellCssClasses[key]) {\r
+        throw "addCellCssStyles: cell CSS hash with key '" + key + "' already exists.";\r
+      }\r
+\r
+      cellCssClasses[key] = hash;\r
+      updateCellCssStylesOnRenderedRows(hash, null);\r
+\r
+      trigger(self.onCellCssStylesChanged, { "key": key, "hash": hash });\r
+    }\r
+\r
+    function removeCellCssStyles(key) {\r
+      if (!cellCssClasses[key]) {\r
+        return;\r
+      }\r
+\r
+      updateCellCssStylesOnRenderedRows(null, cellCssClasses[key]);\r
+      delete cellCssClasses[key];\r
+\r
+      trigger(self.onCellCssStylesChanged, { "key": key, "hash": null });\r
+    }\r
+\r
+    function setCellCssStyles(key, hash) {\r
+      var prevHash = cellCssClasses[key];\r
+\r
+      cellCssClasses[key] = hash;\r
+      updateCellCssStylesOnRenderedRows(hash, prevHash);\r
+\r
+      trigger(self.onCellCssStylesChanged, { "key": key, "hash": hash });\r
+    }\r
+\r
+    function getCellCssStyles(key) {\r
+      return cellCssClasses[key];\r
+    }\r
+\r
+    function flashCell(row, cell, speed) {\r
+      speed = speed || 100;\r
+      if (rowsCache[row]) {\r
+        var $cell = $(getCellNode(row, cell));\r
+\r
+        function toggleCellClass(times) {\r
+          if (!times) {\r
+            return;\r
+          }\r
+          setTimeout(function () {\r
+                $cell.queue(function () {\r
+                  $cell.toggleClass(options.cellFlashingCssClass).dequeue();\r
+                  toggleCellClass(times - 1);\r
+                });\r
+              },\r
+              speed);\r
+        }\r
+\r
+        toggleCellClass(4);\r
+      }\r
+    }\r
+\r
+    //////////////////////////////////////////////////////////////////////////////////////////////\r
+    // Interactivity\r
+\r
+    function handleDragInit(e, dd) {\r
+      var cell = getCellFromEvent(e);\r
+      if (!cell || !cellExists(cell.row, cell.cell)) {\r
+        return false;\r
+      }\r
+\r
+      var retval = trigger(self.onDragInit, dd, e);\r
+      if (e.isImmediatePropagationStopped()) {\r
+        return retval;\r
+      }\r
+\r
+      // if nobody claims to be handling drag'n'drop by stopping immediate propagation,\r
+      // cancel out of it\r
+      return false;\r
+    }\r
+\r
+    function handleDragStart(e, dd) {\r
+      var cell = getCellFromEvent(e);\r
+      if (!cell || !cellExists(cell.row, cell.cell)) {\r
+        return false;\r
+      }\r
+\r
+      var retval = trigger(self.onDragStart, dd, e);\r
+      if (e.isImmediatePropagationStopped()) {\r
+        return retval;\r
+      }\r
+\r
+      return false;\r
+    }\r
+\r
+    function handleDrag(e, dd) {\r
+      return trigger(self.onDrag, dd, e);\r
+    }\r
+\r
+    function handleDragEnd(e, dd) {\r
+      trigger(self.onDragEnd, dd, e);\r
+    }\r
+\r
+    function handleKeyDown(e) {\r
+      trigger(self.onKeyDown, {row: activeRow, cell: activeCell}, e);\r
+      var handled = e.isImmediatePropagationStopped();\r
+\r
+      if (!handled) {\r
+        if (!e.shiftKey && !e.altKey && !e.ctrlKey) {\r
+          if (e.which == 27) {\r
+            if (!getEditorLock().isActive()) {\r
+              return; // no editing mode to cancel, allow bubbling and default processing (exit without cancelling the event)\r
+            }\r
+            cancelEditAndSetFocus();\r
+          } else if (e.which == 37) {\r
+            handled = navigateLeft();\r
+          } else if (e.which == 39) {\r
+            handled = navigateRight();\r
+          } else if (e.which == 38) {\r
+            handled = navigateUp();\r
+          } else if (e.which == 40) {\r
+            handled = navigateDown();\r
+          } else if (e.which == 9) {\r
+            handled = navigateNext();\r
+          } else if (e.which == 13) {\r
+            if (options.editable) {\r
+              if (currentEditor) {\r
+                // adding new row\r
+                if (activeRow === getDataLength()) {\r
+                  navigateDown();\r
+                } else {\r
+                  commitEditAndSetFocus();\r
+                }\r
+              } else {\r
+                if (getEditorLock().commitCurrentEdit()) {\r
+                  makeActiveCellEditable();\r
+                }\r
+              }\r
+            }\r
+            handled = true;\r
+          }\r
+        } else if (e.which == 9 && e.shiftKey && !e.ctrlKey && !e.altKey) {\r
+          handled = navigatePrev();\r
+        }\r
+      }\r
+\r
+      if (handled) {\r
+        // the event has been handled so don't let parent element (bubbling/propagation) or browser (default) handle it\r
+        e.stopPropagation();\r
+        e.preventDefault();\r
+        try {\r
+          e.originalEvent.keyCode = 0; // prevent default behaviour for special keys in IE browsers (F3, F5, etc.)\r
+        }\r
+        // ignore exceptions - setting the original event's keycode throws access denied exception for "Ctrl"\r
+        // (hitting control key only, nothing else), "Shift" (maybe others)\r
+        catch (error) {\r
+        }\r
+      }\r
+    }\r
+\r
+    function handleClick(e) {\r
+      if (!currentEditor) {\r
+        // if this click resulted in some cell child node getting focus,\r
+        // don't steal it back - keyboard events will still bubble up\r
+        if (e.target != document.activeElement) {\r
+          setFocus();\r
+        }\r
+      }\r
+\r
+      var cell = getCellFromEvent(e);\r
+      if (!cell || (currentEditor !== null && activeRow == cell.row && activeCell == cell.cell)) {\r
+        return;\r
+      }\r
+\r
+      trigger(self.onClick, {row: cell.row, cell: cell.cell}, e);\r
+      if (e.isImmediatePropagationStopped()) {\r
+        return;\r
+      }\r
+\r
+      if ((activeCell != cell.cell || activeRow != cell.row) && canCellBeActive(cell.row, cell.cell)) {\r
+        if (!getEditorLock().isActive() || getEditorLock().commitCurrentEdit()) {\r
+          scrollRowIntoView(cell.row, false);\r
+          setActiveCellInternal(getCellNode(cell.row, cell.cell), (cell.row === getDataLength()) || options.autoEdit);\r
+        }\r
+      }\r
+    }\r
+\r
+    function handleContextMenu(e) {\r
+      var $cell = $(e.target).closest(".slick-cell", $canvas);\r
+      if ($cell.length === 0) {\r
+        return;\r
+      }\r
+\r
+      // are we editing this cell?\r
+      if (activeCellNode === $cell[0] && currentEditor !== null) {\r
+        return;\r
+      }\r
+\r
+      trigger(self.onContextMenu, {}, e);\r
+    }\r
+\r
+    function handleDblClick(e) {\r
+      var cell = getCellFromEvent(e);\r
+      if (!cell || (currentEditor !== null && activeRow == cell.row && activeCell == cell.cell)) {\r
+        return;\r
+      }\r
+\r
+      trigger(self.onDblClick, {row: cell.row, cell: cell.cell}, e);\r
+      if (e.isImmediatePropagationStopped()) {\r
+        return;\r
+      }\r
+\r
+      if (options.editable) {\r
+        gotoCell(cell.row, cell.cell, true);\r
+      }\r
+    }\r
+\r
+    function handleHeaderMouseEnter(e) {\r
+      trigger(self.onHeaderMouseEnter, {\r
+        "column": $(this).data("column")\r
+      }, e);\r
+    }\r
+\r
+    function handleHeaderMouseLeave(e) {\r
+      trigger(self.onHeaderMouseLeave, {\r
+        "column": $(this).data("column")\r
+      }, e);\r
+    }\r
+\r
+    function handleHeaderContextMenu(e) {\r
+      var $header = $(e.target).closest(".slick-header-column", ".slick-header-columns");\r
+      var column = $header && $header.data("column");\r
+      trigger(self.onHeaderContextMenu, {column: column}, e);\r
+    }\r
+\r
+    function handleHeaderClick(e) {\r
+      var $header = $(e.target).closest(".slick-header-column", ".slick-header-columns");\r
+      var column = $header && $header.data("column");\r
+      if (column) {\r
+        trigger(self.onHeaderClick, {column: column}, e);\r
+      }\r
+    }\r
+\r
+    function handleMouseEnter(e) {\r
+      trigger(self.onMouseEnter, {}, e);\r
+    }\r
+\r
+    function handleMouseLeave(e) {\r
+      trigger(self.onMouseLeave, {}, e);\r
+    }\r
+\r
+    function cellExists(row, cell) {\r
+      return !(row < 0 || row >= getDataLength() || cell < 0 || cell >= columns.length);\r
+    }\r
+\r
+    function getCellFromPoint(x, y) {\r
+      var row = getRowFromPosition(y);\r
+      var cell = 0;\r
+\r
+      var w = 0;\r
+      for (var i = 0; i < columns.length && w < x; i++) {\r
+        w += columns[i].width;\r
+        cell++;\r
+      }\r
+\r
+      if (cell < 0) {\r
+        cell = 0;\r
+      }\r
+\r
+      return {row: row, cell: cell - 1};\r
+    }\r
+\r
+    function getCellFromNode(cellNode) {\r
+      // read column number from .l<columnNumber> CSS class\r
+      var cls = /l\d+/.exec(cellNode.className);\r
+      if (!cls) {\r
+        throw "getCellFromNode: cannot get cell - " + cellNode.className;\r
+      }\r
+      return parseInt(cls[0].substr(1, cls[0].length - 1), 10);\r
+    }\r
+\r
+    function getRowFromNode(rowNode) {\r
+      for (var row in rowsCache) {\r
+        if (rowsCache[row].rowNode === rowNode) {\r
+          return row | 0;\r
+        }\r
+      }\r
+\r
+      return null;\r
+    }\r
+\r
+    function getCellFromEvent(e) {\r
+      var $cell = $(e.target).closest(".slick-cell", $canvas);\r
+      if (!$cell.length) {\r
+        return null;\r
+      }\r
+\r
+      var row = getRowFromNode($cell[0].parentNode);\r
+      var cell = getCellFromNode($cell[0]);\r
+\r
+      if (row == null || cell == null) {\r
+        return null;\r
+      } else {\r
+        return {\r
+          "row": row,\r
+          "cell": cell\r
+        };\r
+      }\r
+    }\r
+\r
+    function getCellNodeBox(row, cell) {\r
+      if (!cellExists(row, cell)) {\r
+        return null;\r
+      }\r
+\r
+      var y1 = getRowTop(row);\r
+      var y2 = y1 + options.rowHeight - 1;\r
+      var x1 = 0;\r
+      for (var i = 0; i < cell; i++) {\r
+        x1 += columns[i].width;\r
+      }\r
+      var x2 = x1 + columns[cell].width;\r
+\r
+      return {\r
+        top: y1,\r
+        left: x1,\r
+        bottom: y2,\r
+        right: x2\r
+      };\r
+    }\r
+\r
+    //////////////////////////////////////////////////////////////////////////////////////////////\r
+    // Cell switching\r
+\r
+    function resetActiveCell() {\r
+      setActiveCellInternal(null, false);\r
+    }\r
+\r
+    function setFocus() {\r
+      if (tabbingDirection == -1) {\r
+        $focusSink[0].focus();\r
+      } else {\r
+        $focusSink2[0].focus();\r
+      }\r
+    }\r
+\r
+    function scrollCellIntoView(row, cell, doPaging) {\r
+      scrollRowIntoView(row, doPaging);\r
+\r
+      var colspan = getColspan(row, cell);\r
+      var left = columnPosLeft[cell],\r
+        right = columnPosRight[cell + (colspan > 1 ? colspan - 1 : 0)],\r
+        scrollRight = scrollLeft + viewportW;\r
+\r
+      if (left < scrollLeft) {\r
+        $viewport.scrollLeft(left);\r
+        handleScroll();\r
+        render();\r
+      } else if (right > scrollRight) {\r
+        $viewport.scrollLeft(Math.min(left, right - $viewport[0].clientWidth));\r
+        handleScroll();\r
+        render();\r
+      }\r
+    }\r
+\r
+    function setActiveCellInternal(newCell, editMode) {\r
+      if (activeCellNode !== null) {\r
+        makeActiveCellNormal();\r
+        $(activeCellNode).removeClass("active");\r
+        if (rowsCache[activeRow]) {\r
+          $(rowsCache[activeRow].rowNode).removeClass("active");\r
+        }\r
+      }\r
+\r
+      var activeCellChanged = (activeCellNode !== newCell);\r
+      activeCellNode = newCell;\r
+\r
+      if (activeCellNode != null) {\r
+        activeRow = getRowFromNode(activeCellNode.parentNode);\r
+        activeCell = activePosX = getCellFromNode(activeCellNode);\r
+\r
+        $(activeCellNode).addClass("active");\r
+        $(rowsCache[activeRow].rowNode).addClass("active");\r
+\r
+        if (options.editable && editMode && isCellPotentiallyEditable(activeRow, activeCell)) {\r
+          clearTimeout(h_editorLoader);\r
+\r
+          if (options.asyncEditorLoading) {\r
+            h_editorLoader = setTimeout(function () {\r
+              makeActiveCellEditable();\r
+            }, options.asyncEditorLoadDelay);\r
+          } else {\r
+            makeActiveCellEditable();\r
+          }\r
+        }\r
+      } else {\r
+        activeRow = activeCell = null;\r
+      }\r
+\r
+      if (activeCellChanged) {\r
+        trigger(self.onActiveCellChanged, getActiveCell());\r
+      }\r
+    }\r
+\r
+    function clearTextSelection() {\r
+      if (document.selection && document.selection.empty) {\r
+        try {\r
+          //IE fails here if selected element is not in dom\r
+          document.selection.empty();\r
+        } catch (e) { }\r
+      } else if (window.getSelection) {\r
+        var sel = window.getSelection();\r
+        if (sel && sel.removeAllRanges) {\r
+          sel.removeAllRanges();\r
+        }\r
+      }\r
+    }\r
+\r
+    function isCellPotentiallyEditable(row, cell) {\r
+      // is the data for this row loaded?\r
+      if (row < getDataLength() && !getDataItem(row)) {\r
+        return false;\r
+      }\r
+\r
+      // are we in the Add New row?  can we create new from this cell?\r
+      if (columns[cell].cannotTriggerInsert && row >= getDataLength()) {\r
+        return false;\r
+      }\r
+\r
+      // does this cell have an editor?\r
+      if (!getEditor(row, cell)) {\r
+        return false;\r
+      }\r
+\r
+      return true;\r
+    }\r
+\r
+    function makeActiveCellNormal() {\r
+      if (!currentEditor) {\r
+        return;\r
+      }\r
+      trigger(self.onBeforeCellEditorDestroy, {editor: currentEditor});\r
+      currentEditor.destroy();\r
+      currentEditor = null;\r
+\r
+      if (activeCellNode) {\r
+        var d = getDataItem(activeRow);\r
+        $(activeCellNode).removeClass("editable invalid");\r
+        if (d) {\r
+          var column = columns[activeCell];\r
+          var formatter = getFormatter(activeRow, column);\r
+          activeCellNode.innerHTML = formatter(activeRow, activeCell, getDataItemValueForColumn(d, column), column, d);\r
+          invalidatePostProcessingResults(activeRow);\r
+        }\r
+      }\r
+\r
+      // if there previously was text selected on a page (such as selected text in the edit cell just removed),\r
+      // IE can't set focus to anything else correctly\r
+      if (navigator.userAgent.toLowerCase().match(/msie/)) {\r
+        clearTextSelection();\r
+      }\r
+\r
+      getEditorLock().deactivate(editController);\r
+    }\r
+\r
+    function makeActiveCellEditable(editor) {\r
+      if (!activeCellNode) {\r
+        return;\r
+      }\r
+      if (!options.editable) {\r
+        throw "Grid : makeActiveCellEditable : should never get called when options.editable is false";\r
+      }\r
+\r
+      // cancel pending async call if there is one\r
+      clearTimeout(h_editorLoader);\r
+\r
+      if (!isCellPotentiallyEditable(activeRow, activeCell)) {\r
+        return;\r
+      }\r
+\r
+      var columnDef = columns[activeCell];\r
+      var item = getDataItem(activeRow);\r
+\r
+      if (trigger(self.onBeforeEditCell, {row: activeRow, cell: activeCell, item: item, column: columnDef}) === false) {\r
+        setFocus();\r
+        return;\r
+      }\r
+\r
+      getEditorLock().activate(editController);\r
+      $(activeCellNode).addClass("editable");\r
+\r
+      // don't clear the cell if a custom editor is passed through\r
+      if (!editor) {\r
+        activeCellNode.innerHTML = "";\r
+      }\r
+\r
+      currentEditor = new (editor || getEditor(activeRow, activeCell))({\r
+        grid: self,\r
+        gridPosition: absBox($container[0]),\r
+        position: absBox(activeCellNode),\r
+        container: activeCellNode,\r
+        column: columnDef,\r
+        item: item || {},\r
+        commitChanges: commitEditAndSetFocus,\r
+        cancelChanges: cancelEditAndSetFocus\r
+      });\r
+\r
+      if (item) {\r
+        currentEditor.loadValue(item);\r
+      }\r
+\r
+      serializedEditorValue = currentEditor.serializeValue();\r
+\r
+      if (currentEditor.position) {\r
+        handleActiveCellPositionChange();\r
+      }\r
+    }\r
+\r
+    function commitEditAndSetFocus() {\r
+      // if the commit fails, it would do so due to a validation error\r
+      // if so, do not steal the focus from the editor\r
+      if (getEditorLock().commitCurrentEdit()) {\r
+        setFocus();\r
+        if (options.autoEdit) {\r
+          navigateDown();\r
+        }\r
+      }\r
+    }\r
+\r
+    function cancelEditAndSetFocus() {\r
+      if (getEditorLock().cancelCurrentEdit()) {\r
+        setFocus();\r
+      }\r
+    }\r
+\r
+    function absBox(elem) {\r
+      var box = {\r
+        top: elem.offsetTop,\r
+        left: elem.offsetLeft,\r
+        bottom: 0,\r
+        right: 0,\r
+        width: $(elem).outerWidth(),\r
+        height: $(elem).outerHeight(),\r
+        visible: true};\r
+      box.bottom = box.top + box.height;\r
+      box.right = box.left + box.width;\r
+\r
+      // walk up the tree\r
+      var offsetParent = elem.offsetParent;\r
+      while ((elem = elem.parentNode) != document.body) {\r
+        if (box.visible && elem.scrollHeight != elem.offsetHeight && $(elem).css("overflowY") != "visible") {\r
+          box.visible = box.bottom > elem.scrollTop && box.top < elem.scrollTop + elem.clientHeight;\r
+        }\r
+\r
+        if (box.visible && elem.scrollWidth != elem.offsetWidth && $(elem).css("overflowX") != "visible") {\r
+          box.visible = box.right > elem.scrollLeft && box.left < elem.scrollLeft + elem.clientWidth;\r
+        }\r
+\r
+        box.left -= elem.scrollLeft;\r
+        box.top -= elem.scrollTop;\r
+\r
+        if (elem === offsetParent) {\r
+          box.left += elem.offsetLeft;\r
+          box.top += elem.offsetTop;\r
+          offsetParent = elem.offsetParent;\r
+        }\r
+\r
+        box.bottom = box.top + box.height;\r
+        box.right = box.left + box.width;\r
+      }\r
+\r
+      return box;\r
+    }\r
+\r
+    function getActiveCellPosition() {\r
+      return absBox(activeCellNode);\r
+    }\r
+\r
+    function getGridPosition() {\r
+      return absBox($container[0])\r
+    }\r
+\r
+    function handleActiveCellPositionChange() {\r
+      if (!activeCellNode) {\r
+        return;\r
+      }\r
+\r
+      trigger(self.onActiveCellPositionChanged, {});\r
+\r
+      if (currentEditor) {\r
+        var cellBox = getActiveCellPosition();\r
+        if (currentEditor.show && currentEditor.hide) {\r
+          if (!cellBox.visible) {\r
+            currentEditor.hide();\r
+          } else {\r
+            currentEditor.show();\r
+          }\r
+        }\r
+\r
+        if (currentEditor.position) {\r
+          currentEditor.position(cellBox);\r
+        }\r
+      }\r
+    }\r
+\r
+    function getCellEditor() {\r
+      return currentEditor;\r
+    }\r
+\r
+    function getActiveCell() {\r
+      if (!activeCellNode) {\r
+        return null;\r
+      } else {\r
+        return {row: activeRow, cell: activeCell};\r
+      }\r
+    }\r
+\r
+    function getActiveCellNode() {\r
+      return activeCellNode;\r
+    }\r
+\r
+    function scrollRowIntoView(row, doPaging) {\r
+      var rowAtTop = row * options.rowHeight;\r
+      var rowAtBottom = (row + 1) * options.rowHeight - viewportH + (viewportHasHScroll ? scrollbarDimensions.height : 0);\r
+\r
+      // need to page down?\r
+      if ((row + 1) * options.rowHeight > scrollTop + viewportH + offset) {\r
+        scrollTo(doPaging ? rowAtTop : rowAtBottom);\r
+        render();\r
+      }\r
+      // or page up?\r
+      else if (row * options.rowHeight < scrollTop + offset) {\r
+        scrollTo(doPaging ? rowAtBottom : rowAtTop);\r
+        render();\r
+      }\r
+    }\r
+\r
+    function scrollRowToTop(row) {\r
+      scrollTo(row * options.rowHeight);\r
+      render();\r
+    }\r
+\r
+    function getColspan(row, cell) {\r
+      var metadata = data.getItemMetadata && data.getItemMetadata(row);\r
+      if (!metadata || !metadata.columns) {\r
+        return 1;\r
+      }\r
+\r
+      var columnData = metadata.columns[columns[cell].id] || metadata.columns[cell];\r
+      var colspan = (columnData && columnData.colspan);\r
+      if (colspan === "*") {\r
+        colspan = columns.length - cell;\r
+      } else {\r
+        colspan = colspan || 1;\r
+      }\r
+\r
+      return colspan;\r
+    }\r
+\r
+    function findFirstFocusableCell(row) {\r
+      var cell = 0;\r
+      while (cell < columns.length) {\r
+        if (canCellBeActive(row, cell)) {\r
+          return cell;\r
+        }\r
+        cell += getColspan(row, cell);\r
+      }\r
+      return null;\r
+    }\r
+\r
+    function findLastFocusableCell(row) {\r
+      var cell = 0;\r
+      var lastFocusableCell = null;\r
+      while (cell < columns.length) {\r
+        if (canCellBeActive(row, cell)) {\r
+          lastFocusableCell = cell;\r
+        }\r
+        cell += getColspan(row, cell);\r
+      }\r
+      return lastFocusableCell;\r
+    }\r
+\r
+    function gotoRight(row, cell, posX) {\r
+      if (cell >= columns.length) {\r
+        return null;\r
+      }\r
+\r
+      do {\r
+        cell += getColspan(row, cell);\r
+      }\r
+      while (cell < columns.length && !canCellBeActive(row, cell));\r
+\r
+      if (cell < columns.length) {\r
+        return {\r
+          "row": row,\r
+          "cell": cell,\r
+          "posX": cell\r
+        };\r
+      }\r
+      return null;\r
+    }\r
+\r
+    function gotoLeft(row, cell, posX) {\r
+      if (cell <= 0) {\r
+        return null;\r
+      }\r
+\r
+      var firstFocusableCell = findFirstFocusableCell(row);\r
+      if (firstFocusableCell === null || firstFocusableCell >= cell) {\r
+        return null;\r
+      }\r
+\r
+      var prev = {\r
+        "row": row,\r
+        "cell": firstFocusableCell,\r
+        "posX": firstFocusableCell\r
+      };\r
+      var pos;\r
+      while (true) {\r
+        pos = gotoRight(prev.row, prev.cell, prev.posX);\r
+        if (!pos) {\r
+          return null;\r
+        }\r
+        if (pos.cell >= cell) {\r
+          return prev;\r
+        }\r
+        prev = pos;\r
+      }\r
+    }\r
+\r
+    function gotoDown(row, cell, posX) {\r
+      var prevCell;\r
+      while (true) {\r
+        if (++row >= getDataLength() + (options.enableAddRow ? 1 : 0)) {\r
+          return null;\r
+        }\r
+\r
+        prevCell = cell = 0;\r
+        while (cell <= posX) {\r
+          prevCell = cell;\r
+          cell += getColspan(row, cell);\r
+        }\r
+\r
+        if (canCellBeActive(row, prevCell)) {\r
+          return {\r
+            "row": row,\r
+            "cell": prevCell,\r
+            "posX": posX\r
+          };\r
+        }\r
+      }\r
+    }\r
+\r
+    function gotoUp(row, cell, posX) {\r
+      var prevCell;\r
+      while (true) {\r
+        if (--row < 0) {\r
+          return null;\r
+        }\r
+\r
+        prevCell = cell = 0;\r
+        while (cell <= posX) {\r
+          prevCell = cell;\r
+          cell += getColspan(row, cell);\r
+        }\r
+\r
+        if (canCellBeActive(row, prevCell)) {\r
+          return {\r
+            "row": row,\r
+            "cell": prevCell,\r
+            "posX": posX\r
+          };\r
+        }\r
+      }\r
+    }\r
+\r
+    function gotoNext(row, cell, posX) {\r
+      if (row == null && cell == null) {\r
+        row = cell = posX = 0;\r
+        if (canCellBeActive(row, cell)) {\r
+          return {\r
+            "row": row,\r
+            "cell": cell,\r
+            "posX": cell\r
+          };\r
+        }\r
+      }\r
+\r
+      var pos = gotoRight(row, cell, posX);\r
+      if (pos) {\r
+        return pos;\r
+      }\r
+\r
+      var firstFocusableCell = null;\r
+      while (++row < getDataLength() + (options.enableAddRow ? 1 : 0)) {\r
+        firstFocusableCell = findFirstFocusableCell(row);\r
+        if (firstFocusableCell !== null) {\r
+          return {\r
+            "row": row,\r
+            "cell": firstFocusableCell,\r
+            "posX": firstFocusableCell\r
+          };\r
+        }\r
+      }\r
+      return null;\r
+    }\r
+\r
+    function gotoPrev(row, cell, posX) {\r
+      if (row == null && cell == null) {\r
+        row = getDataLength() + (options.enableAddRow ? 1 : 0) - 1;\r
+        cell = posX = columns.length - 1;\r
+        if (canCellBeActive(row, cell)) {\r
+          return {\r
+            "row": row,\r
+            "cell": cell,\r
+            "posX": cell\r
+          };\r
+        }\r
+      }\r
+\r
+      var pos;\r
+      var lastSelectableCell;\r
+      while (!pos) {\r
+        pos = gotoLeft(row, cell, posX);\r
+        if (pos) {\r
+          break;\r
+        }\r
+        if (--row < 0) {\r
+          return null;\r
+        }\r
+\r
+        cell = 0;\r
+        lastSelectableCell = findLastFocusableCell(row);\r
+        if (lastSelectableCell !== null) {\r
+          pos = {\r
+            "row": row,\r
+            "cell": lastSelectableCell,\r
+            "posX": lastSelectableCell\r
+          };\r
+        }\r
+      }\r
+      return pos;\r
+    }\r
+\r
+    function navigateRight() {\r
+      return navigate("right");\r
+    }\r
+\r
+    function navigateLeft() {\r
+      return navigate("left");\r
+    }\r
+\r
+    function navigateDown() {\r
+      return navigate("down");\r
+    }\r
+\r
+    function navigateUp() {\r
+      return navigate("up");\r
+    }\r
+\r
+    function navigateNext() {\r
+      return navigate("next");\r
+    }\r
+\r
+    function navigatePrev() {\r
+      return navigate("prev");\r
+    }\r
+\r
+    /**\r
+     * @param {string} dir Navigation direction.\r
+     * @return {boolean} Whether navigation resulted in a change of active cell.\r
+     */\r
+    function navigate(dir) {\r
+      if (!options.enableCellNavigation) {\r
+        return false;\r
+      }\r
+\r
+      if (!activeCellNode && dir != "prev" && dir != "next") {\r
+        return false;\r
+      }\r
+\r
+      if (!getEditorLock().commitCurrentEdit()) {\r
+        return true;\r
+      }\r
+      setFocus();\r
+\r
+      var tabbingDirections = {\r
+        "up": -1,\r
+        "down": 1,\r
+        "left": -1,\r
+        "right": 1,\r
+        "prev": -1,\r
+        "next": 1\r
+      };\r
+      tabbingDirection = tabbingDirections[dir];\r
+\r
+      var stepFunctions = {\r
+        "up": gotoUp,\r
+        "down": gotoDown,\r
+        "left": gotoLeft,\r
+        "right": gotoRight,\r
+        "prev": gotoPrev,\r
+        "next": gotoNext\r
+      };\r
+      var stepFn = stepFunctions[dir];\r
+      var pos = stepFn(activeRow, activeCell, activePosX);\r
+      if (pos) {\r
+        var isAddNewRow = (pos.row == getDataLength());\r
+        scrollCellIntoView(pos.row, pos.cell, !isAddNewRow);\r
+        setActiveCellInternal(getCellNode(pos.row, pos.cell), isAddNewRow || options.autoEdit);\r
+        activePosX = pos.posX;\r
+        return true;\r
+      } else {\r
+        setActiveCellInternal(getCellNode(activeRow, activeCell), (activeRow == getDataLength()) || options.autoEdit);\r
+        return false;\r
+      }\r
+    }\r
+\r
+    function getCellNode(row, cell) {\r
+      if (rowsCache[row]) {\r
+        ensureCellNodesInRowsCache(row);\r
+        return rowsCache[row].cellNodesByColumnIdx[cell];\r
+      }\r
+      return null;\r
+    }\r
+\r
+    function setActiveCell(row, cell) {\r
+      if (!initialized) { return; }\r
+      if (row > getDataLength() || row < 0 || cell >= columns.length || cell < 0) {\r
+        return;\r
+      }\r
+\r
+      if (!options.enableCellNavigation) {\r
+        return;\r
+      }\r
+\r
+      scrollCellIntoView(row, cell, false);\r
+      setActiveCellInternal(getCellNode(row, cell), false);\r
+    }\r
+\r
+    function canCellBeActive(row, cell) {\r
+      if (!options.enableCellNavigation || row >= getDataLength() + (options.enableAddRow ? 1 : 0) ||\r
+          row < 0 || cell >= columns.length || cell < 0) {\r
+        return false;\r
+      }\r
+\r
+      var rowMetadata = data.getItemMetadata && data.getItemMetadata(row);\r
+      if (rowMetadata && typeof rowMetadata.focusable === "boolean") {\r
+        return rowMetadata.focusable;\r
+      }\r
+\r
+      var columnMetadata = rowMetadata && rowMetadata.columns;\r
+      if (columnMetadata && columnMetadata[columns[cell].id] && typeof columnMetadata[columns[cell].id].focusable === "boolean") {\r
+        return columnMetadata[columns[cell].id].focusable;\r
+      }\r
+      if (columnMetadata && columnMetadata[cell] && typeof columnMetadata[cell].focusable === "boolean") {\r
+        return columnMetadata[cell].focusable;\r
+      }\r
+\r
+      return columns[cell].focusable;\r
+    }\r
+\r
+    function canCellBeSelected(row, cell) {\r
+      if (row >= getDataLength() || row < 0 || cell >= columns.length || cell < 0) {\r
+        return false;\r
+      }\r
+\r
+      var rowMetadata = data.getItemMetadata && data.getItemMetadata(row);\r
+      if (rowMetadata && typeof rowMetadata.selectable === "boolean") {\r
+        return rowMetadata.selectable;\r
+      }\r
+\r
+      var columnMetadata = rowMetadata && rowMetadata.columns && (rowMetadata.columns[columns[cell].id] || rowMetadata.columns[cell]);\r
+      if (columnMetadata && typeof columnMetadata.selectable === "boolean") {\r
+        return columnMetadata.selectable;\r
+      }\r
+\r
+      return columns[cell].selectable;\r
+    }\r
+\r
+    function gotoCell(row, cell, forceEdit) {\r
+      if (!initialized) { return; }\r
+      if (!canCellBeActive(row, cell)) {\r
+        return;\r
+      }\r
+\r
+      if (!getEditorLock().commitCurrentEdit()) {\r
+        return;\r
+      }\r
+\r
+      scrollCellIntoView(row, cell, false);\r
+\r
+      var newCell = getCellNode(row, cell);\r
+\r
+      // if selecting the 'add new' row, start editing right away\r
+      setActiveCellInternal(newCell, forceEdit || (row === getDataLength()) || options.autoEdit);\r
+\r
+      // if no editor was created, set the focus back on the grid\r
+      if (!currentEditor) {\r
+        setFocus();\r
+      }\r
+    }\r
+\r
+\r
+    //////////////////////////////////////////////////////////////////////////////////////////////\r
+    // IEditor implementation for the editor lock\r
+\r
+    function commitCurrentEdit() {\r
+      var item = getDataItem(activeRow);\r
+      var column = columns[activeCell];\r
+\r
+      if (currentEditor) {\r
+        if (currentEditor.isValueChanged()) {\r
+          var validationResults = currentEditor.validate();\r
+\r
+          if (validationResults.valid) {\r
+            if (activeRow < getDataLength()) {\r
+              var editCommand = {\r
+                row: activeRow,\r
+                cell: activeCell,\r
+                editor: currentEditor,\r
+                serializedValue: currentEditor.serializeValue(),\r
+                prevSerializedValue: serializedEditorValue,\r
+                execute: function () {\r
+                  this.editor.applyValue(item, this.serializedValue);\r
+                  updateRow(this.row);\r
+                },\r
+                undo: function () {\r
+                  this.editor.applyValue(item, this.prevSerializedValue);\r
+                  updateRow(this.row);\r
+                }\r
+              };\r
+\r
+              if (options.editCommandHandler) {\r
+                makeActiveCellNormal();\r
+                options.editCommandHandler(item, column, editCommand);\r
+              } else {\r
+                editCommand.execute();\r
+                makeActiveCellNormal();\r
+              }\r
+\r
+              trigger(self.onCellChange, {\r
+                row: activeRow,\r
+                cell: activeCell,\r
+                item: item\r
+              });\r
+            } else {\r
+              var newItem = {};\r
+              currentEditor.applyValue(newItem, currentEditor.serializeValue());\r
+              makeActiveCellNormal();\r
+              trigger(self.onAddNewRow, {item: newItem, column: column});\r
+            }\r
+\r
+            // check whether the lock has been re-acquired by event handlers\r
+            return !getEditorLock().isActive();\r
+          } else {\r
+            // Re-add the CSS class to trigger transitions, if any.\r
+            $(activeCellNode).removeClass("invalid");\r
+            $(activeCellNode).width();  // force layout\r
+            $(activeCellNode).addClass("invalid");\r
+\r
+            trigger(self.onValidationError, {\r
+              editor: currentEditor,\r
+              cellNode: activeCellNode,\r
+              validationResults: validationResults,\r
+              row: activeRow,\r
+              cell: activeCell,\r
+              column: column\r
+            });\r
+\r
+            currentEditor.focus();\r
+            return false;\r
+          }\r
+        }\r
+\r
+        makeActiveCellNormal();\r
+      }\r
+      return true;\r
+    }\r
+\r
+    function cancelCurrentEdit() {\r
+      makeActiveCellNormal();\r
+      return true;\r
+    }\r
+\r
+    function rowsToRanges(rows) {\r
+      var ranges = [];\r
+      var lastCell = columns.length - 1;\r
+      for (var i = 0; i < rows.length; i++) {\r
+        ranges.push(new Slick.Range(rows[i], 0, rows[i], lastCell));\r
+      }\r
+      return ranges;\r
+    }\r
+\r
+    function getSelectedRows() {\r
+      if (!selectionModel) {\r
+        throw "Selection model is not set";\r
+      }\r
+      return selectedRows;\r
+    }\r
+\r
+    function setSelectedRows(rows) {\r
+      if (!selectionModel) {\r
+        throw "Selection model is not set";\r
+      }\r
+      selectionModel.setSelectedRanges(rowsToRanges(rows));\r
+    }\r
+\r
+\r
+    //////////////////////////////////////////////////////////////////////////////////////////////\r
+    // Debug\r
+\r
+    this.debug = function () {\r
+      var s = "";\r
+\r
+      s += ("\n" + "counter_rows_rendered:  " + counter_rows_rendered);\r
+      s += ("\n" + "counter_rows_removed:  " + counter_rows_removed);\r
+      s += ("\n" + "renderedRows:  " + renderedRows);\r
+      s += ("\n" + "numVisibleRows:  " + numVisibleRows);\r
+      s += ("\n" + "maxSupportedCssHeight:  " + maxSupportedCssHeight);\r
+      s += ("\n" + "n(umber of pages):  " + n);\r
+      s += ("\n" + "(current) page:  " + page);\r
+      s += ("\n" + "page height (ph):  " + ph);\r
+      s += ("\n" + "vScrollDir:  " + vScrollDir);\r
+\r
+      alert(s);\r
+    };\r
+\r
+    // a debug helper to be able to access private members\r
+    this.eval = function (expr) {\r
+      return eval(expr);\r
+    };\r
+\r
+    //////////////////////////////////////////////////////////////////////////////////////////////\r
+    // Public API\r
+\r
+    $.extend(this, {\r
+      "slickGridVersion": "2.1",\r
+\r
+      // Events\r
+      "onScroll": new Slick.Event(),\r
+      "onSort": new Slick.Event(),\r
+      "onHeaderMouseEnter": new Slick.Event(),\r
+      "onHeaderMouseLeave": new Slick.Event(),\r
+      "onHeaderContextMenu": new Slick.Event(),\r
+      "onHeaderClick": new Slick.Event(),\r
+      "onHeaderCellRendered": new Slick.Event(),\r
+      "onBeforeHeaderCellDestroy": new Slick.Event(),\r
+      "onHeaderRowCellRendered": new Slick.Event(),\r
+      "onBeforeHeaderRowCellDestroy": new Slick.Event(),\r
+      "onMouseEnter": new Slick.Event(),\r
+      "onMouseLeave": new Slick.Event(),\r
+      "onClick": new Slick.Event(),\r
+      "onDblClick": new Slick.Event(),\r
+      "onContextMenu": new Slick.Event(),\r
+      "onKeyDown": new Slick.Event(),\r
+      "onAddNewRow": new Slick.Event(),\r
+      "onValidationError": new Slick.Event(),\r
+      "onViewportChanged": new Slick.Event(),\r
+      "onColumnsReordered": new Slick.Event(),\r
+      "onColumnsResized": new Slick.Event(),\r
+      "onCellChange": new Slick.Event(),\r
+      "onBeforeEditCell": new Slick.Event(),\r
+      "onBeforeCellEditorDestroy": new Slick.Event(),\r
+      "onBeforeDestroy": new Slick.Event(),\r
+      "onActiveCellChanged": new Slick.Event(),\r
+      "onActiveCellPositionChanged": new Slick.Event(),\r
+      "onDragInit": new Slick.Event(),\r
+      "onDragStart": new Slick.Event(),\r
+      "onDrag": new Slick.Event(),\r
+      "onDragEnd": new Slick.Event(),\r
+      "onSelectedRowsChanged": new Slick.Event(),\r
+      "onCellCssStylesChanged": new Slick.Event(),\r
+\r
+      // Methods\r
+      "registerPlugin": registerPlugin,\r
+      "unregisterPlugin": unregisterPlugin,\r
+      "getColumns": getColumns,\r
+      "setColumns": setColumns,\r
+      "getColumnIndex": getColumnIndex,\r
+      "updateColumnHeader": updateColumnHeader,\r
+      "setSortColumn": setSortColumn,\r
+      "setSortColumns": setSortColumns,\r
+      "getSortColumns": getSortColumns,\r
+      "autosizeColumns": autosizeColumns,\r
+      "getOptions": getOptions,\r
+      "setOptions": setOptions,\r
+      "getData": getData,\r
+      "getDataLength": getDataLength,\r
+      "getDataItem": getDataItem,\r
+      "setData": setData,\r
+      "getSelectionModel": getSelectionModel,\r
+      "setSelectionModel": setSelectionModel,\r
+      "getSelectedRows": getSelectedRows,\r
+      "setSelectedRows": setSelectedRows,\r
+      "getContainerNode": getContainerNode,\r
+\r
+      "render": render,\r
+      "invalidate": invalidate,\r
+      "invalidateRow": invalidateRow,\r
+      "invalidateRows": invalidateRows,\r
+      "invalidateAllRows": invalidateAllRows,\r
+      "updateCell": updateCell,\r
+      "updateRow": updateRow,\r
+      "getViewport": getVisibleRange,\r
+      "getRenderedRange": getRenderedRange,\r
+      "resizeCanvas": resizeCanvas,\r
+      "updateRowCount": updateRowCount,\r
+      "scrollRowIntoView": scrollRowIntoView,\r
+      "scrollRowToTop": scrollRowToTop,\r
+      "scrollCellIntoView": scrollCellIntoView,\r
+      "getCanvasNode": getCanvasNode,\r
+      "focus": setFocus,\r
+\r
+      "getCellFromPoint": getCellFromPoint,\r
+      "getCellFromEvent": getCellFromEvent,\r
+      "getActiveCell": getActiveCell,\r
+      "setActiveCell": setActiveCell,\r
+      "getActiveCellNode": getActiveCellNode,\r
+      "getActiveCellPosition": getActiveCellPosition,\r
+      "resetActiveCell": resetActiveCell,\r
+      "editActiveCell": makeActiveCellEditable,\r
+      "getCellEditor": getCellEditor,\r
+      "getCellNode": getCellNode,\r
+      "getCellNodeBox": getCellNodeBox,\r
+      "canCellBeSelected": canCellBeSelected,\r
+      "canCellBeActive": canCellBeActive,\r
+      "navigatePrev": navigatePrev,\r
+      "navigateNext": navigateNext,\r
+      "navigateUp": navigateUp,\r
+      "navigateDown": navigateDown,\r
+      "navigateLeft": navigateLeft,\r
+      "navigateRight": navigateRight,\r
+      "gotoCell": gotoCell,\r
+      "getTopPanel": getTopPanel,\r
+      "setTopPanelVisibility": setTopPanelVisibility,\r
+      "setHeaderRowVisibility": setHeaderRowVisibility,\r
+      "getHeaderRow": getHeaderRow,\r
+      "getHeaderRowColumn": getHeaderRowColumn,\r
+      "getGridPosition": getGridPosition,\r
+      "flashCell": flashCell,\r
+      "addCellCssStyles": addCellCssStyles,\r
+      "setCellCssStyles": setCellCssStyles,\r
+      "removeCellCssStyles": removeCellCssStyles,\r
+      "getCellCssStyles": getCellCssStyles,\r
+\r
+      "init": finishInitialization,\r
+      "destroy": destroy,\r
+\r
+      // IEditor implementation\r
+      "getEditorLock": getEditorLock,\r
+      "getEditController": getEditController\r
+    });\r
+\r
+    init();\r
+  }\r
+}(jQuery));\r
diff --git a/third-party/slickgrid-2.1/slick.groupitemmetadataprovider.js b/third-party/slickgrid-2.1/slick.groupitemmetadataprovider.js
new file mode 100644 (file)
index 0000000..49852a4
--- /dev/null
@@ -0,0 +1,144 @@
+(function ($) {
+  $.extend(true, window, {
+    Slick: {
+      Data: {
+        GroupItemMetadataProvider: GroupItemMetadataProvider
+      }
+    }
+  });
+
+
+  /***
+   * Provides item metadata for group (Slick.Group) and totals (Slick.Totals) rows produced by the DataView.
+   * This metadata overrides the default behavior and formatting of those rows so that they appear and function
+   * correctly when processed by the grid.
+   *
+   * This class also acts as a grid plugin providing event handlers to expand & collapse groups.
+   * If "grid.registerPlugin(...)" is not called, expand & collapse will not work.
+   *
+   * @class GroupItemMetadataProvider
+   * @module Data
+   * @namespace Slick.Data
+   * @constructor
+   * @param options
+   */
+  function GroupItemMetadataProvider(options) {
+    var _grid;
+    var _defaults = {
+      groupCssClass: "slick-group",
+      groupTitleCssClass: "slick-group-title",
+      totalsCssClass: "slick-group-totals",
+      groupFocusable: true,
+      totalsFocusable: false,
+      toggleCssClass: "slick-group-toggle",
+      toggleExpandedCssClass: "expanded",
+      toggleCollapsedCssClass: "collapsed",
+      enableExpandCollapse: true
+    };
+
+    options = $.extend(true, {}, _defaults, options);
+
+
+    function defaultGroupCellFormatter(row, cell, value, columnDef, item) {
+      if (!options.enableExpandCollapse) {
+        return item.title;
+      }
+
+      var indentation = item.level * 15 + "px";
+
+      return "<span class='" + options.toggleCssClass + " " +
+          (item.collapsed ? options.toggleCollapsedCssClass : options.toggleExpandedCssClass) +
+          "' style='margin-left:" + indentation +"'>" +
+          "</span>" +
+          "<span class='" + options.groupTitleCssClass + "' level='" + item.level + "'>" +
+            item.title +
+          "</span>";
+    }
+
+    function defaultTotalsCellFormatter(row, cell, value, columnDef, item) {
+      return (columnDef.groupTotalsFormatter && columnDef.groupTotalsFormatter(item, columnDef)) || "";
+    }
+
+
+    function init(grid) {
+      _grid = grid;
+      _grid.onClick.subscribe(handleGridClick);
+      _grid.onKeyDown.subscribe(handleGridKeyDown);
+
+    }
+
+    function destroy() {
+      if (_grid) {
+        _grid.onClick.unsubscribe(handleGridClick);
+        _grid.onKeyDown.unsubscribe(handleGridKeyDown);
+      }
+    }
+
+    function handleGridClick(e, args) {
+      var item = this.getDataItem(args.row);
+      if (item && item instanceof Slick.Group && $(e.target).hasClass(options.toggleCssClass)) {
+        if (item.collapsed) {
+          this.getData().expandGroup(item.groupingKey);
+        } else {
+          this.getData().collapseGroup(item.groupingKey);
+        }
+
+        e.stopImmediatePropagation();
+        e.preventDefault();
+      }
+    }
+
+    // TODO:  add -/+ handling
+    function handleGridKeyDown(e, args) {
+      if (options.enableExpandCollapse && (e.which == $.ui.keyCode.SPACE)) {
+        var activeCell = this.getActiveCell();
+        if (activeCell) {
+          var item = this.getDataItem(activeCell.row);
+          if (item && item instanceof Slick.Group) {
+            if (item.collapsed) {
+              this.getData().expandGroup(item.groupingKey);
+            } else {
+              this.getData().collapseGroup(item.groupingKey);
+            }
+
+            e.stopImmediatePropagation();
+            e.preventDefault();
+          }
+        }
+      }
+    }
+
+    function getGroupRowMetadata(item) {
+      return {
+        selectable: false,
+        focusable: options.groupFocusable,
+        cssClasses: options.groupCssClass,
+        columns: {
+          0: {
+            colspan: "*",
+            formatter: defaultGroupCellFormatter,
+            editor: null
+          }
+        }
+      };
+    }
+
+    function getTotalsRowMetadata(item) {
+      return {
+        selectable: false,
+        focusable: options.totalsFocusable,
+        cssClasses: options.totalsCssClass,
+        formatter: defaultTotalsCellFormatter,
+        editor: null
+      };
+    }
+
+
+    return {
+      "init": init,
+      "destroy": destroy,
+      "getGroupRowMetadata": getGroupRowMetadata,
+      "getTotalsRowMetadata": getTotalsRowMetadata
+    };
+  }
+})(jQuery);
diff --git a/third-party/slickgrid-2.1/slick.remotemodel.js b/third-party/slickgrid-2.1/slick.remotemodel.js
new file mode 100644 (file)
index 0000000..6d21020
--- /dev/null
@@ -0,0 +1,173 @@
+(function ($) {
+  /***
+   * A sample AJAX data store implementation.
+   * Right now, it's hooked up to load Hackernews stories, but can
+   * easily be extended to support any JSONP-compatible backend that accepts paging parameters.
+   */
+  function RemoteModel() {
+    // private
+    var PAGESIZE = 50;
+    var data = {length: 0};
+    var searchstr = "";
+    var sortcol = null;
+    var sortdir = 1;
+    var h_request = null;
+    var req = null; // ajax request
+
+    // events
+    var onDataLoading = new Slick.Event();
+    var onDataLoaded = new Slick.Event();
+
+
+    function init() {
+    }
+
+
+    function isDataLoaded(from, to) {
+      for (var i = from; i <= to; i++) {
+        if (data[i] == undefined || data[i] == null) {
+          return false;
+        }
+      }
+
+      return true;
+    }
+
+
+    function clear() {
+      for (var key in data) {
+        delete data[key];
+      }
+      data.length = 0;
+    }
+
+
+    function ensureData(from, to) {
+      if (req) {
+        req.abort();
+        for (var i = req.fromPage; i <= req.toPage; i++)
+          data[i * PAGESIZE] = undefined;
+      }
+
+      if (from < 0) {
+        from = 0;
+      }
+
+      if (data.length > 0) {
+        to = Math.min(to, data.length - 1);
+      }
+
+      var fromPage = Math.floor(from / PAGESIZE);
+      var toPage = Math.floor(to / PAGESIZE);
+
+      while (data[fromPage * PAGESIZE] !== undefined && fromPage < toPage)
+        fromPage++;
+
+      while (data[toPage * PAGESIZE] !== undefined && fromPage < toPage)
+        toPage--;
+
+      if (fromPage > toPage || ((fromPage == toPage) && data[fromPage * PAGESIZE] !== undefined)) {
+        // TODO:  look-ahead
+        onDataLoaded.notify({from: from, to: to});
+        return;
+      }
+
+      var url = "http://api.thriftdb.com/api.hnsearch.com/items/_search?filter[fields][type][]=submission&q=" + searchstr + "&start=" + (fromPage * PAGESIZE) + "&limit=" + (((toPage - fromPage) * PAGESIZE) + PAGESIZE);
+
+      if (sortcol != null) {
+          url += ("&sortby=" + sortcol + ((sortdir > 0) ? "+asc" : "+desc"));
+      }
+
+      if (h_request != null) {
+        clearTimeout(h_request);
+      }
+
+      h_request = setTimeout(function () {
+        for (var i = fromPage; i <= toPage; i++)
+          data[i * PAGESIZE] = null; // null indicates a 'requested but not available yet'
+
+        onDataLoading.notify({from: from, to: to});
+
+        req = $.jsonp({
+          url: url,
+          callbackParameter: "callback",
+          cache: true,
+          success: onSuccess,
+          error: function () {
+            onError(fromPage, toPage)
+          }
+        });
+        req.fromPage = fromPage;
+        req.toPage = toPage;
+      }, 50);
+    }
+
+
+    function onError(fromPage, toPage) {
+      alert("error loading pages " + fromPage + " to " + toPage);
+    }
+
+    function onSuccess(resp) {
+      var from = resp.request.start, to = from + resp.results.length;
+      data.length = Math.min(parseInt(resp.hits),1000); // limitation of the API
+
+      for (var i = 0; i < resp.results.length; i++) {
+        var item = resp.results[i].item;
+
+        // Old IE versions can't parse ISO dates, so change to universally-supported format.
+        item.create_ts = item.create_ts.replace(/^(\d+)-(\d+)-(\d+)T(\d+:\d+:\d+)Z$/, "$2/$3/$1 $4 UTC"); 
+        item.create_ts = new Date(item.create_ts);
+
+        data[from + i] = item;
+        data[from + i].index = from + i;
+      }
+
+      req = null;
+
+      onDataLoaded.notify({from: from, to: to});
+    }
+
+
+    function reloadData(from, to) {
+      for (var i = from; i <= to; i++)
+        delete data[i];
+
+      ensureData(from, to);
+    }
+
+
+    function setSort(column, dir) {
+      sortcol = column;
+      sortdir = dir;
+      clear();
+    }
+
+    function setSearch(str) {
+      searchstr = str;
+      clear();
+    }
+
+
+    init();
+
+    return {
+      // properties
+      "data": data,
+
+      // methods
+      "clear": clear,
+      "isDataLoaded": isDataLoaded,
+      "ensureData": ensureData,
+      "reloadData": reloadData,
+      "setSort": setSort,
+      "setSearch": setSearch,
+
+      // events
+      "onDataLoading": onDataLoading,
+      "onDataLoaded": onDataLoaded
+    };
+  }
+
+  // Slick.Data.RemoteModel
+  $.extend(true, window, { Slick: { Data: { RemoteModel: RemoteModel }}});
+})(jQuery);