fix(gridster): fixing drag limit issues when using autogrow_cols

src/jquery.gridster.js

@@ -369,7 +369,7 @@
         this.set_dom_grid_width();
         this.set_dom_grid_height();
 
-        this.drag_api.set_limits(this.cols * this.min_widget_width);
+        this.drag_api.set_limits((this.cols * this.min_widget_width) + ((this.cols + 1) * this.options.widget_margins[0]));
 
         return $w.fadeIn();
     };
@@ -1233,7 +1233,7 @@
             if (prcol >= this.cols - 1 && this.options.max_cols >= this.cols + 1) {
                 this.add_faux_cols(1);
                 this.set_dom_grid_width(this.cols + 1);
-                this.drag_api.set_limits(this.container_width);
+                this.drag_api.set_limits((this.cols * this.min_widget_width) + ((this.cols + 1) * this.options.widget_margins[0]));
             }
 
             this.collision_api.set_colliders(this.faux_grid);
@@ -1324,7 +1324,7 @@
         this.set_dom_grid_width();
 
         if (this.options.autogrow_cols) {
-            this.drag_api.set_limits(this.cols * this.min_widget_width);
+            this.drag_api.set_limits((this.cols * this.min_widget_width) + ((this.cols + 1) * this.options.widget_margins[0]));
         }
     };
 
@@ -2914,21 +2914,33 @@
     };
 
     /**
-    *
+    * Generates the width of the grid columns based on the width of the window.
     * @returns {number}
     */
     fn.get_responsive_col_width = function() {
       var cols = this.cols || this.options.max_cols;
       return (this.$el.width() - ((cols + 1) * this.options.widget_margins[0])) / cols;
     };
 
+    /**
+    * Changes the minimum width of a widget based on the width of the window and the number of cols that can
+    * fit in it.
+    * @returns {Gridster}
+    */
     fn.resize_responsive_layout = function() {
       this.min_widget_width = this.get_responsive_col_width();
       this.generate_grid_and_stylesheet();
       this.update_widgets_dimensions();
-      this.drag_api.set_limits((this.cols * this.min_widget_width) + ((this.cols) * this.options.widget_margins[0]));
+      this.drag_api.set_limits((this.cols * this.min_widget_width) + ((this.cols + 1) * this.options.widget_margins[0]));
+      return this;
     };
 
+    /**
+    * Switches between collapsed widgets the span the full width when the responsive_breakpoint is triggered.
+    * @param collapse
+    * @param opts
+    * @returns {Gridster}
+    */
     fn.toggle_collapsed_grid = function(collapse, opts) {
       if(collapse) {
         this.$widgets.css({
@@ -2939,7 +2951,7 @@
 
         this.$el.addClass('collapsed');
 
-        if(this.options.resize.enabled && this.resize_api) {
+        if(this.resize_api) {
           this.disable_resize();
         }
 
@@ -2953,18 +2965,19 @@
           'min-height': 'auto'
         });
         this.$el.removeClass('collapsed');
-        if(this.options.resize.enabled && this.resize_api) {
+        if(this.resize_api) {
           this.enable_resize();
         }
 
         if(this.drag_api) {
           this.enable();
         }
       }
-    }
+      return this;
+    };
 
     /**
-    * It generates the neccessary styles to position the widgets.
+    * It generates the necessary styles to position the widgets.
     *
     * @method generate_stylesheet
     * @param {Number} rows Number of columns.