aboutsummaryrefslogtreecommitdiff
path: root/js
diff options
context:
space:
mode:
authorPushkar Joshi2012-04-06 11:31:32 -0700
committerPushkar Joshi2012-04-06 11:31:32 -0700
commit6b3d915b94d1263252448bd5a4ebeef4534b9528 (patch)
tree4b47b0c1630c6b488081547afc5bfd33a66ddd00 /js
parentf492c816575f990429f4540c9a3eb60c28a89623 (diff)
downloadninja-6b3d915b94d1263252448bd5a4ebeef4534b9528.tar.gz
code cleanup and working version of selected path anchor point and overlay display for new paths
Diffstat (limited to 'js')
-rwxr-xr-xjs/tools/PenTool.js127
1 files changed, 17 insertions, 110 deletions
diff --git a/js/tools/PenTool.js b/js/tools/PenTool.js
index 32902cea..f310208e 100755
--- a/js/tools/PenTool.js
+++ b/js/tools/PenTool.js
@@ -402,7 +402,7 @@ exports.PenTool = Montage.create(ShapeTool, {
402 TranslateSelectedSubpathPerPenCanvas:{ 402 TranslateSelectedSubpathPerPenCanvas:{
403 value: function() { 403 value: function() {
404 if (this._penCanvas!==null) { 404 if (this._penCanvas!==null) {
405 this._selectedSubpath.translateSubpathPerCanvas(ElementMediator); 405 this._selectedSubpath.translateSubpathPerCanvas(ElementMediator);
406 } 406 }
407 } 407 }
408 }, 408 },
@@ -586,6 +586,8 @@ exports.PenTool = Montage.create(ShapeTool, {
586 586
587 var drawData = this.getDrawingData(); 587 var drawData = this.getDrawingData();
588 if (drawData) { 588 if (drawData) {
589 //todo handle the case when the user does not click a point on the path canvas
590 // (we don't want to set the plane mat. to be set to some plane not on the canvas of the path)
589 if (!this._penPlaneMat) { 591 if (!this._penPlaneMat) {
590 this._penPlaneMat = drawData.planeMat; 592 this._penPlaneMat = drawData.planeMat;
591 } 593 }
@@ -829,61 +831,18 @@ exports.PenTool = Montage.create(ShapeTool, {
829 throw ("null drawing context in Pentool::DrawSubpathSVG"); 831 throw ("null drawing context in Pentool::DrawSubpathSVG");
830 ctx.save(); 832 ctx.save();
831 833
832 /* 834 var drawingCanvas = subpath.getCanvas();
833 var horizontalOffset = this.application.ninja.stage.userContentLeft; 835 if (!drawingCanvas){
834 var verticalOffset = this.application.ninja.stage.userContentTop; 836 drawingCanvas = ViewUtils.getStageElement();
835 //display the subpath as a sequence of cubic beziers
836 ctx.lineWidth = 1;//TODO replace hardcoded stroke width with some programmatically set value (should not be same as stroke width)
837 ctx.strokeStyle = "green";
838 var i=0;
839 ctx.beginPath();
840 var p0x = subpath.getAnchor(0).getPosX()+ horizontalOffset;
841 var p0y = subpath.getAnchor(0).getPosY()+ verticalOffset;
842 ctx.moveTo(p0x, p0y);
843 for (i = 1; i < numAnchors; i++) {
844 var p1x = subpath.getAnchor(i - 1).getNextX()+ horizontalOffset;
845 var p1y = subpath.getAnchor(i - 1).getNextY()+ verticalOffset;
846 var p2x = subpath.getAnchor(i).getPrevX()+ horizontalOffset;
847 var p2y = subpath.getAnchor(i).getPrevY()+ verticalOffset;
848 var p3x = subpath.getAnchor(i).getPosX()+ horizontalOffset;
849 var p3y = subpath.getAnchor(i).getPosY()+ verticalOffset;
850 ctx.bezierCurveTo(p1x, p1y, p2x, p2y, p3x, p3y);
851 } 837 }
852 if (subpath.getIsClosed()) {
853 var i = numAnchors - 1;
854 var p1x = subpath.getAnchor(i).getNextX()+ horizontalOffset;
855 var p1y = subpath.getAnchor(i).getNextY()+ verticalOffset;
856 var p2x = subpath.getAnchor(0).getPrevX()+ horizontalOffset;
857 var p2y = subpath.getAnchor(0).getPrevY()+ verticalOffset;
858 var p3x = subpath.getAnchor(0).getPosX()+ horizontalOffset;
859 var p3y = subpath.getAnchor(0).getPosY()+ verticalOffset;
860 ctx.bezierCurveTo(p1x, p1y, p2x, p2y, p3x, p3y);
861 }
862 ctx.stroke();*/
863
864
865 //draw the stage world points by projecting them to screen space 838 //draw the stage world points by projecting them to screen space
866 //get the screen coords of this anchor from its stage world coord 839 //get the screen coords of this anchor from its stage world coord
867 ctx.lineWidth = 1;//TODO replace hardcoded stroke width with some programmatically set value (should not be same as stroke width) 840 ctx.lineWidth = 1;//TODO replace hardcoded stroke width with some programmatically set value (should not be same as stroke width)
868 ctx.strokeStyle = "green"; 841 ctx.strokeStyle = "green";
869 var localToGlobalMat = ViewUtils.getLocalToGlobalMatrix(subpath.getCanvas()); 842 var localToGlobalMat = ViewUtils.getLocalToGlobalMatrix(drawingCanvas);
870
871 /*var currentLTWH = subpath.computeLeftTopWidthHeight();
872 var deltaX = currentLTWH[0] - parseInt(ElementMediator.getProperty(subpath.getCanvas(), "left"));
873 var deltaY = currentLTWH[1] - parseInt(ElementMediator.getProperty(subpath.getCanvas(), "top"));*/
874
875 //var localCoord = subpath.getAnchorLocalCoord(0);
876 //var sp = MathUtils.transformAndDivideHomogeneousPoint(localCoord,localToGlobalMat);
877 //add the difference between the current left and top and the canvas left and top
878 //sp[0]+=deltaX; sp[1]+=deltaY;
879 //ctx.moveTo(sp[0], sp[1]);
880
881 var widthAdjustment = -snapManager.getStageWidth()*0.5; 843 var widthAdjustment = -snapManager.getStageWidth()*0.5;
882 var heightAdjustment = -snapManager.getStageHeight()*0.5; 844 var heightAdjustment = -snapManager.getStageHeight()*0.5;
883 /*var stageWorldToGlobalMatrix = ViewUtils.getStageWorldToGlobalMatrix(); 845 var localToStageWorldMat = ViewUtils.getLocalToStageWorldMatrix(drawingCanvas, true, false);
884 var localToStageWorldMatrix = ViewUtils.getMatrixFromElement(subpath.getCanvas());
885 glmat4.multiply(localToStageWorldMatrix, stageWorldToGlobalMatrix, stageWorldToGlobalMatrix);*/
886 var localToStageWorldMat = ViewUtils.getLocalToStageWorldMatrix(subpath.getCanvas(), true, false);
887 var stageWorldToLocalMat = glmat4.inverse(localToStageWorldMat, []); 846 var stageWorldToLocalMat = glmat4.inverse(localToStageWorldMat, []);
888 847
889 var c0=[0,0,0], c1=[0,0,0],c2=[0,0,0], c3=[0,0,0]; //screen coord of the bezier control points 848 var c0=[0,0,0], c1=[0,0,0],c2=[0,0,0], c3=[0,0,0]; //screen coord of the bezier control points
@@ -904,12 +863,6 @@ exports.PenTool = Montage.create(ShapeTool, {
904 863
905 for (i = 1; i < numBezierCurves; i++) { 864 for (i = 1; i < numBezierCurves; i++) {
906 currAnchor = subpath.getAnchor(i%numAnchors); 865 currAnchor = subpath.getAnchor(i%numAnchors);
907 /*localCoord = subpath.getAnchorLocalCoord(i);
908 sp = MathUtils.transformAndDivideHomogeneousPoint(localCoord,localToGlobalMat);
909 //add the difference between the current left and top and the canvas left and top
910 sp[0]+=deltaX; sp[1]+=deltaY;*/
911
912 //ctx.lineTo(sp[0], sp[1]);
913 866
914 c1 = MathUtils.transformAndDivideHomogeneousPoint( 867 c1 = MathUtils.transformAndDivideHomogeneousPoint(
915 [prevAnchor.getNextX()+widthAdjustment, 868 [prevAnchor.getNextX()+widthAdjustment,
@@ -957,20 +910,15 @@ exports.PenTool = Montage.create(ShapeTool, {
957 throw ("null drawing context in Pentool::DrawSelectedSubpathAnchors"); 910 throw ("null drawing context in Pentool::DrawSelectedSubpathAnchors");
958 ctx.save(); 911 ctx.save();
959 912
960 var horizontalOffset = this.application.ninja.stage.userContentLeft;//stageManagerModule.stageManager.userContentLeft;
961 var verticalOffset = this.application.ninja.stage.userContentTop;//stageManagerModule.stageManager.userContentTop;
962
963 var widthAdjustment = -snapManager.getStageWidth()*0.5; 913 var widthAdjustment = -snapManager.getStageWidth()*0.5;
964 var heightAdjustment = -snapManager.getStageHeight()*0.5; 914 var heightAdjustment = -snapManager.getStageHeight()*0.5;
965 915
966 var localToGlobalMat = ViewUtils.getLocalToGlobalMatrix(subpath.getCanvas()); 916 var drawingCanvas = subpath.getCanvas();
967 917 if (!drawingCanvas){
968 /*var currentLTWH = subpath.computeLeftTopWidthHeight(); 918 drawingCanvas = ViewUtils.getStageElement();
969 var deltaX = currentLTWH[0] - parseInt(ElementMediator.getProperty(subpath.getCanvas(), "left")); 919 }
970 var deltaY = currentLTWH[1] - parseInt(ElementMediator.getProperty(subpath.getCanvas(), "top")); 920 var localToGlobalMat = ViewUtils.getLocalToGlobalMatrix(drawingCanvas);
971 */ 921 var localToStageWorldMat = ViewUtils.getLocalToStageWorldMatrix(drawingCanvas, true, false);
972
973 var localToStageWorldMat = ViewUtils.getLocalToStageWorldMatrix(subpath.getCanvas(), true, false);
974 var stageWorldToLocalMat = glmat4.inverse(localToStageWorldMat, []); 922 var stageWorldToLocalMat = glmat4.inverse(localToStageWorldMat, []);
975 923
976 924
@@ -986,19 +934,11 @@ exports.PenTool = Montage.create(ShapeTool, {
986 var currAnchor = null; 934 var currAnchor = null;
987 for (var i = 0; i < numAnchors; i++) { 935 for (var i = 0; i < numAnchors; i++) {
988 currAnchor = subpath.getAnchor(i); 936 currAnchor = subpath.getAnchor(i);
989 //px = currAnchor.getPosX()+horizontalOffset;
990 //py = currAnchor.getPosY()+verticalOffset;
991 //var localCoordOld = subpath.getAnchorLocalCoord(i);
992 localCoord = MathUtils.transformAndDivideHomogeneousPoint([currAnchor.getPosX()+widthAdjustment, currAnchor.getPosY()+heightAdjustment, currAnchor.getPosZ()], stageWorldToLocalMat); //convert from stage world to local coord 937 localCoord = MathUtils.transformAndDivideHomogeneousPoint([currAnchor.getPosX()+widthAdjustment, currAnchor.getPosY()+heightAdjustment, currAnchor.getPosZ()], stageWorldToLocalMat); //convert from stage world to local coord
993 //localCoord[0]-=snapManager.getStageWidth()*0.5;
994 //localCoord[1]-=snapManager.getStageHeight()*0.5;
995 //sp = MathUtils.transformAndDivideHomogeneousPoint(localCoordOld,localToGlobalMat); //convert from local coord to global (screen) coord
996 sp = MathUtils.transformAndDivideHomogeneousPoint(localCoord,localToGlobalMat); //convert from local coord to global (screen) coord 938 sp = MathUtils.transformAndDivideHomogeneousPoint(localCoord,localToGlobalMat); //convert from local coord to global (screen) coord
997 //sp[0]+=deltaX; sp[1]+=deltaY;
998 px = sp[0]; py=sp[1]; 939 px = sp[0]; py=sp[1];
999 940
1000 ctx.beginPath(); 941 ctx.beginPath();
1001 //ctx.arc(px + horizontalOffset, py + verticalOffset, this._DISPLAY_ANCHOR_RADIUS, 0, 2 * Math.PI, false);
1002 ctx.moveTo(px-anchorDelta, py-anchorDelta); 942 ctx.moveTo(px-anchorDelta, py-anchorDelta);
1003 ctx.lineTo(px+anchorDelta, py-anchorDelta); 943 ctx.lineTo(px+anchorDelta, py-anchorDelta);
1004 ctx.lineTo(px+anchorDelta, py+anchorDelta); 944 ctx.lineTo(px+anchorDelta, py+anchorDelta);
@@ -1012,18 +952,11 @@ exports.PenTool = Montage.create(ShapeTool, {
1012 ctx.lineWidth = 2; 952 ctx.lineWidth = 2;
1013 if (this._hoveredAnchorIndex>=0 && this._hoveredAnchorIndex<numAnchors) { 953 if (this._hoveredAnchorIndex>=0 && this._hoveredAnchorIndex<numAnchors) {
1014 currAnchor = subpath.getAnchor(this._hoveredAnchorIndex); 954 currAnchor = subpath.getAnchor(this._hoveredAnchorIndex);
1015 px = currAnchor.getPosX() +horizontalOffset;
1016 py = currAnchor.getPosY() +verticalOffset;
1017 //localCoord = subpath.getAnchorLocalCoord(this._hoveredAnchorIndex);
1018 localCoord = MathUtils.transformAndDivideHomogeneousPoint([currAnchor.getPosX()+widthAdjustment, currAnchor.getPosY()+heightAdjustment, currAnchor.getPosZ()], stageWorldToLocalMat); //convert from stage world to local coord 955 localCoord = MathUtils.transformAndDivideHomogeneousPoint([currAnchor.getPosX()+widthAdjustment, currAnchor.getPosY()+heightAdjustment, currAnchor.getPosZ()], stageWorldToLocalMat); //convert from stage world to local coord
1019 //localCoord[0]-=snapManager.getStageWidth()*0.5;
1020 //localCoord[1]-=snapManager.getStageHeight()*0.5;
1021 sp = MathUtils.transformAndDivideHomogeneousPoint(localCoord,localToGlobalMat); 956 sp = MathUtils.transformAndDivideHomogeneousPoint(localCoord,localToGlobalMat);
1022 //sp[0]+=deltaX; sp[1]+=deltaY;
1023 px = sp[0]; py=sp[1]; 957 px = sp[0]; py=sp[1];
1024 958
1025 ctx.beginPath(); 959 ctx.beginPath();
1026 //ctx.arc(px + horizontalOffset, py + verticalOffset, this._DISPLAY_ANCHOR_RADIUS*1.5, 0, 2 * Math.PI, false);
1027 ctx.moveTo(px-selAnchorDelta, py-selAnchorDelta); 960 ctx.moveTo(px-selAnchorDelta, py-selAnchorDelta);
1028 ctx.lineTo(px+selAnchorDelta, py-selAnchorDelta); 961 ctx.lineTo(px+selAnchorDelta, py-selAnchorDelta);
1029 ctx.lineTo(px+selAnchorDelta, py+selAnchorDelta); 962 ctx.lineTo(px+selAnchorDelta, py+selAnchorDelta);
@@ -1046,34 +979,17 @@ exports.PenTool = Montage.create(ShapeTool, {
1046 var whichPoint = this._selectedSubpath.getSelectedMode(); //which of the selected handles to highlight 979 var whichPoint = this._selectedSubpath.getSelectedMode(); //which of the selected handles to highlight
1047 980
1048 //compute the screen (global) coord. of the selected anchor 981 //compute the screen (global) coord. of the selected anchor
1049 var posX=selAnchor.getPosX()+horizontalOffset, posY=selAnchor.getPosY()+verticalOffset;
1050 //localCoord = subpath.getAnchorLocalCoord(subpath.getSelectedAnchorIndex());
1051 localCoord = MathUtils.transformAndDivideHomogeneousPoint([selAnchor.getPosX()+widthAdjustment, selAnchor.getPosY()+heightAdjustment, selAnchor.getPosZ()], stageWorldToLocalMat); //convert from stage world to local coord 982 localCoord = MathUtils.transformAndDivideHomogeneousPoint([selAnchor.getPosX()+widthAdjustment, selAnchor.getPosY()+heightAdjustment, selAnchor.getPosZ()], stageWorldToLocalMat); //convert from stage world to local coord
1052 //localCoord[0]-=snapManager.getStageWidth()*0.5;
1053 //localCoord[1]-=snapManager.getStageHeight()*0.5;
1054 sp = MathUtils.transformAndDivideHomogeneousPoint(localCoord,localToGlobalMat); 983 sp = MathUtils.transformAndDivideHomogeneousPoint(localCoord,localToGlobalMat);
1055 //sp[0]+=deltaX; sp[1]+=deltaY; 984 var posX = sp[0]; var posY=sp[1];
1056 posX = sp[0]; posY=sp[1];
1057 985
1058 //compute the screen (global) coord. of the selected anchor prev and next points 986 //compute the screen (global) coord. of the selected anchor prev and next points
1059 var prevX=selAnchor.getPrevX() + horizontalOffset, prevY = selAnchor.getPrevY() + verticalOffset,
1060 nextX=selAnchor.getNextX() + horizontalOffset, nextY=selAnchor.getNextY() + verticalOffset;
1061 var prevLocalCoord = MathUtils.transformAndDivideHomogeneousPoint([selAnchor.getPrevX()+widthAdjustment, selAnchor.getPrevY()+heightAdjustment, selAnchor.getPrevZ()], stageWorldToLocalMat); 987 var prevLocalCoord = MathUtils.transformAndDivideHomogeneousPoint([selAnchor.getPrevX()+widthAdjustment, selAnchor.getPrevY()+heightAdjustment, selAnchor.getPrevZ()], stageWorldToLocalMat);
1062 //prevLocalCoord[0]-=snapManager.getStageWidth()*0.5;
1063 //prevLocalCoord[1]-=snapManager.getStageHeight()*0.5;
1064 sp = MathUtils.transformAndDivideHomogeneousPoint(prevLocalCoord, localToGlobalMat); 988 sp = MathUtils.transformAndDivideHomogeneousPoint(prevLocalCoord, localToGlobalMat);
1065 if (sp){ 989 var prevX = sp[0]; var prevY=sp[1];
1066 //sp[0]+=deltaX; sp[1]+=deltaY;