Skip to content
This repository

HTTPS clone URL

Subversion checkout URL

You can clone with HTTPS or Subversion.

Download ZIP

Resizable: Grid now respects min/max dimensions. Fixed #8435. #815

Closed
wants to merge 2 commits into from

2 participants

Ethan Romba Mike Sherov
Ethan Romba

(Follow-up to jquery/jquery-ui#695)

This pull request includes a fix and test case for #8435.

Mike Sherov
Collaborator

The same style standards comments I made on your other pull apply here as well. Thanks again!

Ethan Romba

This most recent commit should do the trick.

Mike Sherov
Collaborator

Thanks! landed in 6e0a055

Mike Sherov mikesherov closed this November 09, 2012
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Showing 2 unique commits by 3 authors.

Nov 08, 2012
Resizable: Grid now respects min/max dimensions. Fixed #8435 - grid does
not respect min/max dimensions
4bf2709
Nov 09, 2012
Ethan Romba Resizable: Updated grid plugin and tests to adhere to style guidelines 50ef441
This page is out of date. Refresh to see the latest.
14  tests/unit/resizable/resizable_options.js
@@ -117,6 +117,20 @@ test("grid", function() {
117 117
 	equal( target.height(), 120, "compare height");
118 118
 });
119 119
 
  120
+test("grid (min/max dimensions)", function() {
  121
+	expect(4);
  122
+
  123
+	var handle = ".ui-resizable-se", target = $("#resizable1").resizable({ handles: "all", grid: 20, minWidth: 65, minHeight: 65, maxWidth: 135, maxHeight: 135 });
  124
+
  125
+	TestHelpers.resizable.drag(handle, 50, 50);
  126
+	equal( target.width(), 120, "grid should respect maxWidth");
  127
+	equal( target.height(), 120, "grid should respect maxHeight");
  128
+
  129
+	TestHelpers.resizable.drag(handle, -100, -100);
  130
+	equal( target.width(), 80, "grid should respect minWidth");
  131
+	equal( target.height(), 80, "grid should respect minHeight");
  132
+});
  133
+
120 134
 test("grid (wrapped)", function() {
121 135
 	expect(4);
122 136
 
44  ui/jquery.ui.resizable.js
@@ -769,25 +769,39 @@ $.ui.plugin.add("resizable", "grid", {
769 769
 	resize: function() {
770 770
 		var that = $(this).data("resizable"), o = that.options, cs = that.size, os = that.originalSize, op = that.originalPosition, a = that.axis;
771 771
 		o.grid = typeof o.grid == "number" ? [o.grid, o.grid] : o.grid;
772  
-		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);
  772
+		var gridX = (o.grid[0]||1), gridY = (o.grid[1]||1),
  773
+			ox = Math.round((cs.width - os.width) / gridX) * gridX, oy = Math.round((cs.height - os.height) / gridY) * gridY,
  774
+			newWidth = os.width + ox, newHeight = os.height + oy,
  775
+			isMaxWidth = o.maxWidth && (o.maxWidth < newWidth), isMaxHeight = o.maxHeight && (o.maxHeight < newHeight),
  776
+			isMinWidth = o.minWidth && (o.minWidth > newWidth), isMinHeight = o.minHeight && (o.minHeight > newHeight);
  777
+
  778
+		if (isMinWidth) {
  779
+			newWidth = newWidth + gridX;
  780
+		}
  781
+		if (isMinHeight) {
  782
+			newHeight = newHeight + gridY;
  783
+		}
  784
+		if (isMaxWidth) {
  785
+			newWidth = newWidth - gridX;
  786
+		}
  787
+		if (isMaxHeight) {
  788
+			newHeight = newHeight - gridY;
  789
+		}
773 790
 
774 791
 		if (/^(se|s|e)$/.test(a)) {
775  
-			that.size.width = os.width + ox;
776  
-			that.size.height = os.height + oy;
777  
-		}
778  
-		else if (/^(ne)$/.test(a)) {
779  
-			that.size.width = os.width + ox;
780  
-			that.size.height = os.height + oy;
  792
+			that.size.width = newWidth;
  793
+			that.size.height = newHeight;
  794
+		} else if (/^(ne)$/.test(a)) {
  795
+			that.size.width = newWidth;
  796
+			that.size.height = newHeight;
781 797
 			that.position.top = op.top - oy;
782  
-		}
783  
-		else if (/^(sw)$/.test(a)) {
784  
-			that.size.width = os.width + ox;
785  
-			that.size.height = os.height + oy;
  798
+		} else if (/^(sw)$/.test(a)) {
  799
+			that.size.width = newWidth;
  800
+			that.size.height = newHeight;
786 801
 			that.position.left = op.left - ox;
787  
-		}
788  
-		else {
789  
-			that.size.width = os.width + ox;
790  
-			that.size.height = os.height + oy;
  802
+		} else {
  803
+			that.size.width = newWidth;
  804
+			that.size.height = newHeight;
791 805
 			that.position.top = op.top - oy;
792 806
 			that.position.left = op.left - ox;
793 807
 		}
Commit_comment_tip

Tip: You can add notes to lines in a file. Hover to the left of a line to make a note

Something went wrong with that request. Please try again.