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.y1b.y1&&a.y2b.cx&&a.x1b.x1&&a.x2 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("
  • ",{"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;gb.row?1:-1}),a},i.sort_by_row_desc=function(a){return a=a.sort(function(a,b){return a.row+a.size_y=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.row0)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=h0){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=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;d0&&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;i0?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;c0&&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=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;i0;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.y1b.y1&&a.y2b.cx&&a.x1b.x1&&a.x2 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("
  • ",{"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;gb.row?1:-1}),a},i.sort_by_row_desc=function(a){return a=a.sort(function(a,b){return a.row+a.size_y=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.row0)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=h0){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=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;d0&&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;i0?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;c0&&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=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;i0;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 @@ @@ -172,7 +172,7 @@ - src/jquery.gridster.js:73 + src/jquery.gridster.js:70

    @@ -232,9 +232,9 @@
    -

    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

    @@ -248,9 +248,9 @@
    -

    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).

    @@ -264,8 +264,8 @@
    -

    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.

    @@ -756,6 +756,13 @@ +
  • + +
  • + recalculate_faux_grid + + +
  • @@ -918,7 +925,7 @@ - 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 insrc/jquery.gridster.js:1877 + src/jquery.gridster.js:1912

    @@ -3544,7 +3551,7 @@ theupperrowsarray. Iteration starts from row specified insrc/jquery.gridster.js:1092 + src/jquery.gridster.js:1103

    @@ -3615,7 +3622,7 @@ theupperrowsarray. Iteration starts from row specified insrc/jquery.gridster.js:852 + src/jquery.gridster.js:861

    @@ -3702,7 +3709,7 @@ theupperrowsarray. Iteration starts from row specified insrc/jquery.gridster.js:771 + src/jquery.gridster.js:780

    @@ -3827,7 +3834,7 @@ theupperrowsarray. Iteration starts from row specified insrc/jquery.gridster.js:790 + src/jquery.gridster.js:799

    @@ -3952,7 +3959,7 @@ theupperrowsarray. Iteration starts from row specified insrc/jquery.gridster.js:745 + src/jquery.gridster.js:754

    @@ -4071,7 +4078,7 @@ theupperrowsarray. Iteration starts from row specified insrc/jquery.gridster.js:759 + src/jquery.gridster.js:768

    @@ -4181,7 +4188,7 @@ theupperrowsarray. Iteration starts from row specified insrc/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.

    @@ -4834,7 +4842,7 @@ params and if this is under the widget that is being dragged.

    - 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

    + + + () + + + + + Object + + + + + + + + + + + + + + + +
    + + + +

    + + Defined in + + + + + src/jquery.gridster.js:1888 + +

    + + + + + +
    + +
    +

    Recalculates the offsets for the faux grid. You need to use it when +the browser is resized.

    +
    + + + + +
    +

    Returns:

    + +
    + + + Object: + + Returns the instance of the Gridster class. + +
    +
    + + +
    @@ -6185,7 +6265,8 @@ overlapped or stops being overlapped.

    -

    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.

    @@ -6255,7 +6336,7 @@ overlapped or stops being overlapped.

    - 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.

    @@ -7198,7 +7280,7 @@ overlapped or stops being overlapped.

    - 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.

    @@ -7308,7 +7391,7 @@ overlapped or stops being overlapped.

    - 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); }