Draggable: Fix border containment. Fixed #5569 - Draggable: Containment incorrectly...

diff --git a/tests/unit/draggable/draggable_options.js b/tests/unit/draggable/draggable_options.js
index ccbe7224ac7e9030740b9817b6234d47d8496057..2e9f85c242790a2488e9911f0ec6537522990900 100644 (file)
--- a/tests/unit/draggable/draggable_options.js
+++ b/tests/unit/draggable/draggable_options.js
@@ -346,6 +346,37 @@ test( "{ containment: 'parent' }, absolute", function() {
        deepEqual( offsetAfter, expected, "compare offset to parent" );
 });
 
+test( "containment, account for border", function() {
+       expect( 2 );
+
+       var el = $("#draggable1").appendTo("#main"),
+               parent = el.parent().css({
+                       height: "100px",
+                       width: "100px",
+                       borderStyle: "solid",
+                       borderWidth: "5px 10px 15px 20px"
+               }),
+               parentBottom = parent.offset().top + parent.outerHeight(),
+               parentRight = parent.offset().left + parent.outerWidth(),
+               parentBorderBottom = TestHelpers.draggable.border( parent, "bottom" ),
+               parentBorderRight = TestHelpers.draggable.border( parent, "right" );
+
+       el.css({
+               height: "5px",
+               width: "5px"
+       }).draggable({ containment: "parent" });
+
+       el.simulate( "drag", {
+               dx: 100,
+               dy: 100
+       });
+
+       equal( el.offset().top, parentBottom - parentBorderBottom - el.height(),
+               "The draggable should be on top of its parent's bottom border" );
+       equal( el.offset().left, parentRight - parentBorderRight - el.width(),
+               "The draggable should be to the right of its parent's right border" );
+});
+
 test( "containment, default, switching after initialization", function() {
        expect( 2 );
 

diff --git a/ui/jquery.ui.draggable.js b/ui/jquery.ui.draggable.js
index 7c1fb33610693f519092999ad72955c07b12af63..56b8fc77d84ff271e9a2a41051809fd5ec7fe597 100644 (file)
--- a/ui/jquery.ui.draggable.js
+++ b/ui/jquery.ui.draggable.js
@@ -421,8 +421,8 @@ $.widget("ui.draggable", $.ui.mouse, {
                        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("borderLeftWidth"),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("borderTopWidth"),10) || 0) - (parseInt($(ce).css("paddingBottom"),10) || 0) - this.helperProportions.height - this.margins.top  - this.margins.bottom
+                               (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
                        ];
                        this.relative_container = c;