diff options
Diffstat (limited to 'js/tools')
-rwxr-xr-x | js/tools/PenTool.js | 81 |
1 files changed, 45 insertions, 36 deletions
diff --git a/js/tools/PenTool.js b/js/tools/PenTool.js index 7e97a8a1..50fd97d7 100755 --- a/js/tools/PenTool.js +++ b/js/tools/PenTool.js | |||
@@ -98,6 +98,7 @@ exports.PenTool = Montage.create(ShapeTool, { | |||
98 | //constants used for limiting size of the subpath canvas | 98 | //constants used for limiting size of the subpath canvas |
99 | _MAX_CANVAS_DIMENSION: {value: 3000, writable: false}, | 99 | _MAX_CANVAS_DIMENSION: {value: 3000, writable: false}, |
100 | 100 | ||
101 | /* | ||
101 | // get the stage world position corresponding to the (x,y) mouse event position by querying the snap manager | 102 | // get the stage world position corresponding to the (x,y) mouse event position by querying the snap manager |
102 | // but temporarily turning off all snapping | 103 | // but temporarily turning off all snapping |
103 | _getMouseEventPosition : { | 104 | _getMouseEventPosition : { |
@@ -130,6 +131,7 @@ exports.PenTool = Montage.create(ShapeTool, { | |||
130 | return [pos, dragPlane]; | 131 | return [pos, dragPlane]; |
131 | } | 132 | } |
132 | }, | 133 | }, |
134 | */ | ||
133 | 135 | ||
134 | ShowToolProperties: { | 136 | ShowToolProperties: { |
135 | value: function () { | 137 | value: function () { |
@@ -146,15 +148,17 @@ exports.PenTool = Montage.create(ShapeTool, { | |||
146 | // will use the plane of the selected path as the working plane if available, else use stage | 148 | // will use the plane of the selected path as the working plane if available, else use stage |
147 | getHitRecord:{ | 149 | getHitRecord:{ |
148 | value: function(x,y){ | 150 | value: function(x,y){ |
149 | var drawingCanvas = ViewUtils.getStageElement(); | ||
150 | if (this._selectedSubpathCanvas){ | 151 | if (this._selectedSubpathCanvas){ |
151 | drawingCanvas = this._selectedSubpathCanvas; | 152 | var drawingCanvas = this._selectedSubpathCanvas; |
153 | var contentPlane = ViewUtils.getUnprojectedElementPlane(drawingCanvas); | ||
154 | snapManager.pushWorkingPlane(contentPlane); | ||
155 | |||
152 | } | 156 | } |
153 | var contentPlane = ViewUtils.getUnprojectedElementPlane(drawingCanvas); | ||
154 | snapManager.pushWorkingPlane(contentPlane); | ||
155 | var tmpPoint = webkitConvertPointFromPageToNode(this.application.ninja.stage.canvas, new WebKitPoint(x,y)); | 157 | var tmpPoint = webkitConvertPointFromPageToNode(this.application.ninja.stage.canvas, new WebKitPoint(x,y)); |
156 | var hitRec = snapManager.snap(tmpPoint.x, tmpPoint.y, false); | 158 | var hitRec = snapManager.snap(tmpPoint.x, tmpPoint.y, false); |
157 | snapManager.popWorkingPlane(); | 159 | if (this._selectedSubpathCanvas){ |
160 | snapManager.popWorkingPlane(); | ||
161 | } | ||
158 | return hitRec; | 162 | return hitRec; |
159 | } | 163 | } |
160 | }, | 164 | }, |
@@ -281,8 +285,8 @@ exports.PenTool = Montage.create(ShapeTool, { | |||
281 | 285 | ||
282 | //now perform the hit testing | 286 | //now perform the hit testing |
283 | var prevSelectedAnchorIndex = this._selectedSubpath.getSelectedAnchorIndex(); | 287 | var prevSelectedAnchorIndex = this._selectedSubpath.getSelectedAnchorIndex(); |
284 | var selAnchorAndParam = this._selectedSubpath.pickPath(localMousePos[0], localMousePos[1], localMousePos[2], this._PICK_POINT_RADIUS, false); | 288 | var selAnchorAndParamAndCode = this._selectedSubpath.pickPath(localMousePos[0], localMousePos[1], localMousePos[2], this._PICK_POINT_RADIUS, false); |
285 | var selParam = selAnchorAndParam[1]; | 289 | var selParam = selAnchorAndParamAndCode[1]; |
286 | var whichPoint = this._selectedSubpath.getSelectedMode(); | 290 | var whichPoint = this._selectedSubpath.getSelectedMode(); |
287 | 291 | ||
288 | 292 | ||
@@ -383,8 +387,7 @@ exports.PenTool = Montage.create(ShapeTool, { | |||
383 | //clear the canvas before we draw anything else | 387 | //clear the canvas before we draw anything else |
384 | this.application.ninja.stage.clearDrawingCanvas(); | 388 | this.application.ninja.stage.clearDrawingCanvas(); |
385 | this._hoveredAnchorIndex = -1; | 389 | this._hoveredAnchorIndex = -1; |
386 | return; | 390 | |
387 | /* | ||
388 | //set the cursor to be the default cursor (depending on whether the selected subpath has any points yet) | 391 | //set the cursor to be the default cursor (depending on whether the selected subpath has any points yet) |
389 | if (this._selectedSubpath && this._selectedSubpath.getNumAnchors()>0){ | 392 | if (this._selectedSubpath && this._selectedSubpath.getNumAnchors()>0){ |
390 | this.application.ninja.stage.drawingCanvas.style.cursor = //"auto"; | 393 | this.application.ninja.stage.drawingCanvas.style.cursor = //"auto"; |
@@ -395,11 +398,11 @@ exports.PenTool = Montage.create(ShapeTool, { | |||
395 | "url('images/cursors/penCursors/Pen_newPath.png') 5 1, default"; | 398 | "url('images/cursors/penCursors/Pen_newPath.png') 5 1, default"; |
396 | } | 399 | } |
397 | 400 | ||
398 | var posInfo = this._getMouseEventPosition (event.pageX, event.pageY, true, false); | 401 | var hitRec = this.getHitRecord(event.pageX, event.pageY); |
399 | var currMousePos = posInfo[0]; | ||
400 | 402 | ||
401 | if (this._isDrawing) { | 403 | if (this._isDrawing) { |
402 | if (currMousePos && this._selectedSubpath && (this._selectedSubpath.getSelectedAnchorIndex() >= 0 && this._selectedSubpath.getSelectedAnchorIndex() < this._selectedSubpath.getNumAnchors())) { | 404 | if (0){ |
405 | //if (currMousePos && this._selectedSubpath && (this._selectedSubpath.getSelectedAnchorIndex() >= 0 && this._selectedSubpath.getSelectedAnchorIndex() < this._selectedSubpath.getNumAnchors())) { | ||
403 | // BEGIN NEW LOCAL COORD BLOCK | 406 | // BEGIN NEW LOCAL COORD BLOCK |
404 | //build the mouse position in local coordinates | 407 | //build the mouse position in local coordinates |
405 | var drawingCanvas = this._selectedSubpath.getCanvas(); | 408 | var drawingCanvas = this._selectedSubpath.getCanvas(); |
@@ -472,7 +475,7 @@ exports.PenTool = Montage.create(ShapeTool, { | |||
472 | //this.doSnap(event); | 475 | //this.doSnap(event); |
473 | //this.DrawHandles(); | 476 | //this.DrawHandles(); |
474 | 477 | ||
475 | if (currMousePos && this._selectedSubpath ){ | 478 | if (this._selectedSubpath ){ |
476 | 479 | ||
477 | //convert the mouse pos. to local space of the canvas | 480 | //convert the mouse pos. to local space of the canvas |
478 | //var widthAdjustment = -snapManager.getStageWidth()*0.5; | 481 | //var widthAdjustment = -snapManager.getStageWidth()*0.5; |
@@ -483,36 +486,38 @@ exports.PenTool = Montage.create(ShapeTool, { | |||
483 | if (!drawingCanvas){ | 486 | if (!drawingCanvas){ |
484 | drawingCanvas = ViewUtils.getStageElement(); | 487 | drawingCanvas = ViewUtils.getStageElement(); |
485 | } | 488 | } |
486 | posInfo = this._getMouseEventPosition (event.pageX, event.pageY, false, false); | 489 | var globalMousePos = hitRec.getScreenPoint(); |
487 | var globalMousePos = posInfo[0]; | ||
488 | var localMousePos = ViewUtils.globalToLocal(globalMousePos, drawingCanvas); | 490 | var localMousePos = ViewUtils.globalToLocal(globalMousePos, drawingCanvas); |
489 | 491 | ||
490 | 492 | ||
491 | //var selAnchorRetCode = this._selectedSubpath.pickAnchor(currMousePos[0], currMousePos[1], currMousePos[2], this._PICK_POINT_RADIUS, false); | 493 | //var selAnchorRetCode = this._selectedSubpath.pickAnchor(currMousePos[0], currMousePos[1], currMousePos[2], this._PICK_POINT_RADIUS, false); |
492 | var selAnchorRetCode = this._selectedSubpath.pickAnchor(localMousePos[0], localMousePos[1], localMousePos[2], this._PICK_POINT_RADIUS, true); | 494 | //var selAnchorRetCode = this._selectedSubpath.pickAnchor(localMousePos[0], localMousePos[1], localMousePos[2], this._PICK_POINT_RADIUS); |
493 | if (selAnchorRetCode[0] >=0) { | 495 | var selAnchorAndParamAndCode = this._selectedSubpath.pickPath(localMousePos[0], localMousePos[1], localMousePos[2], this._PICK_POINT_RADIUS, true); |
494 | this._hoveredAnchorIndex = selAnchorRetCode[0]; | 496 | if (selAnchorAndParamAndCode[0] >=0){ //something on the path was hit |
495 | var lastAnchorIndex = this._selectedSubpath.getNumAnchors()-1; | 497 | if ((selAnchorAndParamAndCode[2] & this._selectedSubpath.SEL_ANCHOR) |
496 | var cursor = "url('images/cursors/penCursors/Pen_anchorSelect.png') 5 1, default"; | 498 | || (selAnchorAndParamAndCode[2] & this._selectedSubpath.SEL_PREV) |
497 | if (this._selectedSubpath.getIsClosed()===false){ | 499 | || (selAnchorAndParamAndCode[2] & this._selectedSubpath.SEL_NEXT)) |
498 | if (this._entryEditMode === this.ENTRY_SELECT_PATH && !this._isPickedEndPointInSelectPathMode && (this._hoveredAnchorIndex===0 || this._hoveredAnchorIndex===lastAnchorIndex)){ | 500 | { //the anchor was hit |
499 | //if we're in SELECT_PATH mode, have not yet clicked on the end anchors, AND we hovered over one of the end anchors | 501 | this._hoveredAnchorIndex = selAnchorAndParamAndCode[0]; |
500 | cursor = "url('images/cursors/penCursors/Pen_append.png') 5 1, default"; | 502 | var lastAnchorIndex = this._selectedSubpath.getNumAnchors()-1; |
501 | } else if ( this._selectedSubpath.getSelectedAnchorIndex()===lastAnchorIndex && this._hoveredAnchorIndex===0) { | 503 | var cursor = "url('images/cursors/penCursors/Pen_anchorSelect.png') 5 1, default"; |
502 | //if we've selected the last anchor and hover over the first anchor | 504 | if (this._selectedSubpath.getIsClosed()===false){ |
503 | cursor = "url('images/cursors/penCursors/Pen_closePath.png') 5 1, default"; | 505 | if (this._entryEditMode === this.ENTRY_SELECT_PATH && !this._isPickedEndPointInSelectPathMode && (this._hoveredAnchorIndex===0 || this._hoveredAnchorIndex===lastAnchorIndex)){ |
504 | } | 506 | //if we're in SELECT_PATH mode, have not yet clicked on the end anchors, AND we hovered over one of the end anchors |
505 | } //if path is not closed | 507 | cursor = "url('images/cursors/penCursors/Pen_append.png') 5 1, default"; |
506 | this.application.ninja.stage.drawingCanvas.style.cursor = cursor; | 508 | } else if ( this._selectedSubpath.getSelectedAnchorIndex()===lastAnchorIndex && this._hoveredAnchorIndex===0) { |
507 | } else { | 509 | //if we've selected the last anchor and hover over the first anchor |
508 | //detect if the current mouse position will hit the path (such that clicking here will insert a new anchor) | 510 | cursor = "url('images/cursors/penCursors/Pen_closePath.png') 5 1, default"; |
509 | var pathHitTestData = this._selectedSubpath.pathSamplesLocalHitTest(localMousePos[0], localMousePos[1], localMousePos[2], this._PICK_POINT_RADIUS*0.5); | 511 | } |
510 | if (pathHitTestData[0]!==-1){ | 512 | } //if path is not closed |
513 | this.application.ninja.stage.drawingCanvas.style.cursor = cursor; | ||
514 | } else if (selAnchorAndParamAndCode[2] & this._selectedSubpath.SEL_PATH) { | ||
511 | //change the cursor | 515 | //change the cursor |
516 | STOPPED HERE...why is this case not being hit? | ||
512 | var cursor = "url('images/cursors/penCursors/Pen_plus.png') 5 1, default"; | 517 | var cursor = "url('images/cursors/penCursors/Pen_plus.png') 5 1, default"; |
513 | this.application.ninja.stage.drawingCanvas.style.cursor = cursor; | 518 | this.application.ninja.stage.drawingCanvas.style.cursor = cursor; |
514 | } | 519 | } |
515 | } | 520 | } //something on the path was hit |
516 | } | 521 | } |
517 | } //else of if (this._isDrawing) { | 522 | } //else of if (this._isDrawing) { |
518 | 523 | ||
@@ -520,7 +525,7 @@ exports.PenTool = Montage.create(ShapeTool, { | |||
520 | if (this._selectedSubpath){ | 525 | if (this._selectedSubpath){ |
521 | this.DrawSubpathAnchors(this._selectedSubpath); | 526 | this.DrawSubpathAnchors(this._selectedSubpath); |
522 | } | 527 | } |
523 | */ | 528 | |
524 | }//value: function(event) | 529 | }//value: function(event) |
525 | },//HandleMouseMove | 530 | },//HandleMouseMove |
526 | 531 | ||
@@ -769,6 +774,10 @@ exports.PenTool = Montage.create(ShapeTool, { | |||
769 | this._selectedSubpathCanvasCenter[1]+= snapManager.getStageHeight()*0.5; | 774 | this._selectedSubpathCanvasCenter[1]+= snapManager.getStageHeight()*0.5; |
770 | } | 775 | } |
771 | 776 | ||
777 | //update the plane matrix of this subpath by querying the element mediator | ||
778 | if (this._selectedSubpathCanvas) { | ||
779 | this._selectedSubpathPlaneMat = ElementMediator.getMatrix(this._selectedSubpathCanvas); | ||
780 | } | ||
772 | var planeMatInv = glmat4.inverse(this._selectedSubpathPlaneMat, []); | 781 | var planeMatInv = glmat4.inverse(this._selectedSubpathPlaneMat, []); |
773 | 782 | ||
774 | // ***** compute local coordinates of the anchor points ***** | 783 | // ***** compute local coordinates of the anchor points ***** |