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

This commit is contained in:
Ethan Romba 2012-07-10 10:21:56 -07:00 committed by Mike Sherov
parent 48e0aa0fd2
commit 6e0a0553ce
2 changed files with 43 additions and 15 deletions

View File

@ -117,6 +117,20 @@ test("grid", function() {
equal( target.height(), 120, "compare height"); 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() { test("grid (wrapped)", function() {
expect(4); expect(4);

View File

@ -769,25 +769,39 @@ $.ui.plugin.add("resizable", "grid", {
resize: function() { resize: function() {
var that = $(this).data("resizable"), o = that.options, cs = that.size, os = that.originalSize, op = that.originalPosition, a = that.axis; 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; 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)) { if (/^(se|s|e)$/.test(a)) {
that.size.width = os.width + ox; that.size.width = newWidth;
that.size.height = os.height + oy; that.size.height = newHeight;
} } else if (/^(ne)$/.test(a)) {
else if (/^(ne)$/.test(a)) { that.size.width = newWidth;
that.size.width = os.width + ox; that.size.height = newHeight;
that.size.height = os.height + oy;
that.position.top = op.top - oy; that.position.top = op.top - oy;
} } else if (/^(sw)$/.test(a)) {
else if (/^(sw)$/.test(a)) { that.size.width = newWidth;
that.size.width = os.width + ox; that.size.height = newHeight;
that.size.height = os.height + oy;
that.position.left = op.left - ox; that.position.left = op.left - ox;
} } else {
else { that.size.width = newWidth;
that.size.width = os.width + ox; that.size.height = newHeight;
that.size.height = os.height + oy;
that.position.top = op.top - oy; that.position.top = op.top - oy;
that.position.left = op.left - ox; that.position.left = op.left - ox;
} }