From 8ec307b6f7173e94610409adcb1671372cc2c67d Mon Sep 17 00:00:00 2001 From: vieron Date: Tue, 24 Jun 2014 23:14:07 +0200 Subject: [PATCH] feat(gridster): move widget up when added if there is space available --- src/jquery.gridster.js | 62 ++++++++++++++++++++++++++++++++---------- 1 file changed, 48 insertions(+), 14 deletions(-) diff --git a/src/jquery.gridster.js b/src/jquery.gridster.js index aa1baaaaa..6ab0fbfe6 100755 --- a/src/jquery.gridster.js +++ b/src/jquery.gridster.js @@ -791,24 +791,47 @@ /** - * Creates the grid coords object representing the widget a add it to the + * Convert widgets from DOM elements to "widget grid data" Objects. + * + * @method dom_to_coords + * @param {HTMLElement} $widget The widget to be converted. + */ + fn.dom_to_coords = function($widget) { + return { + 'col': parseInt($widget.attr('data-col'), 10), + 'row': parseInt($widget.attr('data-row'), 10), + 'size_x': parseInt($widget.attr('data-sizex'), 10) || 1, + 'size_y': parseInt($widget.attr('data-sizey'), 10) || 1, + 'max_size_x': parseInt($widget.attr('data-max-sizex'), 10) || false, + 'max_size_y': parseInt($widget.attr('data-max-sizey'), 10) || false, + 'min_size_x': parseInt($widget.attr('data-min-sizex'), 10) || false, + 'min_size_y': parseInt($widget.attr('data-min-sizey'), 10) || false, + 'el': $widget + }; + }; + + + /** + * Creates the grid coords object representing the widget an add it to the * mapped array of positions. * * @method register_widget - * @return {Array} Returns the instance of the Gridster class. + * @param {HTMLElement|Object} $el jQuery wrapped HTMLElement representing + * the widget, or an "widget grid data" Object with (col, row, el ...). + * @return {Boolean} Returns true if the widget final position is different + * than the original. */ fn.register_widget = function($el) { - var wgd = { - 'col': parseInt($el.attr('data-col'), 10), - 'row': parseInt($el.attr('data-row'), 10), - 'size_x': parseInt($el.attr('data-sizex'), 10), - 'size_y': parseInt($el.attr('data-sizey'), 10), - 'max_size_x': parseInt($el.attr('data-max-sizex'), 10) || false, - 'max_size_y': parseInt($el.attr('data-max-sizey'), 10) || false, - 'min_size_x': parseInt($el.attr('data-min-sizex'), 10) || false, - 'min_size_y': parseInt($el.attr('data-min-sizey'), 10) || false, - 'el': $el - }; + var isDOM = $el instanceof jQuery; + var wgd = isDOM ? this.dom_to_coords($el) : $el; + isDOM || ($el = wgd.el); + + var empty_upper_row = this.can_go_widget_up(wgd); + if (empty_upper_row) { + wgd.row = empty_upper_row; + $el.attr('data-row', empty_upper_row); + this.$el.trigger('gridster:positionchanged', [wgd]); + } if (this.options.avoid_overlapped_widgets && !this.can_move_to( @@ -832,7 +855,7 @@ this.options.resize.enabled && this.add_resize_handle($el); - return this; + return !! empty_upper_row; }; @@ -2991,6 +3014,17 @@ this.$widgets.each($.proxy(function(i, widget) { this.register_widget($(widget)); }, this)); + + widgets_coords = Gridster.sort_by_row_and_col_asc(widgets_coords); + + var changes = $(widgets_coords).map($.proxy(function(i, wgd) { + return this.register_widget(wgd) || null; + }, this)); + + if (changes.length) { + this.$el.trigger('gridster:positionschanged'); + } + return this; };