slickgrid-bootstrap-rails 0.0.1.10

data/vendor/assets/javascripts/plugins/slick.headermenu.js

@@ -0,0 +1,272 @@
+(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: "../images/down.gif"
+    };
+    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(document.body);
+      }
+      $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
+        .css("top", $(this).offset().top + $(this).height())
+        .css("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");
+    }
+
+
+    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);

data/vendor/assets/javascripts/plugins/slick.rowmovemanager.js

@@ -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);

data/vendor/assets/javascripts/plugins/slick.rowselectionmodel.js

@@ -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);