prepare release 0.5.1

Author: Ghislain Beaulac

dist/LICENSE

@@ -0,0 +1,20 @@
+Copyright (c) 2016, Ghislain B.
+
+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.

dist/README.md

@@ -13,24 +13,19 @@ The goal is of course to be able to run SlickGrid within Angular 4+ but also to
 ### NPM Package
 [Angular-Slickgrid on NPM](https://www.npmjs.com/package/angular-slickgrid)
 
-<a name="wiki"></a>
-
 ## Wiki / Documentation
 The Wiki is where all the documentation and instructions will go, so please consult the [Angular-Validation - Wiki](https://github.com/ghiscoding/angular-slickgrid/wiki) before opening any issues. The [Wiki - HOWTO](https://github.com/ghiscoding/angular-slickgrid/wiki/HOWTO---Step-by-Step) is a great place to start with.
 
 
-<a name="main-features"></a>
-
 ## Main features
 You can see some screenshots below and the instructions down below.
 
 This is a work in progress, but so far here are some of the features that `angular-slickgrid` brings (on top of Slickgrid itself):
 - Easier use of SlickGrid within `Angular` as it is just a component (simply pass a column definitions and a dataset and you're good to go)
 - Bootstrap Theme with SASS variables for extra customization (if you create a theme, then please make a PR)
 - Auto-resize (boolean flag), will resize the datagrid viewport with available space even on browser resize (basically takes available space of it's container)
-- Integrated Plugins.
-    - Column Picker (show/hide any column by doing `right+click` in the header, click [here to see print screen](/screenshots/columnPicker.png)).
-    - ... more to come
+- Inline Editors
+- Support all SlickGrid Plugins.
 - Server side (backend) Services (filtering, sorting, pagination)
     - [GraphQL](https://github.com/ghiscoding/Angular-Slikgrid/wiki/GraphQL)
     - [OData](https://github.com/ghiscoding/Angular-Slickgrid/wiki/OData)
@@ -40,17 +35,18 @@ This is a work in progress, but so far here are some of the features that `angul
   - Formatters (a few default ones were added, and you can easily create custom ones too)
   - Optimized DataView which brings a lot of functionalities (sort, grouping, and more)
     - even server side data is saved into the SlickGrid DataView
+  - All the [SlickGrid Events](https://github.com/6pac/SlickGrid/wiki/Grid-Events) are supported, see the [Wiki](https://github.com/ghiscoding/Angular-Slickgrid/wiki/Grid-&-DataView-Events)
 - ... more to come
 
-<a name="missing-features"></a>
-
 ## Missing features (planned items, not necessarily in order of execution)
 The following are SlickGrid features which are not yet included in this library but will be in the eventual future.
-- Inline Editors
 - Filters to support multi-select dropdown and eventually custom filters
-- Plugins (Header Menu, Grid Menu, Column Header Buttons)
-- Row selection, will probably provide a `onRowsChanged()` in the `gridOptions` object
-- Cell click, will probably provide a `onCellClicked()` in the `gridOptions` object
+
+### License
+[MIT License](LICENSE)
+
+## Use it, like it?
+You like and use this great library `Angular-Slickgrid`? You can always upvote :star: and/or contribute :)
 
 ## Screenshots
 

dist/angular-slickgrid.metadata.json

@@ -9387,8 +9387,8 @@ var numberFilterCondition = function (options) {
     return testFilterCondition(options.operator || '==', parseFloat(options.cellValue), parseFloat(options.searchTerm));
 };
 var stringFilterCondition = function (options) {
-    // make sure the cell value is a string by casting it
-    options.cellValue = options.cellValue.toString();
+    // make sure the cell value is a string by casting it when possible
+    options.cellValue = (options.cellValue === undefined || options.cellValue === null) ? '' : options.cellValue.toString();
     if (options.operator === '*') {
         return options.cellValue.startsWith(options.searchTerm);
     }
@@ -9543,13 +9543,13 @@ var Formatters = {
     yesNo: yesNoFormatter
 };
 var moment$11 = moment_min || moment_; // patch to fix rollup "moment has no default export" issue, document here https://github.com/rollup/rollup/issues/670
-var DATE_FORMAT = 'M/D/YY';
+var FORMAT$8 = mapMomentDateFormatWithFieldType(FieldType.dateUsShort);
 var dateUsShortSorter = function (value1, value2, sortDirection) {
-    if (!moment$11(value1, DATE_FORMAT, true).isValid() || !moment$11(value2, DATE_FORMAT, true).isValid()) {
+    if (!moment$11(value1, FORMAT$8, true).isValid() || !moment$11(value2, FORMAT$8, true).isValid()) {
         return 0;
     }
-    var /** @type {?} */ date1 = moment$11(value1, DATE_FORMAT, true);
-    var /** @type {?} */ date2 = moment$11(value2, DATE_FORMAT, true);
+    var /** @type {?} */ date1 = moment$11(value1, FORMAT$8, true);
+    var /** @type {?} */ date2 = moment$11(value2, FORMAT$8, true);
     var /** @type {?} */ diff = parseInt(date1.format('X'), 10) - parseInt(date2.format('X'), 10);
     return sortDirection * (diff === 0 ? 0 : (diff > 0 ? 1 : -1));
 };
@@ -9564,24 +9564,24 @@ var dateSorter = function (value1, value2, sortDirection) {
     return sortDirection * (diff === 0 ? 0 : (diff > 0 ? 1 : -1));
 };
 var moment$13 = moment_min || moment_; // patch to fix rollup "moment has no default export" issue, document here https://github.com/rollup/rollup/issues/670
-var DATE_FORMAT$1 = 'YYYY-MM-DD';
+var FORMAT$9 = mapMomentDateFormatWithFieldType(FieldType.dateIso);
 var dateIsoSorter = function (value1, value2, sortDirection) {
-    if (!moment$13(value1, DATE_FORMAT$1, true).isValid() || !moment$13(value2, DATE_FORMAT$1, true).isValid()) {
+    if (!moment$13(value1, FORMAT$9, true).isValid() || !moment$13(value2, FORMAT$9, true).isValid()) {
         return 0;
     }
-    var /** @type {?} */ date1 = moment$13(value1, DATE_FORMAT$1, true);
-    var /** @type {?} */ date2 = moment$13(value2, DATE_FORMAT$1, true);
+    var /** @type {?} */ date1 = moment$13(value1, FORMAT$9, true);
+    var /** @type {?} */ date2 = moment$13(value2, FORMAT$9, true);
     var /** @type {?} */ diff = parseInt(date1.format('X'), 10) - parseInt(date2.format('X'), 10);
     return sortDirection * (diff === 0 ? 0 : (diff > 0 ? 1 : -1));
 };
 var moment$14 = moment_min || moment_; // patch to fix rollup "moment has no default export" issue, document here https://github.com/rollup/rollup/issues/670
-var DATE_FORMAT$2 = 'M/D/YYYY';
+var FORMAT$10 = mapMomentDateFormatWithFieldType(FieldType.dateUs);
 var dateUsSorter = function (value1, value2, sortDirection) {
-    if (!moment$14(value1, DATE_FORMAT$2, true).isValid() || !moment$14(value2, DATE_FORMAT$2, true).isValid()) {
+    if (!moment$14(value1, FORMAT$10, true).isValid() || !moment$14(value2, FORMAT$10, true).isValid()) {
         return 0;
     }
-    var /** @type {?} */ date1 = moment$14(value1, DATE_FORMAT$2, true);
-    var /** @type {?} */ date2 = moment$14(value2, DATE_FORMAT$2, true);
+    var /** @type {?} */ date1 = moment$14(value1, FORMAT$10, true);
+    var /** @type {?} */ date2 = moment$14(value2, FORMAT$10, true);
     var /** @type {?} */ diff = parseInt(date1.format('X'), 10) - parseInt(date2.format('X'), 10);
     return sortDirection * (diff === 0 ? 0 : (diff > 0 ? 1 : -1));
 };
@@ -9591,7 +9591,23 @@ var numericSorter = function (value1, value2, sortDirection) {
     return sortDirection * (x === y ? 0 : (x > y ? 1 : -1));
 };
 var stringSorter = function (value1, value2, sortDirection) {
-    return sortDirection * (value1 === value2 ? 0 : (value1 > value2 ? 1 : -1));
+    var /** @type {?} */ position;
+    if (value1 === null) {
+        position = -1;
+    }
+    else if (value2 === null) {
+        position = 1;
+    }
+    else if (value1 === value2) {
+        position = 0;
+    }
+    else if (sortDirection) {
+        position = value1 < value2 ? -1 : 1;
+    }
+    else if (!sortDirection) {
+        position = value1 < value2 ? 1 : -1;
+    }
+    return sortDirection * position;
 };
 var Sorters = {
     date: dateSorter,
@@ -9899,6 +9915,35 @@ var GridEventService = /** @class */ (function () {
             e.preventDefault();
         });
     };
+    /**
+     * @param {?} grid
+     * @param {?} gridOptions
+     * @param {?} dataView
+     * @return {?}
+     */
+    GridEventService.prototype.attachOnCellChange = function (grid, gridOptions, dataView) {
+        // subscribe to this Slickgrid event of onCellChange
+        grid.onCellChange.subscribe(function (e, args) {
+            if (!e || !args || !args.grid || args.cell === undefined || !args.grid.getColumns || !args.grid.getDataItem) {
+                return;
+            }
+            var /** @type {?} */ column = args.grid.getColumns()[args.cell];
+            // if the column definition has a onCellChange property (a callback function), then run it
+            if (typeof column.onCellChange === 'function') {
+                // add to the output gridOptions & dataView since we'll need them inside the AJAX column.onCellChange
+                var /** @type {?} */ returnedArgs = {
+                    dataView: dataView,
+                    gridDefinition: gridOptions,
+                    grid: grid,
+                    columnDef: column,
+                    dataContext: args.grid.getDataItem(args.row)
+                };
+                // finally call up the Slick.column.onCellChanges.... function
+                column.onCellChange(returnedArgs);
+                // e.stopImmediatePropagation();
+            }
+        });
+    };
     /**
      * @param {?} grid
      * @param {?} gridOptions
@@ -9911,18 +9956,18 @@ var GridEventService = /** @class */ (function () {
                 return;
             }
             var /** @type {?} */ column = args.grid.getColumns()[args.cell];
-            // so if the columns definition does have an column.onCellClick property (a function attached), then run it
+            // if the column definition has a onCellClick property (a callback function), then run it
             if (typeof column.onCellClick === 'function') {
-                // attach both "this._gridOptions" and "_slickDataViewObj" since we'll need them inside the AJAX column.onClick
-                var /** @type {?} */ onCellClickArgs = {
+                // add to the output gridOptions & dataView since we'll need them inside the AJAX column.onClick
+                var /** @type {?} */ returnedArgs = {
                     dataView: dataView,
                     gridDefinition: gridOptions,
                     grid: grid,
                     columnDef: column,
                     dataContext: args.grid.getDataItem(args.row)
                 };
-                // finally call up the Slick.column.onClicks.... function
-                column.onCellClick(onCellClickArgs);
+                // finally call up the Slick.column.onCellClick.... function
+                column.onCellClick(returnedArgs);
                 e.stopImmediatePropagation();
             }
             // stop the click event bubbling
@@ -31756,6 +31801,7 @@ var GlobalGridOptions = {
     cellHighlightCssClass: 'slick-cell-modified',
     editable: false,
     enableCellNavigation: false,
+    enableColumnPicker: true,
     enableColumnReorder: true,
     enableMouseHoverHighlightRow: true,
     enablePagination: false,
@@ -31849,9 +31895,7 @@ var AngularSlickgridComponent = /** @class */ (function () {
         this.grid.setSelectionModel(new Slick.RowSelectionModel());
         this.gridChanged.emit(this.grid);
         this.dataviewChanged.emit(this._dataView);
-        if (this._gridOptions.enableColumnPicker) {
-            var /** @type {?} */ columnpicker = new Slick.Controls.ColumnPicker(this.columnDefinitions, this.grid, this._gridOptions);
-        }
+        this.attachDifferentControlOrPlugins(this.grid, this._gridOptions, this._dataView);
         this.grid.init();
         this._dataView.beginUpdate();
         this.attachDifferentHooks(this.grid, this._gridOptions, this._dataView);
@@ -31860,6 +31904,40 @@ var AngularSlickgridComponent = /** @class */ (function () {
         // attach resize ONLY after the dataView is ready
         this.attachResizeHook(this.grid, this._gridOptions);
     };
+    /**
+     * @param {?} grid
+     * @param {?} options
+     * @param {?} dataView
+     * @return {?}
+     */
+    AngularSlickgridComponent.prototype.attachDifferentControlOrPlugins = function (grid, options, dataView) {
+        var _this = this;
+        if (options.enableColumnPicker) {
+            var /** @type {?} */ columnpicker = new Slick.Controls.ColumnPicker(this.columnDefinitions, this.grid, options);
+        }
+        if (options.enableAutoTooltip) {
+            var /** @type {?} */ columnpicker = new Slick.Controls.AutoTooltips(options.autoTooltipOptions || {});
+        }
+        if (options.enableRowSelection) {
+            var /** @type {?} */ columnpicker = new Slick.RowSelectionModel(options.rowSelectionOptions || {});
+        }
+        if (options.enableHeaderButton) {
+            var /** @type {?} */ columnpicker = new Slick.RowSelectionModel(options.headerMenuOptions || {});
+        }
+        if (options.enableHeaderMenu) {
+            var /** @type {?} */ columnpicker = new Slick.RowSelectionModel(options.headerMenuOptions || {});
+        }
+        if (options.registerPlugins !== undefined) {
+            if (Array.isArray(options.registerPlugins)) {
+                options.registerPlugins.forEach(function (plugin) {
+                    _this.grid.registerPlugin(plugin);
+                });
+            }
+            else {
+                this.grid.registerPlugin(options.registerPlugins);
+            }
+        }
+    };
     /**
      * @param {?} grid
      * @param {?} options
@@ -31900,6 +31978,7 @@ var AngularSlickgridComponent = /** @class */ (function () {
             }); });
         }
         // on cell click, mainly used with the columnDef.action callback
+        this.gridEventService.attachOnCellChange(grid, this._gridOptions, dataView);
         this.gridEventService.attachOnClick(grid, this._gridOptions, dataView);
         // if enable, change background color on mouse over
         if (options.enableMouseHoverHighlightRow) {