Resizable: Grid now respects min/max dimensions. Fixed #8435 - grid does not respect...

diff --git a/tests/unit/resizable/resizable_options.js b/tests/unit/resizable/resizable_options.js
index 730a3389a80efaa2739340b2a57a4e14a7a319fc..4b47762ab8799d22029c32027401bc8659a518f1 100644 (file)
--- a/tests/unit/resizable/resizable_options.js
+++ b/tests/unit/resizable/resizable_options.js
@@ -117,6 +117,20 @@ test("grid", function() {
        equal( target.height(), 120, "compare height");
 });
 
+test("grid (min/max dimensions)", function() {
+       expect(4);
+
+       var handle = ".ui-resizable-se", target = $("#resizable1").resizable({ handles: "all", grid: 20, minWidth: 65, minHeight: 65, maxWidth: 135, maxHeight: 135 });
+
+       TestHelpers.resizable.drag(handle, 50, 50);
+       equal( target.width(), 120, "grid should respect maxWidth");
+       equal( target.height(), 120, "grid should respect maxHeight");
+
+       TestHelpers.resizable.drag(handle, -100, -100);
+       equal( target.width(), 80, "grid should respect minWidth");
+       equal( target.height(), 80, "grid should respect minHeight");
+});
+
 test("grid (wrapped)", function() {
        expect(4);
 

diff --git a/ui/jquery.ui.resizable.js b/ui/jquery.ui.resizable.js
index c2ad2871623f7b55cffd8e646cf73d29d75c2c29..c701c06be6f39bda201d7f8da852272265f00c62 100644 (file)
--- a/ui/jquery.ui.resizable.js
+++ b/ui/jquery.ui.resizable.js
@@ -769,25 +769,39 @@ $.ui.plugin.add("resizable", "grid", {
        resize: function() {
                var that = $(this).data("resizable"), o = that.options, cs = that.size, os = that.originalSize, op = that.originalPosition, a = that.axis;
                o.grid = typeof o.grid == "number" ? [o.grid, o.grid] : o.grid;
-               var ox = Math.round((cs.width - os.width) / (o.grid[0]||1)) * (o.grid[0]||1), oy = Math.round((cs.height - os.height) / (o.grid[1]||1)) * (o.grid[1]||1);
+               var gridX = (o.grid[0]||1), gridY = (o.grid[1]||1),
+                       ox = Math.round((cs.width - os.width) / gridX) * gridX, oy = Math.round((cs.height - os.height) / gridY) * gridY,
+                       newWidth = os.width + ox, newHeight = os.height + oy,
+                       isMaxWidth = o.maxWidth && (o.maxWidth < newWidth), isMaxHeight = o.maxHeight && (o.maxHeight < newHeight),
+                       isMinWidth = o.minWidth && (o.minWidth > newWidth), isMinHeight = o.minHeight && (o.minHeight > newHeight);
+
+               if (isMinWidth) {
+                       newWidth = newWidth + gridX;
+               }
+               if (isMinHeight) {
+                       newHeight = newHeight + gridY;
+               }
+               if (isMaxWidth) {
+                       newWidth = newWidth - gridX;
+               }
+               if (isMaxHeight) {
+                       newHeight = newHeight - gridY;
+               }
 
                if (/^(se|s|e)$/.test(a)) {
-                       that.size.width = os.width + ox;
-                       that.size.height = os.height + oy;
-               }
-               else if (/^(ne)$/.test(a)) {
-                       that.size.width = os.width + ox;
-                       that.size.height = os.height + oy;
+                       that.size.width = newWidth;
+                       that.size.height = newHeight;
+               } else if (/^(ne)$/.test(a)) {
+                       that.size.width = newWidth;
+                       that.size.height = newHeight;
                        that.position.top = op.top - oy;
-               }
-               else if (/^(sw)$/.test(a)) {
-                       that.size.width = os.width + ox;
-                       that.size.height = os.height + oy;
+               } else if (/^(sw)$/.test(a)) {
+                       that.size.width = newWidth;
+                       that.size.height = newHeight;
                        that.position.left = op.left - ox;
-               }
-               else {
-                       that.size.width = os.width + ox;
-                       that.size.height = os.height + oy;
+               } else {
+                       that.size.width = newWidth;
+                       that.size.height = newHeight;
                        that.position.top = op.top - oy;
                        that.position.left = op.left - ox;
                }