2011-03-06 19:50:44 -05:00
|
|
|
/*
|
|
|
|
* Paper.js
|
|
|
|
*
|
|
|
|
* This file is part of Paper.js, a JavaScript Vector Graphics Library,
|
|
|
|
* based on Scriptographer.org and designed to be largely API compatible.
|
2011-03-07 20:41:50 -05:00
|
|
|
* http://paperjs.org/
|
2011-03-06 19:50:44 -05:00
|
|
|
* http://scriptographer.org/
|
|
|
|
*
|
2011-03-07 20:41:50 -05:00
|
|
|
* Distributed under the MIT license. See LICENSE file for details.
|
|
|
|
*
|
2011-03-06 19:50:44 -05:00
|
|
|
* Copyright (c) 2011, Juerg Lehni & Jonathan Puckey
|
|
|
|
* http://lehni.org/ & http://jonathanpuckey.com/
|
|
|
|
*
|
2011-03-07 20:41:50 -05:00
|
|
|
* All rights reserved.
|
2011-03-06 19:50:44 -05:00
|
|
|
*/
|
|
|
|
|
2011-03-04 08:34:31 -05:00
|
|
|
var Segment = this.Segment = Base.extend({
|
2011-03-06 05:57:14 -05:00
|
|
|
beans: true,
|
|
|
|
|
2011-03-06 07:24:03 -05:00
|
|
|
initialize: function(arg0, arg1, arg2, arg3, arg4, arg5) {
|
2011-02-13 11:26:24 -05:00
|
|
|
if (arguments.length == 0) {
|
2011-04-21 08:21:56 -04:00
|
|
|
this._point = SegmentPoint.create(this, 0, 0);
|
2011-02-13 11:26:24 -05:00
|
|
|
} else if (arguments.length == 1) {
|
2011-05-01 08:27:53 -04:00
|
|
|
// TODO: If beans are not activated, this won't copy from n existing
|
|
|
|
// segment. OK?
|
2011-03-06 07:24:03 -05:00
|
|
|
if (arg0.point) {
|
2011-04-21 08:21:56 -04:00
|
|
|
this._point = SegmentPoint.create(this, arg0.point);
|
|
|
|
this._handleIn = SegmentPoint.create(this, arg0.handleIn);
|
|
|
|
this._handleOut = SegmentPoint.create(this, arg0.handleOut);
|
2011-02-07 13:28:09 -05:00
|
|
|
} else {
|
2011-04-21 08:21:56 -04:00
|
|
|
this._point = SegmentPoint.create(this, arg0);
|
2011-02-07 13:28:09 -05:00
|
|
|
}
|
2011-02-13 11:26:24 -05:00
|
|
|
} else if (arguments.length < 6) {
|
2011-03-06 07:24:03 -05:00
|
|
|
if (arguments.length == 2 && !arg1.x) {
|
2011-04-21 08:21:56 -04:00
|
|
|
this._point = SegmentPoint.create(this, arg0, arg1);
|
2011-02-07 13:28:09 -05:00
|
|
|
} else {
|
2011-04-21 08:21:56 -04:00
|
|
|
this._point = SegmentPoint.create(this, arg0);
|
2011-03-06 05:57:14 -05:00
|
|
|
// Doesn't matter if these arguments exist, it creates 0, 0
|
|
|
|
// points otherwise
|
2011-04-21 08:21:56 -04:00
|
|
|
this._handleIn = SegmentPoint.create(this, arg1);
|
|
|
|
this._handleOut = SegmentPoint.create(this, arg2);
|
2011-02-07 13:28:09 -05:00
|
|
|
}
|
2011-02-13 11:26:24 -05:00
|
|
|
} else if (arguments.length == 6) {
|
2011-04-21 08:21:56 -04:00
|
|
|
this._point = SegmentPoint.create(this, arg0, arg1);
|
|
|
|
this._handleIn = SegmentPoint.create(this, arg2, arg3);
|
|
|
|
this._handleOut = SegmentPoint.create(this, arg4, arg5);
|
2011-02-13 10:09:24 -05:00
|
|
|
}
|
2011-03-06 05:57:14 -05:00
|
|
|
if (!this._handleIn)
|
2011-04-21 08:21:56 -04:00
|
|
|
this._handleIn = SegmentPoint.create(this, 0, 0);
|
2011-03-06 05:57:14 -05:00
|
|
|
if (!this._handleOut)
|
2011-04-21 08:21:56 -04:00
|
|
|
this._handleOut = SegmentPoint.create(this, 0, 0);
|
2011-02-07 13:28:09 -05:00
|
|
|
},
|
2011-03-03 17:45:17 -05:00
|
|
|
|
2011-05-01 19:17:21 -04:00
|
|
|
_changed: function(point) {
|
|
|
|
if (this._path) {
|
|
|
|
// Delegate changes to affected curves if they exist
|
|
|
|
if (this._path._curves) {
|
|
|
|
var curve = this.getCurve(), other;
|
|
|
|
if (curve) {
|
|
|
|
curve._changed();
|
|
|
|
// Get the other affected curve, which is the previous one
|
|
|
|
// for _point or _handleIn changing when this segment is
|
|
|
|
// _segment1 of the curve, for all other cases it's the next
|
|
|
|
// (e.g. _handleOut or this segment == _segment2)
|
|
|
|
if (other = (curve[point == this._point
|
|
|
|
|| point == this._handleIn && curve._segment1 == this
|
|
|
|
? 'getPrevious' : 'getNext']())) {
|
|
|
|
other._changed();
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
2011-05-07 08:39:17 -04:00
|
|
|
this._path._changed(ChangeFlags.PATH);
|
2011-05-01 19:17:21 -04:00
|
|
|
}
|
|
|
|
},
|
|
|
|
|
2011-02-07 13:28:09 -05:00
|
|
|
getPoint: function() {
|
2011-03-06 05:57:14 -05:00
|
|
|
return this._point;
|
2011-02-07 13:28:09 -05:00
|
|
|
},
|
2011-03-03 17:45:17 -05:00
|
|
|
|
2011-03-13 13:31:00 -04:00
|
|
|
setPoint: function(point) {
|
|
|
|
point = Point.read(arguments);
|
2011-03-06 07:24:03 -05:00
|
|
|
// Do not replace the internal object but update it instead, so
|
|
|
|
// references to it are kept alive.
|
|
|
|
this._point.set(point.x, point.y);
|
2011-02-07 13:28:09 -05:00
|
|
|
},
|
2011-03-03 17:45:17 -05:00
|
|
|
|
2011-02-07 13:28:09 -05:00
|
|
|
getHandleIn: function() {
|
2011-03-06 05:57:14 -05:00
|
|
|
return this._handleIn;
|
|
|
|
},
|
|
|
|
|
2011-03-13 13:31:00 -04:00
|
|
|
setHandleIn: function(point) {
|
|
|
|
point = Point.read(arguments);
|
2011-03-06 07:24:03 -05:00
|
|
|
// See #setPoint:
|
|
|
|
this._handleIn.set(point.x, point.y);
|
2011-03-06 05:57:14 -05:00
|
|
|
// Update corner accordingly
|
2011-05-01 18:29:15 -04:00
|
|
|
// this.corner = !this._handleIn.isColinear(this._handleOut);
|
2011-02-07 13:28:09 -05:00
|
|
|
},
|
|
|
|
|
2011-03-06 06:18:35 -05:00
|
|
|
getHandleInIfSet: function() {
|
2011-04-21 08:33:12 -04:00
|
|
|
return this._handleIn._x == 0 && this._handleIn._y == 0
|
2011-03-06 06:18:35 -05:00
|
|
|
? null : this._handleIn;
|
2011-03-06 05:57:14 -05:00
|
|
|
},
|
|
|
|
|
2011-03-06 06:18:35 -05:00
|
|
|
getHandleOut: function() {
|
|
|
|
return this._handleOut;
|
2011-02-07 13:28:09 -05:00
|
|
|
},
|
2011-03-03 17:45:17 -05:00
|
|
|
|
2011-03-13 13:31:00 -04:00
|
|
|
setHandleOut: function(point) {
|
|
|
|
point = Point.read(arguments);
|
2011-03-06 07:24:03 -05:00
|
|
|
// See #setPoint:
|
|
|
|
this._handleOut.set(point.x, point.y);
|
2011-03-06 05:57:14 -05:00
|
|
|
// Update corner accordingly
|
2011-05-01 18:29:15 -04:00
|
|
|
// this.corner = !this._handleIn.isColinear(this._handleOut);
|
2011-02-07 13:28:09 -05:00
|
|
|
},
|
2011-03-03 17:45:17 -05:00
|
|
|
|
2011-03-06 06:18:35 -05:00
|
|
|
getHandleOutIfSet: function() {
|
2011-04-21 08:33:12 -04:00
|
|
|
return this._handleOut._x == 0 && this._handleOut._y == 0
|
2011-03-06 06:18:35 -05:00
|
|
|
? null : this._handleOut;
|
|
|
|
},
|
|
|
|
|
2011-03-06 07:24:03 -05:00
|
|
|
getPath: function() {
|
|
|
|
return this._path;
|
|
|
|
},
|
|
|
|
|
2011-05-01 08:27:53 -04:00
|
|
|
getIndex: function() {
|
|
|
|
return this._index;
|
|
|
|
},
|
|
|
|
|
2011-03-06 08:11:04 -05:00
|
|
|
getCurve: function() {
|
2011-05-01 19:17:21 -04:00
|
|
|
if (this._path) {
|
2011-05-01 08:27:53 -04:00
|
|
|
var index = this._index;
|
2011-03-06 08:11:04 -05:00
|
|
|
// The last segment of an open path belongs to the last curve
|
2011-04-30 18:22:29 -04:00
|
|
|
if (!this._path._closed && index == this._path._segments.length - 1)
|
2011-03-06 08:11:04 -05:00
|
|
|
index--;
|
2011-04-27 16:13:32 -04:00
|
|
|
return this._path.getCurves()[index] || null;
|
2011-03-06 08:11:04 -05:00
|
|
|
}
|
|
|
|
return null;
|
2011-02-07 13:28:09 -05:00
|
|
|
},
|
2011-03-03 17:45:17 -05:00
|
|
|
|
2011-02-07 13:28:09 -05:00
|
|
|
getNext: function() {
|
2011-04-27 07:21:31 -04:00
|
|
|
var segments = this._path && this._path._segments;
|
2011-05-01 08:27:53 -04:00
|
|
|
return segments && (segments[this._index + 1]
|
2011-04-30 18:22:29 -04:00
|
|
|
|| this._path._closed && segments[0]) || null;
|
2011-02-07 13:28:09 -05:00
|
|
|
},
|
2011-03-03 17:45:17 -05:00
|
|
|
|
2011-02-07 13:28:09 -05:00
|
|
|
getPrevious: function() {
|
2011-04-27 07:21:31 -04:00
|
|
|
var segments = this._path && this._path._segments;
|
2011-05-01 08:27:53 -04:00
|
|
|
return segments && (segments[this._index - 1]
|
2011-04-30 18:22:29 -04:00
|
|
|
|| this._path._closed && segments[segments.length - 1]) || null;
|
2011-02-07 13:28:09 -05:00
|
|
|
},
|
2011-03-03 17:45:17 -05:00
|
|
|
|
2011-04-27 07:15:51 -04:00
|
|
|
_isSelected: function(point) {
|
2011-04-21 12:06:06 -04:00
|
|
|
var state = this._selectionState;
|
2011-04-27 12:57:56 -04:00
|
|
|
return point == this._point ? !!(state & SelectionState.POINT)
|
|
|
|
: point == this._handleIn ? !!(state & SelectionState.HANDLE_IN)
|
|
|
|
: point == this._handleOut ? !!(state & SelectionState.HANDLE_OUT)
|
|
|
|
: false;
|
2011-04-21 12:06:06 -04:00
|
|
|
},
|
2011-04-27 07:26:10 -04:00
|
|
|
|
2011-04-27 07:15:51 -04:00
|
|
|
_setSelected: function(point, selected) {
|
2011-04-21 12:06:06 -04:00
|
|
|
if (!this._path)
|
|
|
|
return;
|
2011-04-27 07:15:51 -04:00
|
|
|
var selected = !!selected, // convert to boolean
|
|
|
|
state = this._selectionState,
|
|
|
|
wasSelected = !!state,
|
2011-04-27 13:16:32 -04:00
|
|
|
// For performance reasons use array indices to access the various
|
|
|
|
// selection states: 0 = point, 1 = handleIn, 2 = handleOut
|
|
|
|
selection = [
|
|
|
|
!!(state & SelectionState.POINT),
|
|
|
|
!!(state & SelectionState.HANDLE_IN),
|
|
|
|
!!(state & SelectionState.HANDLE_OUT)
|
|
|
|
];
|
2011-04-27 07:06:44 -04:00
|
|
|
if (point == this._point) {
|
2011-04-27 13:16:32 -04:00
|
|
|
if (selected) {
|
|
|
|
// We're selecting point, deselect the handles
|
|
|
|
selection[1] = selection[2] = false;
|
|
|
|
} else {
|
|
|
|
var previous = this.getPrevious(),
|
|
|
|
next = this.getNext();
|
|
|
|
// When deselecting a point, the handles get selected instead
|
|
|
|
// depending on the selection state of their neighbors.
|
|
|
|
selection[1] = previous && (previous._point.isSelected()
|
|
|
|
|| previous._handleOut.isSelected());
|
|
|
|
selection[2] = next && (next._point.isSelected()
|
|
|
|
|| next._handleIn.isSelected());
|
2011-04-21 12:06:06 -04:00
|
|
|
}
|
2011-04-27 13:16:32 -04:00
|
|
|
selection[0] = selected;
|
|
|
|
} else {
|
|
|
|
var index = point == this._handleIn ? 1 : 2;
|
|
|
|
if (selection[index] != selected) {
|
2011-04-21 12:06:06 -04:00
|
|
|
// When selecting handles, the point get deselected.
|
|
|
|
if (selected)
|
2011-04-27 13:16:32 -04:00
|
|
|
selection[0] = false;
|
|
|
|
selection[index] = selected;
|
2011-04-21 12:06:06 -04:00
|
|
|
}
|
|
|
|
}
|
2011-04-27 13:16:32 -04:00
|
|
|
this._selectionState = (selection[0] ? SelectionState.POINT : 0)
|
|
|
|
| (selection[1] ? SelectionState.HANDLE_IN : 0)
|
|
|
|
| (selection[2] ? SelectionState.HANDLE_OUT : 0);
|
2011-04-21 12:06:06 -04:00
|
|
|
// If the selection state of the segment has changed, we need to let
|
|
|
|
// it's path know and possibly add or remove it from
|
|
|
|
// document._selectedItems
|
2011-04-27 12:53:23 -04:00
|
|
|
if (wasSelected != !!this._selectionState) {
|
2011-04-21 12:06:06 -04:00
|
|
|
var path = this._path,
|
2011-04-27 12:53:23 -04:00
|
|
|
count = path._selectedSegmentCount
|
|
|
|
+= this._selectionState ? 1 : -1;
|
|
|
|
if (count <= 1)
|
|
|
|
path._document._selectItem(path, count == 1);
|
|
|
|
}
|
2011-04-21 12:06:06 -04:00
|
|
|
},
|
2011-03-03 17:45:17 -05:00
|
|
|
|
2011-04-27 07:15:51 -04:00
|
|
|
isSelected: function() {
|
|
|
|
return this._isSelected(this._point);
|
|
|
|
},
|
|
|
|
|
|
|
|
setSelected: function(selected) {
|
|
|
|
this._setSelected(this._point, selected);
|
|
|
|
},
|
|
|
|
|
2011-02-07 13:28:09 -05:00
|
|
|
reverse: function() {
|
2011-03-06 05:57:14 -05:00
|
|
|
return new Segment(this._point, this._handleOut, this._handleIn);
|
2011-02-07 13:28:09 -05:00
|
|
|
},
|
2011-03-03 17:45:17 -05:00
|
|
|
|
2011-02-07 13:28:09 -05:00
|
|
|
clone: function() {
|
|
|
|
return new Segment(this);
|
|
|
|
},
|
2011-03-03 17:45:17 -05:00
|
|
|
|
2011-02-07 13:28:09 -05:00
|
|
|
remove: function() {
|
2011-05-01 08:27:53 -04:00
|
|
|
return this._path ? !!this._path.removeSegment(this._index) : false;
|
2011-02-07 13:28:09 -05:00
|
|
|
},
|
2011-03-03 17:45:17 -05:00
|
|
|
|
2011-02-07 13:28:09 -05:00
|
|
|
toString: function() {
|
2011-05-02 03:57:55 -04:00
|
|
|
var parts = [ 'point: ' + this._point ];
|
|
|
|
if (!this._handleIn.isZero())
|
|
|
|
parts.push('handleIn: ' + this._handleIn);
|
|
|
|
if (!this._handleOut.isZero())
|
|
|
|
parts.push('handleOut: ' + this._handleOut);
|
|
|
|
return '{ ' + parts.join(', ') + ' }';
|
2011-03-06 16:26:38 -05:00
|
|
|
},
|
|
|
|
|
|
|
|
_transformCoordinates: function(matrix, coords, change) {
|
|
|
|
// Use matrix.transform version() that takes arrays of multiple
|
|
|
|
// points for largely improved performance, as no calls to
|
|
|
|
// Point.read() and Point constructors are necessary.
|
|
|
|
var point = this._point,
|
|
|
|
// If a matrix is defined, only transform handles if they are set.
|
|
|
|
// This saves some computation time. If no matrix is set, always
|
|
|
|
// use the real handles, as we just want to receive a filled
|
2011-03-06 19:36:44 -05:00
|
|
|
// coords array for getBounds().
|
2011-03-06 16:26:38 -05:00
|
|
|
handleIn = matrix && this.getHandleInIfSet() || this._handleIn,
|
|
|
|
handleOut = matrix && this.getHandleOutIfSet() || this._handleOut,
|
2011-04-21 08:33:12 -04:00
|
|
|
x = point._x,
|
2011-05-02 03:59:51 -04:00
|
|
|
y = point._y,
|
|
|
|
i = 2;
|
2011-03-06 16:26:38 -05:00
|
|
|
coords[0] = x;
|
|
|
|
coords[1] = y;
|
|
|
|
// We need to convert handles to absolute coordinates in order
|
|
|
|
// to transform them.
|
|
|
|
if (handleIn) {
|
2011-05-02 03:59:51 -04:00
|
|
|
coords[i++] = handleIn._x + x;
|
|
|
|
coords[i++] = handleIn._y + y;
|
2011-03-06 16:26:38 -05:00
|
|
|
}
|
|
|
|
if (handleOut) {
|
2011-05-02 03:59:51 -04:00
|
|
|
coords[i++] = handleOut._x + x;
|
|
|
|
coords[i++] = handleOut._y + y;
|
2011-03-06 16:26:38 -05:00
|
|
|
}
|
|
|
|
if (matrix) {
|
2011-05-06 08:28:35 -04:00
|
|
|
matrix._transformCoordinates(coords, 0, coords, 0, i / 2);
|
2011-03-06 16:26:38 -05:00
|
|
|
x = coords[0];
|
|
|
|
y = coords[1];
|
|
|
|
if (change) {
|
|
|
|
// If change is true, we need to set the new values back
|
2011-04-21 08:33:12 -04:00
|
|
|
point._x = x;
|
|
|
|
point._y = y;
|
2011-05-02 03:59:51 -04:00
|
|
|
i = 2;
|
2011-03-06 16:26:38 -05:00
|
|
|
if (handleIn) {
|
2011-05-02 03:59:51 -04:00
|
|
|
handleIn._x = coords[i++] - x;
|
|
|
|
handleIn._y = coords[i++] - y;
|
2011-03-06 16:26:38 -05:00
|
|
|
}
|
|
|
|
if (handleOut) {
|
2011-05-02 03:59:51 -04:00
|
|
|
handleOut._x = coords[i++] - x;
|
|
|
|
handleOut._y = coords[i++] - y;
|
2011-03-06 16:26:38 -05:00
|
|
|
}
|
|
|
|
} else {
|
|
|
|
// We want to receive the results in coords, so make sure
|
|
|
|
// handleIn and out are defined too, even if they're 0
|
|
|
|
if (!handleIn) {
|
2011-05-02 03:59:51 -04:00
|
|
|
coords[i++] = x;
|
|
|
|
coords[i++] = y;
|
2011-03-06 16:26:38 -05:00
|
|
|
}
|
|
|
|
if (!handleOut) {
|
2011-05-02 03:59:51 -04:00
|
|
|
coords[i++] = x;
|
|
|
|
coords[i++] = y;
|
2011-03-06 16:26:38 -05:00
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
2011-02-07 13:28:09 -05:00
|
|
|
}
|
2011-02-13 11:26:24 -05:00
|
|
|
});
|