scratchfoundation/paper.js
1
0
Fork 0
mirror of https://github.com/scratchfoundation/paper.js.git synced 2025-01-06 04:42:15 -05:00
Code Issues Projects Releases Packages Wiki Activity Actions

Add Path#is/setClockwise(), as a way to check and define a path's orientation.

Browse source
This commit is contained in:
Jürg Lehni 2011-05-15 17:59:06 +01:00
parent 6fc418b581
commit 40c988b313
1 changed files with 53 additions and 30 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

83
src/path/Path.js
View file

@ -34,6 +34,8 @@ var Path = this.Path = PathItem.extend({
delete this._bounds;
delete this._position;
delete this._strokeBounds;
// Clockwise state becomes undefined as soon as geometry changes.
delete this._clockwise;
} else if (flags & ChangeFlags.STROKE) {
delete this._strokeBounds;
}
@ -302,20 +304,66 @@ var Path = this.Path = PathItem.extend({
// TODO: curvesToPoints([maxPointDistance[, flatness]])
// TODO: reduceSegments([flatness])
// TODO: split(offset) / split(location) / split(index[, parameter])
/**
* Returns true if the path is oriented clock-wise, false otherwise.
*/
isClockwise: function() {
if (this._clockwise !== undefined)
return this._clockwise;
var sum = 0,
xPre, yPre;
function edge(x, y) {
if (xPre !== undefined)
sum += (xPre - x) * (y + yPre);
xPre = x;
yPre = y;
}
// Method derived from:
// http://stackoverflow.com/questions/1165647
// We treat the curve points and handles as the outline of a polygon of
// which we determine the orientation using the method of calculating
// the sum over the edges. This will work even with non-convex polygons,
// telling you whether it's mostly clockwise
for (var i = 0, l = this._segments.length; i < l; i++) {
var seg1 = this._segments[i],
seg2 = this._segments[i + 1 < l ? i + 1 : 0],
point1 = seg1._point,
handle1 = seg1._handleOut,
handle2 = seg2._handleIn,
point2 = seg2._point;
edge(point1._x, point1._y);
edge(point1._x + handle1._x, point1._y + handle1._y);
edge(point2._x + handle2._x, point2._y + handle2._y);
edge(point2._x, point2._y);
}
return this._clockwise = sum > 0;
},
setClockwise: function(clockwise) {
// On-the-fly conversion to boolean:
if (this.isClockwise() != (clockwise = !!clockwise)) {
// Only revers the path if its clockwise orientation is not the same
// as what it is now demanded to be.
this.reverse();
}
},
/**
* Reverses the segments of the path.
*/
reverse: function() {
var segments = this._segments;
segments.reverse();
this._segments.reverse();
// Reverse the handles:
for (var i = 0, l = segments.length; i < l; i++) {
var segment = segments[i];
for (var i = 0, l = this._segments.length; i < l; i++) {
var segment = this._segments[i];
var handleIn = segment._handleIn;
segment._handleIn = segment._handleOut;
segment._handleOut = handleIn;
}
// Flip clockwise state if it's defined
if (this._clockwise !== undefined)
this._clockwise = !this._clockwise;
},
join: function(path) {
@ -356,31 +404,6 @@ var Path = this.Path = PathItem.extend({
return false;
},
getOrientation: function() {
var sum = 0;
var xPre, yPre;
function edge(x, y) {
if (xPre !== undefined) {
sum += (xPre - x) * (y + yPre);
}
xPre = x;
yPre = y;
}
for (var i = 0, l = this._segments.length; i < l; i++) {
var seg1 = this._segments[i];
var seg2 = this._segments[i + 1 < l ? i + 1 : 0];
var point1 = seg1._point;
var handle1 = seg1._handleOut;
var handle2 = seg2._handleIn;
var point2 = seg2._point;
edge(point1._x, point1._y);
edge(point1._x + handle1._x, point1._y + handle1._y);
edge(point2._x + handle2._x, point2._y + handle2._y);
edge(point2._x, point2._y);
}
return sum;
},
getLength: function() {
if (this._length == null) {
var curves = this.getCurves();