From 787612e33887fa6e8dcb999e4d8294fb3356737d Mon Sep 17 00:00:00 2001 From: kborchers Date: Wed, 25 May 2011 22:30:58 -0500 Subject: [PATCH 1/6] Droppable: Check if scrolling while dragging and recalculate droppable positions. Fixes #5003 - Scroll on Droppable Demo Breaks Demo --- ui/jquery.ui.droppable.js | 13 ++++++++++++- 1 file changed, 12 insertions(+), 1 deletion(-) diff --git a/ui/jquery.ui.droppable.js b/ui/jquery.ui.droppable.js index b8a93cd460b..17a3c419bc7 100644 --- a/ui/jquery.ui.droppable.js +++ b/ui/jquery.ui.droppable.js @@ -14,6 +14,8 @@ * jquery.ui.draggable.js */ (function( $, undefined ) { + +var scrolling = false; $.widget("ui.droppable", { widgetEventPrefix: "drop", @@ -44,6 +46,12 @@ $.widget("ui.droppable", { (o.addClasses && this.element.addClass("ui-droppable")); + //Listen for scrolling so that if the dragging causes scrolling the position of the droppables can be recalculated (see #5003) + $(this.element).parentsUntil("body").each(function() { + $(this).scroll(function() { + scrolling = $( this ).scrollTop() || $( this ).scrollLeft() ? true : false; + }); + }); }, destroy: function() { @@ -241,7 +249,10 @@ $.ui.ddmanager = { drag: function(draggable, event) { //If you have a highly dynamic page, you might try this option. It renders positions every time you move the mouse. - if(draggable.options.refreshPositions) $.ui.ddmanager.prepareOffsets(draggable, event); + //If the drag causes scrolling, recalculate the positions of the droppables (see #5003) + if(draggable.options.refreshPositions || scrolling) { + $.ui.ddmanager.prepareOffsets(draggable, event); + } //Run through all droppables and check their positions based on specific tolerance options $.each($.ui.ddmanager.droppables[draggable.options.scope] || [], function() { From 5ee7085cb63314ae2f3c046d4943f47453412e49 Mon Sep 17 00:00:00 2001 From: kborchers Date: Thu, 26 May 2011 08:27:14 -0500 Subject: [PATCH 2/6] Droppable: Moved scrolling into the widget and cleaned up code as suggested by @scottgonzalez --- ui/jquery.ui.droppable.js | 13 +++++-------- 1 file changed, 5 insertions(+), 8 deletions(-) diff --git a/ui/jquery.ui.droppable.js b/ui/jquery.ui.droppable.js index 17a3c419bc7..57487f9dc87 100644 --- a/ui/jquery.ui.droppable.js +++ b/ui/jquery.ui.droppable.js @@ -14,8 +14,6 @@ * jquery.ui.draggable.js */ (function( $, undefined ) { - -var scrolling = false; $.widget("ui.droppable", { widgetEventPrefix: "drop", @@ -28,9 +26,10 @@ $.widget("ui.droppable", { scope: 'default', tolerance: 'intersect' }, + scrolling: false, _create: function() { - var o = this.options, accept = o.accept; + var o = this.options, accept = o.accept, scrolling = this.scrolling; this.isover = 0; this.isout = 1; this.accept = $.isFunction(accept) ? accept : function(d) { @@ -47,10 +46,8 @@ $.widget("ui.droppable", { (o.addClasses && this.element.addClass("ui-droppable")); //Listen for scrolling so that if the dragging causes scrolling the position of the droppables can be recalculated (see #5003) - $(this.element).parentsUntil("body").each(function() { - $(this).scroll(function() { - scrolling = $( this ).scrollTop() || $( this ).scrollLeft() ? true : false; - }); + $(this.element).parentsUntil("body").scroll(function() { + scrolling = $( this ).scrollTop() || $( this ).scrollLeft() ? true : false; }); }, @@ -250,7 +247,7 @@ $.ui.ddmanager = { //If you have a highly dynamic page, you might try this option. It renders positions every time you move the mouse. //If the drag causes scrolling, recalculate the positions of the droppables (see #5003) - if(draggable.options.refreshPositions || scrolling) { + if(draggable.options.refreshPositions || t.scrolling) { $.ui.ddmanager.prepareOffsets(draggable, event); } From 0fa39a1135559c47960a96587e13b480e6eeb412 Mon Sep 17 00:00:00 2001 From: kborchers Date: Thu, 26 May 2011 08:29:25 -0500 Subject: [PATCH 3/6] Droppable: Pushed wrong version on last commit. --- ui/jquery.ui.droppable.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/ui/jquery.ui.droppable.js b/ui/jquery.ui.droppable.js index 57487f9dc87..e31a637e268 100644 --- a/ui/jquery.ui.droppable.js +++ b/ui/jquery.ui.droppable.js @@ -46,7 +46,7 @@ $.widget("ui.droppable", { (o.addClasses && this.element.addClass("ui-droppable")); //Listen for scrolling so that if the dragging causes scrolling the position of the droppables can be recalculated (see #5003) - $(this.element).parentsUntil("body").scroll(function() { + this.element.parentsUntil("body").scroll(function() { scrolling = $( this ).scrollTop() || $( this ).scrollLeft() ? true : false; }); }, @@ -247,7 +247,7 @@ $.ui.ddmanager = { //If you have a highly dynamic page, you might try this option. It renders positions every time you move the mouse. //If the drag causes scrolling, recalculate the positions of the droppables (see #5003) - if(draggable.options.refreshPositions || t.scrolling) { + if(draggable.options.refreshPositions || this.scrolling) { $.ui.ddmanager.prepareOffsets(draggable, event); } From 4070af918f257a2ab6792156a706aa5cbf8c4a90 Mon Sep 17 00:00:00 2001 From: kborchers Date: Thu, 26 May 2011 09:17:53 -0500 Subject: [PATCH 4/6] Droppable: Set scrolling to false after short timeout. --- ui/jquery.ui.droppable.js | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/ui/jquery.ui.droppable.js b/ui/jquery.ui.droppable.js index e31a637e268..71c130b1e87 100644 --- a/ui/jquery.ui.droppable.js +++ b/ui/jquery.ui.droppable.js @@ -47,7 +47,8 @@ $.widget("ui.droppable", { //Listen for scrolling so that if the dragging causes scrolling the position of the droppables can be recalculated (see #5003) this.element.parentsUntil("body").scroll(function() { - scrolling = $( this ).scrollTop() || $( this ).scrollLeft() ? true : false; + scrolling = true; + setTimeout(function() { scrolling = false; }, 1); }); }, From f21f7a4120453808d857cd0c83be6f187575acca Mon Sep 17 00:00:00 2001 From: kborchers Date: Thu, 26 May 2011 10:21:18 -0500 Subject: [PATCH 5/6] Droppable: Remove scrolling var and use this.scrolling directly --- ui/jquery.ui.droppable.js | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/ui/jquery.ui.droppable.js b/ui/jquery.ui.droppable.js index 71c130b1e87..6e642810f7e 100644 --- a/ui/jquery.ui.droppable.js +++ b/ui/jquery.ui.droppable.js @@ -29,7 +29,7 @@ $.widget("ui.droppable", { scrolling: false, _create: function() { - var o = this.options, accept = o.accept, scrolling = this.scrolling; + var o = this.options, accept = o.accept; this.isover = 0; this.isout = 1; this.accept = $.isFunction(accept) ? accept : function(d) { @@ -47,8 +47,8 @@ $.widget("ui.droppable", { //Listen for scrolling so that if the dragging causes scrolling the position of the droppables can be recalculated (see #5003) this.element.parentsUntil("body").scroll(function() { - scrolling = true; - setTimeout(function() { scrolling = false; }, 1); + this.scrolling = true; + setTimeout(function() { this.scrolling = false; }, 1); }); }, From d91f1e4d937de3eabed68972e455320bfcc6174e Mon Sep 17 00:00:00 2001 From: kborchers Date: Thu, 26 May 2011 11:02:25 -0500 Subject: [PATCH 6/6] Droppable: Bound the scroll handler on dragstart and unbound on dragstop. --- ui/jquery.ui.droppable.js | 18 ++++++++++++------ 1 file changed, 12 insertions(+), 6 deletions(-) diff --git a/ui/jquery.ui.droppable.js b/ui/jquery.ui.droppable.js index 6e642810f7e..78796b0b413 100644 --- a/ui/jquery.ui.droppable.js +++ b/ui/jquery.ui.droppable.js @@ -44,12 +44,6 @@ $.widget("ui.droppable", { $.ui.ddmanager.droppables[o.scope].push(this); (o.addClasses && this.element.addClass("ui-droppable")); - - //Listen for scrolling so that if the dragging causes scrolling the position of the droppables can be recalculated (see #5003) - this.element.parentsUntil("body").scroll(function() { - this.scrolling = true; - setTimeout(function() { this.scrolling = false; }, 1); - }); }, destroy: function() { @@ -87,6 +81,18 @@ $.widget("ui.droppable", { if(this.options.activeClass) this.element.removeClass(this.options.activeClass); (draggable && this._trigger('deactivate', event, this.ui(draggable))); }, + + _dragStart: function(event) { + //Listen for scrolling so that if the dragging causes scrolling the position of the droppables can be recalculated (see #5003) + this.element.parentsUntil("body").scroll(function() { + this.scrolling = true; + setTimeout(function() { this.scrolling = false; }, 1); + }); + }, + + _dragStop: function(event) { + this.element.parentsUntil("body").unbind( "scroll" ); + }, _over: function(event) {