aboutsummaryrefslogtreecommitdiffstats
path: root/ui/widgets/draggable.js
diff options
context:
space:
mode:
Diffstat (limited to 'ui/widgets/draggable.js')
-rw-r--r--ui/widgets/draggable.js281
1 files changed, 203 insertions, 78 deletions
diff --git a/ui/widgets/draggable.js b/ui/widgets/draggable.js
index 32bf861ed..6b862d0d0 100644
--- a/ui/widgets/draggable.js
+++ b/ui/widgets/draggable.js
@@ -106,7 +106,8 @@ $.widget( "ui.draggable", $.ui.mouse, {
this._blurActiveElement( event );
// Among others, prevent a drag on a resizable-handle
- if ( this.helper || o.disabled || $( event.target ).closest( ".ui-resizable-handle" ).length > 0 ) {
+ if ( this.helper || o.disabled ||
+ $( event.target ).closest( ".ui-resizable-handle" ).length > 0 ) {
return false;
}
@@ -220,9 +221,12 @@ $.widget( "ui.draggable", $.ui.mouse, {
$.ui.ddmanager.prepareOffsets( this, event );
}
- this._mouseDrag( event, true ); //Execute the drag once - this causes the helper not to be visible before getting its correct position
+ // Execute the drag once - this causes the helper not to be visible before getting its
+ // correct position
+ this._mouseDrag( event, true );
- //If the ddmanager is used for droppables, inform the manager that dragging has started (see #5003)
+ // If the ddmanager is used for droppables, inform the manager that dragging has started
+ // (see #5003)
if ( $.ui.ddmanager ) {
$.ui.ddmanager.dragStart( this, event );
}
@@ -291,12 +295,20 @@ $.widget( "ui.draggable", $.ui.mouse, {
this.dropped = false;
}
- if ( ( this.options.revert === "invalid" && !dropped ) || ( this.options.revert === "valid" && dropped ) || this.options.revert === true || ( $.isFunction( this.options.revert ) && this.options.revert.call( this.element, dropped ) ) ) {
- $( this.helper ).animate( this.originalPosition, parseInt( this.options.revertDuration, 10 ), function() {
- if ( that._trigger( "stop", event ) !== false ) {
- that._clear();
+ if ( ( this.options.revert === "invalid" && !dropped ) ||
+ ( this.options.revert === "valid" && dropped ) ||
+ this.options.revert === true || ( $.isFunction( this.options.revert ) &&
+ this.options.revert.call( this.element, dropped ) )
+ ) {
+ $( this.helper ).animate(
+ this.originalPosition,
+ parseInt( this.options.revertDuration, 10 ),
+ function() {
+ if ( that._trigger( "stop", event ) !== false ) {
+ that._clear();
+ }
}
- } );
+ );
} else {
if ( this._trigger( "stop", event ) !== false ) {
this._clear();
@@ -309,7 +321,8 @@ $.widget( "ui.draggable", $.ui.mouse, {
_mouseUp: function( event ) {
this._unblockFrames();
- //If the ddmanager is used for droppables, inform the manager that dragging has stopped (see #5003)
+ // If the ddmanager is used for droppables, inform the manager that dragging has stopped
+ // (see #5003)
if ( $.ui.ddmanager ) {
$.ui.ddmanager.dragStop( this, event );
}
@@ -317,7 +330,8 @@ $.widget( "ui.draggable", $.ui.mouse, {
// Only need to focus if the event occurred on the draggable itself, see #10527
if ( this.handleElement.is( event.target ) ) {
- // The interaction is over; whether or not the click resulted in a drag, focus the element
+ // The interaction is over; whether or not the click resulted in a drag,
+ // focus the element
this.element.trigger( "focus" );
}
@@ -363,7 +377,9 @@ $.widget( "ui.draggable", $.ui.mouse, {
this.element );
if ( !helper.parents( "body" ).length ) {
- helper.appendTo( ( o.appendTo === "parent" ? this.element[ 0 ].parentNode : o.appendTo ) );
+ helper.appendTo( ( o.appendTo === "parent" ?
+ this.element[ 0 ].parentNode :
+ o.appendTo ) );
}
// Http://bugs.jqueryui.com/ticket/9446
@@ -373,7 +389,8 @@ $.widget( "ui.draggable", $.ui.mouse, {
this._setPositionRelative();
}
- if ( helper[ 0 ] !== this.element[ 0 ] && !( /(fixed|absolute)/ ).test( helper.css( "position" ) ) ) {
+ if ( helper[ 0 ] !== this.element[ 0 ] &&
+ !( /(fixed|absolute)/ ).test( helper.css( "position" ) ) ) {
helper.css( "position", "absolute" );
}
@@ -418,11 +435,15 @@ $.widget( "ui.draggable", $.ui.mouse, {
var po = this.offsetParent.offset(),
document = this.document[ 0 ];
- // This is a special case where we need to modify a offset calculated on start, since the following happened:
- // 1. The position of the helper is absolute, so it's position is calculated based on the next positioned parent
- // 2. The actual offset parent is a child of the scroll parent, and the scroll parent isn't the document, which means that
- // the scroll is included in the initial calculation of the offset of the parent, and never recalculated upon drag
- if ( this.cssPosition === "absolute" && this.scrollParent[ 0 ] !== document && $.contains( this.scrollParent[ 0 ], this.offsetParent[ 0 ] ) ) {
+ // This is a special case where we need to modify a offset calculated on start, since the
+ // following happened:
+ // 1. The position of the helper is absolute, so it's position is calculated based on the
+ // next positioned parent
+ // 2. The actual offset parent is a child of the scroll parent, and the scroll parent isn't
+ // the document, which means that the scroll is included in the initial calculation of the
+ // offset of the parent, and never recalculated upon drag
+ if ( this.cssPosition === "absolute" && this.scrollParent[ 0 ] !== document &&
+ $.contains( this.scrollParent[ 0 ], this.offsetParent[ 0 ] ) ) {
po.left += this.scrollParent.scrollLeft();
po.top += this.scrollParent.scrollTop();
}
@@ -447,8 +468,10 @@ $.widget( "ui.draggable", $.ui.mouse, {
scrollIsRootNode = this._isRootNode( this.scrollParent[ 0 ] );
return {
- top: p.top - ( parseInt( this.helper.css( "top" ), 10 ) || 0 ) + ( !scrollIsRootNode ? this.scrollParent.scrollTop() : 0 ),
- left: p.left - ( parseInt( this.helper.css( "left" ), 10 ) || 0 ) + ( !scrollIsRootNode ? this.scrollParent.scrollLeft() : 0 )
+ top: p.top - ( parseInt( this.helper.css( "top" ), 10 ) || 0 ) +
+ ( !scrollIsRootNode ? this.scrollParent.scrollTop() : 0 ),
+ left: p.left - ( parseInt( this.helper.css( "left" ), 10 ) || 0 ) +
+ ( !scrollIsRootNode ? this.scrollParent.scrollLeft() : 0 )
};
},
@@ -486,8 +509,11 @@ $.widget( "ui.draggable", $.ui.mouse, {
this.containment = [
$( window ).scrollLeft() - this.offset.relative.left - this.offset.parent.left,
$( window ).scrollTop() - this.offset.relative.top - this.offset.parent.top,
- $( window ).scrollLeft() + $( window ).width() - this.helperProportions.width - this.margins.left,
- $( window ).scrollTop() + ( $( window ).height() || document.body.parentNode.scrollHeight ) - this.helperProportions.height - this.margins.top
+ $( window ).scrollLeft() + $( window ).width() -
+ this.helperProportions.width - this.margins.left,
+ $( window ).scrollTop() +
+ ( $( window ).height() || document.body.parentNode.scrollHeight ) -
+ this.helperProportions.height - this.margins.top
];
return;
}
@@ -497,7 +523,8 @@ $.widget( "ui.draggable", $.ui.mouse, {
0,
0,
$( document ).width() - this.helperProportions.width - this.margins.left,
- ( $( document ).height() || document.body.parentNode.scrollHeight ) - this.helperProportions.height - this.margins.top
+ ( $( document ).height() || document.body.parentNode.scrollHeight ) -
+ this.helperProportions.height - this.margins.top
];
return;
}
@@ -521,8 +548,10 @@ $.widget( "ui.draggable", $.ui.mouse, {
isUserScrollable = /(scroll|auto)/.test( c.css( "overflow" ) );
this.containment = [
- ( parseInt( c.css( "borderLeftWidth" ), 10 ) || 0 ) + ( parseInt( c.css( "paddingLeft" ), 10 ) || 0 ),
- ( parseInt( c.css( "borderTopWidth" ), 10 ) || 0 ) + ( parseInt( c.css( "paddingTop" ), 10 ) || 0 ),
+ ( parseInt( c.css( "borderLeftWidth" ), 10 ) || 0 ) +
+ ( parseInt( c.css( "paddingLeft" ), 10 ) || 0 ),
+ ( parseInt( c.css( "borderTopWidth" ), 10 ) || 0 ) +
+ ( parseInt( c.css( "paddingTop" ), 10 ) || 0 ),
( isUserScrollable ? Math.max( ce.scrollWidth, ce.offsetWidth ) : ce.offsetWidth ) -
( parseInt( c.css( "borderRightWidth" ), 10 ) || 0 ) -
( parseInt( c.css( "paddingRight" ), 10 ) || 0 ) -
@@ -550,16 +579,32 @@ $.widget( "ui.draggable", $.ui.mouse, {
return {
top: (
- pos.top + // The absolute mouse position
- this.offset.relative.top * mod + // Only for relative positioned nodes: Relative offset from element to offset parent
- this.offset.parent.top * mod - // The offsetParent's offset without borders (offset + border)
- ( ( this.cssPosition === "fixed" ? -this.offset.scroll.top : ( scrollIsRootNode ? 0 : this.offset.scroll.top ) ) * mod )
+
+ // The absolute mouse position
+ pos.top +
+
+ // Only for relative positioned nodes: Relative offset from element to offset parent
+ this.offset.relative.top * mod +
+
+ // The offsetParent's offset without borders (offset + border)
+ this.offset.parent.top * mod -
+ ( ( this.cssPosition === "fixed" ?
+ -this.offset.scroll.top :
+ ( scrollIsRootNode ? 0 : this.offset.scroll.top ) ) * mod )
),
left: (
- pos.left + // The absolute mouse position
- this.offset.relative.left * mod + // Only for relative positioned nodes: Relative offset from element to offset parent
- this.offset.parent.left * mod - // The offsetParent's offset without borders (offset + border)
- ( ( this.cssPosition === "fixed" ? -this.offset.scroll.left : ( scrollIsRootNode ? 0 : this.offset.scroll.left ) ) * mod )
+
+ // The absolute mouse position
+ pos.left +
+
+ // Only for relative positioned nodes: Relative offset from element to offset parent
+ this.offset.relative.left * mod +
+
+ // The offsetParent's offset without borders (offset + border)
+ this.offset.parent.left * mod -
+ ( ( this.cssPosition === "fixed" ?
+ -this.offset.scroll.left :
+ ( scrollIsRootNode ? 0 : this.offset.scroll.left ) ) * mod )
)
};
@@ -617,12 +662,24 @@ $.widget( "ui.draggable", $.ui.mouse, {
if ( o.grid ) {
- //Check for grid elements set to 0 to prevent divide by 0 error causing invalid argument errors in IE (see ticket #6950)
- top = o.grid[ 1 ] ? this.originalPageY + Math.round( ( pageY - this.originalPageY ) / o.grid[ 1 ] ) * o.grid[ 1 ] : this.originalPageY;
- pageY = containment ? ( ( top - this.offset.click.top >= containment[ 1 ] || top - this.offset.click.top > containment[ 3 ] ) ? top : ( ( top - this.offset.click.top >= containment[ 1 ] ) ? top - o.grid[ 1 ] : top + o.grid[ 1 ] ) ) : top;
-
- left = o.grid[ 0 ] ? this.originalPageX + Math.round( ( pageX - this.originalPageX ) / o.grid[ 0 ] ) * o.grid[ 0 ] : this.originalPageX;
- pageX = containment ? ( ( left - this.offset.click.left >= containment[ 0 ] || left - this.offset.click.left > containment[ 2 ] ) ? left : ( ( left - this.offset.click.left >= containment[ 0 ] ) ? left - o.grid[ 0 ] : left + o.grid[ 0 ] ) ) : left;
+ //Check for grid elements set to 0 to prevent divide by 0 error causing invalid
+ // argument errors in IE (see ticket #6950)
+ top = o.grid[ 1 ] ? this.originalPageY + Math.round( ( pageY -
+ this.originalPageY ) / o.grid[ 1 ] ) * o.grid[ 1 ] : this.originalPageY;
+ pageY = containment ? ( ( top - this.offset.click.top >= containment[ 1 ] ||
+ top - this.offset.click.top > containment[ 3 ] ) ?
+ top :
+ ( ( top - this.offset.click.top >= containment[ 1 ] ) ?
+ top - o.grid[ 1 ] : top + o.grid[ 1 ] ) ) : top;
+
+ left = o.grid[ 0 ] ? this.originalPageX +
+ Math.round( ( pageX - this.originalPageX ) / o.grid[ 0 ] ) * o.grid[ 0 ] :
+ this.originalPageX;
+ pageX = containment ? ( ( left - this.offset.click.left >= containment[ 0 ] ||
+ left - this.offset.click.left > containment[ 2 ] ) ?
+ left :
+ ( ( left - this.offset.click.left >= containment[ 0 ] ) ?
+ left - o.grid[ 0 ] : left + o.grid[ 0 ] ) ) : left;
}
if ( o.axis === "y" ) {
@@ -636,18 +693,38 @@ $.widget( "ui.draggable", $.ui.mouse, {
return {
top: (
- pageY - // The absolute mouse position
- this.offset.click.top - // Click offset (relative to the element)
- this.offset.relative.top - // Only for relative positioned nodes: Relative offset from element to offset parent
- this.offset.parent.top + // The offsetParent's offset without borders (offset + border)
- ( this.cssPosition === "fixed" ? -this.offset.scroll.top : ( scrollIsRootNode ? 0 : this.offset.scroll.top ) )
+
+ // The absolute mouse position
+ pageY -
+
+ // Click offset (relative to the element)
+ this.offset.click.top -
+
+ // Only for relative positioned nodes: Relative offset from element to offset parent
+ this.offset.relative.top -
+
+ // The offsetParent's offset without borders (offset + border)
+ this.offset.parent.top +
+ ( this.cssPosition === "fixed" ?
+ -this.offset.scroll.top :
+ ( scrollIsRootNode ? 0 : this.offset.scroll.top ) )
),
left: (
- pageX - // The absolute mouse position
- this.offset.click.left - // Click offset (relative to the element)
- this.offset.relative.left - // Only for relative positioned nodes: Relative offset from element to offset parent
- this.offset.parent.left + // The offsetParent's offset without borders (offset + border)
- ( this.cssPosition === "fixed" ? -this.offset.scroll.left : ( scrollIsRootNode ? 0 : this.offset.scroll.left ) )
+
+ // The absolute mouse position
+ pageX -
+
+ // Click offset (relative to the element)
+ this.offset.click.left -
+
+ // Only for relative positioned nodes: Relative offset from element to offset parent
+ this.offset.relative.left -
+
+ // The offsetParent's offset without borders (offset + border)
+ this.offset.parent.left +
+ ( this.cssPosition === "fixed" ?
+ -this.offset.scroll.left :
+ ( scrollIsRootNode ? 0 : this.offset.scroll.left ) )
)
};
@@ -936,7 +1013,8 @@ $.ui.plugin.add( "draggable", "scroll", {
i.scrollParentNotHidden = i.helper.scrollParent( false );
}
- if ( i.scrollParentNotHidden[ 0 ] !== i.document[ 0 ] && i.scrollParentNotHidden[ 0 ].tagName !== "HTML" ) {
+ if ( i.scrollParentNotHidden[ 0 ] !== i.document[ 0 ] &&
+ i.scrollParentNotHidden[ 0 ].tagName !== "HTML" ) {
i.overflowOffset = i.scrollParentNotHidden.offset();
}
},
@@ -949,7 +1027,8 @@ $.ui.plugin.add( "draggable", "scroll", {
if ( scrollParent !== document && scrollParent.tagName !== "HTML" ) {
if ( !o.axis || o.axis !== "x" ) {
- if ( ( i.overflowOffset.top + scrollParent.offsetHeight ) - event.pageY < o.scrollSensitivity ) {
+ if ( ( i.overflowOffset.top + scrollParent.offsetHeight ) - event.pageY <
+ o.scrollSensitivity ) {
scrollParent.scrollTop = scrolled = scrollParent.scrollTop + o.scrollSpeed;
} else if ( event.pageY - i.overflowOffset.top < o.scrollSensitivity ) {
scrollParent.scrollTop = scrolled = scrollParent.scrollTop - o.scrollSpeed;
@@ -957,7 +1036,8 @@ $.ui.plugin.add( "draggable", "scroll", {
}
if ( !o.axis || o.axis !== "y" ) {
- if ( ( i.overflowOffset.left + scrollParent.offsetWidth ) - event.pageX < o.scrollSensitivity ) {
+ if ( ( i.overflowOffset.left + scrollParent.offsetWidth ) - event.pageX <
+ o.scrollSensitivity ) {
scrollParent.scrollLeft = scrolled = scrollParent.scrollLeft + o.scrollSpeed;
} else if ( event.pageX - i.overflowOffset.left < o.scrollSensitivity ) {
scrollParent.scrollLeft = scrolled = scrollParent.scrollLeft - o.scrollSpeed;
@@ -969,16 +1049,22 @@ $.ui.plugin.add( "draggable", "scroll", {
if ( !o.axis || o.axis !== "x" ) {
if ( event.pageY - $( document ).scrollTop() < o.scrollSensitivity ) {
scrolled = $( document ).scrollTop( $( document ).scrollTop() - o.scrollSpeed );
- } else if ( $( window ).height() - ( event.pageY - $( document ).scrollTop() ) < o.scrollSensitivity ) {
+ } else if ( $( window ).height() - ( event.pageY - $( document ).scrollTop() ) <
+ o.scrollSensitivity ) {
scrolled = $( document ).scrollTop( $( document ).scrollTop() + o.scrollSpeed );
}
}
if ( !o.axis || o.axis !== "y" ) {
if ( event.pageX - $( document ).scrollLeft() < o.scrollSensitivity ) {
- scrolled = $( document ).scrollLeft( $( document ).scrollLeft() - o.scrollSpeed );
- } else if ( $( window ).width() - ( event.pageX - $( document ).scrollLeft() ) < o.scrollSensitivity ) {
- scrolled = $( document ).scrollLeft( $( document ).scrollLeft() + o.scrollSpeed );
+ scrolled = $( document ).scrollLeft(
+ $( document ).scrollLeft() - o.scrollSpeed
+ );
+ } else if ( $( window ).width() - ( event.pageX - $( document ).scrollLeft() ) <
+ o.scrollSensitivity ) {
+ scrolled = $( document ).scrollLeft(
+ $( document ).scrollLeft() + o.scrollSpeed
+ );
}
}
@@ -998,17 +1084,18 @@ $.ui.plugin.add( "draggable", "snap", {
i.snapElements = [];
- $( o.snap.constructor !== String ? ( o.snap.items || ":data(ui-draggable)" ) : o.snap ).each( function() {
- var $t = $( this ),
- $o = $t.offset();
- if ( this !== i.element[ 0 ] ) {
- i.snapElements.push( {
- item: this,
- width: $t.outerWidth(), height: $t.outerHeight(),
- top: $o.top, left: $o.left
- } );
- }
- } );
+ $( o.snap.constructor !== String ? ( o.snap.items || ":data(ui-draggable)" ) : o.snap )
+ .each( function() {
+ var $t = $( this ),
+ $o = $t.offset();
+ if ( this !== i.element[ 0 ] ) {
+ i.snapElements.push( {
+ item: this,
+ width: $t.outerWidth(), height: $t.outerHeight(),
+ top: $o.top, left: $o.left
+ } );
+ }
+ } );
},
drag: function( event, ui, inst ) {
@@ -1026,9 +1113,16 @@ $.ui.plugin.add( "draggable", "snap", {
t = inst.snapElements[ i ].top - inst.margins.top;
b = t + inst.snapElements[ i ].height;
- if ( x2 < l - d || x1 > r + d || y2 < t - d || y1 > b + d || !$.contains( inst.snapElements[ i ].item.ownerDocument, inst.snapElements[ i ].item ) ) {
+ if ( x2 < l - d || x1 > r + d || y2 < t - d || y1 > b + d ||
+ !$.contains( inst.snapElements[ i ].item.ownerDocument,
+ inst.snapElements[ i ].item ) ) {
if ( inst.snapElements[ i ].snapping ) {
- ( inst.options.snap.release && inst.options.snap.release.call( inst.element, event, $.extend( inst._uiHash(), { snapItem: inst.snapElements[ i ].item } ) ) );
+ ( inst.options.snap.release &&
+ inst.options.snap.release.call(
+ inst.element,
+ event,
+ $.extend( inst._uiHash(), { snapItem: inst.snapElements[ i ].item } )
+ ) );
}
inst.snapElements[ i ].snapping = false;
continue;
@@ -1040,16 +1134,28 @@ $.ui.plugin.add( "draggable", "snap", {
ls = Math.abs( l - x2 ) <= d;
rs = Math.abs( r - x1 ) <= d;
if ( ts ) {
- ui.position.top = inst._convertPositionTo( "relative", { top: t - inst.helperProportions.height, left: 0 } ).top;
+ ui.position.top = inst._convertPositionTo( "relative", {
+ top: t - inst.helperProportions.height,
+ left: 0
+ } ).top;
}
if ( bs ) {
- ui.position.top = inst._convertPositionTo( "relative", { top: b, left: 0 } ).top;
+ ui.position.top = inst._convertPositionTo( "relative", {
+ top: b,
+ left: 0
+ } ).top;
}
if ( ls ) {
- ui.position.left = inst._convertPositionTo( "relative", { top: 0, left: l - inst.helperProportions.width } ).left;
+ ui.position.left = inst._convertPositionTo( "relative", {
+ top: 0,
+ left: l - inst.helperProportions.width
+ } ).left;
}
if ( rs ) {
- ui.position.left = inst._convertPositionTo( "relative", { top: 0, left: r } ).left;
+ ui.position.left = inst._convertPositionTo( "relative", {
+ top: 0,
+ left: r
+ } ).left;
}
}
@@ -1061,21 +1167,39 @@ $.ui.plugin.add( "draggable", "snap", {
ls = Math.abs( l - x1 ) <= d;
rs = Math.abs( r - x2 ) <= d;
if ( ts ) {
- ui.position.top = inst._convertPositionTo( "relative", { top: t, left: 0 } ).top;
+ ui.position.top = inst._convertPositionTo( "relative", {
+ top: t,
+ left: 0
+ } ).top;
}
if ( bs ) {
- ui.position.top = inst._convertPositionTo( "relative", { top: b - inst.helperProportions.height, left: 0 } ).top;
+ ui.position.top = inst._convertPositionTo( "relative", {
+ top: b - inst.helperProportions.height,
+ left: 0
+ } ).top;
}
if ( ls ) {
- ui.position.left = inst._convertPositionTo( "relative", { top: 0, left: l } ).left;
+ ui.position.left = inst._convertPositionTo( "relative", {
+ top: 0,
+ left: l
+ } ).left;
}
if ( rs ) {
- ui.position.left = inst._convertPositionTo( "relative", { top: 0, left: r - inst.helperProportions.width } ).left;
+ ui.position.left = inst._convertPositionTo( "relative", {
+ top: 0,
+ left: r - inst.helperProportions.width
+ } ).left;
}
}
if ( !inst.snapElements[ i ].snapping && ( ts || bs || ls || rs || first ) ) {
- ( inst.options.snap.snap && inst.options.snap.snap.call( inst.element, event, $.extend( inst._uiHash(), { snapItem: inst.snapElements[ i ].item } ) ) );
+ ( inst.options.snap.snap &&
+ inst.options.snap.snap.call(
+ inst.element,
+ event,
+ $.extend( inst._uiHash(), {
+ snapItem: inst.snapElements[ i ].item
+ } ) ) );
}
inst.snapElements[ i ].snapping = ( ts || bs || ls || rs || first );
@@ -1089,7 +1213,8 @@ $.ui.plugin.add( "draggable", "stack", {
var min,
o = instance.options,
group = $.makeArray( $( o.stack ) ).sort( function( a, b ) {
- return ( parseInt( $( a ).css( "zIndex" ), 10 ) || 0 ) - ( parseInt( $( b ).css( "zIndex" ), 10 ) || 0 );
+ return ( parseInt( $( a ).css( "zIndex" ), 10 ) || 0 ) -
+ ( parseInt( $( b ).css( "zIndex" ), 10 ) || 0 );
} );
if ( !group.length ) { return; }