library-mirrors/jquery-ui
1
0
Fork 0
mirror of https://github.com/jquery/jquery-ui.git synced 2024-10-05 01:44:18 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

Draggable: Handle containment set to false after init, and style improvements. Fixes #8962 - Containment doesn't properly update

Browse Source
This commit is contained in:
Mike Sherov 2013-03-23 04:12:52 +02:00
parent f306a826a4
commit dc5254aa07
2 changed files with 61 additions and 45 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
tests/unit/draggable/draggable_options.js
View File

@ -378,7 +378,7 @@ test( "containment, account for border", function() {
});
test( "containment, default, switching after initialization", function() {
expect( 2 );
expect( 3 );
var element = $( "#draggable1" ).draggable({ containment: false });
@ -393,9 +393,8 @@ test( "containment, default, switching after initialization", function() {
TestHelpers.draggable.testDrag( element, element, -100, -100, 0, 0 );
// TODO: Switching back to false does not update to false
// element.draggable( "option", "containment", false );
// TestHelpers.draggable.testDrag( element, element, -100, -100, -100, -100 );
element.draggable( "option", "containment", false );
TestHelpers.draggable.testDrag( element, element, -100, -100, -100, -100 );
});
test( "{ cursor: 'auto' }, default", function() {

99
ui/jquery.ui.draggable.js vendored
View File

@ -156,9 +156,7 @@ $.widget("ui.draggable", $.ui.mouse, {
(o.cursorAt && this._adjustOffsetFromHelper(o.cursorAt));
//Set a containment if given in the options
if(o.containment) {
this._setContainment();
}
this._setContainment();
//Trigger event + callbacks
if(this._trigger("start", event) === false) {
@ -383,40 +381,56 @@ $.widget("ui.draggable", $.ui.mouse, {
var over, c, ce,
o = this.options;
if(o.containment === "parent") {
o.containment = this.helper[0].parentNode;
}
if(o.containment === "document" || o.containment === "window") {
this.containment = [
o.containment === "document" ? 0 : $(window).scrollLeft() - this.offset.relative.left - this.offset.parent.left,
o.containment === "document" ? 0 : $(window).scrollTop() - this.offset.relative.top - this.offset.parent.top,
(o.containment === "document" ? 0 : $(window).scrollLeft()) + $(o.containment === "document" ? document : window).width() - this.helperProportions.width - this.margins.left,
(o.containment === "document" ? 0 : $(window).scrollTop()) + ($(o.containment === "document" ? document : window).height() || document.body.parentNode.scrollHeight) - this.helperProportions.height - this.margins.top
];
if ( !o.containment ) {
this.containment = null;
return;
}
if(!(/^(document|window|parent)$/).test(o.containment) && o.containment.constructor !== Array) {
c = $(o.containment);
ce = c[0];
if(!ce) {
return;
}
over = ($(ce).css("overflow") !== "hidden");
if ( o.containment === "window" ) {
this.containment = [
(parseInt($(ce).css("borderLeftWidth"),10) || 0) + (parseInt($(ce).css("paddingLeft"),10) || 0),
(parseInt($(ce).css("borderTopWidth"),10) || 0) + (parseInt($(ce).css("paddingTop"),10) || 0),
(over ? Math.max(ce.scrollWidth,ce.offsetWidth) : ce.offsetWidth) - (parseInt($(ce).css("borderRightWidth"),10) || 0) - (parseInt($(ce).css("paddingRight"),10) || 0) - this.helperProportions.width - this.margins.left - this.margins.right,
(over ? Math.max(ce.scrollHeight,ce.offsetHeight) : ce.offsetHeight) - (parseInt($(ce).css("borderBottomWidth"),10) || 0) - (parseInt($(ce).css("paddingBottom"),10) || 0) - this.helperProportions.height - this.margins.top - this.margins.bottom
$( 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
];
this.relative_container = c;
return;
}
} else if(o.containment.constructor === Array) {
if ( o.containment === "document") {
this.containment = [
0,
0,
$( document ).width() - this.helperProportions.width - this.margins.left,
( $( document ).height() || document.body.parentNode.scrollHeight ) - this.helperProportions.height - this.margins.top
];
return;
}
if ( o.containment.constructor === Array ) {
this.containment = o.containment;
return;
}
if ( o.containment === "parent" ) {
o.containment = this.helper[ 0 ].parentNode;
}
c = $( o.containment );
ce = c[ 0 ];
if( !ce ) {
return;
}
over = c.css( "overflow" ) !== "hidden";
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 ) ,
( over ? Math.max( ce.scrollWidth, ce.offsetWidth ) : ce.offsetWidth ) - ( parseInt( c.css( "borderRightWidth" ), 10 ) || 0 ) - ( parseInt( c.css( "paddingRight" ), 10 ) || 0 ) - this.helperProportions.width - this.margins.left - this.margins.right,
( over ? Math.max( ce.scrollHeight, ce.offsetHeight ) : ce.offsetHeight ) - ( parseInt( c.css( "borderBottomWidth" ), 10 ) || 0 ) - ( parseInt( c.css( "paddingBottom" ), 10 ) || 0 ) - this.helperProportions.height - this.margins.top - this.margins.bottom
];
this.relative_container = c;
},
_convertPositionTo: function(d, pos) {
@ -469,18 +483,21 @@ $.widget("ui.draggable", $.ui.mouse, {
* Constrain the position to a mix of grid, containment.
*/
if(this.originalPosition) { //If we are not dragging yet, we won't check for options
if(this.containment) {
if (this.relative_container){
co = this.relative_container.offset();
containment = [ this.containment[0] + co.left,
this.containment[1] + co.top,
this.containment[2] + co.left,
this.containment[3] + co.top ];
}
else {
containment = this.containment;
}
// If we are not dragging yet, we won't check for options
if ( this.originalPosition ) {
if ( this.containment ) {
if ( this.relative_container ){
co = this.relative_container.offset();
containment = [
this.containment[ 0 ] + co.left,
this.containment[ 1 ] + co.top,
this.containment[ 2 ] + co.left,
this.containment[ 3 ] + co.top
];
}
else {
containment = this.containment;
}
if(event.pageX - this.offset.click.left < containment[0]) {
pageX = containment[0] + this.offset.click.left;