Release v0.5.3

This commit is contained in:
vieron
2014-07-04 19:04:54 +02:00
parent 6bcfa6e16e
commit e837ded844
8 changed files with 523 additions and 315 deletions
+16
View File
@@ -1,3 +1,19 @@
<a name="v0.5.3"></a>
### v0.5.3 (2014-07-04)
#### Bug Fixes
* **gridster:**
* custom `ignore_dragging` overwrites the default value ([6bcfa6e1](http://github.com/ducksboard/gridster.js/commit/6bcfa6e16e4a88cbb5efff1ce29308737884a89d))
* sort widgets appropriately when reading them from DOM ([5c6d25cb](http://github.com/ducksboard/gridster.js/commit/5c6d25cbbe3de021806408f3cff6cb1e139c0a25))
#### Features
* make gridster AMD compatible ([589d7fd5](http://github.com/ducksboard/gridster.js/commit/589d7fd509a570fd02666c2f8231545211d6c83f))
* **gridster:** move widget up when added if there is space available ([8ec307b6](http://github.com/ducksboard/gridster.js/commit/8ec307b6f7173e94610409adcb1671372cc2c67d))
<a name="v0.5.2"></a>
### v0.5.2 (2014-06-16)
+1 -1
View File
@@ -1,4 +1,4 @@
/*! gridster.js - v0.5.2 - 2014-06-16
/*! gridster.js - v0.5.3 - 2014-07-04
* http://gridster.net/
* Copyright (c) 2014 ducksboard; Licensed MIT */
+243 -152
View File
@@ -1,8 +1,16 @@
/*! gridster.js - v0.5.2 - 2014-06-16
/*! gridster.js - v0.5.3 - 2014-07-04
* http://gridster.net/
* Copyright (c) 2014 ducksboard; Licensed MIT */
;(function($, window, document, undefined){
;(function(root, factory) {
if (typeof define === 'function' && define.amd) {
define('gridster-coords', ['jquery'], factory);
} else {
root.GridsterCoords = factory(root.$ || root.jQuery);
}
}(this, function($) {
/**
* Creates objects with coordinates (x1, y1, x2, y2, cx, cy, width, height)
* to simulate DOM elements on the screen.
@@ -108,9 +116,20 @@
return ins;
};
}(jQuery, window, document));
return Coords;
;(function($, window, document, undefined){
}));
;(function(root, factory) {
if (typeof define === 'function' && define.amd) {
define('gridster-collision', ['jquery', 'gridster-coords'], factory);
} else {
root.GridsterCollision = factory(root.$ || root.jQuery,
root.GridsterCoords);
}
}(this, function($, Coords) {
var defaults = {
colliders_context: document.body,
@@ -154,6 +173,7 @@
this.init();
}
Collision.defaults = defaults;
var fn = Collision.prototype;
@@ -331,8 +351,9 @@
return new Collision( this, collider, options );
};
return Collision;
}(jQuery, window, document));
}));
;(function(window, undefined) {
@@ -407,7 +428,15 @@
})(window);
;(function($, window, document, undefined) {
;(function(root, factory) {
if (typeof define === 'function' && define.amd) {
define('gridster-draggable', ['jquery'], factory);
} else {
root.GridsterDraggable = factory(root.$ || root.jQuery);
}
}(this, function($) {
var defaults = {
items: 'li',
@@ -455,6 +484,9 @@
* the mouse must move before dragging should start.
* @param {Boolean} [options.limit] Constrains dragging to the width of
* the container
* @param {Object|Function} [options.ignore_dragging] Array of node names
* that sould not trigger dragging, by default is `['INPUT', 'TEXTAREA',
* 'SELECT', 'BUTTON']`. If a function is used return true to ignore dragging.
* @param {offset_left} [options.offset_left] Offset added to the item
* that is being dragged.
* @param {Number} [options.drag] Executes a callback when the mouse is
@@ -475,6 +507,8 @@
this.init();
}
Draggable.defaults = defaults;
var fn = Draggable.prototype;
fn.init = function() {
@@ -803,10 +837,20 @@
return new Draggable(this, options);
};
return Draggable;
}(jQuery, window, document));
}));
;(function($, window, document, undefined) {
;(function(root, factory) {
if (typeof define === 'function' && define.amd) {
define(['jquery', 'gridster-draggable', 'gridster-collision'], factory);
} else {
root.Gridster = factory(root.$ || root.jQuery, root.GridsterDraggable,
root.GridsterCollision);
}
}(this, function($, Draggable, Collision) {
var defaults = {
namespace: '',
@@ -822,6 +866,7 @@
autogrow_cols: false,
autogenerate_stylesheet: true,
avoid_overlapped_widgets: true,
auto_init: true,
serialize_params: function($w, wgd) {
return {
col: wgd.col,
@@ -833,7 +878,8 @@
collision: {},
draggable: {
items: '.gs-w',
distance: 4
distance: 4,
ignore_dragging: Draggable.defaults.ignore_dragging.slice(0)
},
resize: {
enabled: false,
@@ -880,6 +926,8 @@
* @param {Boolean} [options.avoid_overlapped_widgets] Avoid that widgets loaded
* from the DOM can be overlapped. It is helpful if the positions were
* bad stored in the database or if there was any conflict.
* @param {Boolean} [options.auto_init] Automatically call gridster init
* method or not when the plugin is instantiated.
* @param {Function} [options.serialize_params] Return the data you want
* for each widget in the serialization. Two arguments are passed:
* `$w`: the jQuery wrapped HTMLElement, and `wgd`: the grid
@@ -890,8 +938,10 @@
* @param {Object} [options.draggable] An Object with all options for
* Draggable class you want to overwrite. See Draggable docs for more
* info.
* @param {Object} [options.resize] An Object with resize config
* options.
* @param {Object|Function} [options.draggable.ignore_dragging] Note that
* if you use a Function, and resize is enabled, you should ignore the
* resize handlers manually (options.resize.handle_class).
* @param {Object} [options.resize] An Object with resize config options.
* @param {Boolean} [options.resize.enabled] Set to true to enable
* resizing.
* @param {Array} [options.resize.axes] Axes in which widgets can be
@@ -932,11 +982,100 @@
this.generated_stylesheets = [];
this.$style_tags = $([]);
this.init();
this.options.auto_init && this.init();
}
Gridster.defaults = defaults;
Gridster.generated_stylesheets = [];
/**
* 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
* @return {Array} Returns the array sorted.
*/
Gridster.sort_by_row_asc = function(widgets) {
widgets = widgets.sort(function(a, b) {
if (!a.row) {
a = $(a).coords().grid;
b = $(b).coords().grid;
}
if (a.row > b.row) {
return 1;
}
return -1;
});
return widgets;
};
/**
* Sorts an Array of grid coords objects (representing the grid coords of
* each widget) placing first the empty cells upper left.
*
* @method sort_by_row_and_col_asc
* @param {Array} widgets Array of grid coords objects
* @return {Array} Returns the array sorted.
*/
Gridster.sort_by_row_and_col_asc = function(widgets) {
widgets = widgets.sort(function(a, b) {
if (a.row > b.row || a.row === b.row && a.col > b.col) {
return 1;
}
return -1;
});
return widgets;
};
/**
* Sorts an Array of grid coords objects by column (representing the grid
* coords of each widget) in ascending way.
*
* @method sort_by_col_asc
* @param {Array} widgets Array of grid coords objects
* @return {Array} Returns the array sorted.
*/
Gridster.sort_by_col_asc = function(widgets) {
widgets = widgets.sort(function(a, b) {
if (a.col > b.col) {
return 1;
}
return -1;
});
return widgets;
};
/**
* 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
* @return {Array} Returns the array sorted.
*/
Gridster.sort_by_row_desc = function(widgets) {
widgets = widgets.sort(function(a, b) {
if (a.row + a.size_y < b.row + b.size_y) {
return 1;
}
return -1;
});
return widgets;
};
/** Instance Methods **/
var fn = Gridster.prototype;
fn.init = function() {
@@ -1028,7 +1167,7 @@
if (!col & !row) {
pos = this.next_position(size_x, size_y);
}else{
} else {
pos = {
col: col,
row: row,
@@ -1321,7 +1460,7 @@
$nexts.not($exclude).each($.proxy(function(i, w) {
var wgd = $(w).coords().grid;
if (!(wgd.row <= (row + size_y - 1))) { return; }
if ( !(wgd.row <= (row + size_y - 1))) { return; }
var diff = (row + size_y) - wgd.row;
this.move_widget_down($(w), diff);
}, this));
@@ -1401,7 +1540,7 @@
}
if (valid_pos.length) {
return this.sort_by_row_and_col_asc(valid_pos)[0];
return Gridster.sort_by_row_and_col_asc(valid_pos)[0];
}
return false;
};
@@ -1482,13 +1621,11 @@
*/
fn.serialize = function($widgets) {
$widgets || ($widgets = this.$widgets);
var result = [];
$widgets.each($.proxy(function(i, widget) {
result.push(this.options.serialize_params(
$(widget), $(widget).coords().grid ) );
}, this));
return result;
return $widgets.map($.proxy(function(i, widget) {
var $w = $(widget);
return this.options.serialize_params($w, $w.coords().grid);
}, this));
};
@@ -1506,24 +1643,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(
@@ -1547,7 +1707,7 @@
this.options.resize.enabled && this.add_resize_handle($el);
return this;
return !! empty_upper_row;
};
@@ -1621,8 +1781,6 @@
offset_top: this.options.widget_margins[1],
container_width: this.cols * this.min_widget_width,
limit: true,
ignore_dragging: ['INPUT', 'TEXTAREA', 'SELECT', 'BUTTON',
'.' + this.options.resize.handle_class],
start: function(event, ui) {
self.$widgets.filter('.player-revert')
.removeClass('player-revert');
@@ -1692,6 +1850,12 @@
this.resize_handle_tpl = $.map(axes, function(type) {
return handle_tpl.replace('{type}', type);
}).join('');
if ($.isArray(this.options.draggable.ignore_dragging)) {
this.options.draggable.ignore_dragging.push(
'.' + this.resize_handle_class);
}
return this;
};
@@ -1810,6 +1974,7 @@
}
};
/**
* This function is executed when the player stops being dragged.
*
@@ -1877,7 +2042,6 @@
};
/**
* This function is executed every time a widget starts to be resized.
*
@@ -1980,6 +2144,7 @@
}
};
/**
* This function is executed when a widget is being resized.
*
@@ -2226,7 +2391,7 @@
if (this.can_go_widget_up(wgd)) {
$widgets_can_go_up = $widgets_can_go_up.add($w);
wgd_can_go_up.push(wgd);
}else{
} else {
wgd_can_not_go_up.push(wgd);
}
}, this));
@@ -2234,96 +2399,12 @@
$widgets_can_not_go_up = $widgets.not($widgets_can_go_up);
return {
can_go_up: this.sort_by_row_asc(wgd_can_go_up),
can_not_go_up: this.sort_by_row_desc(wgd_can_not_go_up)
can_go_up: Gridster.sort_by_row_asc(wgd_can_go_up),
can_not_go_up: Gridster.sort_by_row_desc(wgd_can_not_go_up)
};
};
/**
* 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
* @return {Array} Returns the array sorted.
*/
fn.sort_by_row_asc = function(widgets) {
widgets = widgets.sort(function(a, b) {
if (!a.row) {
a = $(a).coords().grid;
b = $(b).coords().grid;
}
if (a.row > b.row) {
return 1;
}
return -1;
});
return widgets;
};
/**
* Sorts an Array of grid coords objects (representing the grid coords of
* each widget) placing first the empty cells upper left.
*
* @method sort_by_row_and_col_asc
* @param {Array} widgets Array of grid coords objects
* @return {Array} Returns the array sorted.
*/
fn.sort_by_row_and_col_asc = function(widgets) {
widgets = widgets.sort(function(a, b) {
if (a.row > b.row || a.row === b.row && a.col > b.col) {
return 1;
}
return -1;
});
return widgets;
};
/**
* Sorts an Array of grid coords objects by column (representing the grid
* coords of each widget) in ascending way.
*
* @method sort_by_col_asc
* @param {Array} widgets Array of grid coords objects
* @return {Array} Returns the array sorted.
*/
fn.sort_by_col_asc = function(widgets) {
widgets = widgets.sort(function(a, b) {
if (a.col > b.col) {
return 1;
}
return -1;
});
return widgets;
};
/**
* 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
* @return {Array} Returns the array sorted.
*/
fn.sort_by_row_desc = function(widgets) {
widgets = widgets.sort(function(a, b) {
if (a.row + a.size_y < b.row + b.size_y) {
return 1;
}
return -1;
});
return widgets;
};
/**
* Sorts an Array of grid coords objects (representing the grid coords of
* each widget) in descending way.
@@ -2624,7 +2705,7 @@
) {
upper_rows[tcol].push(r);
min_row = r < min_row ? r : min_row;
}else{
} else {
break;
}
}
@@ -2743,7 +2824,7 @@
if (valid_rows[0] !== p_top_row) {
new_row = valid_rows[0] || false;
}
}else{
} else {
if (valid_rows[0] !== p_top_row) {
new_row = this.get_consecutive_numbers_index(
valid_rows, size_y);
@@ -2767,7 +2848,7 @@
break;
}
first = false;
}else{
} else {
result = [];
first = true;
}
@@ -3045,7 +3126,7 @@
!this.is_placeholder_in(tcol, r)
) {
urc[tcol].push(r);
}else{
} else {
break;
}
}
@@ -3128,7 +3209,7 @@
});
});
return this.sort_by_row_asc($nexts);
return Gridster.sort_by_row_asc($nexts);
};
@@ -3188,7 +3269,6 @@
};
/**
* Check if it's possible to move a widget to a specific col/row. It takes
* into account the dimensions (`size_y` and `size_x` attrs. of the grid
@@ -3612,21 +3692,21 @@
* @return {Object} Returns the instance of the Gridster class.
*/
fn.add_style_tag = function(css) {
var d = document;
var tag = d.createElement('style');
var d = document;
var tag = d.createElement('style');
d.getElementsByTagName('head')[0].appendChild(tag);
tag.setAttribute('type', 'text/css');
d.getElementsByTagName('head')[0].appendChild(tag);
tag.setAttribute('type', 'text/css');
if (tag.styleSheet) {
tag.styleSheet.cssText = css;
}else{
tag.appendChild(document.createTextNode(css));
}
if (tag.styleSheet) {
tag.styleSheet.cssText = css;
} else {
tag.appendChild(document.createTextNode(css));
}
this.$style_tags = this.$style_tags.add(tag);
this.$style_tags = this.$style_tags.add(tag);
return this;
return this;
};
@@ -3774,7 +3854,6 @@
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;
@@ -3788,9 +3867,21 @@
* @return {Object} Returns the instance of the Gridster class.
*/
fn.get_widgets_from_DOM = function() {
this.$widgets.each($.proxy(function(i, widget) {
this.register_widget($(widget));
var widgets_coords = this.$widgets.map($.proxy(function(i, widget) {
var $w = $(widget);
return this.dom_to_coords($w);
}, 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;
};
@@ -3869,13 +3960,13 @@
//jQuery adapter
$.fn.gridster = function(options) {
return this.each(function() {
if (!$(this).data('gridster')) {
$(this).data('gridster', new Gridster( this, options ));
}
});
return this.each(function() {
if (! $(this).data('gridster')) {
$(this).data('gridster', new Gridster( this, options ));
}
});
};
$.Gridster = fn;
return Gridster;
}(jQuery, window, document));
}));
+1 -1
View File
@@ -1,2 +1,2 @@
/*! gridster.js - v0.5.2 - 2014-06-16 - * http://gridster.net/ - Copyright (c) 2014 ducksboard; Licensed MIT */
/*! gridster.js - v0.5.3 - 2014-07-04 - * http://gridster.net/ - Copyright (c) 2014 ducksboard; Licensed MIT */
.gridster{position:relative}.gridster>*{margin:0 auto;-webkit-transition:height .4s,width .4s;-moz-transition:height .4s,width .4s;-o-transition:height .4s,width .4s;-ms-transition:height .4s,width .4s;transition:height .4s,width .4s}.gridster .gs-w{z-index:2;position:absolute}.ready .gs-w:not(.preview-holder){-webkit-transition:opacity .3s,left .3s,top .3s;-moz-transition:opacity .3s,left .3s,top .3s;-o-transition:opacity .3s,left .3s,top .3s;transition:opacity .3s,left .3s,top .3s}.ready .gs-w:not(.preview-holder),.ready .resize-preview-holder{-webkit-transition:opacity .3s,left .3s,top .3s,width .3s,height .3s;-moz-transition:opacity .3s,left .3s,top .3s,width .3s,height .3s;-o-transition:opacity .3s,left .3s,top .3s,width .3s,height .3s;transition:opacity .3s,left .3s,top .3s,width .3s,height .3s}.gridster .preview-holder{z-index:1;position:absolute;background-color:#fff;border-color:#fff;opacity:.3}.gridster .player-revert{z-index:10!important;-webkit-transition:left .3s,top .3s!important;-moz-transition:left .3s,top .3s!important;-o-transition:left .3s,top .3s!important;transition:left .3s,top .3s!important}.gridster .dragging,.gridster .resizing{z-index:10!important;-webkit-transition:all 0s!important;-moz-transition:all 0s!important;-o-transition:all 0s!important;transition:all 0s!important}.gs-resize-handle{position:absolute;z-index:1}.gs-resize-handle-both{width:20px;height:20px;bottom:-8px;right:-8px;background-image:url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBzdGFuZGFsb25lPSJubyI/Pg08IS0tIEdlbmVyYXRvcjogQWRvYmUgRmlyZXdvcmtzIENTNiwgRXhwb3J0IFNWRyBFeHRlbnNpb24gYnkgQWFyb24gQmVhbGwgKGh0dHA6Ly9maXJld29ya3MuYWJlYWxsLmNvbSkgLiBWZXJzaW9uOiAwLjYuMSAgLS0+DTwhRE9DVFlQRSBzdmcgUFVCTElDICItLy9XM0MvL0RURCBTVkcgMS4xLy9FTiIgImh0dHA6Ly93d3cudzMub3JnL0dyYXBoaWNzL1NWRy8xLjEvRFREL3N2ZzExLmR0ZCI+DTxzdmcgaWQ9IlVudGl0bGVkLVBhZ2UlMjAxIiB2aWV3Qm94PSIwIDAgNiA2IiBzdHlsZT0iYmFja2dyb3VuZC1jb2xvcjojZmZmZmZmMDAiIHZlcnNpb249IjEuMSINCXhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHhtbDpzcGFjZT0icHJlc2VydmUiDQl4PSIwcHgiIHk9IjBweCIgd2lkdGg9IjZweCIgaGVpZ2h0PSI2cHgiDT4NCTxnIG9wYWNpdHk9IjAuMzAyIj4NCQk8cGF0aCBkPSJNIDYgNiBMIDAgNiBMIDAgNC4yIEwgNCA0LjIgTCA0LjIgNC4yIEwgNC4yIDAgTCA2IDAgTCA2IDYgTCA2IDYgWiIgZmlsbD0iIzAwMDAwMCIvPg0JPC9nPg08L3N2Zz4=);background-position:top left;background-repeat:no-repeat;cursor:se-resize;z-index:20}.gs-resize-handle-x{top:0;bottom:13px;right:-5px;width:10px;cursor:e-resize}.gs-resize-handle-y{left:0;right:13px;bottom:-5px;height:10px;cursor:s-resize}.gs-w:hover .gs-resize-handle,.resizing .gs-resize-handle{opacity:1}.gs-resize-handle,.gs-w.dragging .gs-resize-handle{opacity:0}.gs-resize-disabled .gs-resize-handle{display:none!important}[data-max-sizex="1"] .gs-resize-handle-x,[data-max-sizey="1"] .gs-resize-handle-y,[data-max-sizey="1"][data-max-sizex="1"] .gs-resize-handle{display:none!important}
+2 -2
View File
File diff suppressed because one or more lines are too long
+257 -156
View File
@@ -1,8 +1,16 @@
/*! gridster.js - v0.5.2 - 2014-06-16
/*! gridster.js - v0.5.3 - 2014-07-04
* http://gridster.net/
* Copyright (c) 2014 ducksboard; Licensed MIT */
;(function($, window, document, undefined){
;(function(root, factory) {
if (typeof define === 'function' && define.amd) {
define('gridster-coords', ['jquery'], factory);
} else {
root.GridsterCoords = factory(root.$ || root.jQuery);
}
}(this, function($) {
/**
* Creates objects with coordinates (x1, y1, x2, y2, cx, cy, width, height)
* to simulate DOM elements on the screen.
@@ -108,9 +116,20 @@
return ins;
};
}(jQuery, window, document));
return Coords;
;(function($, window, document, undefined){
}));
;(function(root, factory) {
if (typeof define === 'function' && define.amd) {
define('gridster-collision', ['jquery', 'gridster-coords'], factory);
} else {
root.GridsterCollision = factory(root.$ || root.jQuery,
root.GridsterCoords);
}
}(this, function($, Coords) {
var defaults = {
colliders_context: document.body,
@@ -154,6 +173,7 @@
this.init();
}
Collision.defaults = defaults;
var fn = Collision.prototype;
@@ -331,8 +351,9 @@
return new Collision( this, collider, options );
};
return Collision;
}(jQuery, window, document));
}));
;(function(window, undefined) {
@@ -407,7 +428,15 @@
})(window);
;(function($, window, document, undefined) {
;(function(root, factory) {
if (typeof define === 'function' && define.amd) {
define('gridster-draggable', ['jquery'], factory);
} else {
root.GridsterDraggable = factory(root.$ || root.jQuery);
}
}(this, function($) {
var defaults = {
items: 'li',
@@ -455,6 +484,9 @@
* the mouse must move before dragging should start.
* @param {Boolean} [options.limit] Constrains dragging to the width of
* the container
* @param {Object|Function} [options.ignore_dragging] Array of node names
* that sould not trigger dragging, by default is `['INPUT', 'TEXTAREA',
* 'SELECT', 'BUTTON']`. If a function is used return true to ignore dragging.
* @param {offset_left} [options.offset_left] Offset added to the item
* that is being dragged.
* @param {Number} [options.drag] Executes a callback when the mouse is
@@ -475,6 +507,8 @@
this.init();
}
Draggable.defaults = defaults;
var fn = Draggable.prototype;
fn.init = function() {
@@ -803,10 +837,20 @@
return new Draggable(this, options);
};
return Draggable;
}(jQuery, window, document));
}));
;(function($, window, document, undefined) {
;(function(root, factory) {
if (typeof define === 'function' && define.amd) {
define(['jquery', 'gridster-draggable', 'gridster-collision'], factory);
} else {
root.Gridster = factory(root.$ || root.jQuery, root.GridsterDraggable,
root.GridsterCollision);
}
}(this, function($, Draggable, Collision) {
var defaults = {
namespace: '',
@@ -822,6 +866,7 @@
autogrow_cols: false,
autogenerate_stylesheet: true,
avoid_overlapped_widgets: true,
auto_init: true,
serialize_params: function($w, wgd) {
return {
col: wgd.col,
@@ -833,7 +878,8 @@
collision: {},
draggable: {
items: '.gs-w',
distance: 4
distance: 4,
ignore_dragging: Draggable.defaults.ignore_dragging.slice(0)
},
resize: {
enabled: false,
@@ -880,6 +926,8 @@
* @param {Boolean} [options.avoid_overlapped_widgets] Avoid that widgets loaded
* from the DOM can be overlapped. It is helpful if the positions were
* bad stored in the database or if there was any conflict.
* @param {Boolean} [options.auto_init] Automatically call gridster init
* method or not when the plugin is instantiated.
* @param {Function} [options.serialize_params] Return the data you want
* for each widget in the serialization. Two arguments are passed:
* `$w`: the jQuery wrapped HTMLElement, and `wgd`: the grid
@@ -890,8 +938,10 @@
* @param {Object} [options.draggable] An Object with all options for
* Draggable class you want to overwrite. See Draggable docs for more
* info.
* @param {Object} [options.resize] An Object with resize config
* options.
* @param {Object|Function} [options.draggable.ignore_dragging] Note that
* if you use a Function, and resize is enabled, you should ignore the
* resize handlers manually (options.resize.handle_class).
* @param {Object} [options.resize] An Object with resize config options.
* @param {Boolean} [options.resize.enabled] Set to true to enable
* resizing.
* @param {Array} [options.resize.axes] Axes in which widgets can be
@@ -932,11 +982,100 @@
this.generated_stylesheets = [];
this.$style_tags = $([]);
this.init();
this.options.auto_init && this.init();
}
Gridster.defaults = defaults;
Gridster.generated_stylesheets = [];
/**
* 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
* @return {Array} Returns the array sorted.
*/
Gridster.sort_by_row_asc = function(widgets) {
widgets = widgets.sort(function(a, b) {
if (!a.row) {
a = $(a).coords().grid;
b = $(b).coords().grid;
}
if (a.row > b.row) {
return 1;
}
return -1;
});
return widgets;
};
/**
* Sorts an Array of grid coords objects (representing the grid coords of
* each widget) placing first the empty cells upper left.
*
* @method sort_by_row_and_col_asc
* @param {Array} widgets Array of grid coords objects
* @return {Array} Returns the array sorted.
*/
Gridster.sort_by_row_and_col_asc = function(widgets) {
widgets = widgets.sort(function(a, b) {
if (a.row > b.row || a.row === b.row && a.col > b.col) {
return 1;
}
return -1;
});
return widgets;
};
/**
* Sorts an Array of grid coords objects by column (representing the grid
* coords of each widget) in ascending way.
*
* @method sort_by_col_asc
* @param {Array} widgets Array of grid coords objects
* @return {Array} Returns the array sorted.
*/
Gridster.sort_by_col_asc = function(widgets) {
widgets = widgets.sort(function(a, b) {
if (a.col > b.col) {
return 1;
}
return -1;
});
return widgets;
};
/**
* 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
* @return {Array} Returns the array sorted.
*/
Gridster.sort_by_row_desc = function(widgets) {
widgets = widgets.sort(function(a, b) {
if (a.row + a.size_y < b.row + b.size_y) {
return 1;
}
return -1;
});
return widgets;
};
/** Instance Methods **/
var fn = Gridster.prototype;
fn.init = function() {
@@ -1028,7 +1167,7 @@
if (!col & !row) {
pos = this.next_position(size_x, size_y);
}else{
} else {
pos = {
col: col,
row: row,
@@ -1321,7 +1460,7 @@
$nexts.not($exclude).each($.proxy(function(i, w) {
var wgd = $(w).coords().grid;
if (!(wgd.row <= (row + size_y - 1))) { return; }
if ( !(wgd.row <= (row + size_y - 1))) { return; }
var diff = (row + size_y) - wgd.row;
this.move_widget_down($(w), diff);
}, this));
@@ -1401,7 +1540,7 @@
}
if (valid_pos.length) {
return this.sort_by_row_and_col_asc(valid_pos)[0];
return Gridster.sort_by_row_and_col_asc(valid_pos)[0];
}
return false;
};
@@ -1482,13 +1621,11 @@
*/
fn.serialize = function($widgets) {
$widgets || ($widgets = this.$widgets);
var result = [];
$widgets.each($.proxy(function(i, widget) {
result.push(this.options.serialize_params(
$(widget), $(widget).coords().grid ) );
}, this));
return result;
return $widgets.map($.proxy(function(i, widget) {
var $w = $(widget);
return this.options.serialize_params($w, $w.coords().grid);
}, this));
};
@@ -1506,24 +1643,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(
@@ -1547,7 +1707,7 @@
this.options.resize.enabled && this.add_resize_handle($el);
return this;
return !! empty_upper_row;
};
@@ -1621,8 +1781,6 @@
offset_top: this.options.widget_margins[1],
container_width: this.cols * this.min_widget_width,
limit: true,
ignore_dragging: ['INPUT', 'TEXTAREA', 'SELECT', 'BUTTON',
'.' + this.options.resize.handle_class],
start: function(event, ui) {
self.$widgets.filter('.player-revert')
.removeClass('player-revert');
@@ -1692,6 +1850,12 @@
this.resize_handle_tpl = $.map(axes, function(type) {
return handle_tpl.replace('{type}', type);
}).join('');
if ($.isArray(this.options.draggable.ignore_dragging)) {
this.options.draggable.ignore_dragging.push(
'.' + this.resize_handle_class);
}
return this;
};
@@ -1810,6 +1974,7 @@
}
};
/**
* This function is executed when the player stops being dragged.
*
@@ -1877,7 +2042,6 @@
};
/**
* This function is executed every time a widget starts to be resized.
*
@@ -1980,6 +2144,7 @@
}
};
/**
* This function is executed when a widget is being resized.
*
@@ -2226,7 +2391,7 @@
if (this.can_go_widget_up(wgd)) {
$widgets_can_go_up = $widgets_can_go_up.add($w);
wgd_can_go_up.push(wgd);
}else{
} else {
wgd_can_not_go_up.push(wgd);
}
}, this));
@@ -2234,96 +2399,12 @@
$widgets_can_not_go_up = $widgets.not($widgets_can_go_up);
return {
can_go_up: this.sort_by_row_asc(wgd_can_go_up),
can_not_go_up: this.sort_by_row_desc(wgd_can_not_go_up)
can_go_up: Gridster.sort_by_row_asc(wgd_can_go_up),
can_not_go_up: Gridster.sort_by_row_desc(wgd_can_not_go_up)
};
};
/**
* 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
* @return {Array} Returns the array sorted.
*/
fn.sort_by_row_asc = function(widgets) {
widgets = widgets.sort(function(a, b) {
if (!a.row) {
a = $(a).coords().grid;
b = $(b).coords().grid;
}
if (a.row > b.row) {
return 1;
}
return -1;
});
return widgets;
};
/**
* Sorts an Array of grid coords objects (representing the grid coords of
* each widget) placing first the empty cells upper left.
*
* @method sort_by_row_and_col_asc
* @param {Array} widgets Array of grid coords objects
* @return {Array} Returns the array sorted.
*/
fn.sort_by_row_and_col_asc = function(widgets) {
widgets = widgets.sort(function(a, b) {
if (a.row > b.row || a.row === b.row && a.col > b.col) {
return 1;
}
return -1;
});
return widgets;
};
/**
* Sorts an Array of grid coords objects by column (representing the grid
* coords of each widget) in ascending way.
*
* @method sort_by_col_asc
* @param {Array} widgets Array of grid coords objects
* @return {Array} Returns the array sorted.
*/
fn.sort_by_col_asc = function(widgets) {
widgets = widgets.sort(function(a, b) {
if (a.col > b.col) {
return 1;
}
return -1;
});
return widgets;
};
/**
* 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
* @return {Array} Returns the array sorted.
*/
fn.sort_by_row_desc = function(widgets) {
widgets = widgets.sort(function(a, b) {
if (a.row + a.size_y < b.row + b.size_y) {
return 1;
}
return -1;
});
return widgets;
};
/**
* Sorts an Array of grid coords objects (representing the grid coords of
* each widget) in descending way.
@@ -2624,7 +2705,7 @@
) {
upper_rows[tcol].push(r);
min_row = r < min_row ? r : min_row;
}else{
} else {
break;
}
}
@@ -2743,7 +2824,7 @@
if (valid_rows[0] !== p_top_row) {
new_row = valid_rows[0] || false;
}
}else{
} else {
if (valid_rows[0] !== p_top_row) {
new_row = this.get_consecutive_numbers_index(
valid_rows, size_y);
@@ -2767,7 +2848,7 @@
break;
}
first = false;
}else{
} else {
result = [];
first = true;
}
@@ -3045,7 +3126,7 @@
!this.is_placeholder_in(tcol, r)
) {
urc[tcol].push(r);
}else{
} else {
break;
}
}
@@ -3128,7 +3209,7 @@
});
});
return this.sort_by_row_asc($nexts);
return Gridster.sort_by_row_asc($nexts);
};
@@ -3188,7 +3269,6 @@
};
/**
* Check if it's possible to move a widget to a specific col/row. It takes
* into account the dimensions (`size_y` and `size_x` attrs. of the grid
@@ -3612,21 +3692,21 @@
* @return {Object} Returns the instance of the Gridster class.
*/
fn.add_style_tag = function(css) {
var d = document;
var tag = d.createElement('style');
var d = document;
var tag = d.createElement('style');
d.getElementsByTagName('head')[0].appendChild(tag);
tag.setAttribute('type', 'text/css');
d.getElementsByTagName('head')[0].appendChild(tag);
tag.setAttribute('type', 'text/css');
if (tag.styleSheet) {
tag.styleSheet.cssText = css;
}else{
tag.appendChild(document.createTextNode(css));
}
if (tag.styleSheet) {
tag.styleSheet.cssText = css;
} else {
tag.appendChild(document.createTextNode(css));
}
this.$style_tags = this.$style_tags.add(tag);
this.$style_tags = this.$style_tags.add(tag);
return this;
return this;
};
@@ -3774,7 +3854,6 @@
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;
@@ -3788,9 +3867,21 @@
* @return {Object} Returns the instance of the Gridster class.
*/
fn.get_widgets_from_DOM = function() {
this.$widgets.each($.proxy(function(i, widget) {
this.register_widget($(widget));
var widgets_coords = this.$widgets.map($.proxy(function(i, widget) {
var $w = $(widget);
return this.dom_to_coords($w);
}, 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;
};
@@ -3869,20 +3960,28 @@
//jQuery adapter
$.fn.gridster = function(options) {
return this.each(function() {
if (!$(this).data('gridster')) {
$(this).data('gridster', new Gridster( this, options ));
}
});
return this.each(function() {
if (! $(this).data('gridster')) {
$(this).data('gridster', new Gridster( this, options ));
}
});
};
$.Gridster = fn;
return Gridster;
}(jQuery, window, document));
}));
;(function($, window, document, undefined) {
;(function(root, factory) {
var fn = $.Gridster;
if (typeof define === 'function' && define.amd) {
define(['jquery', 'gridster'], factory);
} else {
root.Gridster = factory(root.$ || root.jQuery, root.Gridster);
}
}(this, function($, Gridster) {
var fn = Gridster.prototype;
fn.widgets_in_col = function(col) {
if (!this.gridmap[col]) {
@@ -4010,7 +4109,7 @@
}
if (valid_pos.length >= 1) {
return this.sort_by_col_asc(valid_pos)[0];
return Gridster.sort_by_col_asc(valid_pos)[0];
}
return false;
@@ -4044,4 +4143,6 @@
return false;
};
}(jQuery, window, document));
return Gridster;
}));
File diff suppressed because one or more lines are too long
+1 -1
View File
@@ -2,7 +2,7 @@
"name": "gridster",
"title": "gridster.js",
"description": "a drag-and-drop multi-column jQuery grid plugin",
"version": "0.5.2",
"version": "0.5.3",
"homepage": "http://gridster.net/",
"author": {
"name": "ducksboard",