aboutsummaryrefslogtreecommitdiff
diff options
context:
space:
mode:
authorPushkar Joshi2012-04-18 14:28:43 -0700
committerPushkar Joshi2012-04-18 14:28:43 -0700
commit9b4f9a792f34b3c6ca291ad23da1efe4711687f4 (patch)
treeac5bd64ab0a8067489f7603bbf101ee8fb851f8f
parent890d84a1078fae1f21a56e8be3ed181650afe9e1 (diff)
downloadninja-9b4f9a792f34b3c6ca291ad23da1efe4711687f4.tar.gz
re-enable dragging and editing of anchor point handles for bezier path editing in 3D
-rwxr-xr-xjs/lib/geom/anchor-point.js4
-rwxr-xr-xjs/tools/PenTool.js227
2 files changed, 103 insertions, 128 deletions
diff --git a/js/lib/geom/anchor-point.js b/js/lib/geom/anchor-point.js
index 0e9f65ea..d254681c 100755
--- a/js/lib/geom/anchor-point.js
+++ b/js/lib/geom/anchor-point.js
@@ -221,6 +221,10 @@ GLAnchorPoint.prototype.getNext = function() {
221 return [this._nextX, this._nextY, this._nextZ]; 221 return [this._nextX, this._nextY, this._nextZ];
222}; 222};
223 223
224GLAnchorPoint.prototype.getAllPos = function() {
225 return [[this._prevX, this._prevY, this._prevZ],[this._x, this._y, this._z],[this._nextX, this._nextY, this._nextZ]];
226};
227
224//return the square of distance from passed in point to the anchor position 228//return the square of distance from passed in point to the anchor position
225GLAnchorPoint.prototype.getDistanceSq = function (x, y, z) { 229GLAnchorPoint.prototype.getDistanceSq = function (x, y, z) {
226 return (this._x - x) * (this._x - x) + (this._y - y) * (this._y - y) + (this._z - z) * (this._z - z); 230 return (this._x - x) * (this._x - x) + (this._y - y) * (this._y - y) + (this._z - z) * (this._z - z);
diff --git a/js/tools/PenTool.js b/js/tools/PenTool.js
index ec63771a..127beacd 100755
--- a/js/tools/PenTool.js
+++ b/js/tools/PenTool.js
@@ -287,14 +287,7 @@ exports.PenTool = Montage.create(ShapeTool, {
287 // Compute the mouse position in local (selected subpath canvas) space 287 // Compute the mouse position in local (selected subpath canvas) space
288 var globalPos = hitRec.getScreenPoint(); 288 var globalPos = hitRec.getScreenPoint();
289 var localMousePos = ViewUtils.globalToLocal(globalPos, this._selectedSubpathCanvas); 289 var localMousePos = ViewUtils.globalToLocal(globalPos, this._selectedSubpathCanvas);
290 /* 290
291 CHECK IF THIS IS CORRECT
292 ViewUtils.pushViewportObj
293 var temp ViewUtils.screenToView(localMousePos[0], localMousePos[1], 0) should return a point in view space of canvas
294 ViewUtils.popViewportObj
295 MathUtils.transformPoint(temp, this._selectedSubpathPlaneMat)
296 */
297
298 //now perform the hit testing 291 //now perform the hit testing
299 var prevSelectedAnchorIndex = this._selectedSubpath.getSelectedAnchorIndex(); 292 var prevSelectedAnchorIndex = this._selectedSubpath.getSelectedAnchorIndex();
300 var selAnchorAndParamAndCode = this._selectedSubpath.pickPath(localMousePos[0], localMousePos[1], localMousePos[2], this._PICK_POINT_RADIUS, false); 293 var selAnchorAndParamAndCode = this._selectedSubpath.pickPath(localMousePos[0], localMousePos[1], localMousePos[2], this._PICK_POINT_RADIUS, false);
@@ -417,29 +410,29 @@ exports.PenTool = Montage.create(ShapeTool, {
417 410
418 var hitRec = this.getHitRecord(event.pageX, event.pageY); 411 var hitRec = this.getHitRecord(event.pageX, event.pageY);
419 412
420 if (this._isDrawing) { 413 var drawingCanvas=null, globalMousePos=null, localMousePos=null;
421 if (0){ 414 if (this._selectedSubpath ){
422 //if (currMousePos && this._selectedSubpath && (this._selectedSubpath.getSelectedAnchorIndex() >= 0 && this._selectedSubpath.getSelectedAnchorIndex() < this._selectedSubpath.getNumAnchors())) { 415 drawingCanvas = this._selectedSubpath.getCanvas();
423 // BEGIN NEW LOCAL COORD BLOCK 416 if (!drawingCanvas){
424 //build the mouse position in local coordinates 417 drawingCanvas = ViewUtils.getStageElement();
425 var drawingCanvas = this._selectedSubpath.getCanvas(); 418 }
426 if (!drawingCanvas){ 419 globalMousePos = hitRec.getScreenPoint();
427 drawingCanvas = ViewUtils.getStageElement(); 420 localMousePos = ViewUtils.globalToLocal(globalMousePos, drawingCanvas);
428 } 421 }
429 posInfo = this._getMouseEventPosition (event.pageX, event.pageY, false, false);
430 var globalMousePos = posInfo[0];
431 var localMousePos = ViewUtils.globalToLocal(globalMousePos, drawingCanvas);
432 422
423 if (this._isDrawing) {
424 //if there is a selected subpath with a selected anchor point
425 if (this._selectedSubpath.getSelectedAnchorIndex() >= 0 && this._selectedSubpath.getSelectedAnchorIndex() < this._selectedSubpath.getNumAnchors()) {
433 //compute the translation from the selected anchor 426 //compute the translation from the selected anchor
434 var selAnchorLocalPos = this._selectedSubpath.getAnchorLocalCoord(this._selectedSubpath.getSelectedAnchorIndex());
435 var localTranslation = VecUtils.vecSubtract(3, localMousePos, selAnchorLocalPos[1]);
436 var selAnchor = this._selectedSubpath.getAnchor(this._selectedSubpath.getSelectedAnchorIndex()); 427 var selAnchor = this._selectedSubpath.getAnchor(this._selectedSubpath.getSelectedAnchorIndex());
428 var selAnchorPos = selAnchor.getAllPos();
429 var localTranslation = VecUtils.vecSubtract(3, localMousePos, selAnchorPos[1]);
437 430
438 if (this._editMode & this.EDIT_ANCHOR) { 431 if (this._editMode & this.EDIT_ANCHOR) {
439 selAnchor.translateAll(localTranslation[0], localTranslation[1], localTranslation[2]); 432 selAnchor.translateAll(localTranslation[0], localTranslation[1], localTranslation[2]);
440 } 433 }
441 else if (this._editMode & this.EDIT_PREV) { 434 else if (this._editMode & this.EDIT_PREV) {
442 localTranslation = VecUtils.vecSubtract(3, localMousePos, selAnchorLocalPos[0]); 435 localTranslation = VecUtils.vecSubtract(3, localMousePos, selAnchorPos[0]);
443 selAnchor.translatePrev(localTranslation[0], localTranslation[1], localTranslation[2]); 436 selAnchor.translatePrev(localTranslation[0], localTranslation[1], localTranslation[2]);
444 437
445 //move the next point if Alt key is down to ensure relative angle between prev and next 438 //move the next point if Alt key is down to ensure relative angle between prev and next
@@ -448,7 +441,7 @@ exports.PenTool = Montage.create(ShapeTool, {
448 } 441 }
449 } 442 }
450 else if (this._editMode & this.EDIT_NEXT) { 443 else if (this._editMode & this.EDIT_NEXT) {
451 localTranslation = VecUtils.vecSubtract(3, localMousePos, selAnchorLocalPos[2]); 444 localTranslation = VecUtils.vecSubtract(3, localMousePos, selAnchorPos[2]);
452 selAnchor.translateNext(localTranslation[0], localTranslation[1], localTranslation[2]); 445 selAnchor.translateNext(localTranslation[0], localTranslation[1], localTranslation[2]);
453 446
454 //move the prev point if Alt key is down to ensure relative angle between prev and next 447 //move the prev point if Alt key is down to ensure relative angle between prev and next
@@ -457,12 +450,11 @@ exports.PenTool = Montage.create(ShapeTool, {
457 } 450 }
458 } 451 }
459 else if (this._editMode & this.EDIT_PREV_NEXT) { 452 else if (this._editMode & this.EDIT_PREV_NEXT) {
460 localTranslation = VecUtils.vecSubtract(3, localMousePos, selAnchorLocalPos[2]); 453 localTranslation = VecUtils.vecSubtract(3, localMousePos, selAnchorPos[2]);
461 selAnchor.translateNext(localTranslation[0], localTranslation[1], localTranslation[2]); 454 selAnchor.translateNext(localTranslation[0], localTranslation[1], localTranslation[2]);
462 selAnchor.setPrevFromNext(); 455 selAnchor.setPrevFromNext();
463 } 456 }
464 457
465
466 //snapping...check if the new location of the anchor point is close to another anchor point 458 //snapping...check if the new location of the anchor point is close to another anchor point
467 var selX = selAnchor.getPosX(); 459 var selX = selAnchor.getPosX();
468 var selY = selAnchor.getPosY(); 460 var selY = selAnchor.getPosY();
@@ -482,59 +474,37 @@ exports.PenTool = Montage.create(ShapeTool, {
482 } 474 }
483 } 475 }
484 476
485 // END NEW LOCAL COORD BLOCK
486
487 //make the subpath dirty so it will get re-drawn 477 //make the subpath dirty so it will get re-drawn
488 this._selectedSubpath.makeDirty(); 478 this._selectedSubpath.makeDirty();
489 this.DrawSubpathOnStage(this._selectedSubpath); 479 this.DrawSubpathOnStage(this._selectedSubpath);
490 } 480 }
491 } else { //if mouse is not down: 481 } else { //if mouse is not down:
492 //this.doSnap(event); 482 var selAnchorAndParamAndCode = this._selectedSubpath.pickPath(localMousePos[0], localMousePos[1], localMousePos[2], this._PICK_POINT_RADIUS, true);
493 //this.DrawHandles(); 483 if (selAnchorAndParamAndCode[0] >=0){ //something on the path was hit
494 484 if ((selAnchorAndParamAndCode[2] & this._selectedSubpath.SEL_ANCHOR)
495 if (this._selectedSubpath ){ 485 || (selAnchorAndParamAndCode[2] & this._selectedSubpath.SEL_PREV)
496 486 || (selAnchorAndParamAndCode[2] & this._selectedSubpath.SEL_NEXT))
497 //convert the mouse pos. to local space of the canvas 487 { //the anchor was hit
498 //var widthAdjustment = -snapManager.getStageWidth()*0.5; 488 this._hoveredAnchorIndex = selAnchorAndParamAndCode[0];
499 //var heightAdjustment = -snapManager.getStageHeight()*0.5; 489 var lastAnchorIndex = this._selectedSubpath.getNumAnchors()-1;
500 490 var cursor = "url('images/cursors/penCursors/Pen_anchorSelect.png') 5 1, default";
501 491 if (this._selectedSubpath.getIsClosed()===false){
502 var drawingCanvas = this._selectedSubpath.getCanvas(); 492 if (this._entryEditMode === this.ENTRY_SELECT_PATH && !this._isPickedEndPointInSelectPathMode && (this._hoveredAnchorIndex===0 || this._hoveredAnchorIndex===lastAnchorIndex)){
503 if (!drawingCanvas){ 493 //if we're in SELECT_PATH mode, have not yet clicked on the end anchors, AND we hovered over one of the end anchors
504 drawingCanvas = ViewUtils.getStageElement(); 494 cursor = "url('images/cursors/penCursors/Pen_append.png') 5 1, default";
495 } else if ( this._selectedSubpath.getSelectedAnchorIndex()===lastAnchorIndex && this._hoveredAnchorIndex===0) {
496 //if we've selected the last anchor and hover over the first anchor
497 cursor = "url('images/cursors/penCursors/Pen_closePath.png') 5 1, default";
498 }
499 } //if path is not closed
500 this.application.ninja.stage.drawingCanvas.style.cursor = cursor;
501 } else if (selAnchorAndParamAndCode[2] & this._selectedSubpath.SEL_PATH) {
502 //change the cursor
503 var cursor = "url('images/cursors/penCursors/Pen_plus.png') 5 1, default";
504 this.application.ninja.stage.drawingCanvas.style.cursor = cursor;
505 } 505 }
506 var globalMousePos = hitRec.getScreenPoint(); 506 } //something on the path was hit
507 var localMousePos = ViewUtils.globalToLocal(globalMousePos, drawingCanvas); 507 } //mouse is not down
508
509 //var selAnchorRetCode = this._selectedSubpath.pickAnchor(currMousePos[0], currMousePos[1], currMousePos[2], this._PICK_POINT_RADIUS, false);
510 //var selAnchorRetCode = this._selectedSubpath.pickAnchor(localMousePos[0], localMousePos[1], localMousePos[2], this._PICK_POINT_RADIUS);
511 var selAnchorAndParamAndCode = this._selectedSubpath.pickPath(localMousePos[0], localMousePos[1], localMousePos[2], this._PICK_POINT_RADIUS, true);
512 if (selAnchorAndParamAndCode[0] >=0){ //something on the path was hit
513 if ((selAnchorAndParamAndCode[2] & this._selectedSubpath.SEL_ANCHOR)
514 || (selAnchorAndParamAndCode[2] & this._selectedSubpath.SEL_PREV)
515 || (selAnchorAndParamAndCode[2] & this._selectedSubpath.SEL_NEXT))
516 { //the anchor was hit
517 this._hoveredAnchorIndex = selAnchorAndParamAndCode[0];
518 var lastAnchorIndex = this._selectedSubpath.getNumAnchors()-1;
519 var cursor = "url('images/cursors/penCursors/Pen_anchorSelect.png') 5 1, default";
520 if (this._selectedSubpath.getIsClosed()===false){
521 if (this._entryEditMode === this.ENTRY_SELECT_PATH && !this._isPickedEndPointInSelectPathMode && (this._hoveredAnchorIndex===0 || this._hoveredAnchorIndex===lastAnchorIndex)){
522 //if we're in SELECT_PATH mode, have not yet clicked on the end anchors, AND we hovered over one of the end anchors
523 cursor = "url('images/cursors/penCursors/Pen_append.png') 5 1, default";
524 } else if ( this._selectedSubpath.getSelectedAnchorIndex()===lastAnchorIndex && this._hoveredAnchorIndex===0) {
525 //if we've selected the last anchor and hover over the first anchor
526 cursor = "url('images/cursors/penCursors/Pen_closePath.png') 5 1, default";
527 }
528 } //if path is not closed
529 this.application.ninja.stage.drawingCanvas.style.cursor = cursor;
530 } else if (selAnchorAndParamAndCode[2] & this._selectedSubpath.SEL_PATH) {
531 //change the cursor
532 var cursor = "url('images/cursors/penCursors/Pen_plus.png') 5 1, default";
533 this.application.ninja.stage.drawingCanvas.style.cursor = cursor;
534 }
535 } //something on the path was hit
536 }
537 } //else of if (this._isDrawing) {
538 508
539 //this.drawLastSnap(); // Required cleanup for both Draw/Feedbacks 509 //this.drawLastSnap(); // Required cleanup for both Draw/Feedbacks
540 if (this._selectedSubpath){ 510 if (this._selectedSubpath){
@@ -781,24 +751,22 @@ exports.PenTool = Montage.create(ShapeTool, {
781 var bboxMid = VecUtils.vecInterpolate(3, bboxMin, bboxMax, 0.5); 751 var bboxMid = VecUtils.vecInterpolate(3, bboxMin, bboxMax, 0.5);
782 752
783 //sandwich the planeMat between with the translation to the previous center of the canvas in local space and its inverse 753 //sandwich the planeMat between with the translation to the previous center of the canvas in local space and its inverse
784 var centerDisp = VecUtils.vecSubtract(3, bboxMid, this._selectedSubpathLocalCenter); 754 if (this._selectedSubpathLocalCenter) {
785 var tMat = Matrix.Translation([centerDisp[0], centerDisp[1],centerDisp[2]]); 755 var centerDisp = VecUtils.vecSubtract(3, bboxMid, this._selectedSubpathLocalCenter);
786 var tInvMat = Matrix.Translation([-centerDisp[0], -centerDisp[1], -centerDisp[2]]); 756 var tMat = Matrix.Translation([centerDisp[0], centerDisp[1],centerDisp[2]]);
787 var newMat = Matrix.I(4); 757 var tInvMat = Matrix.Translation([-centerDisp[0], -centerDisp[1], -centerDisp[2]]);
788 glmat4.multiply( tInvMat, this._selectedSubpathPlaneMat, newMat); 758 var newMat = Matrix.I(4);
789 glmat4.multiply( newMat, tMat, newMat); 759 glmat4.multiply( tInvMat, this._selectedSubpathPlaneMat, newMat);
790 this._selectedSubpathPlaneMat = newMat; 760 glmat4.multiply( newMat, tMat, newMat);