diff options
Diffstat (limited to 'js/tools')
-rwxr-xr-x | js/tools/PenTool.js | 82 |
1 files changed, 66 insertions, 16 deletions
diff --git a/js/tools/PenTool.js b/js/tools/PenTool.js index 22172193..5145eb39 100755 --- a/js/tools/PenTool.js +++ b/js/tools/PenTool.js | |||
@@ -184,23 +184,60 @@ exports.PenTool = Montage.create(ShapeTool, { | |||
184 | } | 184 | } |
185 | } | 185 | } |
186 | 186 | ||
187 | //build the mouse down position in local coordinates | 187 | |
188 | // ****** build the mouse down position in local coordinates ******* | ||
189 | |||
190 | var localMousePos = null; //local mouse position | ||
191 | var swFromLocalMousePos = null; // | ||
192 | var swMousePos = null; | ||
193 | |||
188 | var drawingCanvas = this._selectedSubpath.getCanvas(); | 194 | var drawingCanvas = this._selectedSubpath.getCanvas(); |
195 | var useLocal = true; | ||
189 | if (!drawingCanvas){ | 196 | if (!drawingCanvas){ |
197 | //if the subpath has no canvas, it means we should not use local coordinates, and use stage-world coordinates only | ||
198 | useLocal = false; | ||
190 | drawingCanvas = ViewUtils.getStageElement(); | 199 | drawingCanvas = ViewUtils.getStageElement(); |
200 | |||
201 | var contentPlane = ViewUtils.getUnprojectedElementPlane(drawingCanvas); //this should just be the | ||
202 | snapManager.pushWorkingPlane(contentPlane); | ||
203 | var tmpPoint = webkitConvertPointFromPageToNode(this.application.ninja.stage.canvas, new WebKitPoint(event.pageX, event.pageY)); | ||
204 | var hitRec = snapManager.snap(tmpPoint.x, tmpPoint.y, false); | ||
205 | swMousePos = hitRec.calculateStageWorldPoint(); | ||
206 | //DrawingToolBase.getHitRecPos(snapManager.snap(point.x, point.y, false)); | ||
207 | this._dragPlane = snapManager.getDragPlane(); | ||
208 | snapManager.popWorkingPlane(); | ||
209 | swMousePos[0]+= snapManager.getStageWidth()*0.5; swMousePos[1]+= snapManager.getStageHeight()*0.5; | ||
210 | |||
211 | this._penPlaneMat = hitRec.getPlaneMatrix(); | ||
212 | this._selectedSubpath.setPlaneMatrix(this._penPlaneMat); | ||
213 | var planeMatInv = glmat4.inverse( this._penPlaneMat, [] ); | ||
214 | this._selectedSubpath.setPlaneMatrixInverse(planeMatInv); | ||
215 | this._selectedSubpath.setDragPlane(this._dragPlane); | ||
216 | |||
217 | } else { | ||
218 | //build the local coordinates of the screen point | ||
219 | var globalMousePos = this._getUnsnappedScreenPosition(event.pageX, event.pageY); | ||
220 | localMousePos = ViewUtils.globalToLocal(globalMousePos, drawingCanvas); | ||
221 | |||
222 | //now build the stage world coordinates (without taking the canvas transformation into account) of the local coordinates | ||
223 | var localToStageWorldNoTransform = ViewUtils.getLocalToStageWorldMatrix(drawingCanvas, true, false); | ||
224 | var swFromLocalMousePos = MathUtils.transformAndDivideHomogeneousPoint(localMousePos,localToStageWorldNoTransform); | ||
225 | swFromLocalMousePos[0]+= snapManager.getStageWidth()*0.5; swFromLocalMousePos[1]+= snapManager.getStageHeight()*0.5; | ||
191 | } | 226 | } |
192 | var globalMousePos = this._getUnsnappedScreenPosition(event.pageX, event.pageY); | 227 | |
193 | var localMousePos = ViewUtils.globalToLocal(globalMousePos, drawingCanvas); | 228 | |
194 | var localToStageWorldNoTransform = ViewUtils.getLocalToStageWorldMatrix(drawingCanvas, true, false); | ||
195 | var swMousePos = MathUtils.transformAndDivideHomogeneousPoint(localMousePos,localToStageWorldNoTransform); | ||
196 | swMousePos[0]+= snapManager.getStageWidth()*0.5; swMousePos[1]+= snapManager.getStageHeight()*0.5; | ||
197 | var prevSelectedAnchorIndex = this._selectedSubpath.getSelectedAnchorIndex(); | 229 | var prevSelectedAnchorIndex = this._selectedSubpath.getSelectedAnchorIndex(); |
198 | // ************* Add/Select Anchor Point ************* | 230 | // ************* Add/Select Anchor Point ************* |
199 | //check if the clicked location is close to an anchor point...if so, make that anchor the selected point and do nothing else | 231 | //check if the clicked location is close to an anchor point...if so, make that anchor the selected point and do nothing else |
200 | // BUT if the anchor point selected is the first anchor point, check if the previous selected anchor was the last anchor point...in that case, close the path | 232 | // BUT if the anchor point selected is the first anchor point, check if the previous selected anchor was the last anchor point...in that case, close the path |
201 | 233 | ||
202 | //var selParam = this._selectedSubpath.pickPath(mouseDownPos[0], mouseDownPos[1], mouseDownPos[2], this._PICK_POINT_RADIUS); | 234 | //var selParam = this._selectedSubpath.pickPath(mouseDownPos[0], mouseDownPos[1], mouseDownPos[2], this._PICK_POINT_RADIUS); |
203 | var selParam = this._selectedSubpath.pickPath(localMousePos[0], localMousePos[1], localMousePos[2], this._PICK_POINT_RADIUS, true); | 235 | var selParam = null; |
236 | if (useLocal) { | ||
237 | selParam = this._selectedSubpath.pickPath(localMousePos[0], localMousePos[1], localMousePos[2], this._PICK_POINT_RADIUS, true); | ||
238 | } else { | ||
239 | selParam = this._selectedSubpath.pickPath(swMousePos[0], swMousePos[1], swMousePos[2], this._PICK_POINT_RADIUS, false); | ||
240 | } | ||
204 | var whichPoint = this._selectedSubpath.getSelectedMode(); | 241 | var whichPoint = this._selectedSubpath.getSelectedMode(); |
205 | if (whichPoint & this._selectedSubpath.SEL_ANCHOR) { | 242 | if (whichPoint & this._selectedSubpath.SEL_ANCHOR) { |
206 | //if we're in ENTRY_SELECT_PATH mode AND we have not yet clicked on the endpoint AND if we have now clicked on the endpoint | 243 | //if we're in ENTRY_SELECT_PATH mode AND we have not yet clicked on the endpoint AND if we have now clicked on the endpoint |
@@ -262,9 +299,15 @@ exports.PenTool = Montage.create(ShapeTool, { | |||
262 | if (!this._selectedSubpath.getIsClosed() || this._makeMultipleSubpaths) { | 299 | if (!this._selectedSubpath.getIsClosed() || this._makeMultipleSubpaths) { |
263 | this._selectedSubpath.addAnchor(new AnchorPoint()); | 300 | this._selectedSubpath.addAnchor(new AnchorPoint()); |
264 | var newAnchor = this._selectedSubpath.getAnchor(this._selectedSubpath.getSelectedAnchorIndex()); | 301 | var newAnchor = this._selectedSubpath.getAnchor(this._selectedSubpath.getSelectedAnchorIndex()); |
265 | newAnchor.setPos(swMousePos[0], swMousePos[1], swMousePos[2]); | 302 | if (useLocal) { |
266 | newAnchor.setPrevPos(swMousePos[0], swMousePos[1], swMousePos[2]); | 303 | newAnchor.setPos(swFromLocalMousePos[0], swFromLocalMousePos[1], swFromLocalMousePos[2]); |
267 | newAnchor.setNextPos(swMousePos[0], swMousePos[1], swMousePos[2]); | 304 | newAnchor.setPrevPos(swFromLocalMousePos[0], swFromLocalMousePos[1], swFromLocalMousePos[2]); |
305 | newAnchor.setNextPos(swFromLocalMousePos[0], swFromLocalMousePos[1], swFromLocalMousePos[2]); | ||
306 | } else { | ||
307 | newAnchor.setPos(swMousePos[0], swMousePos[1], swMousePos[2]); | ||
308 | newAnchor.setPrevPos(swMousePos[0], swMousePos[1], swMousePos[2]); | ||
309 | newAnchor.setNextPos(swMousePos[0], swMousePos[1], swMousePos[2]); | ||
310 | } | ||
268 | 311 | ||
269 | //set the mode so that dragging will update the next and previous locations | 312 | //set the mode so that dragging will update the next and previous locations |
270 | this._editMode = this.EDIT_PREV_NEXT; | 313 | this._editMode = this.EDIT_PREV_NEXT; |
@@ -275,9 +318,15 @@ exports.PenTool = Montage.create(ShapeTool, { | |||
275 | if (!this._selectedSubpath.getIsClosed()) { | 318 | if (!this._selectedSubpath.getIsClosed()) { |
276 | this._selectedSubpath.addAnchor(new AnchorPoint()); | 319 | this._selectedSubpath.addAnchor(new AnchorPoint()); |
277 | var newAnchor = this._selectedSubpath.getAnchor(this._selectedSubpath.getSelectedAnchorIndex()); | 320 | var newAnchor = this._selectedSubpath.getAnchor(this._selectedSubpath.getSelectedAnchorIndex()); |
278 | newAnchor.setPos(swMousePos[0], swMousePos[1], swMousePos[2]); | 321 | if (useLocal) { |
279 | newAnchor.setPrevPos(swMousePos[0], swMousePos[1], swMousePos[2]); | 322 | newAnchor.setPos(swFromLocalMousePos[0], swFromLocalMousePos[1], swFromLocalMousePos[2]); |
280 | newAnchor.setNextPos(swMousePos[0], swMousePos[1], swMousePos[2]); | 323 | newAnchor.setPrevPos(swFromLocalMousePos[0], swFromLocalMousePos[1], swFromLocalMousePos[2]); |
324 | newAnchor.setNextPos(swFromLocalMousePos[0], swFromLocalMousePos[1], swFromLocalMousePos[2]); | ||
325 | } else { | ||
326 | newAnchor.setPos(swMousePos[0], swMousePos[1], swMousePos[2]); | ||
327 | newAnchor.setPrevPos(swMousePos[0], swMousePos[1], swMousePos[2]); | ||
328 | newAnchor.setNextPos(swMousePos[0], swMousePos[1], swMousePos[2]); | ||
329 | } | ||
281 | 330 | ||
282 | //set the mode so that dragging will update the next and previous locations | 331 | //set the mode so that dragging will update the next and previous locations |
283 | this._editMode = this.EDIT_PREV_NEXT; | 332 | this._editMode = this.EDIT_PREV_NEXT; |
@@ -329,7 +378,6 @@ exports.PenTool = Montage.create(ShapeTool, { | |||
329 | //go through the drawing toolbase to get the position of the mouse | 378 | //go through the drawing toolbase to get the position of the mouse |
330 | var currMousePos = DrawingToolBase.getHitRecPos(DrawingToolBase.getUpdatedSnapPoint(point.x, point.y, false, this.mouseDownHitRec)); | 379 | var currMousePos = DrawingToolBase.getHitRecPos(DrawingToolBase.getUpdatedSnapPoint(point.x, point.y, false, this.mouseDownHitRec)); |
331 | if (currMousePos && this._selectedSubpath && (this._selectedSubpath.getSelectedAnchorIndex() >= 0 && this._selectedSubpath.getSelectedAnchorIndex() < this._selectedSubpath.getNumAnchors())) { | 380 | if (currMousePos && this._selectedSubpath && (this._selectedSubpath.getSelectedAnchorIndex() >= 0 && this._selectedSubpath.getSelectedAnchorIndex() < this._selectedSubpath.getNumAnchors())) { |
332 | |||
333 | // BEGIN NEW LOCAL COORD BLOCK | 381 | // BEGIN NEW LOCAL COORD BLOCK |
334 | //build the mouse position in local coordinates | 382 | //build the mouse position in local coordinates |
335 | var drawingCanvas = this._selectedSubpath.getCanvas(); | 383 | var drawingCanvas = this._selectedSubpath.getCanvas(); |
@@ -473,6 +521,7 @@ exports.PenTool = Montage.create(ShapeTool, { | |||
473 | var globalMousePos = this._getUnsnappedScreenPosition(event.pageX, event.pageY); | 521 | var globalMousePos = this._getUnsnappedScreenPosition(event.pageX, event.pageY); |
474 | var localMousePos = ViewUtils.globalToLocal(globalMousePos, drawingCanvas); | 522 | var localMousePos = ViewUtils.globalToLocal(globalMousePos, drawingCanvas); |
475 | 523 | ||
524 | |||
476 | //var selAnchorRetCode = this._selectedSubpath.pickAnchor(currMousePos[0], currMousePos[1], currMousePos[2], this._PICK_POINT_RADIUS, false); | 525 | //var selAnchorRetCode = this._selectedSubpath.pickAnchor(currMousePos[0], currMousePos[1], currMousePos[2], this._PICK_POINT_RADIUS, false); |
477 | var selAnchorRetCode = this._selectedSubpath.pickAnchor(localMousePos[0], localMousePos[1], localMousePos[2], this._PICK_POINT_RADIUS, true); | 526 | var selAnchorRetCode = this._selectedSubpath.pickAnchor(localMousePos[0], localMousePos[1], localMousePos[2], this._PICK_POINT_RADIUS, true); |
478 | if (selAnchorRetCode[0] >=0) { | 527 | if (selAnchorRetCode[0] >=0) { |
@@ -553,6 +602,8 @@ exports.PenTool = Montage.create(ShapeTool, { | |||
553 | return; | 602 | return; |
554 | } | 603 | } |
555 | 604 | ||
605 | w= Math.round(w); | ||
606 | h = Math.round(h); | ||
556 | var left = Math.round(midPt[0] - 0.5 * w); | 607 | var left = Math.round(midPt[0] - 0.5 * w); |
557 | var top = Math.round(midPt[1] - 0.5 * h); | 608 | var top = Math.round(midPt[1] - 0.5 * h); |
558 | this._selectedSubpath.setPlaneCenter(midPt); | 609 | this._selectedSubpath.setPlaneCenter(midPt); |
@@ -617,8 +668,7 @@ exports.PenTool = Montage.create(ShapeTool, { | |||
617 | if (this._entryEditMode !== this.ENTRY_SELECT_CANVAS){ | 668 | if (this._entryEditMode !== this.ENTRY_SELECT_CANVAS){ |
618 | //update the left and top of the canvas element | 669 | //update the left and top of the canvas element |
619 | var canvasArray=[canvas]; | 670 | var canvasArray=[canvas]; |
620 | w= Math.round(w); | 671 | |
621 | h = Math.round(h); | ||
622 | ElementMediator.setProperty(canvasArray, "width", [w+"px"], "Changing", "penTool");//canvas.width = w; | 672 | ElementMediator.setProperty(canvasArray, "width", [w+"px"], "Changing", "penTool");//canvas.width = w; |
623 | ElementMediator.setProperty(canvasArray, "height", [h+"px"], "Changing", "penTool");//canvas.height = h; | 673 | ElementMediator.setProperty(canvasArray, "height", [h+"px"], "Changing", "penTool");//canvas.height = h; |
624 | ElementMediator.setProperty(canvasArray, "left", [left+"px"],"Changing", "penTool");//DocumentControllerModule.DocumentController.SetElementStyle(canvas, "left", parseInt(left) + "px"); | 674 | ElementMediator.setProperty(canvasArray, "left", [left+"px"],"Changing", "penTool");//DocumentControllerModule.DocumentController.SetElementStyle(canvas, "left", parseInt(left) + "px"); |