Resizable: Only resize/reposition if size is greater than specified grid

Fixes #9611
Closes gh-1132

diff --git a/tests/unit/resizable/resizable_options.js b/tests/unit/resizable/resizable_options.js
index 8da189d966905444862203f856c1471da6035e02..34fef47f02e4ab46f50ad8d47b0dc192f42bb14a 100644 (file)
--- a/tests/unit/resizable/resizable_options.js
+++ b/tests/unit/resizable/resizable_options.js
@@ -224,6 +224,29 @@ test("grid (wrapped)", function() {
        equal( target.height(), 120, "compare height");
 });
 
+test( "grid - Resizable: can be moved when grid option is set (#9611)", function() {
+       expect( 6 );
+
+       var oldPosition,
+               handle = ".ui-resizable-nw",
+               target = $( "#resizable1" ).resizable({
+                       handles: "all",
+                       grid: 50
+               });
+
+       TestHelpers.resizable.drag( handle, 50, 50 );
+       equal( target.width(), 50, "compare width" );
+       equal( target.height(), 50, "compare height" );
+
+       oldPosition = target.position();
+
+       TestHelpers.resizable.drag( handle, 50, 50 );
+       equal( target.width(), 50, "compare width" );
+       equal( target.height(), 50, "compare height" );
+       equal( target.position().top, oldPosition.top, "compare top" );
+       equal( target.position().left, oldPosition.left, "compare left" );
+});
+
 test("ui-resizable-se { handles: 'all', minWidth: 60, minHeight: 60, maxWidth: 100, maxHeight: 100 }", function() {
        expect(4);
 

diff --git a/ui/jquery.ui.resizable.js b/ui/jquery.ui.resizable.js
index 3470e88eb52ee829ecedccf30d00135a22ab5bf6..636cf41232f84778462f2aee1912d187381ed04e 100644 (file)
--- a/ui/jquery.ui.resizable.js
+++ b/ui/jquery.ui.resizable.js
@@ -1002,10 +1002,20 @@ $.ui.plugin.add("resizable", "grid", {
                        that.size.height = newHeight;
                        that.position.left = op.left - ox;
                } else {
-                       that.size.width = newWidth;
-                       that.size.height = newHeight;
-                       that.position.top = op.top - oy;
-                       that.position.left = op.left - ox;
+                       if ( newHeight - gridY > 0 ) {
+                               that.size.height = newHeight;
+                               that.position.top = op.top - oy;
+                       } else {
+                               that.size.height = gridY;
+                               that.position.top = op.top + os.height - gridY;
+                       }
+                       if ( newWidth - gridX > 0 ) {
+                               that.size.width = newWidth;
+                               that.position.left = op.left - ox;
+                       } else {
+                               that.size.width = gridX;
+                               that.position.left = op.left + os.width - gridX;
+                       }
                }
        }