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.y1src/jquery.gridster.js:73
+ Defined in: src/jquery.gridster.js:70
src/jquery.gridster.js:73
+ src/jquery.gridster.js:70
Define who will be the - draggable widgets. Can be a CSS Selector String or a collection of - HTMLElements
+Define who will + be the draggable widgets. Can be a CSS Selector String or a + collection of HTMLElements
Margin between widgets. The first - index for the horizontal margin (left, right) and the second - for the vertical margin (top, bottom).
+Margin between widgets. + The first index for the horizontal margin (left, right) and + the second for the vertical margin (top, bottom).
Base widget dimensions in - pixels. The first index for the width and the second for the +
Base widget dimensions + in pixels. The first index for the width and the second for the height.
src/jquery.gridster.js:1818
+ src/jquery.gridster.js:1829
@@ -1028,7 +1035,7 @@
- src/jquery.gridster.js:292
+ src/jquery.gridster.js:293
@@ -1296,7 +1303,7 @@
- src/jquery.gridster.js:915
+ src/jquery.gridster.js:925
@@ -1414,7 +1421,7 @@
- src/jquery.gridster.js:1321
+ src/jquery.gridster.js:1332
@@ -1551,7 +1558,7 @@ upper row possible.
- src/jquery.gridster.js:963
+ src/jquery.gridster.js:974
@@ -1669,7 +1676,7 @@ upper row possible.
- src/jquery.gridster.js:1493
+ src/jquery.gridster.js:1504
@@ -1796,7 +1803,7 @@ into account the dimensions (size_y
and size_x
attrs.
- src/jquery.gridster.js:314
+ src/jquery.gridster.js:315
@@ -1867,7 +1874,7 @@ into account the dimensions (size_y
and size_x
attrs.
- src/jquery.gridster.js:1456
+ src/jquery.gridster.js:1467
@@ -1954,7 +1961,7 @@ into account the dimensions (size_y
and size_x
attrs.
- src/jquery.gridster.js:1591
+ src/jquery.gridster.js:1602
@@ -2082,7 +2089,7 @@ each one.
- src/jquery.gridster.js:1612
+ src/jquery.gridster.js:1623
@@ -2210,7 +2217,7 @@ each one.
- src/jquery.gridster.js:1631
+ src/jquery.gridster.js:1642
@@ -2343,7 +2350,7 @@ each one.
- src/jquery.gridster.js:1697
+ src/jquery.gridster.js:1708
@@ -2490,7 +2497,7 @@ iteration. The value of this
inside the function is the jQuery wrap
- src/jquery.gridster.js:1713
+ src/jquery.gridster.js:1724
@@ -2631,7 +2638,7 @@ iteration. The value of this
inside the function is the jQuery wrap
- src/jquery.gridster.js:1841
+ src/jquery.gridster.js:1852
@@ -2741,7 +2748,7 @@ detect row or column that we want to go.
- src/jquery.gridster.js:1891
+ src/jquery.gridster.js:1926
@@ -2829,7 +2836,7 @@ detect row or column that we want to go.
- src/jquery.gridster.js:1774
+ src/jquery.gridster.js:1785
@@ -2948,7 +2955,7 @@ detect row or column that we want to go.
- src/jquery.gridster.js:1563
+ src/jquery.gridster.js:1574
@@ -3042,7 +3049,7 @@ detect row or column that we want to go.
- src/jquery.gridster.js:1729
+ src/jquery.gridster.js:1740
@@ -3123,7 +3130,7 @@ detect row or column that we want to go.
- src/jquery.gridster.js:1528
+ src/jquery.gridster.js:1539
@@ -3228,7 +3235,7 @@ detect row or column that we want to go.
- src/jquery.gridster.js:1546
+ src/jquery.gridster.js:1557
@@ -3345,7 +3352,7 @@ detect row or column that we want to go.
- src/jquery.gridster.js:1014
+ src/jquery.gridster.js:1025
@@ -3473,7 +3480,7 @@ theupperrowsarray. Iteration starts from row specified in
src/jquery.gridster.js:1877
+ src/jquery.gridster.js:1912
@@ -3544,7 +3551,7 @@ theupperrowsarray. Iteration starts from row specified in
src/jquery.gridster.js:1092
+ src/jquery.gridster.js:1103
@@ -3615,7 +3622,7 @@ theupperrowsarray. Iteration starts from row specified in
src/jquery.gridster.js:852
+ src/jquery.gridster.js:861
@@ -3702,7 +3709,7 @@ theupperrowsarray. Iteration starts from row specified in
src/jquery.gridster.js:771
+ src/jquery.gridster.js:780
@@ -3827,7 +3834,7 @@ theupperrowsarray. Iteration starts from row specified in
src/jquery.gridster.js:790
+ src/jquery.gridster.js:799
@@ -3952,7 +3959,7 @@ theupperrowsarray. Iteration starts from row specified in
src/jquery.gridster.js:745
+ src/jquery.gridster.js:754
@@ -4071,7 +4078,7 @@ theupperrowsarray. Iteration starts from row specified in
src/jquery.gridster.js:759
+ src/jquery.gridster.js:768
@@ -4181,7 +4188,7 @@ theupperrowsarray. Iteration starts from row specified in
src/jquery.gridster.js:713
+ src/jquery.gridster.js:722
@@ -4309,7 +4316,7 @@ HTMLElements.
- src/jquery.gridster.js:730
+ src/jquery.gridster.js:739
@@ -4435,7 +4442,7 @@ and col given.
- src/jquery.gridster.js:810
+ src/jquery.gridster.js:819
@@ -4561,7 +4568,7 @@ else returns the jQuery HTMLElement
- src/jquery.gridster.js:835
+ src/jquery.gridster.js:844
@@ -4693,7 +4700,7 @@ params and if this is under the widget that is being dragged.
- src/jquery.gridster.js:668
+ src/jquery.gridster.js:676
@@ -4704,7 +4711,8 @@ params and if this is under the widget that is being dragged.
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.
src/jquery.gridster.js:1276
+ src/jquery.gridster.js:1287
@@ -4953,7 +4961,7 @@ params and if this is under the widget that is being dragged.
- src/jquery.gridster.js:1187
+ src/jquery.gridster.js:1198
@@ -5065,7 +5073,7 @@ if they can.
- src/jquery.gridster.js:1230
+ src/jquery.gridster.js:1241
@@ -5187,7 +5195,7 @@ if they can.
- src/jquery.gridster.js:389
+ src/jquery.gridster.js:395
@@ -5300,7 +5308,7 @@ if they can.
- src/jquery.gridster.js:466
+ src/jquery.gridster.js:472
@@ -5428,7 +5436,7 @@ overlapped or stops being overlapped.
- src/jquery.gridster.js:506
+ src/jquery.gridster.js:512
@@ -5552,7 +5560,7 @@ overlapped or stops being overlapped.
- src/jquery.gridster.js:342
+ src/jquery.gridster.js:346
@@ -5659,7 +5667,7 @@ overlapped or stops being overlapped.
- src/jquery.gridster.js:1125
+ src/jquery.gridster.js:1136
@@ -5763,7 +5771,7 @@ overlapped or stops being overlapped.
- src/jquery.gridster.js:1137
+ src/jquery.gridster.js:1148
@@ -5869,7 +5877,7 @@ overlapped or stops being overlapped.
- src/jquery.gridster.js:415
+ src/jquery.gridster.js:421
@@ -5976,7 +5984,7 @@ overlapped or stops being overlapped.
- src/jquery.gridster.js:1149
+ src/jquery.gridster.js:1160
@@ -6080,7 +6088,7 @@ overlapped or stops being overlapped.
- src/jquery.gridster.js:1167
+ src/jquery.gridster.js:1178
@@ -6135,6 +6143,78 @@ overlapped or stops being overlapped.
+
+
+
+ recalculate_faux_grid
Recalculates the offsets for the faux grid. You need to use it when +the browser is resized.
+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.
src/jquery.gridster.js:279
+ src/jquery.gridster.js:280
@@ -6650,7 +6731,7 @@ overlapped or stops being overlapped.
- src/jquery.gridster.js:1439
+ src/jquery.gridster.js:1450
@@ -6759,7 +6840,7 @@ overlapped or stops being overlapped.
- src/jquery.gridster.js:1761
+ src/jquery.gridster.js:1772
@@ -6846,7 +6927,7 @@ overlapped or stops being overlapped.
- src/jquery.gridster.js:874
+ src/jquery.gridster.js:883
@@ -6973,7 +7054,7 @@ overlapped or stops being overlapped.
- src/jquery.gridster.js:542
+ src/jquery.gridster.js:548
@@ -7094,7 +7175,7 @@ overlapped or stops being overlapped.
- src/jquery.gridster.js:631
+ src/jquery.gridster.js:637
@@ -7105,7 +7186,8 @@ overlapped or stops being overlapped.
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.
src/jquery.gridster.js:650
+ src/jquery.gridster.js:657
@@ -7209,7 +7291,8 @@ overlapped or stops being overlapped.
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.
src/jquery.gridster.js:258
+ src/jquery.gridster.js:259
@@ -7431,7 +7514,7 @@ the grid coords object passed in the grid_data
param.
- src/jquery.gridster.js:1410
+ src/jquery.gridster.js:1421
@@ -7535,7 +7618,7 @@ the grid coords object passed in the grid_data
param.
- src/jquery.gridster.js:595
+ src/jquery.gridster.js:601
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('ready');
this.draggable();
+
+ $(window).bind(
+ 'resize', throttle($.proxy(this.recalculate_faux_grid, this), 200));
};
@@ -322,7 +322,8 @@
/**
- * 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 @@
// containment : this.$wrapper,
start: function(event, ui) {
self.$player = $(this);
+ self.$helper = self.options.draggable.helper === 'clone' ?
+ $(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);
-
//set new grid height along the dragging period
this.$el.css('height', 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('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.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 = [];
// 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 = $('<li />', {
'class': 'preview-holder',
@@ -526,7 +532,7 @@
this.on_stop_overlapping_row
);
- this.$player.attr({
+ this.$player.add(this.$helper).attr({
'data-col': this.placeholder_grid_data.col,
'data-row': this.placeholder_grid_data.row
}).css({
@@ -722,7 +728,8 @@
/**
- * 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 @@
/**
- * 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 @@
/**
- * 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 && !this.gridmap[col_or_el]) { return false; }
var $w = row ? this.gridmap[col_or_el][row] : col_or_el;
- return $w && $w.is(this.$player);
+ return $w && ($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 > 0){
if (this.is_empty(tcol, r) || this.is_player(tcol, r) ||
- this.is_widget(tcol, r) && grid_col[r].is($widgets_under_player)
+ this.is_widget(tcol, r) &&
+ grid_col[r].is($widgets_under_player)
) {
upper_rows[tcol].push(r);
min_row = r < min_row ? r : min_row;
@@ -1945,7 +1956,6 @@
this.gridmap = [];
var col;
var row;
-
for (col = cols; col > 0; col--) {
this.gridmap[col] = [];
for (row = rows; row > 0; row--) {
@@ -1967,6 +1977,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.
*
@@ -1989,13 +2024,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() {
@@ -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));
//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);
}