Skip to content

Commit bae06d2

Browse files
zhizhangchenscottgonzalez
authored andcommitted
Sortable: Calculating item distance and direction using a more robust algorithm to better support sorting among nested sortables. Fixes #8572 - Wrong placeholder positions. Fixes #8573 - Can't drag an item out of an inner sortable. Fixes #8574 - Hard to put an item between two inner sortables.
Use the item which has the least distance between the mouse pointer and one of its borders to rearrange, with direction being determined by the nearest border. Also we use this algorithm to rearrange even when currentContainer is not changed to override the defective rearrangment in _mouseDrag
1 parent 20e6064 commit bae06d2

File tree

1 file changed

+14
-4
lines changed

1 file changed

+14
-4
lines changed

ui/jquery.ui.sortable.js

Lines changed: 14 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -734,16 +734,26 @@ $.widget("ui.sortable", $.ui.mouse, {
734734
if(this.containers.length === 1) {
735735
this.containers[innermostIndex]._trigger("over", event, this._uiHash(this));
736736
this.containers[innermostIndex].containerCache.over = 1;
737-
} else if(this.currentContainer != this.containers[innermostIndex]) {
737+
} else {
738738

739739
//When entering a new container, we will find the item with the least distance and append our item near it
740-
var dist = 10000; var itemWithLeastDistance = null; var base = this.positionAbs[this.containers[innermostIndex].floating ? 'left' : 'top'];
740+
var dist = 10000; var itemWithLeastDistance = null;
741+
var posProperty = this.containers[innermostIndex].floating ? 'left' : 'top';
742+
var sizeProperty = this.containers[innermostIndex].floating ? 'width' : 'height';
743+
var base = this.positionAbs[posProperty] + this.offset.click[posProperty];
741744
for (var j = this.items.length - 1; j >= 0; j--) {
742745
if(!$.contains(this.containers[innermostIndex].element[0], this.items[j].item[0])) continue;
743-
var cur = this.containers[innermostIndex].floating ? this.items[j].item.offset().left : this.items[j].item.offset().top;
746+
if(this.items[j].item[0] == this.currentItem[0]) continue;
747+
var cur = this.items[j].item.offset()[posProperty];
748+
var nearBottom = false;
749+
if(Math.abs(cur - base) > Math.abs(cur + this.items[j][sizeProperty] - base)){
750+
nearBottom = true;
751+
cur += this.items[j][sizeProperty];
752+
}
753+
744754
if(Math.abs(cur - base) < dist) {
745755
dist = Math.abs(cur - base); itemWithLeastDistance = this.items[j];
746-
this.direction = (cur - base > 0) ? 'down' : 'up';
756+
this.direction = nearBottom ? "up": "down";
747757
}
748758
}
749759

0 commit comments

Comments
 (0)