slickgrid - npm Package Compare versions

Comparing version 2.4.10 to 2.4.11

controls/slick.columnpicker.js

@@ -1,27 +0,27 @@
-  /***
-   * A control to add a Column Picker (right+click on any column header to reveal the column picker)
-   *
-   * USAGE:
-   *
-   * Add the slick.columnpicker.(js|css) files and register it with the grid.
-   *
-   * Available options, by defining a columnPicker object:
-   *
-   *  var options = {
-   *    enableCellNavigation: true,
-   *    columnPicker: {
-   *      columnTitle: "Columns",                 // default to empty string
-   *
-   *      // the last 2 checkboxes titles
-   *      hideForceFitButton: false,              // show/hide checkbox near the end "Force Fit Columns" (default:false)
-   *      hideSyncResizeButton: false,            // show/hide checkbox near the end "Synchronous Resize" (default:false)
-   *      forceFitTitle: "Force fit columns",     // default to "Force fit columns"
-   *      headerColumnValueExtractor: "Extract the column label" // default to column.name
-   *      syncResizeTitle: "Synchronous resize",  // default to "Synchronous resize"
-   *    }
-   *  };
-   *
-   * @class Slick.Controls.ColumnPicker
-   * @constructor
-   */
+/***
+ * A control to add a Column Picker (right+click on any column header to reveal the column picker)
+ *
+ * USAGE:
+ *
+ * Add the slick.columnpicker.(js|css) files and register it with the grid.
+ *
+ * Available options, by defining a columnPicker object:
+ *
+ *  var options = {
+ *    enableCellNavigation: true,
+ *    columnPicker: {
+ *      columnTitle: "Columns",                 // default to empty string
+ *
+ *      // the last 2 checkboxes titles
+ *      hideForceFitButton: false,              // show/hide checkbox near the end "Force Fit Columns" (default:false)
+ *      hideSyncResizeButton: false,            // show/hide checkbox near the end "Synchronous Resize" (default:false)
+ *      forceFitTitle: "Force fit columns",     // default to "Force fit columns"
+ *      headerColumnValueExtractor: "Extract the column label" // default to column.name
+ *      syncResizeTitle: "Synchronous resize",  // default to "Synchronous resize"
+ *    }
+ *  };
+ *
+ * @class Slick.Controls.ColumnPicker
+ * @constructor
+ */
 
@@ -34,2 +34,4 @@ 'use strict';
     var _options = options;
+    var $columnTitleElm;
+    var columns;
     var $list;
@@ -60,9 +62,9 @@ var $menu;
       $menu = $("<div class='slick-columnpicker' style='display:none' />").appendTo(document.body);
-      var $close = $("<button type='button' class='close' data-dismiss='slick-columnpicker' aria-label='Close'><span class='close' aria-hidden='true'>&times;</span></button>").appendTo($menu);
+      $("<button type='button' class='close' data-dismiss='slick-columnpicker' aria-label='Close'><span class='close' aria-hidden='true'>&times;</span></button>").appendTo($menu);
 
       // user could pass a title on top of the columns list
