--- a/integration/js/cutout.js Tue Mar 19 13:19:59 2013 +0100
+++ b/integration/js/cutout.js Tue Mar 19 13:26:31 2013 +0100
@@ -257,6 +257,16 @@
closed = true;
}
+ if (
+ points.length === 4
+ && points[0].x === points[3].x
+ && points[0].y === points[1].y
+ && points[1].x === points[2].x
+ && points[2].y === points[3].y
+ ) {
+ rectangleMode = true;
+ }
+
redrawPath();
}
--- a/src/egonomy/static/egonomy/js/cutout.js Tue Mar 19 13:19:59 2013 +0100
+++ b/src/egonomy/static/egonomy/js/cutout.js Tue Mar 19 13:26:31 2013 +0100
@@ -37,6 +37,7 @@
}
redrawPath();
pathDragging = true;
+ rectangleMode = true;
}
var x = mx - offset.left,
@@ -56,6 +57,7 @@
);
function resetPoints() {
+ rectangleMode = false;
points.forEach(function(p) {
p.handle.remove();
});
@@ -70,6 +72,8 @@
y: Math.floor(y)
}
+ var pointsWithSameX = [], pointsWithSameY = [];
+
var pointrect = paper.rect(0, 0, HANDLESIZE, HANDLESIZE)
.attr({
stroke: PATHCOLOR,
@@ -82,11 +86,27 @@
pointDragging = true;
point.x = dx + dragdeltax;
point.y = dy + dragdeltay;
+ if (rectangleMode) {
+ pointsWithSameX.forEach(function(p) {
+ p.x = point.x;
+ });
+ pointsWithSameY.forEach(function(p) {
+ p.y = point.y;
+ });
+ }
redrawPath();
},
function() {
dragdeltax = point.x;
dragdeltay = point.y;
+ if (rectangleMode) {
+ pointsWithSameX = points.filter(function(p) {
+ return p !== point && p.x === point.x;
+ });
+ pointsWithSameY = points.filter(function(p) {
+ return p !== point && p.y === point.y;
+ });
+ }
},
function() {
setTimeout(function() {
@@ -118,6 +138,10 @@
return;
}
+ if (rectangleMode) {
+ resetPoints();
+ }
+
clearTimeout(closeTimeout);
closed = false;
@@ -179,7 +203,7 @@
var transd = "M"
+ points.map(function(p) { return (p.x / paper.width).toString().replace(/(\.\d{4})\d*/,"$1") + " " + (p.y / paper.height).toString().replace(/(\.\d{4})\d*/,"$1") }).join("L")
+ "Z";
- $(".fragment-path").val(transd).change();
+ $(".fragment-path").val(transd);
}
var dragdeltax, dragdeltay, pathDragging;
@@ -233,6 +257,16 @@
closed = true;
}
+ if (
+ points.length === 4
+ && points[0].x === points[3].x
+ && points[0].y === points[1].y
+ && points[1].x === points[2].x
+ && points[2].y === points[3].y
+ ) {
+ rectangleMode = true;
+ }
+
redrawPath();
}