From 15a2dba98ed9811d54d7838df1eccbb96448372a Mon Sep 17 00:00:00 2001
From: vieron <javiersanchezmarin@gmail.com>
Date: Thu, 19 Jul 2012 11:16:29 +0200
Subject: [PATCH] updated docs and dist

---
 dist/jquery.gridster.css               |   2 +-
 dist/jquery.gridster.js                |  74 ++++++---
 dist/jquery.gridster.min.css           |   2 +-
 dist/jquery.gridster.min.js            |   4 +-
 docs/classes/Gridster.html             | 221 +++++++++++++++++--------
 docs/data.json                         | 138 ++++++++-------
 docs/files/src_jquery.coords.js.html   |   4 +-
 docs/files/src_jquery.gridster.js.html | 106 +++++++-----
 8 files changed, 349 insertions(+), 202 deletions(-)

diff --git a/dist/jquery.gridster.css b/dist/jquery.gridster.css
index f2d73ae5ba..82117d0a8b 100644
--- a/dist/jquery.gridster.css
+++ b/dist/jquery.gridster.css
@@ -1,4 +1,4 @@
-/*! gridster.js - v0.1.0 - 2012-07-18
+/*! gridster.js - v0.1.0 - 2012-07-19
 * https://github.com/ducksboard/gridster.js
 * Copyright (c) 2012 ducksboard; Licensed MIT, GPL */
 
diff --git a/dist/jquery.gridster.js b/dist/jquery.gridster.js
index a65eedd494..b81b5cbfb1 100644
--- a/dist/jquery.gridster.js
+++ b/dist/jquery.gridster.js
@@ -1,4 +1,4 @@
-/*! gridster.js - v0.1.0 - 2012-07-18
+/*! gridster.js - v0.1.0 - 2012-07-19
 * https://github.com/ducksboard/gridster.js
 * Copyright (c) 2012 ducksboard; Licensed MIT, GPL */
 
@@ -30,7 +30,7 @@
         this.original_coords = this.get();
     };
 
-    fn.set = function(update) {
+    fn.set = function() {
         var el = this.el;
         if (el) {
             this.data = el.offset();
@@ -62,7 +62,7 @@
             var new_data = $.extend(this.data, data);
             this.data = new_data;
         }
-        this.set(true);
+        this.set();
         return this;
     };
 
@@ -300,12 +300,8 @@
                 row: wgd.row
             };
         },
-        collision: {
-            on_overlap: function(coords) {}
-        },
-        draggable: {
-
-        }
+        collision: {},
+        draggable: {}
     };
 
 
@@ -356,14 +352,14 @@
     * @param {HTMLElement} el The HTMLelement that contains all the widgets.
     * @param {Object} [options] An Object with all options you want to
     *        overwrite:
-    *    @param {HTMLElement|String} [options.widget_selector] Define who will be the
-    *     draggable widgets. Can be a CSS Selector String or a collection of
-    *     HTMLElements
-    *    @param {Array} [options.widget_margins] Margin between widgets. The first
-    *     index for the horizontal margin (left, right) and the second
-    *     for the vertical margin (top, bottom).
-    *    @param {Array} [options.widget_base_dimensions] Base widget dimensions in
-    *     pixels. The first index for the width and the second for the
+    *    @param {HTMLElement|String} [options.widget_selector] Define who will
+    *     be the draggable widgets. Can be a CSS Selector String or a
+    *     collection of HTMLElements
+    *    @param {Array} [options.widget_margins] Margin between widgets.
+    *     The first index for the horizontal margin (left, right) and
+    *     the second for the vertical margin (top, bottom).
+    *    @param {Array} [options.widget_base_dimensions] Base widget dimensions
+    *     in pixels. The first index for the width and the second for the
     *     height.
     *    @param {Number} [options.extra_cols] Add more columns in addition to
     *     those that have been calculated.
@@ -413,6 +409,9 @@
       this.set_dom_grid_height();
       this.$wrapper.addClass('ready');
       this.draggable();
+
+      $(window).bind(
+        'resize', throttle($.proxy(this.recalculate_faux_grid, this), 200));
     };
 
 
@@ -2142,7 +2141,6 @@
         this.gridmap = [];
         var col;
         var row;
