nicolas/librenms
1
0
Fork 0
mirror of https://github.com/stylersnico/librenms.git synced 2026-08-02 00:32:09 +02:00
Code Issues Packages Projects Releases Wiki Activity

Merge remote-tracking branch 'mooglemoogle/gridster.js/master'

Browse Source 
* mooglemoogle/gridster.js/master:
  Added destroy of widget coords and resize api
  Added ability to specify scroll container for drag/resize
This commit is contained in:
David Morse
2015-04-07 21:36:00 -06:00
parent e7509f0220 bd8dbf8459
commit 84598f6862
8 changed files with 193 additions and 96 deletions
Download Patch File Download Diff File Expand all files Collapse all files
dist/jquery.gridster.js
Vendored
+59 -31
View File
@@ -288,7 +288,7 @@
var area_coords = self.calculate_overlapped_area_coords(
player_coords, collider_coords);
var area = self.calculate_overlapped_area(area_coords);
if ( 0 != area ) {
if ( 0 !== area ) {
var collider_data = {
area: area,
area_coords : area_coords,
@@ -436,7 +436,7 @@
})(window);
;(function(root, factory) {
'use strict';
if (typeof define === 'function' && define.amd) {
define('gridster-draggable', ['jquery'], factory);
} else {
@@ -473,7 +473,7 @@
var idCounter = 0;
var uniqId = function() {
return ++idCounter + '';
}
};
/**
* Basic drag implementation for DOM elements inside a container.
@@ -505,15 +505,17 @@
* @constructor
*/
function Draggable(el, options) {
this.options = $.extend({}, defaults, options);
this.$document = $(document);
this.$container = $(el);
this.$dragitems = $(this.options.items, this.$container);
this.is_dragging = false;
this.player_min_left = 0 + this.options.offset_left;
this.id = uniqId();
this.ns = '.gridster-draggable-' + this.id;
this.init();
this.options = $.extend({}, defaults, options);
this.$document = $(document);
this.$container = $(el);
this.$scroll_container = this.options.scroll_container == window ?
$(window) : this.$container.closest(this.options.scroll_container);
this.$dragitems = $(this.options.items, this.$container);
this.is_dragging = false;
this.player_min_left = 0 + this.options.offset_left;
this.id = uniqId();
this.ns = '.gridster-draggable-' + this.id;
this.init();
}
Draggable.defaults = defaults;
@@ -585,9 +587,13 @@
var diff_y = Math.round(mouse_actual_pos.top - this.mouse_init_pos.top);
var left = Math.round(this.el_init_offset.left +
diff_x - this.baseX + $window.scrollLeft() - this.win_offset_x);
diff_x - this.baseX +
this.$scroll_container.scrollLeft() -
this.scroll_container_offset_x);
var top = Math.round(this.el_init_offset.top +
diff_y - this.baseY + $window.scrollTop() - this.win_offset_y);
diff_y - this.baseY +
this.$scroll_container.scrollTop() -
this.scroll_container_offset_y);
if (this.options.limit) {
if (left > this.player_max_left) {
@@ -605,8 +611,10 @@
pointer: {
left: mouse_actual_pos.left,
top: mouse_actual_pos.top,
diff_left: diff_x + ($window.scrollLeft() - this.win_offset_x),
diff_top: diff_y + ($window.scrollTop() - this.win_offset_y)
diff_left: diff_x + (this.$scroll_container.scrollLeft() -
this.scroll_container_offset_x),
diff_top: diff_y + (this.$scroll_container.scrollTop() -
this.scroll_container_offset_y)
}
};
};
@@ -637,28 +645,36 @@
var area_size = 50;
var scroll_inc = 30;
var scrollDir = 'scroll' + capitalize(dir_prop);
var is_x = axis === 'x';
var window_size = is_x ? this.window_width : this.window_height;
var doc_size = is_x ? $(document).width() : $(document).height();
var scroller_size = is_x ? this.scroller_width : this.scroller_height;
var doc_size;
if (this.$scroll_container === window){
doc_size = is_x ? this.$scroll_container.width() :
this.$scroll_container.height();
}else{
doc_size = is_x ? this.$scroll_container[0].scrollWidth :
this.$scroll_container[0].scrollHeight;
}
var player_size = is_x ? this.$player.width() : this.$player.height();
var next_scroll;
var scroll_offset = $window['scroll' + capitalize(dir_prop)]();
var min_window_pos = scroll_offset;
var max_window_pos = min_window_pos + window_size;
var scroll_offset = this.$scroll_container[scrollDir]();
var min_scroll_pos = scroll_offset;
var max_scroll_pos = min_scroll_pos + scroller_size;
var mouse_next_zone = max_window_pos - area_size; // down/right
var mouse_prev_zone = min_window_pos + area_size; // up/left
var mouse_next_zone = max_scroll_pos - area_size; // down/right
var mouse_prev_zone = min_scroll_pos + area_size; // up/left
var abs_mouse_pos = min_window_pos + data.pointer[dir_prop];
var abs_mouse_pos = min_scroll_pos + data.pointer[dir_prop];
var max_player_pos = (doc_size - window_size + player_size);
var max_player_pos = (doc_size - scroller_size + player_size);
if (abs_mouse_pos >= mouse_next_zone) {
next_scroll = scroll_offset + scroll_inc;
if (next_scroll < max_player_pos) {
$window['scroll' + capitalize(dir_prop)](next_scroll);
this.$scroll_container[scrollDir](next_scroll);
this['scroll_offset_' + axis] += scroll_inc;
}
}
@@ -666,7 +682,7 @@
if (abs_mouse_pos <= mouse_prev_zone) {
next_scroll = scroll_offset - scroll_inc;
if (next_scroll > 0) {
$window['scroll' + capitalize(dir_prop)](next_scroll);
this.$scroll_container[scrollDir](next_scroll);
this['scroll_offset_' + axis] -= scroll_inc;
}
}
@@ -682,8 +698,8 @@
fn.calculate_dimensions = function(e) {
this.window_height = $window.height();
this.window_width = $window.width();
this.scroller_height = this.$scroll_container.height();
this.scroller_width = this.$scroll_container.width();
};
@@ -754,8 +770,8 @@
this.helper = false;
}
this.win_offset_y = $window.scrollTop();
this.win_offset_x = $window.scrollLeft();
this.scroll_container_offset_y = this.$scroll_container.scrollTop();
this.scroll_container_offset_x = this.$scroll_container.scrollLeft();
this.scroll_offset_y = 0;
this.scroll_offset_x = 0;
this.el_init_offset = this.$player.offset();
@@ -889,6 +905,7 @@
auto_init: true,
center_widgets: false,
responsive_breakpoint: false,
scroll_container: window,
serialize_params: function($w, wgd) {
return {
col: wgd.col,
@@ -989,7 +1006,12 @@
*/
function Gridster(el, options) {
this.options = $.extend(true, {}, defaults, options);
this.options.draggable = this.options.draggable || {};
this.options.draggable = $.extend(true, {}, this.options.draggable,
{scroll_container: this.options.scroll_container});
this.$el = $(el);
this.$scroll_container = this.options.scroll_container == window ?
$(window) : this.$el.closest(this.options.scroll_container);
this.$wrapper = this.$el.parent();
this.$widgets = this.$el.children(
this.options.widget_selector).addClass('gs-w');
@@ -2149,6 +2171,7 @@
move_element: false,
resize: true,
limit: this.options.autogrow_cols ? false : true,
scroll_container: this.options.scroll_container,
start: $.proxy(this.on_start_resize, this),
stop: $.proxy(function(event, ui) {
delay($.proxy(function() {
@@ -4441,6 +4464,11 @@
if (this.drag_api) {
this.drag_api.destroy();
}
if (this.resize_api) {
this.resize_api.destroy();
}
this.$widgets.each(function(i, el) { $(el).coords().destroy(); });
if (this.resize_api) {
this.resize_api.destroy();
dist/jquery.gridster.min.js
Vendored
+2 -2
View File
File diff suppressed because one or more lines are too long
dist/jquery.gridster.with-extras.js
Vendored
+59 -31
View File
@@ -288,7 +288,7 @@
var area_coords = self.calculate_overlapped_area_coords(
player_coords, collider_coords);
var area = self.calculate_overlapped_area(area_coords);
if ( 0 != area ) {
if ( 0 !== area ) {
var collider_data = {
area: area,
area_coords : area_coords,
@@ -436,7 +436,7 @@
})(window);
;(function(root, factory) {
'use strict';
if (typeof define === 'function' && define.amd) {
define('gridster-draggable', ['jquery'], factory);
} else {
@@ -473,7 +473,7 @@
var idCounter = 0;
var uniqId = function() {
return ++idCounter + '';
}
};
/**
* Basic drag implementation for DOM elements inside a container.
@@ -505,15 +505,17 @@
* @constructor
*/
function Draggable(el, options) {
this.options = $.extend({}, defaults, options);
this.$document = $(document);
this.$container = $(el);
this.$dragitems = $(this.options.items, this.$container);
this.is_dragging = false;
this.player_min_left = 0 + this.options.offset_left;
this.id = uniqId();
this.ns = '.gridster-draggable-' + this.id;
this.init();
this.options = $.extend({}, defaults, options);
this.$document = $(document);
this.$container = $(el);
this.$scroll_container = this.options.scroll_container == window ?
$(window) : this.$container.closest(this.options.scroll_container);
this.$dragitems = $(this.options.items, this.$container);
this.is_dragging = false;
this.player_min_left = 0 + this.options.offset_left;
this.id = uniqId();
this.ns = '.gridster-draggable-' + this.id;
this.init();
}
Draggable.defaults = defaults;
@@ -585,9 +587,13 @@
var diff_y = Math.round(mouse_actual_pos.top - this.mouse_init_pos.top);
var left = Math.round(this.el_init_offset.left +
diff_x - this.baseX + $window.scrollLeft() - this.win_offset_x);
diff_x - this.baseX +
this.$scroll_container.scrollLeft() -
this.scroll_container_offset_x);
var top = Math.round(this.el_init_offset.top +
diff_y - this.baseY + $window.scrollTop() - this.win_offset_y);
diff_y - this.baseY +
this.$scroll_container.scrollTop() -
this.scroll_container_offset_y);
if (this.options.limit) {
if (left > this.player_max_left) {
@@ -605,8 +611,10 @@
pointer: {
left: mouse_actual_pos.left,
top: mouse_actual_pos.top,
diff_left: diff_x + ($window.scrollLeft() - this.win_offset_x),
diff_top: diff_y + ($window.scrollTop() - this.win_offset_y)
diff_left: diff_x + (this.$scroll_container.scrollLeft() -
this.scroll_container_offset_x),
diff_top: diff_y + (this.$scroll_container.scrollTop() -
this.scroll_container_offset_y)
}
};
};
@@ -637,28 +645,36 @@
var area_size = 50;
var scroll_inc = 30;
var scrollDir = 'scroll' + capitalize(dir_prop);
var is_x = axis === 'x';
var window_size = is_x ? this.window_width : this.window_height;
var doc_size = is_x ? $(document).width() : $(document).height();
var scroller_size = is_x ? this.scroller_width : this.scroller_height;
var doc_size;
if (this.$scroll_container === window){
doc_size = is_x ? this.$scroll_container.width() :
this.$scroll_container.height();
}else{
doc_size = is_x ? this.$scroll_container[0].scrollWidth :
this.$scroll_container[0].scrollHeight;
}
var player_size = is_x ? this.$player.width() : this.$player.height();
var next_scroll;
var scroll_offset = $window['scroll' + capitalize(dir_prop)]();
var min_window_pos = scroll_offset;
var max_window_pos = min_window_pos + window_size;
var scroll_offset = this.$scroll_container[scrollDir]();
var min_scroll_pos = scroll_offset;
var max_scroll_pos = min_scroll_pos + scroller_size;
var mouse_next_zone = max_window_pos - area_size; // down/right
var mouse_prev_zone = min_window_pos + area_size; // up/left
var mouse_next_zone = max_scroll_pos - area_size; // down/right
var mouse_prev_zone = min_scroll_pos + area_size; // up/left
var abs_mouse_pos = min_window_pos + data.pointer[dir_prop];
var abs_mouse_pos = min_scroll_pos + data.pointer[dir_prop];
var max_player_pos = (doc_size - window_size + player_size);
var max_player_pos = (doc_size - scroller_size + player_size);
if (abs_mouse_pos >= mouse_next_zone) {
next_scroll = scroll_offset + scroll_inc;
if (next_scroll < max_player_pos) {
$window['scroll' + capitalize(dir_prop)](next_scroll);
this.$scroll_container[scrollDir](next_scroll);
this['scroll_offset_' + axis] += scroll_inc;
}
}
@@ -666,7 +682,7 @@
if (abs_mouse_pos <= mouse_prev_zone) {
next_scroll = scroll_offset - scroll_inc;
if (next_scroll > 0) {
$window['scroll' + capitalize(dir_prop)](next_scroll);
this.$scroll_container[scrollDir](next_scroll);
this['scroll_offset_' + axis] -= scroll_inc;
}
}
@@ -682,8 +698,8 @@
fn.calculate_dimensions = function(e) {
this.window_height = $window.height();
this.window_width = $window.width();
this.scroller_height = this.$scroll_container.height();
this.scroller_width = this.$scroll_container.width();
};
@@ -754,8 +770,8 @@
this.helper = false;
}
this.win_offset_y = $window.scrollTop();
this.win_offset_x = $window.scrollLeft();
this.scroll_container_offset_y = this.$scroll_container.scrollTop();
this.scroll_container_offset_x = this.$scroll_container.scrollLeft();
this.scroll_offset_y = 0;
this.scroll_offset_x = 0;
this.el_init_offset = this.$player.offset();
@@ -889,6 +905,7 @@
auto_init: true,
center_widgets: false,
responsive_breakpoint: false,
scroll_container: window,
serialize_params: function($w, wgd) {
return {
col: wgd.col,
@@ -989,7 +1006,12 @@
*/
function Gridster(el, options) {
this.options = $.extend(true, {}, defaults, options);
this.options.draggable = this.options.draggable || {};
this.options.draggable = $.extend(true, {}, this.options.draggable,
{scroll_container: this.options.scroll_container});
this.$el = $(el);
this.$scroll_container = this.options.scroll_container == window ?
$(window) : this.$el.closest(this.options.scroll_container);
this.$wrapper = this.$el.parent();
this.$widgets = this.$el.children(
this.options.widget_selector).addClass('gs-w');
@@ -2149,6 +2171,7 @@
move_element: false,
resize: true,
limit: this.options.autogrow_cols ? false : true,
scroll_container: this.options.scroll_container,
start: $.proxy(this.on_start_resize, this),
stop: $.proxy(function(event, ui) {
delay($.proxy(function() {
@@ -4441,6 +4464,11 @@
if (this.drag_api) {
this.drag_api.destroy();
}
if (this.resize_api) {
this.resize_api.destroy();
}
this.$widgets.each(function(i, el) { $(el).coords().destroy(); });
if (this.resize_api) {
this.resize_api.destroy();
dist/jquery.gridster.with-extras.min.js
Vendored
+2 -2
View File
File diff suppressed because one or more lines are too long