Merge pull request gridstack#665 from radiolips/feature/494

Add `data-gs-resize-handles` option to allow for widgets to have thei…
telecomsoftware · May 15, 2017 · 7e054a3 · 7e054a3
2 parents 1fbf9af + b5468d0
commit 7e054a3
Show file tree

Hide file tree

Showing 10 changed files with 20 additions and 8 deletions.
diff --git a/dist/gridstack.all.js b/dist/gridstack.all.js
diff --git a/dist/gridstack.jQueryUI.js b/dist/gridstack.jQueryUI.js
@@ -47,7 +47,11 @@
             var value = arguments[3];
             el.resizable(opts, key, value);
         } else {
+            var handles = el.data('gs-resize-handles') ? el.data('gs-resize-handles') :
+                this.grid.opts.resizable.handles;
             el.resizable(_.extend({}, this.grid.opts.resizable, {
+                handles: handles
+            }, {
                 start: opts.start || function() {},
                 stop: opts.stop || function() {},
                 resize: opts.resize || function() {}

diff --git a/dist/gridstack.jQueryUI.min.js b/dist/gridstack.jQueryUI.min.js
diff --git a/dist/gridstack.js b/dist/gridstack.js
@@ -1248,6 +1248,7 @@
             noResize: Utils.toBool(el.attr('data-gs-no-resize')),
             noMove: Utils.toBool(el.attr('data-gs-no-move')),
             locked: Utils.toBool(el.attr('data-gs-locked')),
+            resizeHandles: el.attr('data-gs-resize-handles'),
             el: el,
             id: el.attr('data-gs-id'),
             _grid: self

diff --git a/dist/gridstack.min.js b/dist/gridstack.min.js
diff --git a/dist/gridstack.min.map b/dist/gridstack.min.map
diff --git a/doc/CHANGES.md b/doc/CHANGES.md
@@ -20,7 +20,8 @@ Change log
 
 ## v1.0.0 (development)
 
-- enable sidebar items to be duplicated properly. Pass `helper: 'clone'` in `draggable` options. ([#661](https://github.com/troolee/gridstack.js/issues/661), ([#396](https://github.com/troolee/gridstack.js/issues/396), ([#499](https://github.com/troolee/gridstack.js/issues/499).
+- widgets can have their own resize handles. Use `data-gs-resize-handles` element attribute to use. For example, `data-gs-resize-handles="e,w"` will make the particular widget only resize west and east. ([#494](https://github.com/troolee/gridstack.js/issues/494)).
+- enable sidebar items to be duplicated properly. Pass `helper: 'clone'` in `draggable` options. ([#661](https://github.com/troolee/gridstack.js/issues/661), ([#396](https://github.com/troolee/gridstack.js/issues/396), ([#499](https://github.com/troolee/gridstack.js/issues/499)).
 
 ## v0.3.0 (2017-04-21)
 

diff --git a/doc/README.md b/doc/README.md
@@ -111,6 +111,7 @@ gridstack.js API
 - `data-gs-locked` - the widget will be locked. It means another widget wouldn't be able to move it during dragging or resizing.
 The widget can still be dragged or resized. You need to add `data-gs-no-resize` and `data-gs-no-move` attributes
 to completely lock the widget.
+- `data-gs-resize-handles` - sets resize handles for a specific widget.
 
 ## Events
 

diff --git a/src/gridstack.jQueryUI.js b/src/gridstack.jQueryUI.js
@@ -47,7 +47,11 @@
             var value = arguments[3];
             el.resizable(opts, key, value);
         } else {
+            var handles = el.data('gs-resize-handles') ? el.data('gs-resize-handles') :
+                this.grid.opts.resizable.handles;
             el.resizable(_.extend({}, this.grid.opts.resizable, {
+                handles: handles
+            }, {
                 start: opts.start || function() {},
                 stop: opts.stop || function() {},
                 resize: opts.resize || function() {}

diff --git a/src/gridstack.js b/src/gridstack.js
@@ -1248,6 +1248,7 @@
             noResize: Utils.toBool(el.attr('data-gs-no-resize')),
             noMove: Utils.toBool(el.attr('data-gs-no-move')),
             locked: Utils.toBool(el.attr('data-gs-locked')),
+            resizeHandles: el.attr('data-gs-resize-handles'),
             el: el,
             id: el.attr('data-gs-id'),
             _grid: self