-
         for (col = cols; col > 0; col--) {
             this.gridmap[col] = [];
             for (row = rows; row > 0; row--) {
@@ -2164,6 +2162,31 @@
         return this;
     };
 
+
+    /**
+    * Recalculates the offsets for the faux grid. You need to use it when
+    * the browser is resized.
+    *
+    * @method recalculate_faux_grid
+    * @return {Object} Returns the instance of the Gridster class.
+    */
+    fn.recalculate_faux_grid = function() {
+        var aw = this.$wrapper.width();
+        this.baseX = ($(window).width() - aw) / 2;
+        this.baseY = this.$wrapper.offset().top;
+
+        $.each(this.faux_grid, $.proxy(function(i, coords){
+            this.faux_grid[i] = coords.update({
+                left: this.baseX + (coords.data.col -1) * this.min_widget_width,
+                top: this.baseY + (coords.data.row -1) * this.min_widget_height
+            });
+
+        }, this));
+
+        return this;
+    };
+
+
     /**
     * Get all widgets in the DOM and register them.
     *
@@ -2186,13 +2209,12 @@
     * @return {Object} Returns the instance of the Gridster class.
     */
     fn.generate_grid_and_stylesheet = function() {
-        var grid_width;
         var aw = this.$wrapper.width();
         var ah = this.$wrapper.height();
 
-        var cols = Math.floor(aw/this.min_widget_width) +
+        var cols = Math.floor(aw / this.min_widget_width) +
                    this.options.extra_cols;
-        var rows = Math.floor(ah/this.min_widget_height) +
+        var rows = Math.floor(ah / this.min_widget_height) +
                    this.options.extra_rows;
 
         var actual_cols = this.$widgets.map(function() {
@@ -2208,18 +2230,16 @@
 
         cols = Math.max(min_cols, cols, this.options.min_cols);
         rows = Math.max(min_rows, rows, this.options.min_rows);
-        grid_width = cols * (this.options.widget_base_dimensions[0] +
-                         (this.options.widget_margins[0] * 2));
 
         //this.support_grid_width = cols * this.min_widget_width;
-        this.support_grid_width = this.wrapper_width;
+        // this.support_grid_width = this.wrapper_width;
 
-        this.support_grid_height = rows * this.min_widget_height;
-        this.baseX = ($(window).width() - this.support_grid_width) / 2;
+        // this.support_grid_height = rows * this.min_widget_height;
+        this.baseX = ($(window).width() - aw) / 2;
         this.baseY = this.$wrapper.offset().top;
 
         //this.baseX = 0;
-        if(this.options.autogenerate_stylesheet) {
+        if (this.options.autogenerate_stylesheet) {
             this.generate_stylesheet(rows, cols);
         }
 
diff --git a/dist/jquery.gridster.min.css b/dist/jquery.gridster.min.css
index 79bcb93cdb..40ffed021c 100644
--- a/dist/jquery.gridster.min.css
+++ b/dist/jquery.gridster.min.css
@@ -1,3 +1,3 @@
-/*! gridster.js - v0.1.0 - 2012-07-18
+/*! gridster.js - v0.1.0 - 2012-07-19
 * https://github.com/ducksboard/gridster.js
 * Copyright (c) 2012 ducksboard; Licensed MIT, GPL */.gridster{position:relative}.gridster>*{margin:0 auto;-webkit-transition:height .4s;-moz-transition:height .4s;-o-transition:height .4s;-ms-transition:height .4s;transition:height .4s}.gridster .gs_w{z-index:2;position:absolute;background:rgba(0,0,0,.23)}.ready .gs_w:not(.player):not(.preview-holder):not(.ui-draggable-dragging){-webkit-transition:left .3s,top .3s;-moz-transition:left .3s,top .3s;-o-transition:left .3s,top .3s}.gridster.dragging .ui-sortable-helper{z-index:9}.gridster .preview-holder{border:2px dashed #333;border-radius:5px;z-index:1;background:#FFF;position:absolute}.gridster .ui-draggable-dragging{z-index:10!important}
\ No newline at end of file
diff --git a/dist/jquery.gridster.min.js b/dist/jquery.gridster.min.js
index 07f511e43a..6db18a9aaa 100644
--- a/dist/jquery.gridster.min.js
+++ b/dist/jquery.gridster.min.js
@@ -1,4 +1,4 @@
-/*! gridster.js - v0.1.0 - 2012-07-18
+/*! gridster.js - v0.1.0 - 2012-07-19
 * https://github.com/ducksboard/gridster.js
 * Copyright (c) 2012 ducksboard; Licensed MIT, GPL */
-(function(a,b,c,d){function e(b){return b[0]&&a.isPlainObject(b[0])?this.data=b[0]:this.el=b,this.isCoords=!0,this.coords={},this.init(),this}var f=e.prototype;f.init=function(){this.set(),this.original_coords=this.get()},f.set=function(a){var b=this.el;b&&(this.data=b.offset(),this.data.width||(this.data.width=b.width()),this.data.height||(this.data.height=b.height()));var c=this.data;return this.coords.x1=c.left,this.coords.y1=c.top,this.coords.x2=c.left+c.width,this.coords.y2=c.top+c.height,this.coords.cx=c.left+c.width/2,this.coords.cy=c.top+c.height/2,this.coords.width=c.width,this.coords.height=c.height,this.coords.el=b||!1,this},f.update=function(b){if(!b&&!this.el)return this;if(b){var c=a.extend(this.data,b);this.data=c}return this.set(!0),this},f.get=function(){return this.coords},a.fn.coords=function(){if(this.data("coords"))return this.data("coords");var a=new e(this,arguments[0]);return this.data("coords",a),a}})(jQuery,window,document),function(a,b,c,d){function f(b,c,d){this.options=a.extend(e,d),this.$element=b,this.last_colliders=[],this.last_colliders_coords=[],typeof c=="string"||c instanceof jQuery?this.$colliders=a(c,this.options.colliders_context).not(this.$element):this.colliders=a(c),this.init()}var e={colliders_context:c.body,on_overlap:function(a){},on_overlap_start:function(a){},on_overlap_stop:function(a){}},g=f.prototype;g.init=function(){this.find_collisions()},g.overlaps=function(a,b){var c=!1,d=!1;if(b.x1>=a.x1&&b.x1<=a.x2||b.x2>=a.x1&&b.x2<=a.x2||a.x1>=b.x1&&a.x2<=b.x2)c=!0;if(b.y1>=a.y1&&b.y1<=a.y2||b.y2>=a.y1&&b.y2<=a.y2||a.y1>=b.y1&&a.y2<=b.y2)d=!0;return c&&d},g.detect_overlapping_region=function(a,b){var c="",d="";return a.y1>b.cy&&a.y1<b.y2&&(c="N"),a.y2>b.y1&&a.y2<b.cy&&(c="S"),a.x1>b.cx&&a.x1<b.x2&&(d="W"),a.x2>b.x1&&a.x2<b.cx&&(d="E"),c+d||"C"},g.calculate_overlapped_area_coords=function(b,c){var d=Math.max(b.x1,c.x1),e=Math.max(b.y1,c.y1),f=Math.min(b.x2,c.x2),g=Math.min(b.y2,c.y2);return a({left:d,top:e,width:f-d,height:g-e}).coords().get()},g.calculate_overlapped_area=function(a){return a.width*a.height},g.manage_colliders_start_stop=function(b,c,d){var e=this.last_colliders_coords;for(var f=0,g=e.length;f<g;f++)a.inArray(e[f],b)===-1&&c.call(this,e[f]);for(var h=0,i=b.length;h<i;h++)a.inArray(b[h],e)===-1&&d.call(this,b[h])},g.find_collisions=function(){var b=this,c=[],d=[],e=this.colliders||this.$colliders,f=e.length;while(f--){var g=b.$colliders?a(e[f]):e[f],h=b.$element.coords().update().get(),i=g.isCoords?g.update():g.coords(),j=i.get(),k=b.overlaps(h,j);if(!k)continue;var l=b.detect_overlapping_region(h,j);if(l==="C"){var m=b.calculate_overlapped_area_coords(h,j),n=b.calculate_overlapped_area(m),o={area:n,area_coords:m,region:l,coords:j,player_coords:h,el:g};b.options.on_overlap.call(this,o),c.push(i),d.push(o)}}return this.manage_colliders_start_stop(c,b.options.on_overlap_stop,b.options.on_overlap_start),this.last_colliders_coords=c,d},g.get_closest_colliders=function(){var a=this.find_collisions(),b=100;return a.sort(function(a,c){return a.area<=b?1:a.region==="C"&&c.region==="C"?a.coords.y1<c.coords.y1||a.coords.x1<c.coords.x1?-1:1:a.area<c.area?1:1}),a},a.fn.collision=function(a,b){return new f(this,a,b)}}(jQuery,window,document),function(a,b,c,d){function h(b,c){this.options=a.extend(!0,e,c),this.$el=a(b),this.$wrapper=this.$el.parent(),this.$widgets=this.$el.find(this.options.widget_selector).addClass("gs_w"),this.widgets=[],this.$changed=a([]),this.wrapper_width=this.$wrapper.width(),this.min_widget_width=this.options.widget_margins[0]*2+this.options.widget_base_dimensions[0],this.min_widget_height=this.options.widget_margins[1]*2+this.options.widget_base_dimensions[1],this.init()}var e={widget_selector:"> li",widget_margins:[10,10],widget_base_dimensions:[400,225],extra_rows:0,extra_cols:0,min_cols:1,min_rows:10,autogenerate_stylesheet:!0,serialize_params:function(a,b){return{col:b.col,row:b.row}},collision:{on_overlap:function(a){}},draggable:{}},f=function(a,b,c){var d;return function(){var e=this,f=arguments,g=function(){d=null,c||a.apply(e,f)};c&&!d&&a.apply(e,f),clearTimeout(d),d=setTimeout(g,b)}},g=function(a,b){var c,d,e,g,h,i,j=f(function(){h=g=!1},b,!0);return function(){c=this,d=arguments;var f=function(){e=null,h&&a.apply(c,d),j()};return e||(e=setTimeout(f,b)),g?h=!0:i=a.apply(c,d),j(),g=!0,i}},i=h.prototype;i.init=function(){this.generate_grid_and_stylesheet(),this.get_widgets_from_DOM(),this.set_dom_grid_height(),this.$wrapper.addClass("ready"),this.draggable()},i.add_widget=function(b,c,d){var e=a(b).attr({"data-col":this.highest_occupied_cell.col,"data-row":this.highest_occupied_cell.row+1,"data-sizex":c||1,"data-sizey":d||1}).addClass("gs_w").appendTo(this.$el).hide();this.$widgets=this.$widgets.add(e),this.register_widget(e),this.$widgets.draggable("destroy"),this.draggable(),this.set_dom_grid_height(),e.fadeIn()},i.remove_widget=function(b){var c=b instanceof jQuery?b:a(b),d=c.coords().grid;this.$widgets=this.$widgets.not(c);var e=this.widgets_below(c);this.remove_from_gridmap(d),c.fadeOut(a.proxy(function(){c.remove(),e.each(a.proxy(function(b,c){this.move_widget_up(a(c),d.size_y)},this))},this))},i.serialize=function(b){b||(b=this.$widgets);var c=[];return b.each(a.proxy(function(b,d){c.push(this.options.serialize_params(a(d),a(d).coords().grid))},this)),c},i.serialize_changed=function(){return this.serialize(this.$changed)},i.register_widget=function(a){var b={col:parseInt(a.attr("data-col"),10),row:parseInt(a.attr("data-row"),10),size_x:parseInt(a.attr("data-sizex"),10),size_y:parseInt(a.attr("data-sizey"),10),el:a};return a.data("coords",a.coords()),a.data("coords").grid=b,this.add_to_gridmap(b,a),this.widgets.push(a),this},i.update_widget_position=function(a,b){return this.for_each_cell_occupied(a,function(a,c){if(!this.gridmap[a])return this;this.gridmap[a][c]=b}),this},i.remove_from_gridmap=function(a){return this.update_widget_position(a,!1)},i.add_to_gridmap=function(b,c){this.update_widget_position(b,c||b.el);if(b.el){var d=this.widgets_below(b.el);d.each(a.proxy(function(b,c){this.move_widget_up(a(c))},this))}},i.draggable=function(){var b=this,c=a.extend(!0,{},this.options.draggable,{start:function(c,d){b.$player=a(this),b.$helper=b.options.draggable.helper==="clone"?a(d.helper):b.$player,b.on_start_drag.call(b,c,d)},stop:function(a,c){b.on_stop_drag.call(b,c)},drag:g(function(a,c){b.on_drag.call(b,a,c)},100,!0)});return this.$widgets.draggable(c),this},i.on_start_drag=function(b,c){this.$player.addClass("player"),this.$wrapper.addClass("dragging"),this.player_grid_data=this.$player.coords().grid,this.placeholder_grid_data=a.extend({},this.player_grid_data),this.$el.css("height",this.$el.height()+this.player_grid_data.size_y*this.min_widget_height);var d=this.faux_grid,e=this.$player.data("coords").coords;this.cells_occupied_by_player=this.get_cells_occupied(this.player_grid_data),this.cells_occupied_by_placeholder=this.get_cells_occupied(this.placeholder_grid_data),this.last_cols=[],this.last_rows=[],this.drag_api=this.$helper.collision(d,this.options.collision),this.$preview_holder=a("<li />",{"class":"preview-holder","data-row":this.$player.attr("data-row"),"data-col":this.$player.attr("data-col"),css:{width:e.width,height:e.height}}).appendTo(this.$el),this.options.draggable.start&&this.options.draggable.start.call(this,b,c)},i.on_drag=function(a,b){this.colliders_data=this.drag_api.get_closest_colliders(),this.on_overlapped_column_change(this.on_start_overlapping_column,this.on_stop_overlapping_column),this.on_overlapped_row_change(this.on_start_overlapping_row,this.on_stop_overlapping_row),this.options.draggable.drag&&this.options.draggable.drag.call(this,a,b)},i.on_stop_drag=function(a,b){this.colliders_data=this.drag_api.get_closest_colliders(),this.on_overlapped_column_change(this.on_start_overlapping_column,this.on_stop_overlapping_column),this.on_overlapped_row_change(this.on_start_overlapping_row,this.on_stop_overlapping_row),this.$player.add(this.$helper).attr({"data-col":this.placeholder_grid_data.col,"data-row":this.placeholder_grid_data.row}).css({left:"",top:""}).removeClass("player"),this.$changed=this.$changed.add(this.$player),this.cells_occupied_by_player=this.get_cells_occupied(this.placeholder_grid_data),this.set_cells_player_occupies(this.placeholder_grid_data.col,this.placeholder_grid_data.row),this.$player.coords().grid.row=this.placeholder_grid_data.row,this.$player.coords().grid.col=this.placeholder_grid_data.col,this.$player=null,this.$preview_holder.remove(),this.set_dom_grid_height(),this.options.draggable.stop&&this.options.draggable.stop.call(this,a,b)},i.on_overlapped_column_change=function(b,c){if(!this.colliders_data.length)return;var d=this.get_targeted_columns(this.colliders_data[0].el.data.col),e=this.last_cols.length,f=d.length,g;for(g=0;g<f;g++)a.inArray(d[g],this.last_cols)===-1&&(b||a.noop).call(this,d[g]);for(g=0;g<e;g++)a.inArray(this.last_cols[g],d)===-1&&(c||a.noop).call(this,this.last_cols[g]);return this.last_cols=d,this},i.on_overlapped_row_change=function(b,c){if(!this.colliders_data.length)return;var d=this.get_targeted_rows(this.colliders_data[0].el.data.row),e=this.last_rows.length,f=d.length,g;for(g=0;g<f;g++)a.inArray(d[g],this.last_rows)===-1&&(b||a.noop).call(this,d[g]);for(g=0;g<e;g++)a.inArray(this.last_rows[g],d)===-1&&(c||a.noop).call(this,this.last_rows[g]);this.last_rows=d},i.set_player=function(a,b){this.empty_cells_player_occupies();var c=this,d=c.colliders_data[0].el.data,e=d.col,f=b||d.row;this.player_grid_data={col:e,row:f,size_y:this.player_grid_data.size_y,size_x:this.player_grid_data.size_x},this.cells_occupied_by_player=this.get_cells_occupied(this.player_grid_data);var g=this.get_widgets_overlapped(this.player_grid_data),h=this.widgets_constraints(g);this.manage_movements(h.can_go_up,e,f),this.manage_movements(h.can_not_go_up,e,f);if(!g.length){var i=this.can_go_player_up(this.player_grid_data);i!==!1&&(f=i),this.set_placeholder(e,f)}return{col:e,row:f}},i.widgets_constraints=function(b){var c=a([]),d,e=[],f=[];return b.each(a.proxy(function(b,d){var g=a(d),h=g.coords().grid;this.can_go_widget_up(h)?(c=c.add(g),e.push(h)):f.push(h)},this)),d=b.not(c),{can_go_up:this.sort_by_row_asc(e),can_not_go_up:this.sort_by_row_desc(f)}},i.sort_by_row_asc=function(a){return a=a.sort(function(a,b){return a.row>b.row?1:-1}),a},i.sort_by_row_desc=function(a){return a=a.sort(function(a,b){return a.row+a.size_y<b.row+b.size_y?1:-1}),a},i.manage_movements=function(b,c,d){return a.each(b,a.proxy(function(a,b){var e=b,f=e.el,g=this.can_go_widget_up(e);if(g)this.move_widget_to(f,g),this.set_placeholder(c,g+e.size_y);else{var h=this.can_go_player_up(this.player_grid_data);if(!h){var i=d+this.player_grid_data.size_y-e.row;this.move_widget_down(f,i),this.set_placeholder(c,d)}}},this)),this},i.is_player=function(a,b){if(b&&!this.gridmap[a])return!1;var c=b?this.gridmap[a][b]:a;return c&&(c.is(this.$player)||c.is(this.$helper))},i.is_player_in=function(b,c){var d=this.cells_occupied_by_player;return a.inArray(b,d.cols)>=0&&a.inArray(c,d.rows)>=0},i.is_placeholder_in=function(b,c){var d=this.cells_occupied_by_placeholder||[];return this.is_placeholder_in_col(b)&&a.inArray(c,d.rows)>=0},i.is_placeholder_in_col=function(b){return a.inArray(b,this.cells_occupied_by_placeholder.cols)>=0},i.is_empty=function(a,b){return typeof this.gridmap[a]!="undefined"&&typeof this.gridmap[a][b]!="undefined"&&this.gridmap[a][b]===!1?!0:!1},i.is_occupied=function(a,b){return this.gridmap[a]?this.gridmap[a][b]?!0:!1:!1},i.is_widget=function(a,b){var c=this.gridmap[a];return c?(c=c[b],c?c:!1):!1},i.is_widget_under_player=function(a,b){return this.is_widget(a,b)?this.is_player_in(a,b):!1},i.get_widgets_under_player=function(){var b=this.cells_occupied_by_player,c=a([]);return a.each(b.cols,a.proxy(function(d,e){a.each(b.rows,a.proxy(function(a,b){this.is_widget(e,b)&&(c=c.add(this.gridmap[e][b]))},this))},this)),c},i.set_placeholder=function(b,c){var d=a.extend({},this.placeholder_grid_data),e=this.widgets_below({col:d.col,row:d.row,size_y:d.size_y,size_x:d.size_x}),f=this.placeholder_grid_data.row<c,g=this.placeholder_grid_data.col!==b;this.placeholder_grid_data.col=b,this.placeholder_grid_data.row=c,this.cells_occupied_by_placeholder=this.get_cells_occupied(this.placeholder_grid_data),this.$preview_holder.attr({"data-row":c,"data-col":b}),(f||g)&&e.each(a.proxy(function(c,e){this.move_widget_up(a(e),this.placeholder_grid_data.col-b+d.size_y)},this))},i.can_go_player_up=function(a){var b=a.row+a.size_y-1,c=!0,d=[],e=1e4,f=this.get_widgets_under_player();return this.for_each_column_occupied(a,function(a){var g=this.gridmap[a],h=b+1;d[a]=[];while(--h>0)if(this.is_empty(a,h)||this.is_player(a,h)||this.is_widget(a,h)&&g[h].is(f))d[a].push(h),e=h<e?h:e;else break;if(d[a].length===0)return c=!1,!0;d[a].sort()}),c?this.get_valid_rows(a,d,e):!1},i.can_go_widget_up=function(a){var b=a.row+a.size_y-1,c=!0,d=[],e=1e4;return this.for_each_column_occupied(a,function(a){var f=this.gridmap[a];d[a]=[];var g=b+1;while(--g>0){if(this.is_occupied(a,g)&&!this.is_player(a,g))break;!this.is_player(a,g)&&!this.is_placeholder_in(a,g)&&d[a].push(g),g<e&&(e=g)}if(d[a].length===0)return c=!1,!0;d[a].sort()}),c?this.get_valid_rows(a,d,e):!1},i.get_valid_rows=function(b,c,d){var e=b.row,f=b.row+b.size_y-1,g=b.size_y,h=d-1,i=[];while(++h<=f){var j=!0;a.each(c,function(b,c){c&&a.inArray(h,c)===-1&&(j=!1)});if(j===!0){i.push(h);if(i.length===g)break}}var k=!1;return g===1?i[0]!==e&&(k=i[0]||!1):i[0]!==e&&(k=this.get_consecutive_numbers_index(i,g)),k},i.get_consecutive_numbers_index=function(a,b){var c=a.length,d=[],e=!0,f=-1;for(var g=0;g<c;g++){if(e||a[g]===f+1){d.push(g);if(d.length===b)break;e=!1}else d=[],e=!0;f=a[g]}return d.length>=b?a[d[0]]:!1},i.get_widgets_overlapped=function(){var b,c=a([]),d=[],e=this.cells_occupied_by_player.rows.slice(0);return e.reverse(),a.each(this.cells_occupied_by_player.cols,a.proxy(function(b,f){a.each(e,a.proxy(function(b,e){if(!this.gridmap[f])return!0;var g=this.gridmap[f][e];this.is_occupied(f,e)&&!this.is_player(g)&&a.inArray(g,d)===-1&&(c=c.add(g),d.push(g))},this))},this)),c},i.on_start_overlapping_column=function(a){this.set_player(a,!1)},i.on_start_overlapping_row=function(a){this.set_player(!1,a)},i.on_stop_overlapping_column=function(a){this.set_player();var b=this;this.for_each_widget_below(a,this.cells_occupied_by_player.rows[0],function(a,c){b.move_widget_up(this,b.player_grid_data.size_y)})},i.on_stop_overlapping_row=function(a){this.set_player();var b=this,c=this.cells_occupied_by_player.cols;for(var d=0,e=c.length;d<e;d++)this.for_each_widget_below(c[d],a,function(a,c){b.move_widget_up(this,b.player_grid_data.size_y)})},i.move_widget_to=function(b,c){var d=this,e=b.coords().grid,f=c-e.row,g=this.widgets_below(b),h=this.can_move_to(e,e.col,c,b);return h===!1?!1:(this.remove_from_gridmap(e),e.row=c,this.add_to_gridmap(e),b.attr("data-row",c),this.$changed=this.$changed.add(b),g.each(function(b,c){var e=a(c),f=e.coords().grid,g=d.can_go_widget_up(f);g&&g!==f.row&&d.move_widget_to(e,g)}),this)},i.move_widget_up=function(b,c){var d=b.coords().grid,e=d.row,f=[],g=!0;c||(c=1);if(!this.can_go_up(b))return!1;this.for_each_column_occupied(d,function(d){if(a.inArray(b,f)===-1){var g=b.coords().grid,h=e-c;h=this.can_go_up_to_row(g,d,h);if(!h)return!0;var i=this.widgets_below(b);this.remove_from_gridmap(g),g.row=h,this.add_to_gridmap(g),b.attr("data-row",g.row),this.$changed=this.$changed.add(b),f.push(b),i.each(a.proxy(function(b,d){this.move_widget_up(a(d),c)},this))}})},i.move_widget_down=function(b,c){var d=b.coords().grid,e=d.row,f=[],g=c;if(!b)return!1;if(a.inArray(b,f)===-1){var h=b.coords().grid,i=e+c,j=this.widgets_below(b);this.remove_from_gridmap(h),j.each(a.proxy(function(b,c){var d=a(c),e=d.coords().grid,f=this.displacement_diff(e,h,g);f>0&&this.move_widget_down(d,f)},this)),h.row=i,this.update_widget_position(h,b),b.attr("data-row",h.row),this.$changed=this.$changed.add(b),f.push(b)}},i.can_go_up_to_row=function(b,c,d){var e=this.gridmap,f=!0,g=[],h=b.row,i;this.for_each_column_occupied(b,function(a){var b=e[a];g[a]=[],i=h;while(i--)if(this.is_empty(a,i)&&!this.is_placeholder_in(a,i))g[a].push(i);else break;if(!g[a].length)return f=!1,!0});if(!f)return!1;i=d;for(i=1;i<h;i++){var j=!0;for(var k=0,l=g.length;k<l;k++)g[k]&&a.inArray(i,g[k])===-1&&(j=!1);if(j===!0){f=i;break}}return f},i.displacement_diff=function(a,b,c){var d=a.row,e=[],f=b.row+b.size_y;this.for_each_column_occupied(a,function(a){var b=0;for(var c=f;c<d;c++)this.is_empty(a,c)&&(b=b+1);e.push(b)});var g=Math.max.apply(null,e);return c=c-g,c>0?c:0},i.widgets_below=function(b){var c=a.isPlainObject(b)?b:b.coords().grid,d=this,e=this.gridmap,f=c.row+c.size_y-1,g=a([]);return this.for_each_column_occupied(c,function(b){d.for_each_widget_below(b,f,function(b,c){if(!d.is_player(this)&&a.inArray(this,g)===-1)return g=g.add(this),!0})}),this.sort_by_row_asc(g)},i.set_cells_player_occupies=function(a,b){return this.remove_from_gridmap(this.placeholder_grid_data),this.placeholder_grid_data.col=a,this.placeholder_grid_data.row=b,this.add_to_gridmap(this.placeholder_grid_data,this.$player),this},i.empty_cells_player_occupies=function(){return this.remove_from_gridmap(this.placeholder_grid_data),this},i.can_go_up=function(a){var b=a.coords().grid,c=b.row,d=c-1,e=this.gridmap,f=[],g=!0;return c===1?!1:(this.for_each_column_occupied(b,function(a){if(this.is_occupied(a,d)||this.is_player(a,d)||this.is_placeholder_in(a,d))return g=!1,!0}),g)},i.can_move_to=function(a,b,c){var d=this.gridmap,e=a.el,f={size_y:a.size_y,size_x:a.size_x,col:b,row:c},g=this.get_cells_occupied(a),h=!0;return this.for_each_cell_occupied(f,function(a,b){var c=this.is_widget(a,b);c&&!c.is(e)&&(h=!1)}),h},i.get_targeted_columns=function(a){var b=(a||this.player_grid_data.col)+(this.player_grid_data.size_x-1),c=[];for(var d=a;d<=b;d++)c.push(d);return c},i.get_targeted_rows=function(a){var b=(a||this.player_grid_data.row)+(this.player_grid_data.size_y-1),c=[];for(var d=a;d<=b;d++)c.push(d);return c},i.get_cells_occupied=function(a){var b={cols:[],rows:[]},c;arguments[1]instanceof jQuery&&(a=arguments[1].coords().grid);for(c=0;c<a.size_x;c++){var d=a.col+c;b.cols.push(d)}for(c=0;c<a.size_y;c++){var e=a.row+c;b.rows.push(e)}return b},i.for_each_cell_occupied=function(a,b){return this.for_each_column_occupied(a,function(c){this.for_each_row_occupied(a,function(a){b.call(this,c,a)})}),this},i.for_each_column_occupied=function(a,b){for(var c=0;c<a.size_x;c++){var d=a.col+c;b.call(this,d,a)}},i.for_each_row_occupied=function(a,b){for(var c=0;c<a.size_y;c++){var d=a.row+c;b.call(this,d,a)}},i._traversing_widgets=function(b,c,d,e,f){var g=this.gridmap;if(!g[d])return;var h,i,j=b+"/"+c;if(arguments[2]instanceof jQuery){var k=arguments[2].coords().grid;d=k.col,e=k.row,f=arguments[3]}var l=[],m=e,n={"for_each/above":function(){while(m--)if(m>0&&this.is_widget(d,m)&&a.inArray(g[d][m],l)===-1){h=f.call(g[d][m],d,m),l.push(g[d][m]);if(h)break}},"for_each/below":function(){for(m=e+1,i=g[d].length;m<i;m++)if(this.is_widget(d,m)&&a.inArray(g[d][m],l)===-1){h=f.call(g[d][m],d,m),l.push(g[d][m]);if(h)break}}};n[j]&&n[j].call(this)},i.for_each_widget_above=function(a,b,c){return this._traversing_widgets("for_each","above",a,b,c),this},i.for_each_widget_below=function(a,b,c){return this._traversing_widgets("for_each","below",a,b,c),this},i.get_highest_occupied_cell=function(){var a,b=this.gridmap,c=[],d=[];for(var e=b.length-1;e>=1;e--)for(a=b[e].length-1;a>=1;a--)if(this.is_widget(e,a)){c.push(a),d[a]=e;break}var f=Math.max.apply(null,c);return this.highest_occupied_cell={col:d[f],row:f},this.highest_occupied_cell},i.set_dom_grid_height=function(){var a=this.get_highest_occupied_cell().row;return this.$el.css("height",a*this.min_widget_height),this},i.generate_stylesheet=function(a,b){var c="",d=10,e=6,f=6,g,h;for(g=b+d;g>=0;g--)c+='[data-col="'+(g+1)+'"] { left: '+g*this.min_widget_width+"px;} ";for(g=a+d;g>=0;g--)c+='[data-row="'+(g+1)+'"] { top: '+g*this.min_widget_height+"px;} ";for(var i=1;i<e;i++)c+='[data-sizey="'+i+'"] { height: '+(i*this.options.widget_base_dimensions[1]+(i-1)*this.options.widget_margins[1]*2)+"px;}";for(var j=1;j<f;j++)c+='[data-sizex="'+j+'"] { width: '+(j*this.options.widget_base_dimensions[0]+(j-1)*this.options.widget_margins[0]*2)+"px;}";return this.add_style_tag(c)},i.add_style_tag=function(a){var b=c,d=b.createElement("style");return b.getElementsByTagName("head")[0].appendChild(d),d.setAttribute("type","text/css"),d.styleSheet?d.styleSheet.cssText=a:d.appendChild(c.createTextNode(a)),this},i.generate_faux_grid=function(b,c){this.faux_grid=[],this.gridmap=[];var d,e;for(d=c;d>0;d--){this.gridmap[d]=[];for(e=b;e>0;e--){var f=a({left:this.baseX+(d-1)*this.min_widget_width,top:this.baseY+(e-1)*this.min_widget_height,width:this.min_widget_width,height:this.min_widget_height,col:d,row:e,original_col:d,original_row:e}).coords();this.gridmap[d][e]=!1,this.faux_grid.push(f)}}return this},i.get_widgets_from_DOM=function(){return this.$widgets.each(a.proxy(function(b,c){this.register_widget(a(c))},this)),this},i.generate_grid_and_stylesheet=function(){var c,d=this.$wrapper.width(),e=this.$wrapper.height(),f=Math.floor(d/this.min_widget_width)+this.options.extra_cols,g=Math.floor(e/this.min_widget_height)+this.options.extra_rows,h=this.$widgets.map(function(){return a(this).attr("data-col")}),i=this.$widgets.map(function(){return a(this).attr("data-row")}),j=Math.max.apply(null,h),k=Math.max.apply(null,i);return f=Math.max(j,f,this.options.min_cols),g=Math.max(k,g,this.options.min_rows),c=f*(this.options.widget_base_dimensions[0]+this.options.widget_margins[0]*2),this.support_grid_width=this.wrapper_width,this.support_grid_height=g*this.min_widget_height,this.baseX=(a(b).width()-this.support_grid_width)/2,this.baseY=this.$wrapper.offset().top,this.options.autogenerate_stylesheet&&this.generate_stylesheet(g,f),this.generate_faux_grid(g,f)},a.fn.gridster=function(b){return this.each(function(){a(this).data("gridster")||a(this).data("gridster",new h(this,b))})}}(jQuery,window,document);
\ No newline at end of file
+(function(a,b,c,d){function e(b){return b[0]&&a.isPlainObject(b[0])?this.data=b[0]:this.el=b,this.isCoords=!0,this.coords={},this.init(),this}var f=e.prototype;f.init=function(){this.set(),this.original_coords=this.get()},f.set=function(){var a=this.el;a&&(this.data=a.offset(),this.data.width||(this.data.width=a.width()),this.data.height||(this.data.height=a.height()));var b=this.data;return this.coords.x1=b.left,this.coords.y1=b.top,this.coords.x2=b.left+b.width,this.coords.y2=b.top+b.height,this.coords.cx=b.left+b.width/2,this.coords.cy=b.top+b.height/2,this.coords.width=b.width,this.coords.height=b.height,this.coords.el=a||!1,this},f.update=function(b){if(!b&&!this.el)return this;if(b){var c=a.extend(this.data,b);this.data=c}return this.set(),this},f.get=function(){return this.coords},a.fn.coords=function(){if(this.data("coords"))return this.data("coords");var a=new e(this,arguments[0]);return this.data("coords",a),a}})(jQuery,window,document),function(a,b,c,d){function f(b,c,d){this.options=a.extend(e,d),this.$element=b,this.last_colliders=[],this.last_colliders_coords=[],typeof c=="string"||c instanceof jQuery?this.$colliders=a(c,this.options.colliders_context).not(this.$element):this.colliders=a(c),this.init()}var e={colliders_context:c.body,on_overlap:function(a){},on_overlap_start:function(a){},on_overlap_stop:function(a){}},g=f.prototype;g.init=function(){this.find_collisions()},g.overlaps=function(a,b){var c=!1,d=!1;if(b.x1>=a.x1&&b.x1<=a.x2||b.x2>=a.x1&&b.x2<=a.x2||a.x1>=b.x1&&a.x2<=b.x2)c=!0;if(b.y1>=a.y1&&b.y1<=a.y2||b.y2>=a.y1&&b.y2<=a.y2||a.y1>=b.y1&&a.y2<=b.y2)d=!0;return c&&d},g.detect_overlapping_region=function(a,b){var c="",d="";return a.y1>b.cy&&a.y1<b.y2&&(c="N"),a.y2>b.y1&&a.y2<b.cy&&(c="S"),a.x1>b.cx&&a.x1<b.x2&&(d="W"),a.x2>b.x1&&a.x2<b.cx&&(d="E"),c+d||"C"},g.calculate_overlapped_area_coords=function(b,c){var d=Math.max(b.x1,c.x1),e=Math.max(b.y1,c.y1),f=Math.min(b.x2,c.x2),g=Math.min(b.y2,c.y2);return a({left:d,top:e,width:f-d,height:g-e}).coords().get()},g.calculate_overlapped_area=function(a){return a.width*a.height},g.manage_colliders_start_stop=function(b,c,d){var e=this.last_colliders_coords;for(var f=0,g=e.length;f<g;f++)a.inArray(e[f],b)===-1&&c.call(this,e[f]);for(var h=0,i=b.length;h<i;h++)a.inArray(b[h],e)===-1&&d.call(this,b[h])},g.find_collisions=function(){var b=this,c=[],d=[],e=this.colliders||this.$colliders,f=e.length;while(f--){var g=b.$colliders?a(e[f]):e[f],h=b.$element.coords().update().get(),i=g.isCoords?g.update():g.coords(),j=i.get(),k=b.overlaps(h,j);if(!k)continue;var l=b.detect_overlapping_region(h,j);if(l==="C"){var m=b.calculate_overlapped_area_coords(h,j),n=b.calculate_overlapped_area(m),o={area:n,area_coords:m,region:l,coords:j,player_coords:h,el:g};b.options.on_overlap.call(this,o),c.push(i),d.push(o)}}return this.manage_colliders_start_stop(c,b.options.on_overlap_stop,b.options.on_overlap_start),this.last_colliders_coords=c,d},g.get_closest_colliders=function(){var a=this.find_collisions(),b=100;return a.sort(function(a,c){return a.area<=b?1:a.region==="C"&&c.region==="C"?a.coords.y1<c.coords.y1||a.coords.x1<c.coords.x1?-1:1:a.area<c.area?1:1}),a},a.fn.collision=function(a,b){return new f(this,a,b)}}(jQuery,window,document),function(a,b,c,d){function h(b,c){this.options=a.extend(!0,e,c),this.$el=a(b),this.$wrapper=this.$el.parent(),this.$widgets=this.$el.find(this.options.widget_selector).addClass("gs_w"),this.widgets=[],this.$changed=a([]),this.wrapper_width=this.$wrapper.width(),this.min_widget_width=this.options.widget_margins[0]*2+this.options.widget_base_dimensions[0],this.min_widget_height=this.options.widget_margins[1]*2+this.options.widget_base_dimensions[1],this.init()}var e={widget_selector:"> li",widget_margins:[10,10],widget_base_dimensions:[400,225],extra_rows:0,extra_cols:0,min_cols:1,min_rows:10,autogenerate_stylesheet:!0,serialize_params:function(a,b){return{col:b.col,row:b.row}},collision:{},draggable:{}},f=function(a,b,c){var d;return function(){var e=this,f=arguments,g=function(){d=null,c||a.apply(e,f)};c&&!d&&a.apply(e,f),clearTimeout(d),d=setTimeout(g,b)}},g=function(a,b){var c,d,e,g,h,i,j=f(function(){h=g=!1},b,!0);return function(){c=this,d=arguments;var f=function(){e=null,h&&a.apply(c,d),j()};return e||(e=setTimeout(f,b)),g?h=!0:i=a.apply(c,d),j(),g=!0,i}},i=h.prototype;i.init=function(){this.generate_grid_and_stylesheet(),this.get_widgets_from_DOM(),this.set_dom_grid_height(),this.$wrapper.addClass("ready"),this.draggable(),a(b).bind("resize",g(a.proxy(this.recalculate_faux_grid,this),200))},i.add_widget=function(b,c,d){var e=a(b).attr({"data-col":this.highest_occupied_cell.col,"data-row":this.highest_occupied_cell.row+1,"data-sizex":c||1,"data-sizey":d||1}).addClass("gs_w").appendTo(this.$el).hide();this.$widgets=this.$widgets.add(e),this.register_widget(e),this.$widgets.draggable("destroy"),this.draggable(),this.set_dom_grid_height(),e.fadeIn()},i.remove_widget=function(b){var c=b instanceof jQuery?b:a(b),d=c.coords().grid;this.$widgets=this.$widgets.not(c);var e=this.widgets_below(c);this.remove_from_gridmap(d),c.fadeOut(a.proxy(function(){c.remove(),e.each(a.proxy(function(b,c){this.move_widget_up(a(c),d.size_y)},this))},this))},i.serialize=function(b){b||(b=this.$widgets);var c=[];return b.each(a.proxy(function(b,d){c.push(this.options.serialize_params(a(d),a(d).coords().grid))},this)),c},i.serialize_changed=function(){return this.serialize(this.$changed)},i.register_widget=function(a){var b={col:parseInt(a.attr("data-col"),10),row:parseInt(a.attr("data-row"),10),size_x:parseInt(a.attr("data-sizex"),10),size_y:parseInt(a.attr("data-sizey"),10),el:a};return a.data("coords",a.coords()),a.data("coords").grid=b,this.add_to_gridmap(b,a),this.widgets.push(a),this},i.update_widget_position=function(a,b){return this.for_each_cell_occupied(a,function(a,c){if(!this.gridmap[a])return this;this.gridmap[a][c]=b}),this},i.remove_from_gridmap=function(a){return this.update_widget_position(a,!1)},i.add_to_gridmap=function(b,c){this.update_widget_position(b,c||b.el);if(b.el){var d=this.widgets_below(b.el);d.each(a.proxy(function(b,c){this.move_widget_up(a(c))},this))}},i.draggable=function(){var b=this,c=a.extend(!0,{},this.options.draggable,{start:function(c,d){b.$player=a(this),b.$helper=b.options.draggable.helper==="clone"?a(d.helper):b.$player,b.on_start_drag.call(b,c,d)},stop:function(a,c){b.on_stop_drag.call(b,c)},drag:g(function(a,c){b.on_drag.call(b,a,c)},100,!0)});return this.$widgets.draggable(c),this},i.on_start_drag=function(b,c){this.$player.addClass("player"),this.$wrapper.addClass("dragging"),this.player_grid_data=this.$player.coords().grid,this.placeholder_grid_data=a.extend({},this.player_grid_data),this.$el.css("height",this.$el.height()+this.player_grid_data.size_y*this.min_widget_height);var d=this.faux_grid,e=this.$player.data("coords").coords;this.cells_occupied_by_player=this.get_cells_occupied(this.player_grid_data),this.cells_occupied_by_placeholder=this.get_cells_occupied(this.placeholder_grid_data),this.last_cols=[],this.last_rows=[],this.drag_api=this.$helper.collision(d,this.options.collision),this.$preview_holder=a("<li />",{"class":"preview-holder","data-row":this.$player.attr("data-row"),"data-col":this.$player.attr("data-col"),css:{width:e.width,height:e.height}}).appendTo(this.$el),this.options.draggable.start&&this.options.draggable.start.call(this,b,c)},i.on_drag=function(a,b){this.colliders_data=this.drag_api.get_closest_colliders(),this.on_overlapped_column_change(this.on_start_overlapping_column,this.on_stop_overlapping_column),this.on_overlapped_row_change(this.on_start_overlapping_row,this.on_stop_overlapping_row),this.options.draggable.drag&&this.options.draggable.drag.call(this,a,b)},i.on_stop_drag=function(a,b){this.colliders_data=this.drag_api.get_closest_colliders(),this.on_overlapped_column_change(this.on_start_overlapping_column,this.on_stop_overlapping_column),this.on_overlapped_row_change(this.on_start_overlapping_row,this.on_stop_overlapping_row),this.$player.add(this.$helper).attr({"data-col":this.placeholder_grid_data.col,"data-row":this.placeholder_grid_data.row}).css({left:"",top:""}).removeClass("player"),this.$changed=this.$changed.add(this.$player),this.cells_occupied_by_player=this.get_cells_occupied(this.placeholder_grid_data),this.set_cells_player_occupies(this.placeholder_grid_data.col,this.placeholder_grid_data.row),this.$player.coords().grid.row=this.placeholder_grid_data.row,this.$player.coords().grid.col=this.placeholder_grid_data.col,this.$player=null,this.$preview_holder.remove(),this.set_dom_grid_height(),this.options.draggable.stop&&this.options.draggable.stop.call(this,a,b)},i.on_overlapped_column_change=function(b,c){if(!this.colliders_data.length)return;var d=this.get_targeted_columns(this.colliders_data[0].el.data.col),e=this.last_cols.length,f=d.length,g;for(g=0;g<f;g++)a.inArray(d[g],this.last_cols)===-1&&(b||a.noop).call(this,d[g]);for(g=0;g<e;g++)a.inArray(this.last_cols[g],d)===-1&&(c||a.noop).call(this,this.last_cols[g]);return this.last_cols=d,this},i.on_overlapped_row_change=function(b,c){if(!this.colliders_data.length)return;var d=this.get_targeted_rows(this.colliders_data[0].el.data.row),e=this.last_rows.length,f=d.length,g;for(g=0;g<f;g++)a.inArray(d[g],this.last_rows)===-1&&(b||a.noop).call(this,d[g]);for(g=0;g<e;g++)a.inArray(this.last_rows[g],d)===-1&&(c||a.noop).call(this,this.last_rows[g]);this.last_rows=d},i.set_player=function(a,b){this.empty_cells_player_occupies();var c=this,d=c.colliders_data[0].el.data,e=d.col,f=b||d.row;this.player_grid_data={col:e,row:f,size_y:this.player_grid_data.size_y,size_x:this.player_grid_data.size_x},this.cells_occupied_by_player=this.get_cells_occupied(this.player_grid_data);var g=this.get_widgets_overlapped(this.player_grid_data),h=this.widgets_constraints(g);this.manage_movements(h.can_go_up,e,f),this.manage_movements(h.can_not_go_up,e,f);if(!g.length){var i=this.can_go_player_up(this.player_grid_data);i!==!1&&(f=i),this.set_placeholder(e,f)}return{col:e,row:f}},i.widgets_constraints=function(b){var c=a([]),d,e=[],f=[];return b.each(a.proxy(function(b,d){var g=a(d),h=g.coords().grid;this.can_go_widget_up(h)?(c=c.add(g),e.push(h)):f.push(h)},this)),d=b.not(c),{can_go_up:this.sort_by_row_asc(e),can_not_go_up:this.sort_by_row_desc(f)}},i.sort_by_row_asc=function(a){return a=a.sort(function(a,b){return a.row>b.row?1:-1}),a},i.sort_by_row_desc=function(a){return a=a.sort(function(a,b){return a.row+a.size_y<b.row+b.size_y?1:-1}),a},i.manage_movements=function(b,c,d){return a.each(b,a.proxy(function(a,b){var e=b,f=e.el,g=this.can_go_widget_up(e);if(g)this.move_widget_to(f,g),this.set_placeholder(c,g+e.size_y);else{var h=this.can_go_player_up(this.player_grid_data);if(!h){var i=d+this.player_grid_data.size_y-e.row;this.move_widget_down(f,i),this.set_placeholder(c,d)}}},this)),this},i.is_player=function(a,b){if(b&&!this.gridmap[a])return!1;var c=b?this.gridmap[a][b]:a;return c&&(c.is(this.$player)||c.is(this.$helper))},i.is_player_in=function(b,c){var d=this.cells_occupied_by_player;return a.inArray(b,d.cols)>=0&&a.inArray(c,d.rows)>=0},i.is_placeholder_in=function(b,c){var d=this.cells_occupied_by_placeholder||[];return this.is_placeholder_in_col(b)&&a.inArray(c,d.rows)>=0},i.is_placeholder_in_col=function(b){return a.inArray(b,this.cells_occupied_by_placeholder.cols)>=0},i.is_empty=function(a,b){return typeof this.gridmap[a]!="undefined"&&typeof this.gridmap[a][b]!="undefined"&&this.gridmap[a][b]===!1?!0:!1},i.is_occupied=function(a,b){return this.gridmap[a]?this.gridmap[a][b]?!0:!1:!1},i.is_widget=function(a,b){var c=this.gridmap[a];return c?(c=c[b],c?c:!1):!1},i.is_widget_under_player=function(a,b){return this.is_widget(a,b)?this.is_player_in(a,b):!1},i.get_widgets_under_player=function(){var b=this.cells_occupied_by_player,c=a([]);return a.each(b.cols,a.proxy(function(d,e){a.each(b.rows,a.proxy(function(a,b){this.is_widget(e,b)&&(c=c.add(this.gridmap[e][b]))},this))},this)),c},i.set_placeholder=function(b,c){var d=a.extend({},this.placeholder_grid_data),e=this.widgets_below({col:d.col,row:d.row,size_y:d.size_y,size_x:d.size_x}),f=this.placeholder_grid_data.row<c,g=this.placeholder_grid_data.col!==b;this.placeholder_grid_data.col=b,this.placeholder_grid_data.row=c,this.cells_occupied_by_placeholder=this.get_cells_occupied(this.placeholder_grid_data),this.$preview_holder.attr({"data-row":c,"data-col":b}),(f||g)&&e.each(a.proxy(function(c,e){this.move_widget_up(a(e),this.placeholder_grid_data.col-b+d.size_y)},this))},i.can_go_player_up=function(a){var b=a.row+a.size_y-1,c=!0,d=[],e=1e4,f=this.get_widgets_under_player();return this.for_each_column_occupied(a,function(a){var g=this.gridmap[a],h=b+1;d[a]=[];while(--h>0)if(this.is_empty(a,h)||this.is_player(a,h)||this.is_widget(a,h)&&g[h].is(f))d[a].push(h),e=h<e?h:e;else break;if(d[a].length===0)return c=!1,!0;d[a].sort()}),c?this.get_valid_rows(a,d,e):!1},i.can_go_widget_up=function(a){var b=a.row+a.size_y-1,c=!0,d=[],e=1e4;return this.for_each_column_occupied(a,function(a){var f=this.gridmap[a];d[a]=[];var g=b+1;while(--g>0){if(this.is_occupied(a,g)&&!this.is_player(a,g))break;!this.is_player(a,g)&&!this.is_placeholder_in(a,g)&&d[a].push(g),g<e&&(e=g)}if(d[a].length===0)return c=!1,!0;d[a].sort()}),c?this.get_valid_rows(a,d,e):!1},i.get_valid_rows=function(b,c,d){var e=b.row,f=b.row+b.size_y-1,g=b.size_y,h=d-1,i=[];while(++h<=f){var j=!0;a.each(c,function(b,c){c&&a.inArray(h,c)===-1&&(j=!1)});if(j===!0){i.push(h);if(i.length===g)break}}var k=!1;return g===1?i[0]!==e&&(k=i[0]||!1):i[0]!==e&&(k=this.get_consecutive_numbers_index(i,g)),k},i.get_consecutive_numbers_index=function(a,b){var c=a.length,d=[],e=!0,f=-1;for(var g=0;g<c;g++){if(e||a[g]===f+1){d.push(g);if(d.length===b)break;e=!1}else d=[],e=!0;f=a[g]}return d.length>=b?a[d[0]]:!1},i.get_widgets_overlapped=function(){var b,c=a([]),d=[],e=this.cells_occupied_by_player.rows.slice(0);return e.reverse(),a.each(this.cells_occupied_by_player.cols,a.proxy(function(b,f){a.each(e,a.proxy(function(b,e){if(!this.gridmap[f])return!0;var g=this.gridmap[f][e];this.is_occupied(f,e)&&!this.is_player(g)&&a.inArray(g,d)===-1&&(c=c.add(g),d.push(g))},this))},this)),c},i.on_start_overlapping_column=function(a){this.set_player(a,!1)},i.on_start_overlapping_row=function(a){this.set_player(!1,a)},i.on_stop_overlapping_column=function(a){this.set_player();var b=this;this.for_each_widget_below(a,this.cells_occupied_by_player.rows[0],function(a,c){b.move_widget_up(this,b.player_grid_data.size_y)})},i.on_stop_overlapping_row=function(a){this.set_player();var b=this,c=this.cells_occupied_by_player.cols;for(var d=0,e=c.length;d<e;d++)this.for_each_widget_below(c[d],a,function(a,c){b.move_widget_up(this,b.player_grid_data.size_y)})},i.move_widget_to=function(b,c){var d=this,e=b.coords().grid,f=c-e.row,g=this.widgets_below(b),h=this.can_move_to(e,e.col,c,b);return h===!1?!1:(this.remove_from_gridmap(e),e.row=c,this.add_to_gridmap(e),b.attr("data-row",c),this.$changed=this.$changed.add(b),g.each(function(b,c){var e=a(c),f=e.coords().grid,g=d.can_go_widget_up(f);g&&g!==f.row&&d.move_widget_to(e,g)}),this)},i.move_widget_up=function(b,c){var d=b.coords().grid,e=d.row,f=[],g=!0;c||(c=1);if(!this.can_go_up(b))return!1;this.for_each_column_occupied(d,function(d){if(a.inArray(b,f)===-1){var g=b.coords().grid,h=e-c;h=this.can_go_up_to_row(g,d,h);if(!h)return!0;var i=this.widgets_below(b);this.remove_from_gridmap(g),g.row=h,this.add_to_gridmap(g),b.attr("data-row",g.row),this.$changed=this.$changed.add(b),f.push(b),i.each(a.proxy(function(b,d){this.move_widget_up(a(d),c)},this))}})},i.move_widget_down=function(b,c){var d=b.coords().grid,e=d.row,f=[],g=c;if(!b)return!1;if(a.inArray(b,f)===-1){var h=b.coords().grid,i=e+c,j=this.widgets_below(b);this.remove_from_gridmap(h),j.each(a.proxy(function(b,c){var d=a(c),e=d.coords().grid,f=this.displacement_diff(e,h,g);f>0&&this.move_widget_down(d,f)},this)),h.row=i,this.update_widget_position(h,b),b.attr("data-row",h.row),this.$changed=this.$changed.add(b),f.push(b)}},i.can_go_up_to_row=function(b,c,d){var e=this.gridmap,f=!0,g=[],h=b.row,i;this.for_each_column_occupied(b,function(a){var b=e[a];g[a]=[],i=h;while(i--)if(this.is_empty(a,i)&&!this.is_placeholder_in(a,i))g[a].push(i);else break;if(!g[a].length)return f=!1,!0});if(!f)return!1;i=d;for(i=1;i<h;i++){var j=!0;for(var k=0,l=g.length;k<l;k++)g[k]&&a.inArray(i,g[k])===-1&&(j=!1);if(j===!0){f=i;break}}return f},i.displacement_diff=function(a,b,c){var d=a.row,e=[],f=b.row+b.size_y;this.for_each_column_occupied(a,function(a){var b=0;for(var c=f;c<d;c++)this.is_empty(a,c)&&(b=b+1);e.push(b)});var g=Math.max.apply(null,e);return c=c-g,c>0?c:0},i.widgets_below=function(b){var c=a.isPlainObject(b)?b:b.coords().grid,d=this,e=this.gridmap,f=c.row+c.size_y-1,g=a([]);return this.for_each_column_occupied(c,function(b){d.for_each_widget_below(b,f,function(b,c){if(!d.is_player(this)&&a.inArray(this,g)===-1)return g=g.add(this),!0})}),this.sort_by_row_asc(g)},i.set_cells_player_occupies=function(a,b){return this.remove_from_gridmap(this.placeholder_grid_data),this.placeholder_grid_data.col=a,this.placeholder_grid_data.row=b,this.add_to_gridmap(this.placeholder_grid_data,this.$player),this},i.empty_cells_player_occupies=function(){return this.remove_from_gridmap(this.placeholder_grid_data),this},i.can_go_up=function(a){var b=a.coords().grid,c=b.row,d=c-1,e=this.gridmap,f=[],g=!0;return c===1?!1:(this.for_each_column_occupied(b,function(a){if(this.is_occupied(a,d)||this.is_player(a,d)||this.is_placeholder_in(a,d))return g=!1,!0}),g)},i.can_move_to=function(a,b,c){var d=this.gridmap,e=a.el,f={size_y:a.size_y,size_x:a.size_x,col:b,row:c},g=this.get_cells_occupied(a),h=!0;return this.for_each_cell_occupied(f,function(a,b){var c=this.is_widget(a,b);c&&!c.is(e)&&(h=!1)}),h},i.get_targeted_columns=function(a){var b=(a||this.player_grid_data.col)+(this.player_grid_data.size_x-1),c=[];for(var d=a;d<=b;d++)c.push(d);return c},i.get_targeted_rows=function(a){var b=(a||this.player_grid_data.row)+(this.player_grid_data.size_y-1),c=[];for(var d=a;d<=b;d++)c.push(d);return c},i.get_cells_occupied=function(a){var b={cols:[],rows:[]},c;arguments[1]instanceof jQuery&&(a=arguments[1].coords().grid);for(c=0;c<a.size_x;c++){var d=a.col+c;b.cols.push(d)}for(c=0;c<a.size_y;c++){var e=a.row+c;b.rows.push(e)}return b},i.for_each_cell_occupied=function(a,b){return this.for_each_column_occupied(a,function(c){this.for_each_row_occupied(a,function(a){b.call(this,c,a)})}),this},i.for_each_column_occupied=function(a,b){for(var c=0;c<a.size_x;c++){var d=a.col+c;b.call(this,d,a)}},i.for_each_row_occupied=function(a,b){for(var c=0;c<a.size_y;c++){var d=a.row+c;b.call(this,d,a)}},i._traversing_widgets=function(b,c,d,e,f){var g=this.gridmap;if(!g[d])return;var h,i,j=b+"/"+c;if(arguments[2]instanceof jQuery){var k=arguments[2].coords().grid;d=k.col,e=k.row,f=arguments[3]}var l=[],m=e,n={"for_each/above":function(){while(m--)if(m>0&&this.is_widget(d,m)&&a.inArray(g[d][m],l)===-1){h=f.call(g[d][m],d,m),l.push(g[d][m]);if(h)break}},"for_each/below":function(){for(m=e+1,i=g[d].length;m<i;m++)if(this.is_widget(d,m)&&a.inArray(g[d][m],l)===-1){h=f.call(g[d][m],d,m),l.push(g[d][m]);if(h)break}}};n[j]&&n[j].call(this)},i.for_each_widget_above=function(a,b,c){return this._traversing_widgets("for_each","above",a,b,c),this},i.for_each_widget_below=function(a,b,c){return this._traversing_widgets("for_each","below",a,b,c),this},i.get_highest_occupied_cell=function(){var a,b=this.gridmap,c=[],d=[];for(var e=b.length-1;e>=1;e--)for(a=b[e].length-1;a>=1;a--)if(this.is_widget(e,a)){c.push(a),d[a]=e;break}var f=Math.max.apply(null,c);return this.highest_occupied_cell={col:d[f],row:f},this.highest_occupied_cell},i.set_dom_grid_height=function(){var a=this.get_highest_occupied_cell().row;return this.$el.css("height",a*this.min_widget_height),this},i.generate_stylesheet=function(a,b){var c="",d=10,e=6,f=6,g,h;for(g=b+d;g>=0;g--)c+='[data-col="'+(g+1)+'"] { left: '+g*this.min_widget_width+"px;} ";for(g=a+d;g>=0;g--)c+='[data-row="'+(g+1)+'"] { top: '+g*this.min_widget_height+"px;} ";for(var i=1;i<e;i++)c+='[data-sizey="'+i+'"] { height: '+(i*this.options.widget_base_dimensions[1]+(i-1)*this.options.widget_margins[1]*2)+"px;}";for(var j=1;j<f;j++)c+='[data-sizex="'+j+'"] { width: '+(j*this.options.widget_base_dimensions[0]+(j-1)*this.options.widget_margins[0]*2)+"px;}";return this.add_style_tag(c)},i.add_style_tag=function(a){var b=c,d=b.createElement("style");return b.getElementsByTagName("head")[0].appendChild(d),d.setAttribute("type","text/css"),d.styleSheet?d.styleSheet.cssText=a:d.appendChild(c.createTextNode(a)),this},i.generate_faux_grid=function(b,c){this.faux_grid=[],this.gridmap=[];var d,e;for(d=c;d>0;d--){this.gridmap[d]=[];for(e=b;e>0;e--){var f=a({left:this.baseX+(d-1)*this.min_widget_width,top:this.baseY+(e-1)*this.min_widget_height,width:this.min_widget_width,height:this.min_widget_height,col:d,row:e,original_col:d,original_row:e}).coords();this.gridmap[d][e]=!1,this.faux_grid.push(f)}}return this},i.recalculate_faux_grid=function(){var c=this.$wrapper.width();return this.baseX=(a(b).width()-c)/2,this.baseY=this.$wrapper.offset().top,a.each(this.faux_grid,a.proxy(function(a,b){this.faux_grid[a]=b.update({left:this.baseX+(b.data.col-1)*this.min_widget_width,top:this.baseY+(b.data.row-1)*this.min_widget_height})},this)),this},i.get_widgets_from_DOM=function(){return this.$widgets.each(a.proxy(function(b,c){this.register_widget(a(c))},this)),this},i.generate_grid_and_stylesheet=function(){var c=this.$wrapper.width(),d=this.$wrapper.height(),e=Math.floor(c/this.min_widget_width)+this.options.extra_cols,f=Math.floor(d/this.min_widget_height)+this.options.extra_rows,g=this.$widgets.map(function(){return a(this).attr("data-col")}),h=this.$widgets.map(function(){return a(this).attr("data-row")}),i=Math.max.apply(null,g),j=Math.max.apply(null,h);return e=Math.max(i,e,this.options.min_cols),f=Math.max(j,f,this.options.min_rows),this.baseX=(a(b).width()-c)/2,this.baseY=this.$wrapper.offset().top,this.options.autogenerate_stylesheet&&this.generate_stylesheet(f,e),this.generate_faux_grid(f,e)},a.fn.gridster=function(b){return this.each(function(){a(this).data("gridster")||a(this).data("gridster",new h(this,b))})}}(jQuery,window,document);
\ No newline at end of file
diff --git a/docs/classes/Gridster.html b/docs/classes/Gridster.html
index 3080b167b5..2c88e919c3 100644
--- a/docs/classes/Gridster.html
+++ b/docs/classes/Gridster.html
@@ -106,7 +106,7 @@
 
     
         <div class="foundat">
-            Defined in: <a href="..&#x2F;files&#x2F;src_jquery.gridster.js.html#l73"><code>src&#x2F;jquery.gridster.js:73</code></a>
+            Defined in: <a href="..&#x2F;files&#x2F;src_jquery.gridster.js.html#l70"><code>src&#x2F;jquery.gridster.js:70</code></a>
         </div>
     
 
@@ -172,7 +172,7 @@
             
         
         
-        <a href="..&#x2F;files&#x2F;src_jquery.gridster.js.html#l73"><code>src&#x2F;jquery.gridster.js:73</code></a>
+        <a href="..&#x2F;files&#x2F;src_jquery.gridster.js.html#l70"><code>src&#x2F;jquery.gridster.js:70</code></a>
         
         </p>
 
@@ -232,9 +232,9 @@
                                 
 
                                 <div class="param-description">
-                                    <p>Define who will be the
-    draggable widgets. Can be a CSS Selector String or a collection of
-    HTMLElements</p>
+                                    <p>Define who will
+    be the draggable widgets. Can be a CSS Selector String or a
+    collection of HTMLElements</p>
                                 </div>
 
                                 
@@ -248,9 +248,9 @@
                                 
 
                                 <div class="param-description">
-                                    <p>Margin between widgets. The first
-    index for the horizontal margin (left, right) and the second
-    for the vertical margin (top, bottom).</p>
+                                    <p>Margin between widgets.
+    The first index for the horizontal margin (left, right) and
+    the second for the vertical margin (top, bottom).</p>
                                 </div>
 
                                 
@@ -264,8 +264,8 @@
                                 
 
                                 <div class="param-description">
-                                    <p>Base widget dimensions in
-    pixels. The first index for the width and the second for the
+                                    <p>Base widget dimensions
+    in pixels. The first index for the width and the second for the
     height.</p>
                                 </div>
 
@@ -756,6 +756,13 @@
 
                                 
                                 
+                            </li>
+                        
+                            <li class="index-item method">
+                                <a href="#method_recalculate_faux_grid">recalculate_faux_grid</a>
+
+                                
+                                
                             </li>
                         
                             <li class="index-item method">
@@ -918,7 +925,7 @@
             
         
         
-        <a href="..&#x2F;files&#x2F;src_jquery.gridster.js.html#l1818"><code>src&#x2F;jquery.gridster.js:1818</code></a>
+        <a href="..&#x2F;files&#x2F;src_jquery.gridster.js.html#l1829"><code>src&#x2F;jquery.gridster.js:1829</code></a>
         
         </p>
 
@@ -1028,7 +1035,7 @@
             
         
         
-        <a href="..&#x2F;files&#x2F;src_jquery.gridster.js.html#l292"><code>src&#x2F;jquery.gridster.js:292</code></a>
+        <a href="..&#x2F;files&#x2F;src_jquery.gridster.js.html#l293"><code>src&#x2F;jquery.gridster.js:293</code></a>
         
         </p>
 
@@ -1296,7 +1303,7 @@
             
         
         
-        <a href="..&#x2F;files&#x2F;src_jquery.gridster.js.html#l915"><code>src&#x2F;jquery.gridster.js:915</code></a>
+        <a href="..&#x2F;files&#x2F;src_jquery.gridster.js.html#l925"><code>src&#x2F;jquery.gridster.js:925</code></a>
         
         </p>
 
@@ -1414,7 +1421,7 @@
             
         
         
-        <a href="..&#x2F;files&#x2F;src_jquery.gridster.js.html#l1321"><code>src&#x2F;jquery.gridster.js:1321</code></a>
+        <a href="..&#x2F;files&#x2F;src_jquery.gridster.js.html#l1332"><code>src&#x2F;jquery.gridster.js:1332</code></a>
         
         </p>
 
@@ -1551,7 +1558,7 @@ upper row possible.</p>
             
         
         
-        <a href="..&#x2F;files&#x2F;src_jquery.gridster.js.html#l963"><code>src&#x2F;jquery.gridster.js:963</code></a>
+        <a href="..&#x2F;files&#x2F;src_jquery.gridster.js.html#l974"><code>src&#x2F;jquery.gridster.js:974</code></a>
         
         </p>
 
@@ -1669,7 +1676,7 @@ upper row possible.</p>
             
         
         
-        <a href="..&#x2F;files&#x2F;src_jquery.gridster.js.html#l1493"><code>src&#x2F;jquery.gridster.js:1493</code></a>
+        <a href="..&#x2F;files&#x2F;src_jquery.gridster.js.html#l1504"><code>src&#x2F;jquery.gridster.js:1504</code></a>
         
         </p>
 
@@ -1796,7 +1803,7 @@ into account the dimensions (<code>size_y</code> and <code>size_x</code> attrs.
             
         
         
-        <a href="..&#x2F;files&#x2F;src_jquery.gridster.js.html#l314"><code>src&#x2F;jquery.gridster.js:314</code></a>
+        <a href="..&#x2F;files&#x2F;src_jquery.gridster.js.html#l315"><code>src&#x2F;jquery.gridster.js:315</code></a>
         
         </p>
 
@@ -1867,7 +1874,7 @@ into account the dimensions (<code>size_y</code> and <code>size_x</code> attrs.
             
         
         
-        <a href="..&#x2F;files&#x2F;src_jquery.gridster.js.html#l1456"><code>src&#x2F;jquery.gridster.js:1456</code></a>
+        <a href="..&#x2F;files&#x2F;src_jquery.gridster.js.html#l1467"><code>src&#x2F;jquery.gridster.js:1467</code></a>
         
         </p>
 
@@ -1954,7 +1961,7 @@ into account the dimensions (<code>size_y</code> and <code>size_x</code> attrs.
             
         
         
-        <a href="..&#x2F;files&#x2F;src_jquery.gridster.js.html#l1591"><code>src&#x2F;jquery.gridster.js:1591</code></a>
+        <a href="..&#x2F;files&#x2F;src_jquery.gridster.js.html#l1602"><code>src&#x2F;jquery.gridster.js:1602</code></a>
         
         </p>
 
@@ -2082,7 +2089,7 @@ each one.</p>
             
         
         
-        <a href="..&#x2F;files&#x2F;src_jquery.gridster.js.html#l1612"><code>src&#x2F;jquery.gridster.js:1612</code></a>
+        <a href="..&#x2F;files&#x2F;src_jquery.gridster.js.html#l1623"><code>src&#x2F;jquery.gridster.js:1623</code></a>
         
         </p>
 
@@ -2210,7 +2217,7 @@ each one.</p>
             
         
         
-        <a href="..&#x2F;files&#x2F;src_jquery.gridster.js.html#l1631"><code>src&#x2F;jquery.gridster.js:1631</code></a>
+        <a href="..&#x2F;files&#x2F;src_jquery.gridster.js.html#l1642"><code>src&#x2F;jquery.gridster.js:1642</code></a>
         
         </p>
 
@@ -2343,7 +2350,7 @@ each one.</p>
             
         
         
-        <a href="..&#x2F;files&#x2F;src_jquery.gridster.js.html#l1697"><code>src&#x2F;jquery.gridster.js:1697</code></a>
+        <a href="..&#x2F;files&#x2F;src_jquery.gridster.js.html#l1708"><code>src&#x2F;jquery.gridster.js:1708</code></a>
         
         </p>
 
@@ -2490,7 +2497,7 @@ iteration. The value of <code>this</code> inside the function is the jQuery wrap
             
         
         
-        <a href="..&#x2F;files&#x2F;src_jquery.gridster.js.html#l1713"><code>src&#x2F;jquery.gridster.js:1713</code></a>
+        <a href="..&#x2F;files&#x2F;src_jquery.gridster.js.html#l1724"><code>src&#x2F;jquery.gridster.js:1724</code></a>
         
         </p>
 
@@ -2631,7 +2638,7 @@ iteration. The value of <code>this</code> inside the function is the jQuery wrap
             
         
         
-        <a href="..&#x2F;files&#x2F;src_jquery.gridster.js.html#l1841"><code>src&#x2F;jquery.gridster.js:1841</code></a>
+        <a href="..&#x2F;files&#x2F;src_jquery.gridster.js.html#l1852"><code>src&#x2F;jquery.gridster.js:1852</code></a>
         
         </p>
 
@@ -2741,7 +2748,7 @@ detect row or column that we want to go.</p>
             
         
         
-        <a href="..&#x2F;files&#x2F;src_jquery.gridster.js.html#l1891"><code>src&#x2F;jquery.gridster.js:1891</code></a>
+        <a href="..&#x2F;files&#x2F;src_jquery.gridster.js.html#l1926"><code>src&#x2F;jquery.gridster.js:1926</code></a>
         
         </p>
 
@@ -2829,7 +2836,7 @@ detect row or column that we want to go.</p>
             
         
         
-        <a href="..&#x2F;files&#x2F;src_jquery.gridster.js.html#l1774"><code>src&#x2F;jquery.gridster.js:1774</code></a>
+        <a href="..&#x2F;files&#x2F;src_jquery.gridster.js.html#l1785"><code>src&#x2F;jquery.gridster.js:1785</code></a>
         
         </p>
 
@@ -2948,7 +2955,7 @@ detect row or column that we want to go.</p>
             
         
         
-        <a href="..&#x2F;files&#x2F;src_jquery.gridster.js.html#l1563"><code>src&#x2F;jquery.gridster.js:1563</code></a>
+        <a href="..&#x2F;files&#x2F;src_jquery.gridster.js.html#l1574"><code>src&#x2F;jquery.gridster.js:1574</code></a>
         
         </p>
 
@@ -3042,7 +3049,7 @@ detect row or column that we want to go.</p>
             
         
         
-        <a href="..&#x2F;files&#x2F;src_jquery.gridster.js.html#l1729"><code>src&#x2F;jquery.gridster.js:1729</code></a>
+        <a href="..&#x2F;files&#x2F;src_jquery.gridster.js.html#l1740"><code>src&#x2F;jquery.gridster.js:1740</code></a>
         
         </p>
 
@@ -3123,7 +3130,7 @@ detect row or column that we want to go.</p>
             
         
         
-        <a href="..&#x2F;files&#x2F;src_jquery.gridster.js.html#l1528"><code>src&#x2F;jquery.gridster.js:1528</code></a>
+        <a href="..&#x2F;files&#x2F;src_jquery.gridster.js.html#l1539"><code>src&#x2F;jquery.gridster.js:1539</code></a>
         
         </p>
 
@@ -3228,7 +3235,7 @@ detect row or column that we want to go.</p>
             
         
         
-        <a href="..&#x2F;files&#x2F;src_jquery.gridster.js.html#l1546"><code>src&#x2F;jquery.gridster.js:1546</code></a>
+        <a href="..&#x2F;files&#x2F;src_jquery.gridster.js.html#l1557"><code>src&#x2F;jquery.gridster.js:1557</code></a>
         
         </p>
 
@@ -3345,7 +3352,7 @@ detect row or column that we want to go.</p>
             
         
         
-        <a href="..&#x2F;files&#x2F;src_jquery.gridster.js.html#l1014"><code>src&#x2F;jquery.gridster.js:1014</code></a>
+        <a href="..&#x2F;files&#x2F;src_jquery.gridster.js.html#l1025"><code>src&#x2F;jquery.gridster.js:1025</code></a>
         
         </p>
 
@@ -3473,7 +3480,7 @@ the</code>upper<em>rows<code>array. Iteration starts from row specified in</code
             
         
         
-        <a href="..&#x2F;files&#x2F;src_jquery.gridster.js.html#l1877"><code>src&#x2F;jquery.gridster.js:1877</code></a>
+        <a href="..&#x2F;files&#x2F;src_jquery.gridster.js.html#l1912"><code>src&#x2F;jquery.gridster.js:1912</code></a>
         
         </p>
 
@@ -3544,7 +3551,7 @@ the</code>upper<em>rows<code>array. Iteration starts from row specified in</code
             
         
         
-        <a href="..&#x2F;files&#x2F;src_jquery.gridster.js.html#l1092"><code>src&#x2F;jquery.gridster.js:1092</code></a>
+        <a href="..&#x2F;files&#x2F;src_jquery.gridster.js.html#l1103"><code>src&#x2F;jquery.gridster.js:1103</code></a>
         
         </p>
 
@@ -3615,7 +3622,7 @@ the</code>upper<em>rows<code>array. Iteration starts from row specified in</code
             
         
         
-        <a href="..&#x2F;files&#x2F;src_jquery.gridster.js.html#l852"><code>src&#x2F;jquery.gridster.js:852</code></a>
+        <a href="..&#x2F;files&#x2F;src_jquery.gridster.js.html#l861"><code>src&#x2F;jquery.gridster.js:861</code></a>
         
         </p>
 
@@ -3702,7 +3709,7 @@ the</code>upper<em>rows<code>array. Iteration starts from row specified in</code
             
         
         
-        <a href="..&#x2F;files&#x2F;src_jquery.gridster.js.html#l771"><code>src&#x2F;jquery.gridster.js:771</code></a>
+        <a href="..&#x2F;files&#x2F;src_jquery.gridster.js.html#l780"><code>src&#x2F;jquery.gridster.js:780</code></a>
         
         </p>
 
@@ -3827,7 +3834,7 @@ the</code>upper<em>rows<code>array. Iteration starts from row specified in</code
             
         
         
-        <a href="..&#x2F;files&#x2F;src_jquery.gridster.js.html#l790"><code>src&#x2F;jquery.gridster.js:790</code></a>
+        <a href="..&#x2F;files&#x2F;src_jquery.gridster.js.html#l799"><code>src&#x2F;jquery.gridster.js:799</code></a>
         
         </p>
 
@@ -3952,7 +3959,7 @@ the</code>upper<em>rows<code>array. Iteration starts from row specified in</code
             
         
         
-        <a href="..&#x2F;files&#x2F;src_jquery.gridster.js.html#l745"><code>src&#x2F;jquery.gridster.js:745</code></a>
+        <a href="..&#x2F;files&#x2F;src_jquery.gridster.js.html#l754"><code>src&#x2F;jquery.gridster.js:754</code></a>
         
         </p>
 
@@ -4071,7 +4078,7 @@ the</code>upper<em>rows<code>array. Iteration starts from row specified in</code
             
         
         
-        <a href="..&#x2F;files&#x2F;src_jquery.gridster.js.html#l759"><code>src&#x2F;jquery.gridster.js:759</code></a>
+        <a href="..&#x2F;files&#x2F;src_jquery.gridster.js.html#l768"><code>src&#x2F;jquery.gridster.js:768</code></a>
         
         </p>
 
@@ -4181,7 +4188,7 @@ the</code>upper<em>rows<code>array. Iteration starts from row specified in</code
             
         
         
-        <a href="..&#x2F;files&#x2F;src_jquery.gridster.js.html#l713"><code>src&#x2F;jquery.gridster.js:713</code></a>
+        <a href="..&#x2F;files&#x2F;src_jquery.gridster.js.html#l722"><code>src&#x2F;jquery.gridster.js:722</code></a>
         
         </p>
 
@@ -4309,7 +4316,7 @@ HTMLElements.</p>
             
         
         
-        <a href="..&#x2F;files&#x2F;src_jquery.gridster.js.html#l730"><code>src&#x2F;jquery.gridster.js:730</code></a>
+        <a href="..&#x2F;files&#x2F;src_jquery.gridster.js.html#l739"><code>src&#x2F;jquery.gridster.js:739</code></a>
         
         </p>
 
@@ -4435,7 +4442,7 @@ and col given.</p>
             
         
         
-        <a href="..&#x2F;files&#x2F;src_jquery.gridster.js.html#l810"><code>src&#x2F;jquery.gridster.js:810</code></a>
+        <a href="..&#x2F;files&#x2F;src_jquery.gridster.js.html#l819"><code>src&#x2F;jquery.gridster.js:819</code></a>
         
         </p>
 
@@ -4561,7 +4568,7 @@ else returns the jQuery HTMLElement
             
         
         
-        <a href="..&#x2F;files&#x2F;src_jquery.gridster.js.html#l835"><code>src&#x2F;jquery.gridster.js:835</code></a>
+        <a href="..&#x2F;files&#x2F;src_jquery.gridster.js.html#l844"><code>src&#x2F;jquery.gridster.js:844</code></a>
         
         </p>
 
@@ -4693,7 +4700,7 @@ params and if this is under the widget that is being dragged.</p>
             
         
         
-        <a href="..&#x2F;files&#x2F;src_jquery.gridster.js.html#l668"><code>src&#x2F;jquery.gridster.js:668</code></a>
+        <a href="..&#x2F;files&#x2F;src_jquery.gridster.js.html#l676"><code>src&#x2F;jquery.gridster.js:676</code></a>
         
         </p>
 
@@ -4704,7 +4711,8 @@ params and if this is under the widget that is being dragged.</p>
     </div>
 
     <div class="description">
-        <p>Sorts an Array of grid coords objects (representing the grid coords of each widget) in descending way.</p>
+        <p>Sorts an Array of grid coords objects (representing the grid coords of
+each widget) in descending way.</p>
     </div>
 
     
@@ -4834,7 +4842,7 @@ params and if this is under the widget that is being dragged.</p>
             
         
         
-        <a href="..&#x2F;files&#x2F;src_jquery.gridster.js.html#l1276"><code>src&#x2F;jquery.gridster.js:1276</code></a>
+        <a href="..&#x2F;files&#x2F;src_jquery.gridster.js.html#l1287"><code>src&#x2F;jquery.gridster.js:1287</code></a>
         
         </p>
 
@@ -4953,7 +4961,7 @@ params and if this is under the widget that is being dragged.</p>
             
         
         
-        <a href="..&#x2F;files&#x2F;src_jquery.gridster.js.html#l1187"><code>src&#x2F;jquery.gridster.js:1187</code></a>
+        <a href="..&#x2F;files&#x2F;src_jquery.gridster.js.html#l1198"><code>src&#x2F;jquery.gridster.js:1198</code></a>
         
         </p>
 
@@ -5065,7 +5073,7 @@ if they can.</p>
             
         
         
-        <a href="..&#x2F;files&#x2F;src_jquery.gridster.js.html#l1230"><code>src&#x2F;jquery.gridster.js:1230</code></a>
+        <a href="..&#x2F;files&#x2F;src_jquery.gridster.js.html#l1241"><code>src&#x2F;jquery.gridster.js:1241</code></a>
         
         </p>
 
@@ -5187,7 +5195,7 @@ if they can.</p>
             
         
         
-        <a href="..&#x2F;files&#x2F;src_jquery.gridster.js.html#l389"><code>src&#x2F;jquery.gridster.js:389</code></a>
+        <a href="..&#x2F;files&#x2F;src_jquery.gridster.js.html#l395"><code>src&#x2F;jquery.gridster.js:395</code></a>
         
         </p>
 
@@ -5300,7 +5308,7 @@ if they can.</p>
             
         
         
-        <a href="..&#x2F;files&#x2F;src_jquery.gridster.js.html#l466"><code>src&#x2F;jquery.gridster.js:466</code></a>
+        <a href="..&#x2F;files&#x2F;src_jquery.gridster.js.html#l472"><code>src&#x2F;jquery.gridster.js:472</code></a>
         
         </p>
 
@@ -5428,7 +5436,7 @@ overlapped or stops being overlapped.</p>
             
         
         
-        <a href="..&#x2F;files&#x2F;src_jquery.gridster.js.html#l506"><code>src&#x2F;jquery.gridster.js:506</code></a>
+        <a href="..&#x2F;files&#x2F;src_jquery.gridster.js.html#l512"><code>src&#x2F;jquery.gridster.js:512</code></a>
         
         </p>
 
@@ -5552,7 +5560,7 @@ overlapped or stops being overlapped.</p>
             
         
         
-        <a href="..&#x2F;files&#x2F;src_jquery.gridster.js.html#l342"><code>src&#x2F;jquery.gridster.js:342</code></a>
+        <a href="..&#x2F;files&#x2F;src_jquery.gridster.js.html#l346"><code>src&#x2F;jquery.gridster.js:346</code></a>
         
         </p>
 
@@ -5659,7 +5667,7 @@ overlapped or stops being overlapped.</p>
             
         
         
-        <a href="..&#x2F;files&#x2F;src_jquery.gridster.js.html#l1125"><code>src&#x2F;jquery.gridster.js:1125</code></a>
+        <a href="..&#x2F;files&#x2F;src_jquery.gridster.js.html#l1136"><code>src&#x2F;jquery.gridster.js:1136</code></a>
         
         </p>
 
@@ -5763,7 +5771,7 @@ overlapped or stops being overlapped.</p>
             
         
         
-        <a href="..&#x2F;files&#x2F;src_jquery.gridster.js.html#l1137"><code>src&#x2F;jquery.gridster.js:1137</code></a>
+        <a href="..&#x2F;files&#x2F;src_jquery.gridster.js.html#l1148"><code>src&#x2F;jquery.gridster.js:1148</code></a>
         
         </p>
 
@@ -5869,7 +5877,7 @@ overlapped or stops being overlapped.</p>
             
         
         
-        <a href="..&#x2F;files&#x2F;src_jquery.gridster.js.html#l415"><code>src&#x2F;jquery.gridster.js:415</code></a>
+        <a href="..&#x2F;files&#x2F;src_jquery.gridster.js.html#l421"><code>src&#x2F;jquery.gridster.js:421</code></a>
         
         </p>
 
@@ -5976,7 +5984,7 @@ overlapped or stops being overlapped.</p>
             
         
         
-        <a href="..&#x2F;files&#x2F;src_jquery.gridster.js.html#l1149"><code>src&#x2F;jquery.gridster.js:1149</code></a>
+        <a href="..&#x2F;files&#x2F;src_jquery.gridster.js.html#l1160"><code>src&#x2F;jquery.gridster.js:1160</code></a>
         
         </p>
 
@@ -6080,7 +6088,7 @@ overlapped or stops being overlapped.</p>
             
         
         
-        <a href="..&#x2F;files&#x2F;src_jquery.gridster.js.html#l1167"><code>src&#x2F;jquery.gridster.js:1167</code></a>
+        <a href="..&#x2F;files&#x2F;src_jquery.gridster.js.html#l1178"><code>src&#x2F;jquery.gridster.js:1178</code></a>
         
         </p>
 
@@ -6135,6 +6143,78 @@ overlapped or stops being overlapped.</p>
     
 
     
+</div>
+
+                
+                    <div id="method_recalculate_faux_grid" class="method item">
+    <h3 class="name"><code>recalculate_faux_grid</code></h3>
+
+    
+        <span class="paren">()</span>
+    
+
+    
+        <span class="returns-inline">
+            <span class="type">Object</span>
+        </span>
+    
+
+    
+
+    
+
+    
+
+    
+
+    
+
+    
+
+    <div class="meta">
+        
+            
+                
+                <p>
+                
+                Defined in
+                
+            
+        
+        
+        <a href="..&#x2F;files&#x2F;src_jquery.gridster.js.html#l1888"><code>src&#x2F;jquery.gridster.js:1888</code></a>
+        
+        </p>
+
+
+        
+
+        
+    </div>
+
+    <div class="description">
+        <p>Recalculates the offsets for the faux grid. You need to use it when
+the browser is resized.</p>
+    </div>
+
+    
+
+    
+        <div class="returns">
+            <h4>Returns:</h4>
+
+            <div class="returns-description">
+                
+                    
+                        <span class="type">Object</span>:
+                    
+                    Returns the instance of the Gridster class.
+                
+            </div>
+        </div>
+    
+
+    
 </div>
 
                 
@@ -6185,7 +6265,8 @@ overlapped or stops being overlapped.</p>
     </div>
 
     <div class="description">
-        <p>Creates the grid coords object representing the widget a add it to the mapped array of positions</p>
+        <p>Creates the grid coords object representing the widget a add it to the
+mapped array of positions.</p>
     </div>
 
     
@@ -6255,7 +6336,7 @@ overlapped or stops being overlapped.</p>
             
         
         
-        <a href="..&#x2F;files&#x2F;src_jquery.gridster.js.html#l279"><code>src&#x2F;jquery.gridster.js:279</code></a>
+        <a href="..&#x2F;files&#x2F;src_jquery.gridster.js.html#l280"><code>src&#x2F;jquery.gridster.js:280</code></a>
         
         </p>
 
@@ -6650,7 +6731,7 @@ overlapped or stops being overlapped.</p>
             
         
         
-        <a href="..&#x2F;files&#x2F;src_jquery.gridster.js.html#l1439"><code>src&#x2F;jquery.gridster.js:1439</code></a>
+        <a href="..&#x2F;files&#x2F;src_jquery.gridster.js.html#l1450"><code>src&#x2F;jquery.gridster.js:1450</code></a>
         
         </p>
 
@@ -6759,7 +6840,7 @@ overlapped or stops being overlapped.</p>
             
         
         
-        <a href="..&#x2F;files&#x2F;src_jquery.gridster.js.html#l1761"><code>src&#x2F;jquery.gridster.js:1761</code></a>
+        <a href="..&#x2F;files&#x2F;src_jquery.gridster.js.html#l1772"><code>src&#x2F;jquery.gridster.js:1772</code></a>
         
         </p>
 
@@ -6846,7 +6927,7 @@ overlapped or stops being overlapped.</p>
             
         
         
-        <a href="..&#x2F;files&#x2F;src_jquery.gridster.js.html#l874"><code>src&#x2F;jquery.gridster.js:874</code></a>
+        <a href="..&#x2F;files&#x2F;src_jquery.gridster.js.html#l883"><code>src&#x2F;jquery.gridster.js:883</code></a>
         
         </p>
 
@@ -6973,7 +7054,7 @@ overlapped or stops being overlapped.</p>
             
         
         
-        <a href="..&#x2F;files&#x2F;src_jquery.gridster.js.html#l542"><code>src&#x2F;jquery.gridster.js:542</code></a>
+        <a href="..&#x2F;files&#x2F;src_jquery.gridster.js.html#l548"><code>src&#x2F;jquery.gridster.js:548</code></a>
         
         </p>
 
@@ -7094,7 +7175,7 @@ overlapped or stops being overlapped.</p>
             
         
         
-        <a href="..&#x2F;files&#x2F;src_jquery.gridster.js.html#l631"><code>src&#x2F;jquery.gridster.js:631</code></a>
+        <a href="..&#x2F;files&#x2F;src_jquery.gridster.js.html#l637"><code>src&#x2F;jquery.gridster.js:637</code></a>
         
         </p>
 
@@ -7105,7 +7186,8 @@ overlapped or stops being overlapped.</p>
     </div>
 
     <div class="description">
-        <p>Sorts an Array of grid coords objects (representing the grid coords of each widget) in ascending way.</p>
+        <p>Sorts an Array of grid coords objects (representing the grid coords of
+each widget) in ascending way.</p>
     </div>
 
     
@@ -7198,7 +7280,7 @@ overlapped or stops being overlapped.</p>
             
         
         
-        <a href="..&#x2F;files&#x2F;src_jquery.gridster.js.html#l650"><code>src&#x2F;jquery.gridster.js:650</code></a>
+        <a href="..&#x2F;files&#x2F;src_jquery.gridster.js.html#l657"><code>src&#x2F;jquery.gridster.js:657</code></a>
         
         </p>
 
@@ -7209,7 +7291,8 @@ overlapped or stops being overlapped.</p>
     </div>
 
     <div class="description">
-        <p>Sorts an Array of grid coords objects (representing the grid coords of each widget) in descending way.</p>
+        <p>Sorts an Array of grid coords objects (representing the grid coords of
+each widget) in descending way.</p>
     </div>
 
     
@@ -7308,7 +7391,7 @@ overlapped or stops being overlapped.</p>
             
         
         
-        <a href="..&#x2F;files&#x2F;src_jquery.gridster.js.html#l258"><code>src&#x2F;jquery.gridster.js:258</code></a>
+        <a href="..&#x2F;files&#x2F;src_jquery.gridster.js.html#l259"><code>src&#x2F;jquery.gridster.js:259</code></a>
         
         </p>
 
@@ -7431,7 +7514,7 @@ the grid coords object passed in the <code>grid_data</code> param.</p>
             
         
         
-        <a href="..&#x2F;files&#x2F;src_jquery.gridster.js.html#l1410"><code>src&#x2F;jquery.gridster.js:1410</code></a>
+        <a href="..&#x2F;files&#x2F;src_jquery.gridster.js.html#l1421"><code>src&#x2F;jquery.gridster.js:1421</code></a>
         
         </p>
 
@@ -7535,7 +7618,7 @@ the grid coords object passed in the <code>grid_data</code> param.</p>
             
         
         
-        <a href="..&#x2F;files&#x2F;src_jquery.gridster.js.html#l595"><code>src&#x2F;jquery.gridster.js:595</code></a>
+        <a href="..&#x2F;files&#x2F;src_jquery.gridster.js.html#l601"><code>src&#x2F;jquery.gridster.js:601</code></a>
         
         </p>
 
diff --git a/docs/data.json b/docs/data.json
index 34457ba772..9b67032d55 100644
--- a/docs/data.json
+++ b/docs/data.json
@@ -123,7 +123,7 @@
             "plugin_for": [],
             "extension_for": [],
             "file": "src/jquery.gridster.js",
-            "line": 73,
+            "line": 70,
             "uses": [
                 "Coords",
                 "Collision"
@@ -142,19 +142,19 @@
                     "props": [
                         {
                             "name": "widget_selector",
-                            "description": "Define who will be the\n    draggable widgets. Can be a CSS Selector String or a collection of\n    HTMLElements",
+                            "description": "Define who will\n    be the draggable widgets. Can be a CSS Selector String or a\n    collection of HTMLElements",
                             "type": "HTMLElement|String",
                             "optional": true
                         },
                         {
                             "name": "widget_margins",
-                            "description": "Margin between widgets. The first\n    index for the horizontal margin (left, right) and the second\n    for the vertical margin (top, bottom).",
+                            "description": "Margin between widgets.\n    The first index for the horizontal margin (left, right) and\n    the second for the vertical margin (top, bottom).",
                             "type": "Array",
                             "optional": true
                         },
                         {
                             "name": "widget_base_dimensions",
-                            "description": "Base widget dimensions in\n    pixels. The first index for the width and the second for the\n    height.",
+                            "description": "Base widget dimensions\n    in pixels. The first index for the width and the second for the\n    height.",
                             "type": "Array",
                             "optional": true
                         },
@@ -296,7 +296,7 @@
         {
             "file": "src/jquery.gridster.js",
             "line": 231,
-            "description": "Creates the grid coords object representing the widget a add it to the mapped array of positions",
+            "description": "Creates the grid coords object representing the widget a add it to the\nmapped array of positions.",
             "itemtype": "method",
             "name": "register_widget",
             "return": {
@@ -307,7 +307,7 @@
         },
         {
             "file": "src/jquery.gridster.js",
-            "line": 258,
+            "line": 259,
             "description": "Update in the mapped array of positions the value of cells represented by\nthe grid coords object passed in the `grid_data` param.",
             "params": [
                 {
@@ -331,7 +331,7 @@
         },
         {
             "file": "src/jquery.gridster.js",
-            "line": 279,
+            "line": 280,
             "description": "Remove a widget from the mapped array of positions.",
             "itemtype": "method",
             "name": "remove_from_gridmap",
@@ -350,7 +350,7 @@
         },
         {
             "file": "src/jquery.gridster.js",
-            "line": 292,
+            "line": 293,
             "description": "Add a widget to the mapped array of positions.",
             "itemtype": "method",
             "name": "add_to_gridmap",
@@ -374,7 +374,7 @@
         },
         {
             "file": "src/jquery.gridster.js",
-            "line": 314,
+            "line": 315,
             "description": "Make widgets draggable. It Wraps the jQuery UI Draggable Plugin.",
             "itemtype": "method",
             "name": "draggable",
@@ -386,7 +386,7 @@
         },
         {
             "file": "src/jquery.gridster.js",
-            "line": 342,
+            "line": 346,
             "description": "This function is executed when the player begins to be dragged.",
             "itemtype": "method",
             "name": "on_start_drag",
@@ -406,7 +406,7 @@
         },
         {
             "file": "src/jquery.gridster.js",
-            "line": 389,
+            "line": 395,
             "description": "This function is executed when the player is being dragged.",
             "itemtype": "method",
             "name": "on_drag",
@@ -426,7 +426,7 @@
         },
         {
             "file": "src/jquery.gridster.js",
-            "line": 415,
+            "line": 421,
             "description": "This function is executed when the player stops being dragged.",
             "itemtype": "method",
             "name": "on_stop_drag",
@@ -446,7 +446,7 @@
         },
         {
             "file": "src/jquery.gridster.js",
-            "line": 466,
+            "line": 472,
             "description": "Executes the callbacks passed as arguments when a column begins to be\noverlapped or stops being overlapped.",
             "params": [
                 {
@@ -470,7 +470,7 @@
         },
         {
             "file": "src/jquery.gridster.js",
-            "line": 506,
+            "line": 512,
             "description": "Executes the callbacks passed as arguments when a row starts to be\noverlapped or stops being overlapped.",
             "params": [
                 {
@@ -494,7 +494,7 @@
         },
         {
             "file": "src/jquery.gridster.js",
-            "line": 542,
+            "line": 548,
             "description": "Sets the current position of the player",
             "params": [
                 {
@@ -518,7 +518,7 @@
         },
         {
             "file": "src/jquery.gridster.js",
-            "line": 595,
+            "line": 601,
             "description": "See which of the widgets in the $widgets param collection can go to\na upper row and which not.",
             "itemtype": "method",
             "name": "widgets_contraints",
@@ -537,8 +537,8 @@
         },
         {
             "file": "src/jquery.gridster.js",
-            "line": 631,
-            "description": "Sorts an Array of grid coords objects (representing the grid coords of each widget) in ascending way.",
+            "line": 637,
+            "description": "Sorts an Array of grid coords objects (representing the grid coords of\neach widget) in ascending way.",
             "itemtype": "method",
             "name": "sort_by_row_asc",
             "params": [
@@ -556,8 +556,8 @@
         },
         {
             "file": "src/jquery.gridster.js",
-            "line": 650,
-            "description": "Sorts an Array of grid coords objects (representing the grid coords of each widget) in descending way.",
+            "line": 657,
+            "description": "Sorts an Array of grid coords objects (representing the grid coords of\neach widget) in descending way.",
             "itemtype": "method",
             "name": "sort_by_row_desc",
             "params": [
@@ -575,8 +575,8 @@
         },
         {
             "file": "src/jquery.gridster.js",
-            "line": 668,
-            "description": "Sorts an Array of grid coords objects (representing the grid coords of each widget) in descending way.",
+            "line": 676,
+            "description": "Sorts an Array of grid coords objects (representing the grid coords of\neach widget) in descending way.",
             "itemtype": "method",
             "name": "manage_movements",
             "params": [
@@ -604,7 +604,7 @@
         },
         {
             "file": "src/jquery.gridster.js",
-            "line": 713,
+            "line": 722,
             "description": "Determines if there is a widget in the row and col given. Or if the\nHTMLElement passed as first argument is the player.",
             "itemtype": "method",
             "name": "is_player",
@@ -629,7 +629,7 @@
         },
         {
             "file": "src/jquery.gridster.js",
-            "line": 730,
+            "line": 739,
             "description": "Determines if the widget that is being dragged is currently over the row\nand col given.",
             "itemtype": "method",
             "name": "is_player_in",
@@ -653,7 +653,7 @@
         },
         {
             "file": "src/jquery.gridster.js",
-            "line": 745,
+            "line": 754,
             "description": "Determines if the placeholder is currently over the row and col given.",
             "itemtype": "method",
             "name": "is_placeholder_in",
@@ -677,7 +677,7 @@
         },
         {
             "file": "src/jquery.gridster.js",
-            "line": 759,
+            "line": 768,
             "description": "Determines if the placeholder is currently over the column given.",
             "itemtype": "method",
             "name": "is_placeholder_in_col",
@@ -696,7 +696,7 @@
         },
         {
             "file": "src/jquery.gridster.js",
-            "line": 771,
+            "line": 780,
             "description": "Determines if the cell represented by col and row params is empty.",
             "itemtype": "method",
             "name": "is_empty",
@@ -720,7 +720,7 @@
         },
         {
             "file": "src/jquery.gridster.js",
-            "line": 790,
+            "line": 799,
             "description": "Determines if the cell represented by col and row params is occupied.",
             "itemtype": "method",
             "name": "is_occupied",
@@ -744,7 +744,7 @@
         },
         {
             "file": "src/jquery.gridster.js",
-            "line": 810,
+            "line": 819,
             "description": "Determines if there is a widget in the cell represented by col/row params.",
             "itemtype": "method",
             "name": "is_widget",
@@ -768,7 +768,7 @@
         },
         {
             "file": "src/jquery.gridster.js",
-            "line": 835,
+            "line": 844,
             "description": "Determines if there is a widget in the cell represented by col/row\nparams and if this is under the widget that is being dragged.",
             "itemtype": "method",
             "name": "is_widget_under_player",
@@ -792,7 +792,7 @@
         },
         {
             "file": "src/jquery.gridster.js",
-            "line": 852,
+            "line": 861,
             "description": "Get widgets overlapping with the player.",
             "itemtype": "method",
             "name": "get_widgets_under_player",
@@ -804,7 +804,7 @@
         },
         {
             "file": "src/jquery.gridster.js",
-            "line": 874,
+            "line": 883,
             "description": "Put placeholder at the row and column specified.",
             "itemtype": "method",
             "name": "set_placeholder",
@@ -828,7 +828,7 @@
         },
         {
             "file": "src/jquery.gridster.js",
-            "line": 915,
+            "line": 925,
             "description": "Determines whether the player can move to a position above.",
             "itemtype": "method",
             "name": "can_go_player_up",
@@ -847,7 +847,7 @@
         },
         {
             "file": "src/jquery.gridster.js",
-            "line": 963,
+            "line": 974,
             "description": "Determines whether a widget can move to a position above.",
             "itemtype": "method",
             "name": "can_go_widget_up",
@@ -866,7 +866,7 @@
         },
         {
             "file": "src/jquery.gridster.js",
-            "line": 1014,
+            "line": 1025,
             "description": "Search a valid row for the widget represented by `widget_grid_data' in\nthe `upper_rows` array. Iteration starts from row specified in `min_row`.",
             "itemtype": "method",
             "name": "get_valid_rows",
@@ -895,7 +895,7 @@
         },
         {
             "file": "src/jquery.gridster.js",
-            "line": 1092,
+            "line": 1103,
             "description": "Get widgets overlapping with the player.",
             "itemtype": "method",
             "name": "get_widgets_overlapped",
@@ -907,7 +907,7 @@
         },
         {
             "file": "src/jquery.gridster.js",
-            "line": 1125,
+            "line": 1136,
             "description": "This callback is executed when the player begins to collide with a column.",
             "itemtype": "method",
             "name": "on_start_overlapping_column",
@@ -926,7 +926,7 @@
         },
         {
             "file": "src/jquery.gridster.js",
-            "line": 1137,
+            "line": 1148,
             "description": "A callback executed when the player begins to collide with a row.",
             "itemtype": "method",
             "name": "on_start_overlapping_row",
@@ -945,7 +945,7 @@
         },
         {
             "file": "src/jquery.gridster.js",
-            "line": 1149,
+            "line": 1160,
             "description": "A callback executed when the the player ends to collide with a column.",
             "itemtype": "method",
             "name": "on_stop_overlapping_column",
@@ -964,7 +964,7 @@
         },
         {
             "file": "src/jquery.gridster.js",
-            "line": 1167,
+            "line": 1178,
             "description": "This callback is executed when the player ends to collide with a row.",
             "itemtype": "method",
             "name": "on_stop_overlapping_row",
@@ -983,7 +983,7 @@
         },
         {
             "file": "src/jquery.gridster.js",
-            "line": 1187,
+            "line": 1198,
             "description": "Move a widget to a specific row. The cell or cells must be empty.\nIf the widget has widgets below, all of these widgets will be moved also\nif they can.",
             "itemtype": "method",
             "name": "move_widget_to",
@@ -1002,7 +1002,7 @@
         },
         {
             "file": "src/jquery.gridster.js",
-            "line": 1230,
+            "line": 1241,
             "description": "Move up the specified widget and all below it.",
             "itemtype": "method",
             "name": "move_widget_up",
@@ -1027,7 +1027,7 @@
         },
         {
             "file": "src/jquery.gridster.js",
-            "line": 1276,
+            "line": 1287,
             "description": "Move down the specified widget and all below it.",
             "itemtype": "method",
             "name": "move_widget_down",
@@ -1051,7 +1051,7 @@
         },
         {
             "file": "src/jquery.gridster.js",
-            "line": 1321,
+            "line": 1332,
             "description": "Check if the widget can move to the specified row, else returns the\nupper row possible.",
             "itemtype": "method",
             "name": "can_go_up_to_row",
@@ -1080,7 +1080,7 @@
         },
         {
             "file": "src/jquery.gridster.js",
-            "line": 1410,
+            "line": 1421,
             "description": "Get widgets below a widget.",
             "itemtype": "method",
             "name": "widgets_below",
@@ -1099,7 +1099,7 @@
         },
         {
             "file": "src/jquery.gridster.js",
-            "line": 1439,
+            "line": 1450,
             "description": "Update the array of mapped positions with the new player position.",
             "itemtype": "method",
             "name": "set_cells_player_occupies",
@@ -1123,7 +1123,7 @@
         },
         {
             "file": "src/jquery.gridster.js",
-            "line": 1456,
+            "line": 1467,
             "description": "Remove from the array of mapped positions the reference to the player.",
             "itemtype": "method",
             "name": "empty_cells_player_occupies",
@@ -1135,7 +1135,7 @@
         },
         {
             "file": "src/jquery.gridster.js",
-            "line": 1493,
+            "line": 1504,
             "description": "Check if it's possible to move a widget to a specific col/row. It takes\ninto account the dimensions (`size_y` and `size_x` attrs. of the grid coords\n object) the widget occupies.",
             "itemtype": "method",
             "name": "can_move_to",
@@ -1164,7 +1164,7 @@
         },
         {
             "file": "src/jquery.gridster.js",
-            "line": 1528,
+            "line": 1539,
             "description": "Given the leftmost column returns all columns that are overlapping with the player.",
             "itemtype": "method",
             "name": "get_targeted_columns",
@@ -1184,7 +1184,7 @@
         },
         {
             "file": "src/jquery.gridster.js",
-            "line": 1546,
+            "line": 1557,
             "description": "Given the upper row returns all rows that are overlapping with the player.",
             "itemtype": "method",
             "name": "get_targeted_rows",
@@ -1204,7 +1204,7 @@
         },
         {
             "file": "src/jquery.gridster.js",
-            "line": 1563,
+            "line": 1574,
             "description": "Get all columns and rows that a widget occupies.",
             "itemtype": "method",
             "name": "get_cells_occupied",
@@ -1223,7 +1223,7 @@
         },
         {
             "file": "src/jquery.gridster.js",
-            "line": 1591,
+            "line": 1602,
             "description": "Iterate over the cells occupied by a widget executing a function for\neach one.",
             "itemtype": "method",
             "name": "for_each_cell_occupied",
@@ -1247,7 +1247,7 @@
         },
         {
             "file": "src/jquery.gridster.js",
-            "line": 1612,
+            "line": 1623,
             "description": "Iterate over the columns occupied by a widget executing a function for\neach one.",
             "itemtype": "method",
             "name": "for_each_column_occupied",
@@ -1271,7 +1271,7 @@
         },
         {
             "file": "src/jquery.gridster.js",
-            "line": 1631,
+            "line": 1642,
             "description": "Iterate over the rows occupied by a widget executing a function for\neach one.",
             "itemtype": "method",
             "name": "for_each_row_occupied",
@@ -1295,7 +1295,7 @@
         },
         {
             "file": "src/jquery.gridster.js",
-            "line": 1697,
+            "line": 1708,
             "description": "Iterate over each widget above the column and row specified.",
             "itemtype": "method",
             "name": "for_each_widget_above",
@@ -1324,7 +1324,7 @@
         },
         {
             "file": "src/jquery.gridster.js",
-            "line": 1713,
+            "line": 1724,
             "description": "Iterate over each widget below the column and row specified.",
             "itemtype": "method",
             "name": "for_each_widget_below",
@@ -1353,7 +1353,7 @@
         },
         {
             "file": "src/jquery.gridster.js",
-            "line": 1729,
+            "line": 1740,
             "description": "Returns the highest occupied cell in the grid.",
             "itemtype": "method",
             "name": "get_highest_occupied_cell",
@@ -1365,7 +1365,7 @@
         },
         {
             "file": "src/jquery.gridster.js",
-            "line": 1761,
+            "line": 1772,
             "description": "Set the current height of the parent grid.",
             "itemtype": "method",
             "name": "set_dom_grid_height",
@@ -1377,7 +1377,7 @@
         },
         {
             "file": "src/jquery.gridster.js",
-            "line": 1774,
+            "line": 1785,
             "description": "It generates the neccessary styles to position the widgets.",
             "itemtype": "method",
             "name": "generate_stylesheet",
@@ -1401,7 +1401,7 @@
         },
         {
             "file": "src/jquery.gridster.js",
-            "line": 1818,
+            "line": 1829,
             "description": "Injects the given CSS as string to the head of the document.",
             "itemtype": "method",
             "name": "add_style_tag",
@@ -1420,7 +1420,7 @@
         },
         {
             "file": "src/jquery.gridster.js",
-            "line": 1841,
+            "line": 1852,
             "description": "Generates a faux grid to collide with it when a widget is dragged and\ndetect row or column that we want to go.",
             "itemtype": "method",
             "name": "generate_faux_grid",
@@ -1444,7 +1444,19 @@
         },
         {
             "file": "src/jquery.gridster.js",
-            "line": 1877,
+            "line": 1888,
+            "description": "Recalculates the offsets for the faux grid. You need to use it when\nthe browser is resized.",
+            "itemtype": "method",
+            "name": "recalculate_faux_grid",
+            "return": {
+                "description": "Returns the instance of the Gridster class.",
+                "type": "Object"
+            },
+            "class": "Gridster"
+        },
+        {
+            "file": "src/jquery.gridster.js",
+            "line": 1912,
             "description": "Get all widgets in the DOM and register them.",
             "itemtype": "method",
             "name": "get_widgets_from_DOM",
@@ -1456,7 +1468,7 @@
         },
         {
             "file": "src/jquery.gridster.js",
-            "line": 1891,
+            "line": 1926,
             "description": "Calculate columns and rows to be set based on the configuration\n parameters, grid dimensions, etc ...",
             "itemtype": "method",
             "name": "generate_grid_and_stylesheet",
diff --git a/docs/files/src_jquery.coords.js.html b/docs/files/src_jquery.coords.js.html
index c393a1c25c..0b0b63e7bc 100644
--- a/docs/files/src_jquery.coords.js.html
+++ b/docs/files/src_jquery.coords.js.html
@@ -127,7 +127,7 @@
         this.original_coords = this.get();
     };
 
-    fn.set = function(update) {
+    fn.set = function() {
         var el = this.el;
         if (el) {
             this.data = el.offset();
@@ -159,7 +159,7 @@
             var new_data = $.extend(this.data, data);
             this.data = new_data;
         }
-        this.set(true);
+        this.set();
         return this;
     };
 
diff --git a/docs/files/src_jquery.gridster.js.html b/docs/files/src_jquery.gridster.js.html
index ffaf88dc33..3f02ab798b 100644
--- a/docs/files/src_jquery.gridster.js.html
+++ b/docs/files/src_jquery.gridster.js.html
@@ -115,12 +115,8 @@
                 row: wgd.row
             };
         },
-        collision: {
-            on_overlap: function(coords) {}
-        },
-        draggable: {
-
-        }
+        collision: {},
+        draggable: {}
     };
 
 
@@ -142,7 +138,8 @@
 
     var throttle = function(func, wait) {
         var context, args, timeout, throttling, more, result;
-        var whenDone = debounce(function(){ more = throttling = false; }, wait, true);
+        var whenDone = debounce(
+            function(){ more = throttling = false; }, wait, true);
         return function() {
           context = this; args = arguments;
           var later = function() {
@@ -170,14 +167,14 @@
     * @param {HTMLElement} el The HTMLelement that contains all the widgets.
     * @param {Object} [options] An Object with all options you want to
     *        overwrite:
-    *    @param {HTMLElement|String} [options.widget_selector] Define who will be the
-    *     draggable widgets. Can be a CSS Selector String or a collection of
-    *     HTMLElements
-    *    @param {Array} [options.widget_margins] Margin between widgets. The first
-    *     index for the horizontal margin (left, right) and the second
-    *     for the vertical margin (top, bottom).
-    *    @param {Array} [options.widget_base_dimensions] Base widget dimensions in
-    *     pixels. The first index for the width and the second for the
+    *    @param {HTMLElement|String} [options.widget_selector] Define who will
+    *     be the draggable widgets. Can be a CSS Selector String or a
+    *     collection of HTMLElements
+    *    @param {Array} [options.widget_margins] Margin between widgets.
+    *     The first index for the horizontal margin (left, right) and
+    *     the second for the vertical margin (top, bottom).
+    *    @param {Array} [options.widget_base_dimensions] Base widget dimensions
+    *     in pixels. The first index for the width and the second for the
     *     height.
     *    @param {Number} [options.extra_cols] Add more columns in addition to
     *     those that have been calculated.
@@ -227,6 +224,9 @@
       this.set_dom_grid_height();
       this.$wrapper.addClass(&#x27;ready&#x27;);
       this.draggable();
+
+      $(window).bind(
+        &#x27;resize&#x27;, throttle($.proxy(this.recalculate_faux_grid, this), 200));
     };
 
 
@@ -322,7 +322,8 @@
 
 
     &#x2F;**
-    * Creates the grid coords object representing the widget a add it to the mapped array of positions
+    * Creates the grid coords object representing the widget a add it to the
+    * mapped array of positions.
     *
     * @method register_widget
     * @return {Array} Returns the instance of the Gridster class.
@@ -416,6 +417,9 @@
             &#x2F;&#x2F; containment : this.$wrapper,
             start: function(event, ui) {
                 self.$player = $(this);
+                self.$helper = self.options.draggable.helper === &#x27;clone&#x27; ?
+                    $(ui.helper) : self.$player;
+
                 self.on_start_drag.call(self, event, ui);
             },
             stop: function(event, ui) {
@@ -446,7 +450,6 @@
         this.player_grid_data = this.$player.coords().grid;
         this.placeholder_grid_data = $.extend({}, this.player_grid_data);
 
-
         &#x2F;&#x2F;set new grid height along the dragging period
         this.$el.css(&#x27;height&#x27;, this.$el.height() +
           (this.player_grid_data.size_y * this.min_widget_height));
@@ -454,14 +457,17 @@
         var colliders = this.faux_grid;
         var coords = this.$player.data(&#x27;coords&#x27;).coords;
 
-        this.cells_occupied_by_player = this.get_cells_occupied(this.player_grid_data);
-        this.cells_occupied_by_placeholder = this.get_cells_occupied(this.placeholder_grid_data);
+        this.cells_occupied_by_player = this.get_cells_occupied(
+            this.player_grid_data);
+        this.cells_occupied_by_placeholder = this.get_cells_occupied(
+            this.placeholder_grid_data);
 
         this.last_cols = [];
         this.last_rows = [];
 
         &#x2F;&#x2F; see jquery.collision.js
-        this.drag_api = this.$player.collision(colliders, this.options.collision);
+        this.drag_api = this.$helper.collision(
+            colliders, this.options.collision);
 
         this.$preview_holder = $(&#x27;&lt;li &#x2F;&gt;&#x27;, {
               &#x27;class&#x27;: &#x27;preview-holder&#x27;,
@@ -526,7 +532,7 @@
             this.on_stop_overlapping_row
         );
 
-        this.$player.attr({
+        this.$player.add(this.$helper).attr({
             &#x27;data-col&#x27;: this.placeholder_grid_data.col,
             &#x27;data-row&#x27;: this.placeholder_grid_data.row
         }).css({
@@ -722,7 +728,8 @@
 
 
     &#x2F;**
-    * Sorts an Array of grid coords objects (representing the grid coords of each widget) in ascending way.
+    * Sorts an Array of grid coords objects (representing the grid coords of
+    * each widget) in ascending way.
     *
     * @method sort_by_row_asc
     * @param {Array} widgets Array of grid coords objects
@@ -741,7 +748,8 @@
 
 
     &#x2F;**
-    * Sorts an Array of grid coords objects (representing the grid coords of each widget) in descending way.
+    * Sorts an Array of grid coords objects (representing the grid coords of
+    * each widget) in descending way.
     *
     * @method sort_by_row_desc
     * @param {Array} widgets Array of grid coords objects
@@ -759,7 +767,8 @@
 
 
     &#x2F;**
-    * Sorts an Array of grid coords objects (representing the grid coords of each widget) in descending way.
+    * Sorts an Array of grid coords objects (representing the grid coords of
+    * each widget) in descending way.
     *
     * @method manage_movements
     * @param {HTMLElements} $widgets A jQuery collection of HTMLElements
@@ -816,7 +825,7 @@
     fn.is_player = function(col_or_el, row) {
         if (row &amp;&amp; !this.gridmap[col_or_el]) { return false; }
         var $w = row ? this.gridmap[col_or_el][row] : col_or_el;
-        return $w &amp;&amp; $w.is(this.$player);
+        return $w &amp;&amp; ($w.is(this.$player) || $w.is(this.$helper));
     };
 
 
@@ -998,7 +1007,8 @@
 
         if (moved_down || changed_column) {
             $nexts.each($.proxy(function(i, widget){
-                this.move_widget_up( $(widget) , this.placeholder_grid_data.col - col + phgd.size_y );
+                this.move_widget_up(
+                    $(widget), this.placeholder_grid_data.col - col + phgd.size_y);
             }, this));
         }
 
@@ -1030,7 +1040,8 @@
 
             while (--r &gt; 0){
                 if (this.is_empty(tcol, r) || this.is_player(tcol, r) ||
-                    this.is_widget(tcol, r) &amp;&amp; grid_col[r].is($widgets_under_player)
+                    this.is_widget(tcol, r) &amp;&amp;
+                    grid_col[r].is($widgets_under_player)
                 ) {
                     upper_rows[tcol].push(r);
                     min_row = r &lt; min_row ? r : min_row;
@@ -1945,7 +1956,6 @@
         this.gridmap = [];
         var col;
         var row;
-
         for (col = cols; col &gt; 0; col--) {
             this.gridmap[col] = [];
             for (row = rows; row &gt; 0; row--) {
@@ -1967,6 +1977,31 @@
         return this;
     };
 
+
+    &#x2F;**
+    * Recalculates the offsets for the faux grid. You need to use it when
+    * the browser is resized.
+    *
+    * @method recalculate_faux_grid
+    * @return {Object} Returns the instance of the Gridster class.
+    *&#x2F;
+    fn.recalculate_faux_grid = function() {
+        var aw = this.$wrapper.width();
+        this.baseX = ($(window).width() - aw) &#x2F; 2;
+        this.baseY = this.$wrapper.offset().top;
+
+        $.each(this.faux_grid, $.proxy(function(i, coords){
+            this.faux_grid[i] = coords.update({
+                left: this.baseX + (coords.data.col -1) * this.min_widget_width,
+                top: this.baseY + (coords.data.row -1) * this.min_widget_height
+            });
+
+        }, this));
+
+        return this;
+    };
+
+
     &#x2F;**
     * Get all widgets in the DOM and register them.
     *
@@ -1989,13 +2024,12 @@
     * @return {Object} Returns the instance of the Gridster class.
     *&#x2F;
     fn.generate_grid_and_stylesheet = function() {
-        var grid_width;
         var aw = this.$wrapper.width();
         var ah = this.$wrapper.height();
 
-        var cols = Math.floor(aw&#x2F;this.min_widget_width) +
+        var cols = Math.floor(aw &#x2F; this.min_widget_width) +
                    this.options.extra_cols;
-        var rows = Math.floor(ah&#x2F;this.min_widget_height) +
+        var rows = Math.floor(ah &#x2F; this.min_widget_height) +
                    this.options.extra_rows;
 
         var actual_cols = this.$widgets.map(function() {
@@ -2011,18 +2045,16 @@
 
         cols = Math.max(min_cols, cols, this.options.min_cols);
         rows = Math.max(min_rows, rows, this.options.min_rows);
-        grid_width = cols * (this.options.widget_base_dimensions[0] +
-                         (this.options.widget_margins[0] * 2));
 
         &#x2F;&#x2F;this.support_grid_width = cols * this.min_widget_width;
-        this.support_grid_width = this.wrapper_width;
+        &#x2F;&#x2F; this.support_grid_width = this.wrapper_width;
 
-        this.support_grid_height = rows * this.min_widget_height;
-        this.baseX = ($(window).width() - this.support_grid_width) &#x2F; 2;
+        &#x2F;&#x2F; this.support_grid_height = rows * this.min_widget_height;
+        this.baseX = ($(window).width() - aw) &#x2F; 2;
         this.baseY = this.$wrapper.offset().top;
 
         &#x2F;&#x2F;this.baseX = 0;
-        if(this.options.autogenerate_stylesheet) {
+        if (this.options.autogenerate_stylesheet) {
             this.generate_stylesheet(rows, cols);
         }