add disableOneColumnMode option

Sylvain Nael · Sylvain Nael · commit 2618e630f6b9 · 2017-02-21T17:56:24.000+01:00
diff --git a/doc/README.md b/doc/README.md
@@ -78,6 +78,7 @@ gridstack.js API
 - `float` - enable floating widgets (default: `false`) See [example](http://troolee.github.io/gridstack.js/demo/float.html)
 - `itemClass` - widget class (default: `'grid-stack-item'`)
 - `minWidth` - minimal width. If window width is less, grid will be shown in one-column mode (default: `768`)
+- `disableOneColumnMode` - disables the onColumnMode when the window width is less than minWidth (default: 'false')
 - `oneColumnModeClass` - class set on grid when in one column mode (default: 'grid-stack-one-column-mode')
 - `placeholderClass` - class for placeholder (default: `'grid-stack-placeholder'`)
 - `placeholderText` - placeholder default content (default: `''`)
diff --git a/src/gridstack.js b/src/gridstack.js
@@ -606,6 +606,7 @@
             removeTimeout: 2000,
             verticalMarginUnit: 'px',
             cellHeightUnit: 'px',
+            disableOneColumnMode: opts.disableOneColumnMode || false,
             oneColumnModeClass: opts.oneColumnModeClass || 'grid-stack-one-column-mode',
             ddPlugin: null
         });
@@ -699,7 +700,7 @@
                 self._updateHeightsOnResize();
             }
 
-            if (self._isOneColumnMode()) {
+            if (self._isOneColumnMode() && !self.opts.disableOneColumnMode) {
                 if (oneColumnMode) {
                     return;
                 }
@@ -1204,11 +1205,11 @@
                 resize: dragOrResize
             });
 
-        if (node.noMove || this._isOneColumnMode() || this.opts.disableDrag) {
+        if (node.noMove || (this._isOneColumnMode() && !self.opts.disableOneColumnMode) || this.opts.disableDrag) {
             this.dd.draggable(el, 'disable');
         }
 
-        if (node.noResize || this._isOneColumnMode() || this.opts.disableResize) {
+        if (node.noResize || (this._isOneColumnMode() && !self.opts.disableOneColumnMode) || this.opts.disableResize) {
             this.dd.resizable(el, 'disable');
         }
 
@@ -1342,7 +1343,7 @@
             }
 
             node.noResize = !(val || false);
-            if (node.noResize || self._isOneColumnMode()) {
+            if (node.noResize || (self._isOneColumnMode() && !self.opts.disableOneColumnMode )) {
                 self.dd.resizable(el, 'disable');
             } else {
                 self.dd.resizable(el, 'enable');
@@ -1362,7 +1363,7 @@
             }
 
             node.noMove = !(val || false);
-            if (node.noMove || self._isOneColumnMode()) {
+            if (node.noMove || (self._isOneColumnMode() && !self.opts.disableOneColumnMode)) {
                 self.dd.draggable(el, 'disable');
                 el.removeClass('ui-draggable-handle');
             } else {