-      if(_options.columnPickerTitle || (_options.columnPicker && _options.columnPicker.columnTitle)) {
+      if (_options.columnPickerTitle || (_options.columnPicker && _options.columnPicker.columnTitle)) {
         var columnTitle = _options.columnPickerTitle || _options.columnPicker.columnTitle;
-        var $title = $("<div class='title'/>").append(columnTitle);
-        $title.appendTo($menu);
+        $columnTitleElm = $("<div class='title'/>").append(columnTitle);
+        $columnTitleElm.appendTo($menu);
       }
@@ -101,5 +103,6 @@
       var $li, $input;
-      var columnLabel;
+      var columnLabel, excludeCssClass;
       for (var i = 0; i < columns.length; i++) {
-        $li = $("<li />").appendTo($list);
+        excludeCssClass = columns[i].excludeFromColumnPicker ? "hidden" : "";
+        $li = $('<li class="' + excludeCssClass + '" />').appendTo($list);
         $input = $("<input type='checkbox' />").data("column-id", columns[i].id);
@@ -133,5 +136,5 @@ columnCheckboxes.push($input);
         $("<label />")
-            .text(forceFitTitle)
-            .prepend($input)
-            .appendTo($li);
+          .text(forceFitTitle)
+          .prepend($input)
+          .appendTo($li);
         if (_grid.getOptions().forceFitColumns) {
@@ -147,5 +150,5 @@ $input.attr("checked", "checked");
         $("<label />")
-            .text(syncResizeTitle)
-            .prepend($input)
-            .appendTo($li);
+          .text(syncResizeTitle)
+          .prepend($input)
+          .appendTo($li);
         if (_grid.getOptions().syncColumnCellResize) {
@@ -157,6 +160,6 @@ $input.attr("checked", "checked");
       $menu
-          .css("top", e.pageY - 10)
-          .css("left", e.pageX - 10)
-          .css("max-height", $(window).height() - e.pageY -10)
-          .fadeIn(_options.fadeSpeed);
+        .css("top", e.pageY - 10)
+        .css("left", e.pageX - 10)
+        .css("max-height", $(window).height() - e.pageY - 10)
+        .fadeIn(_options.fadeSpeed);
 
@@ -176,3 +179,3 @@ $list.appendTo($menu);
       for (var i = 0; i < ordered.length; i++) {
-        if ( _grid.getColumnIndex(columns[i].id) === undefined ) {
+        if (_grid.getColumnIndex(columns[i].id) === undefined) {
           // If the column doesn't return a value from getColumnIndex,
@@ -186,11 +189,9 @@ // it is hidden. Leave it in this position.
       }
+      columns = ordered;
+    }
 
-      // filter out excluded column header when necessary
-      // (works with IE9+, older browser requires a polyfill for the filter to work, visit MDN for more info)
-      if (Array.isArray(ordered) && typeof ordered.filter === 'function') {
-        columns = ordered.filter(function(columnDef) {
-          return !columnDef.excludeFromColumnPicker;
-        });
-      } else {
-        columns = ordered;
+    /** Update the Titles of each sections (command, customTitle, ...) */
+    function updateAllTitles(gridMenuOptions) {
+      if ($columnTitleElm && $columnTitleElm.text) {
+        $columnTitleElm.text(gridMenuOptions.columnTitle);
       }
@@ -202,6 +203,6 @@ }
         if (e.target.checked) {
-          _grid.setOptions({forceFitColumns:true});
+          _grid.setOptions({ forceFitColumns: true });
           _grid.autosizeColumns();
         } else {
-          _grid.setOptions({forceFitColumns:false});
+          _grid.setOptions({ forceFitColumns: false });
         }
@@ -213,5 +214,5 @@ return;
         if (e.target.checked) {
-          _grid.setOptions({syncColumnCellResize:true});
+          _grid.setOptions({ syncColumnCellResize: true });
         } else {
-          _grid.setOptions({syncColumnCellResize:false});
+          _grid.setOptions({ syncColumnCellResize: false });
         }
@@ -235,3 +236,3 @@ return;
         _grid.setColumns(visibleColumns);
-        onColumnsChanged.notify({columns: visibleColumns, grid: _grid});
+        onColumnsChanged.notify({ columns: visibleColumns, grid: _grid });
       }
@@ -250,2 +251,3 @@ }
       "destroy": destroy,
+      "updateAllTitles": updateAllTitles,
       "onColumnsChanged": onColumnsChanged
@@ -256,3 +258,3 @@ };
   // Slick.Controls.ColumnPicker
-  $.extend(true, window, { Slick:{ Controls:{ ColumnPicker:SlickColumnPicker }}});
+  $.extend(true, window, { Slick: { Controls: { ColumnPicker: SlickColumnPicker } } });
 })(jQuery);

controls/slick.gridmenu.js

@@ -1,457 +0,463 @@
-  /***
-   * A control to add a Grid Menu (hambuger menu on top-right of the grid)
-   *
-   * USAGE:
-   *
-   * Add the slick.gridmenu.(js|css) files and register it with the grid.
-   *
-   * To specify a menu in a column header, extend the column definition like so:
-   * var gridMenuControl = new Slick.Controls.GridMenu(columns, grid, options);
-   *
-   * Available grid options, by defining a gridMenu object:
-   *
-   *  var options = {
-   *    enableCellNavigation: true,
-   *    gridMenu: {
-   *      customTitle: "Custom Menus",                // default to empty string
-   *      columnTitle: "Columns",                     // default to empty string
-   *      iconImage: "../images/drag-handle.png",     // this is the Grid Menu icon (hamburger icon)
-   *      iconCssClass: "fa fa-bars",                 // you can provide iconImage OR iconCssClass
-   *      leaveOpen: false,                           // do we want to leave the Grid Menu open after a command execution? (false by default)
-   *      menuWidth: 18,                              // width that will be use to resize the column header container (18 by default)
-   *      resizeOnShowHeaderRow: false,               // false by default
-   *
-   *      // the last 2 checkboxes titles
-   *      hideForceFitButton: false,                  // show/hide checkbox near the end "Force Fit Columns"
-   *      hideSyncResizeButton: false,                // show/hide checkbox near the end "Synchronous Resize"
-   *      forceFitTitle: "Force fit columns",         // default to "Force fit columns"
-   *      syncResizeTitle: "Synchronous resize",      // default to "Synchronous resize"
-   *
-   *      customItems: [
-   *        {
-   *          // custom menu item options
-   *        },
-   *        {
-   *          // custom menu item options
-   *        }
-   *      ]
-   *    }
-   *  };
-   *
-   *
-   * Available custom menu item options:
-   *    title:        Menu item text.
-   *    divider:      Whether the current item is a divider, not an actual command.
-   *    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.
-   *      * ONLY works with a jQuery event (as per slick.core code), so we cannot notify when it's a button event (when grid menu is attached to an external button, not the hamburger menu)
-   *        Event args:
-   *            grid:     Reference to the grid.
-   *            column:   Column definition.
-   *            menu:     Menu options.  Note that you can change the menu items here.
-   *
-   *    onMenuClose:      Fired when the menu is closing.
-   *        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.Controls.GridMenu
-   * @constructor
-   */
+/***
+ * A control to add a Grid Menu (hambuger menu on top-right of the grid)
+ *
+ * USAGE:
+ *
+ * Add the slick.gridmenu.(js|css) files and register it with the grid.
+ *
+ * To specify a menu in a column header, extend the column definition like so:
+ * var gridMenuControl = new Slick.Controls.GridMenu(columns, grid, options);
+ *
+ * Available grid options, by defining a gridMenu object:
+ *
+ *  var options = {
+ *    enableCellNavigation: true,
+ *    gridMenu: {
+ *      customTitle: "Custom Menus",                // default to empty string
+ *      columnTitle: "Columns",                     // default to empty string
+ *      iconImage: "../images/drag-handle.png",     // this is the Grid Menu icon (hamburger icon)
+ *      iconCssClass: "fa fa-bars",                 // you can provide iconImage OR iconCssClass
+ *      leaveOpen: false,                           // do we want to leave the Grid Menu open after a command execution? (false by default)
+ *      menuWidth: 18,                              // width that will be use to resize the column header container (18 by default)
+ *      resizeOnShowHeaderRow: false,               // false by default
+ *
+ *      // the last 2 checkboxes titles
+ *      hideForceFitButton: false,                  // show/hide checkbox near the end "Force Fit Columns"
+ *      hideSyncResizeButton: false,                // show/hide checkbox near the end "Synchronous Resize"
+ *      forceFitTitle: "Force fit columns",         // default to "Force fit columns"
+ *      syncResizeTitle: "Synchronous resize",      // default to "Synchronous resize"
+ *
+ *      customItems: [
+ *        {
+ *          // custom menu item options
+ *        },
+ *        {
+ *          // custom menu item options
+ *        }
+ *      ]
+ *    }
+ *  };
+ *
+ *
+ * Available custom menu item options:
+ *    title:        Menu item text.
+ *    divider:      Whether the current item is a divider, not an actual command.
+ *    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.
+ *      * ONLY works with a jQuery event (as per slick.core code), so we cannot notify when it's a button event (when grid menu is attached to an external button, not the hamburger menu)
+ *        Event args:
+ *            grid:     Reference to the grid.
+ *            column:   Column definition.
+ *            menu:     Menu options.  Note that you can change the menu items here.
+ *
+ *    onMenuClose:      Fired when the menu is closing.
+ *        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.Controls.GridMenu
+ * @constructor
+ */
 
-  'use strict';
+'use strict';
 
-  (function ($) {
-    // register namespace
-    $.extend(true, window, {
-      "Slick": {
-        "Controls": {
-          "GridMenu": SlickGridMenu
-        }
+(function ($) {
+  // register namespace
+  $.extend(true, window, {
+    "Slick": {
+      "Controls": {
+        "GridMenu": SlickGridMenu
       }
-    });
+    }
+  });
 
-    function SlickGridMenu(columns, grid, options) {
-      var _grid = grid;
-      var _gridOptions;
-      var _gridUid = (grid && grid.getUID) ? grid.getUID() : '';
-      var _isMenuOpen = false;
-      var _options = options;
-      var _self = this;
-      var $list;
-      var $button;
-      var $menu;
-      var columnCheckboxes;
-      var _defaults = {
-        hideForceFitButton: false,
-        hideSyncResizeButton: false,
-        fadeSpeed: 250,
-        forceFitTitle: "Force fit columns",
-        menuWidth: 18,
-        resizeOnShowHeaderRow: false,
-        syncResizeTitle: "Synchronous resize"
-      };
+  function SlickGridMenu(columns, grid, options) {
+    var _grid = grid;
+    var _gridOptions;
+    var _gridUid = (grid && grid.getUID) ? grid.getUID() : '';
+    var _isMenuOpen = false;
+    var _options = options;
+    var _self = this;
+    var $customTitleElm;
+    var $columnTitleElm;
+    var $list;
+    var $button;
+    var $menu;
+    var columns;
+    var columnCheckboxes;
+    var _defaults = {
+      hideForceFitButton: false,
+      hideSyncResizeButton: false,
+      fadeSpeed: 250,
+      forceFitTitle: "Force fit columns",
+      menuWidth: 18,
+      resizeOnShowHeaderRow: false,
+      syncResizeTitle: "Synchronous resize"
+    };
 
-      function init(grid) {
-        _gridOptions = grid.getOptions();
-        var gridMenuWidth = (_options.gridMenu && _options.gridMenu.menuWidth) || _defaults.menuWidth;
-        var $header;
-        if (_gridOptions && _gridOptions.frozenColumn && _gridOptions.frozenColumn > 0 ) {
-          $header = $('.' + _gridUid + ' .slick-header-right');
-        } else {
-          $header = $('.' + _gridUid + ' .slick-header-left');
-        }
-        $header.attr('style', 'width: calc(100% - ' + gridMenuWidth +'px)');
+    function init(grid) {
+      _gridOptions = grid.getOptions();
+      var gridMenuWidth = (_options.gridMenu && _options.gridMenu.menuWidth) || _defaults.menuWidth;
+      var $header;
+      if (_gridOptions && _gridOptions.frozenColumn && _gridOptions.frozenColumn > 0) {
+        $header = $('.' + _gridUid + ' .slick-header-right');
+      } else {
+        $header = $('.' + _gridUid + ' .slick-header-left');
+      }
+      $header.attr('style', 'width: calc(100% - ' + gridMenuWidth + 'px)');
 
-        // subscribe to the grid, when it's destroyed, we should also destroy the Grid Menu
-        grid.onBeforeDestroy.subscribe(destroy);
+      // subscribe to the grid, when it's destroyed, we should also destroy the Grid Menu
+      grid.onBeforeDestroy.subscribe(destroy);
 
-        // if header row is enabled, we need to resize it's width also
-        var enableResizeHeaderRow = (_options.gridMenu && _options.gridMenu.resizeOnShowHeaderRow != undefined) ? _options.gridMenu.resizeOnShowHeaderRow : _defaults.resizeOnShowHeaderRow;
-        if(enableResizeHeaderRow && _options.showHeaderRow) {
-          var $headerrow = $('.' + _gridUid + '.slick-headerrow');
-          $headerrow.attr('style', 'width: calc(100% - ' + gridMenuWidth +'px)');
-        }
+      // if header row is enabled, we need to resize it's width also
+      var enableResizeHeaderRow = (_options.gridMenu && _options.gridMenu.resizeOnShowHeaderRow != undefined) ? _options.gridMenu.resizeOnShowHeaderRow : _defaults.resizeOnShowHeaderRow;
+      if (enableResizeHeaderRow && _options.showHeaderRow) {
+        var $headerrow = $('.' + _gridUid + '.slick-headerrow');
+        $headerrow.attr('style', 'width: calc(100% - ' + gridMenuWidth + 'px)');
+      }
 
-        $button = $('<button class="slick-gridmenu-button"/>');
-        if (_options.gridMenu && _options.gridMenu.iconCssClass) {
-          $button.addClass(_options.gridMenu.iconCssClass);
-        } else {
-          var iconImage = (_options.gridMenu && _options.gridMenu.iconImage) ? _options.gridMenu.iconImage :"../images/drag-handle.png";
-          var $btnImage = $('<img src="' + iconImage + '"/>');
-          $btnImage.appendTo($button);
-        }
-        $button.insertBefore($header);
+      $button = $('<button class="slick-gridmenu-button"/>');
+      if (_options.gridMenu && _options.gridMenu.iconCssClass) {
+        $button.addClass(_options.gridMenu.iconCssClass);
+      } else {
+        var iconImage = (_options.gridMenu && _options.gridMenu.iconImage) ? _options.gridMenu.iconImage : "../images/drag-handle.png";
+        var $btnImage = $('<img src="' + iconImage + '"/>');
+        $btnImage.appendTo($button);
+      }
+      $button.insertBefore($header);
 
-        $menu = $('<div class="slick-gridmenu ' + _gridUid + '" style="display: none" />').appendTo(document.body);
-        var $close = $('<button type="button" class="close" data-dismiss="slick-gridmenu" aria-label="Close"><span class="close" aria-hidden="true">&times;</span></button>').appendTo($menu);
+      $menu = $('<div class="slick-gridmenu ' + _gridUid + '" style="display: none" />').appendTo(document.body);
+      $('<button type="button" class="close" data-dismiss="slick-gridmenu" aria-label="Close"><span class="close" aria-hidden="true">&times;</span></button>').appendTo($menu);
 
-        var $customMenu = $('<div class="slick-gridmenu-custom" />');
-        $customMenu.appendTo($menu);
+      var $customMenu = $('<div class="slick-gridmenu-custom" />');
+      $customMenu.appendTo($menu);
 
-        // user could pass a title on top of the custom section
-        if(_options.gridMenu && _options.gridMenu.customTitle) {
-          var $title = $('<div class="title"/>').append(_options.gridMenu.customTitle);
-          $title.appendTo($customMenu);
-        }
+      // user could pass a title on top of the custom section
+      if (_options.gridMenu && _options.gridMenu.customTitle) {
+        $customTitleElm = $('<div class="title"/>').append(_options.gridMenu.customTitle);
+        $customTitleElm.appendTo($customMenu);
+      }
 
-        populateCustomMenus(_options, $customMenu);
-        populateColumnPicker();
+      populateCustomMenus(_options, $customMenu);
+      populateColumnPicker();
 
-        // Hide the menu on outside click.
-        $(document.body).on("mousedown." + _gridUid, handleBodyMouseDown);
+      // Hide the menu on outside click.
+      $(document.body).on("mousedown." + _gridUid, handleBodyMouseDown);
 
-        // destroy the picker if user leaves the page
-        $(window).on("beforeunload", destroy);
+      // destroy the picker if user leaves the page
+      $(window).on("beforeunload", destroy);
 
-        // add on click handler for the Grid Menu itself
-        $button.on("click." + _gridUid, showGridMenu);
-      }
+      // add on click handler for the Grid Menu itself
+      $button.on("click." + _gridUid, showGridMenu);
+    }
 
-      function destroy() {
-        _self.onBeforeMenuShow.unsubscribe();
-        _self.onMenuClose.unsubscribe();
-        _self.onCommand.unsubscribe();
-        _self.onColumnsChanged.unsubscribe();
-        _grid.onColumnsReordered.unsubscribe(updateColumnOrder);
-        _grid.onBeforeDestroy.unsubscribe();
-        $(document.body).off("mousedown." + _gridUid, handleBodyMouseDown);
-        $("div.slick-gridmenu." + _gridUid).hide(_options.fadeSpeed);
-        $menu.remove();
-        $button.remove();
+    function destroy() {
+      _self.onBeforeMenuShow.unsubscribe();
+      _self.onMenuClose.unsubscribe();
+      _self.onCommand.unsubscribe();
+      _self.onColumnsChanged.unsubscribe();
+      _grid.onColumnsReordered.unsubscribe(updateColumnOrder);
+      _grid.onBeforeDestroy.unsubscribe();
+      $(document.body).off("mousedown." + _gridUid, handleBodyMouseDown);
+      $("div.slick-gridmenu." + _gridUid).hide(_options.fadeSpeed);
+      $menu.remove();
+      $button.remove();
+    }
+
+    function populateCustomMenus(options, $customMenu) {
+      // Construct the custom menu items.
+      if (!options.gridMenu || !options.gridMenu.customItems) {
+        return;
       }
+      for (var i = 0, ln = options.gridMenu.customItems.length; i < ln; i++) {
+        var item = options.gridMenu.customItems[i];
 
-      function populateCustomMenus(options, $customMenu) {
-        // Construct the custom menu items.
-        if(!options.gridMenu || !options.gridMenu.customItems) {
-          return;
+        var $li = $("<div class='slick-gridmenu-item'></div>")
+          .data("command", item.command || '')
+          .data("item", item)
+          .on("click", handleMenuItemClick)
+          .appendTo($customMenu);
+
+        if (item.disabled) {
+          $li.addClass("slick-gridmenu-item-disabled");
         }
-        for (var i = 0, ln = options.gridMenu.customItems.length; i < ln; i++) {
-          var item = options.gridMenu.customItems[i];
 
-          var $li = $("<div class='slick-gridmenu-item'></div>")
-            .data("command", item.command || '')
-            .data("item", item)
-            .on("click", handleMenuItemClick)
-            .appendTo($customMenu);
+        if (item.divider) {
+          $li.addClass("slick-gridmenu-item-divider");
+          continue;
+        }
 
-          if (item.disabled) {
-            $li.addClass("slick-gridmenu-item-disabled");
-          }
+        if (item.tooltip) {
+          $li.attr("title", item.tooltip);
+        }
 
-          if (item.divider) {
-            $li.addClass("slick-gridmenu-item-divider");
-            continue;
-          }
+        var $icon = $("<div class='slick-gridmenu-icon'></div>")
+          .appendTo($li);
 
-          if (item.tooltip) {
-            $li.attr("title", item.tooltip);
-          }
+        if (item.iconCssClass) {
+          $icon.addClass(item.iconCssClass);
+        }
 
-          var $icon = $("<div class='slick-gridmenu-icon'></div>")
-            .appendTo($li);
+        if (item.iconImage) {
+          $icon.css("background-image", "url(" + item.iconImage + ")");
+        }
 
-          if (item.iconCssClass) {
-            $icon.addClass(item.iconCssClass);
-          }
+        var $content = $("<span class='slick-gridmenu-content'></span>")
+          .text(item.title)
+          .appendTo($li);
+      }
+    }
 
-          if (item.iconImage) {
-            $icon.css("background-image", "url(" + item.iconImage + ")");
-          }
+    /** Build the column picker, the code comes almost untouched from the file "slick.columnpicker.js" */
+    function populateColumnPicker() {
+      _grid.onColumnsReordered.subscribe(updateColumnOrder);
+      _options = $.extend({}, _defaults, _options);
 
-          var $content = $("<span class='slick-gridmenu-content'></span>")
-            .text(item.title)
-            .appendTo($li);
-        }
+      // user could pass a title on top of the columns list
+      if (_options.gridMenu && _options.gridMenu.columnTitle) {
+        $columnTitleElm = $('<div class="title"/>').append(_options.gridMenu.columnTitle);
+        $columnTitleElm.appendTo($menu);
       }
 
-      /** Build the column picker, the code comes almost untouched from the file "slick.columnpicker.js" */
-      function populateColumnPicker() {
-        _grid.onColumnsReordered.subscribe(updateColumnOrder);
-        _options = $.extend({}, _defaults, _options);
+      $menu.on("click", updateColumn);
+      $list = $('<span class="slick-gridmenu-list" />');
+    }
 
-        // user could pass a title on top of the columns list
-        if(_options.gridMenu && _options.gridMenu.columnTitle) {
-          var $title = $('<div class="title"/>').append(_options.gridMenu.columnTitle);
-          $title.appendTo($menu);
+    function showGridMenu(e) {
+      e.preventDefault();
+      $list.empty();
+
+      updateColumnOrder();
+      columnCheckboxes = [];
+
+      // notify of the onBeforeMenuShow only works when it's a jQuery event (as per slick.core code)
+      // this mean that we cannot notify when the grid menu is attach to a button event
+      if (typeof e.isPropagationStopped === "function") {
+        if (_self.onBeforeMenuShow.notify({
+          "grid": _grid,
+          "menu": $menu
+        }, e, _self) == false) {
+          return;
         }
-
-        $menu.on("click", updateColumn);
-        $list = $('<span class="slick-gridmenu-list" />');
       }
 
-      function showGridMenu(e) {
-        e.preventDefault();
-        $list.empty();
+      var $li, $input, excludeCssClass;
+      for (var i = 0; i < columns.length; i++) {
+        excludeCssClass = columns[i].excludeFromGridMenu ? "hidden" : "";
+        $li = $('<li class="' + excludeCssClass + '" />').appendTo($list);
 
-        updateColumnOrder();
-        columnCheckboxes = [];
+        $input = $("<input type='checkbox' />").data("column-id", columns[i].id);
+        columnCheckboxes.push($input);
 
-        // notify of the onBeforeMenuShow only works when it's a jQuery event (as per slick.core code)
-        // this mean that we cannot notify when the grid menu is attach to a button event
-        if(typeof e.isPropagationStopped === "function") {
-          if (_self.onBeforeMenuShow.notify({
-            "grid": _grid,
-            "menu": $menu
-          }, e, _self) == false) {
-            return;
-          }
+        if (_grid.getColumnIndex(columns[i].id) != null) {
+          $input.attr("checked", "checked");
         }
 
-        var $li, $input;
-        for (var i = 0; i < columns.length; i++) {
-          $li = $("<li />").appendTo($list);
-          $input = $("<input type='checkbox' />").data("column-id", columns[i].id);
-          columnCheckboxes.push($input);
+        $("<label />")
+          .html(columns[i].name)
+          .prepend($input)
+          .appendTo($li);
+      }
 
-          if (_grid.getColumnIndex(columns[i].id) != null) {
-            $input.attr("checked", "checked");
-          }
+      if (_options.gridMenu && (!_options.gridMenu.hideForceFitButton || !_options.gridMenu.hideSyncResizeButton)) {
+        $("<hr/>").appendTo($list);
+      }
 
-          $("<label />")
-              .html(columns[i].name)
-              .prepend($input)
-              .appendTo($li);
+      if (!(_options.gridMenu && _options.gridMenu.hideForceFitButton)) {
+        var forceFitTitle = (_options.gridMenu && _options.gridMenu.forceFitTitle) || _defaults.forceFitTitle;
+        $li = $("<li />").appendTo($list);
+        $input = $("<input type='checkbox' />").data("option", "autoresize");
+        $("<label />")
+          .text(forceFitTitle)
+          .prepend($input)
+          .appendTo($li);
+        if (_grid.getOptions().forceFitColumns) {
+          $input.attr("checked", "checked");
         }
+      }
 
-        if (_options.gridMenu && (!_options.gridMenu.hideForceFitButton || !_options.gridMenu.hideSyncResizeButton)) {
-          $("<hr/>").appendTo($list);
-        }
+      if (!(_options.gridMenu && _options.gridMenu.hideSyncResizeButton)) {
+        var syncResizeTitle = (_options.gridMenu && _options.gridMenu.syncResizeTitle) || _defaults.syncResizeTitle;
+        $li = $("<li />").appendTo($list);
+        $input = $("<input type='checkbox' />").data("option", "syncresize");
+        $("<label />")
+          .text(syncResizeTitle)
+          .prepend($input)
+          .appendTo($li);
 
-        if (!(_options.gridMenu && _options.gridMenu.hideForceFitButton)) {
-          var forceFitTitle = (_options.gridMenu && _options.gridMenu.forceFitTitle) || _defaults.forceFitTitle;
-          $li = $("<li />").appendTo($list);
-          $input = $("<input type='checkbox' />").data("option", "autoresize");
-          $("<label />")
-              .text(forceFitTitle)
-              .prepend($input)
-              .appendTo($li);
-          if (_grid.getOptions().forceFitColumns) {
-            $input.attr("checked", "checked");
-          }
+        if (_grid.getOptions().syncColumnCellResize) {
+          $input.attr("checked", "checked");
         }
+      }
 
-        if (!(_options.gridMenu && _options.gridMenu.hideSyncResizeButton)) {
-          var syncResizeTitle = (_options.gridMenu && _options.gridMenu.syncResizeTitle) || _defaults.syncResizeTitle;
-          $li = $("<li />").appendTo($list);
-          $input = $("<input type='checkbox' />").data("option", "syncresize");
-          $("<label />")
-              .text(syncResizeTitle)
-              .prepend($input)
-              .appendTo($li);
-          if (_grid.getOptions().syncColumnCellResize) {
-            $input.attr("checked", "checked");
-          }
-        }
+      $menu
+        .css("top", e.pageY + 10)
+        .css("left", e.pageX - $menu.width())
+        .css("max-height", $(window).height() - e.pageY - 10)
+        .fadeIn(_options.fadeSpeed);
 
-        var gridMenuWidth = $menu.width();
+      $list.appendTo($menu);
+      _isMenuOpen = true;
+    }
 
-        $menu
-            .css("top", e.pageY + 10)
-            .css("left", e.pageX - $menu.width())
-            .css("max-height", $(window).height() - e.pageY -10)
-            .fadeIn(_options.fadeSpeed);
+    function handleBodyMouseDown(e) {
+      if (($menu && $menu[0] != e.target && !$.contains($menu[0], e.target) && _isMenuOpen) || e.target.className == "close") {
+        hideMenu(e);
+      }
+    }
 
-        $list.appendTo($menu);
-        _isMenuOpen = true;
+    function handleMenuItemClick(e) {
+      var command = $(this).data("command");
+      var item = $(this).data("item");
+
+      if (item.disabled || item.divider) {
+        return;
       }
 
-      function handleBodyMouseDown(e) {
-        if (($menu && $menu[0] != e.target && !$.contains($menu[0], e.target) && _isMenuOpen) || e.target.className == "close") {
-          hideMenu(e);
-        }
+      // does the user want to leave open the Grid Menu after executing a command?
+      var leaveOpen = (_options.gridMenu && _options.gridMenu.leaveOpen) ? true : false;
+      if (!leaveOpen) {
+        hideMenu(e);
       }
 
-      function handleMenuItemClick(e) {
-        var command = $(this).data("command");
-        var item = $(this).data("item");
+      if (command != null && command != '') {
+        _self.onCommand.notify({
+          "grid": _grid,
+          "command": command,
+          "item": item
+        }, e, _self);
+      }
 
-        if (item.disabled || item.divider) {
-          return;
-        }
+      // Stop propagation so that it doesn't register as a header click event.
+      e.preventDefault();
+      e.stopPropagation();
+    }
 
-        // does the user want to leave open the Grid Menu after executing a command?
-        var leaveOpen = (_options.gridMenu && _options.gridMenu.leaveOpen) ? true : false;
-        if(!leaveOpen) {
-          hideMenu(e);
-        }
+    function hideMenu(e) {
+      if ($menu) {
+        $menu.hide(_options.fadeSpeed);
+        _isMenuOpen = false;
 
-        if (command != null && command != '') {
-          _self.onCommand.notify({
-              "grid": _grid,
-              "command": command,
-              "item": item
-            }, e, _self);
+        if (_self.onMenuClose.notify({
+          "grid": _grid,
+          "menu": $menu
+        }, e, _self) == false) {
+          return;
         }
+      }
+    }
 
-        // Stop propagation so that it doesn't register as a header click event.
-        e.preventDefault();
-        e.stopPropagation();
+    /** Update the Titles of each sections (command, customTitle, ...) */
+    function updateAllTitles(gridMenuOptions) {
+      if ($customTitleElm && $customTitleElm.text) {
+        $customTitleElm.text(gridMenuOptions.customTitle);
       }
+      if ($columnTitleElm && $columnTitleElm.text) {
+        $columnTitleElm.text(gridMenuOptions.columnTitle);
+      }
+    }
 
-      function hideMenu(e) {
-        if ($menu) {
-          $menu.hide(_options.fadeSpeed);
-          _isMenuOpen = false;
-
-          if (_self.onMenuClose.notify({
-            "grid": _grid,
-            "menu": $menu
-          }, e, _self) == false) {
-            return;
-          }
+    function updateColumnOrder() {
+      // Because columns can be reordered, we have to update the `columns`
+      // to reflect the new order, however we can't just take `grid.getColumns()`,
+      // as it does not include columns currently hidden by the picker.
+      // We create a new `columns` structure by leaving currently-hidden
+      // columns in their original ordinal position and interleaving the results
+      // of the current column sort.
+      var current = _grid.getColumns().slice(0);
+      var ordered = new Array(columns.length);
+      for (var i = 0; i < ordered.length; i++) {
+        if (_grid.getColumnIndex(columns[i].id) === undefined) {
+          // If the column doesn't return a value from getColumnIndex,
+          // it is hidden. Leave it in this position.
+          ordered[i] = columns[i];
+        } else {
+          // Otherwise, grab the next visible column.
+          ordered[i] = current.shift();
         }
       }
+      columns = ordered;
+    }
 
-      function updateColumnOrder() {
-        // Because columns can be reordered, we have to update the `columns`
-        // to reflect the new order, however we can't just take `grid.getColumns()`,
-        // as it does not include columns currently hidden by the picker.
-        // We create a new `columns` structure by leaving currently-hidden
-        // columns in their original ordinal position and interleaving the results
-        // of the current column sort.
-        var current = _grid.getColumns().slice(0);
-        var ordered = new Array(columns.length);
-        for (var i = 0; i < ordered.length; i++) {
-          if ( _grid.getColumnIndex(columns[i].id) === undefined ) {
-            // If the column doesn't return a value from getColumnIndex,
-            // it is hidden. Leave it in this position.
-            ordered[i] = columns[i];
-          } else {
-            // Otherwise, grab the next visible column.
-            ordered[i] = current.shift();
-          }
+    function updateColumn(e) {
+      if ($(e.target).data("option") == "autoresize") {
+        if (e.target.checked) {
+          _grid.setOptions({ forceFitColumns: true });
+          _grid.autosizeColumns();
+        } else {
+          _grid.setOptions({ forceFitColumns: false });
         }
+        return;
+      }
 
-        // filter out excluded column header when necessary
-        // (works with IE9+, older browser requires a polyfill for the filter to work, visit MDN for more info)
-        if (Array.isArray(ordered) && typeof ordered.filter === 'function') {
-          columns = ordered.filter(function(columnDef) {
-            return !columnDef.excludeFromGridMenu;
-          });
+      if ($(e.target).data("option") == "syncresize") {
+        if (e.target.checked) {
+          _grid.setOptions({ syncColumnCellResize: true });
         } else {
-          columns = ordered;
+          _grid.setOptions({ syncColumnCellResize: false });
         }
+        return;
       }
 
-      function updateColumn(e) {
-        if ($(e.target).data("option") == "autoresize") {
-          if (e.target.checked) {
-            _grid.setOptions({forceFitColumns:true});
-            _grid.autosizeColumns();
-          } else {
-            _grid.setOptions({forceFitColumns:false});
+      if ($(e.target).is(":checkbox")) {
+        var visibleColumns = [];
+        $.each(columnCheckboxes, function (i, e) {
+          if ($(this).is(":checked")) {
+            visibleColumns.push(columns[i]);
           }
-          return;
-        }
+        });
 
-        if ($(e.target).data("option") == "syncresize") {
-          if (e.target.checked) {
-            _grid.setOptions({syncColumnCellResize:true});
-          } else {
-            _grid.setOptions({syncColumnCellResize:false});
-          }
+        if (!visibleColumns.length) {
+          $(e.target).attr("checked", "checked");
           return;
         }
 
-        if ($(e.target).is(":checkbox")) {
-          var visibleColumns = [];
-          $.each(columnCheckboxes, function (i, e) {
-            if ($(this).is(":checked")) {
-              visibleColumns.push(columns[i]);
-            }
-          });
-
-          if (!visibleColumns.length) {
-            $(e.target).attr("checked", "checked");
-            return;
-          }
-
-          _grid.setColumns(visibleColumns);
-          _self.onColumnsChanged.notify({
-              "grid": _grid,
-              "columns": visibleColumns
-            }, e, _self);
-        }
+        _grid.setColumns(visibleColumns);
+        _self.onColumnsChanged.notify({
+          "grid": _grid,
+          "columns": visibleColumns
+        }, e, _self);
       }
+    }
 
-      init(_grid);
+    init(_grid);
 
-      function getAllColumns() {
-        return columns;
-      }
+    function getAllColumns() {
+      return columns;
+    }
 
-      $.extend(this, {
-        "init": init,
-        "getAllColumns": getAllColumns,
-        "destroy": destroy,
-        "showGridMenu": showGridMenu,
-        "onBeforeMenuShow": new Slick.Event(),
-        "onMenuClose": new Slick.Event(),
-        "onCommand": new Slick.Event(),
-        "onColumnsChanged": new Slick.Event()
-      });
-    }
-  })(jQuery);
+    $.extend(this, {
+      "init": init,
+      "getAllColumns": getAllColumns,
+      "destroy": destroy,
+      "showGridMenu": showGridMenu,
+      "updateAllTitles": updateAllTitles,
+      "onBeforeMenuShow": new Slick.Event(),
+      "onMenuClose": new Slick.Event(),
+      "onCommand": new Slick.Event(),
+      "onColumnsChanged": new Slick.Event()
+    });
+  }
+})(jQuery);

package.json

 {
   "name": "slickgrid",
-  "version": "2.4.10",
+  "version": "2.4.11",
   "description": "A lightning fast JavaScript grid/spreadsheet",
@@ -19,4 +19,4 @@ "main": "slick.core.js",
   "author": "Michael Leibman <[e-mail]>",
-  "contributors": [ 
-    "Ben McIntyre <[e-mail]>" 
+  "contributors": [
+    "Ben McIntyre <[e-mail]>"
   ],
@@ -29,3 +29,4 @@ "license": "MIT",
   "scripts": {
-    "test": "echo \"Error: no test specified\" && exit 1"
+    "cypress:ci": "node node_modules/cypress/bin/cypress run --reporter xunit --reporter-options output=testresult.xml",
+    "cypress:open": "node node_modules/cypress/bin/cypress open"
   },
@@ -35,3 +36,6 @@ "dependencies": {
     "jquery-ui": ">=1.8.0"
+  },
+  "devDependencies": {
+    "cypress": "^3.3.1"
   }
 }

slick.core.js

@@ -51,3 +51,4 @@ /***
         None: 'NOA',
-        Legacy: 'LEG',
+        LegacyOff: 'LOF',
+        LegacyForceFit: 'LFF',
         IgnoreViewport: 'IGV',
@@ -54,0 +55,0 @@ FitColsToViewport: 'FCV',

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

No tests

Quality

Package does not have any tests. This is a strong signal of a poorly maintained or low quality package.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

3841882

increased by5.57%

Number of package files

132

increased by5.6%

Lines of code

92814

increased by0.2%

Number of low quality alerts

0

decreased by-100%

Worsened metrics

Dev dependency count

1

increased byInfinity%

No dependency changes