aboutsummaryrefslogtreecommitdiff
diff options
context:
space:
mode:
authorPushkar Joshi2012-04-06 10:53:27 -0700
committerPushkar Joshi2012-04-06 10:53:27 -0700
commitf492c816575f990429f4540c9a3eb60c28a89623 (patch)
treeeef2eab16c4d99d2c67f542b454bf0251548b57e
parent0681b34b506767b6caf2816b9096bc1a57a17a2d (diff)
downloadninja-f492c816575f990429f4540c9a3eb60c28a89623.tar.gz
complete version of the code for rendering selected subpath anchor points and path overlay (code needs cleanup)...still buggy if creating new paths
-rwxr-xr-xjs/helper-classes/3D/view-utils.js71
-rwxr-xr-xjs/tools/PenTool.js216
2 files changed, 237 insertions, 50 deletions
diff --git a/js/helper-classes/3D/view-utils.js b/js/helper-classes/3D/view-utils.js
index f60b953a..35f4a568 100755
--- a/js/helper-classes/3D/view-utils.js
+++ b/js/helper-classes/3D/view-utils.js
@@ -787,6 +787,7 @@ exports.ViewUtils = Montage.create(Component, {
787 } 787 }
788 }, 788 },
789 789
790 /*
790 getStageWorldToGlobalMatrix: { 791 getStageWorldToGlobalMatrix: {
791 value: function() { 792 value: function() {
792 var stage = this.application.ninja.currentDocument.documentRoot; 793 var stage = this.application.ninja.currentDocument.documentRoot;
@@ -820,6 +821,26 @@ exports.ViewUtils = Montage.create(Component, {
820 return mat; 821 return mat;
821 } 822 }
822 }, 823 },
824 */
825 getStageWorldToGlobalMatrix:
826 {
827 value: function()
828 {
829 var stage = this.application.ninja.currentDocument.documentRoot;
830
831 this.pushViewportObj( stage );
832 // put the point into screen space of the stage - requires
833 // a translation to the top/left only
834 var cop = this.getCenterOfProjection();
835 var v2s = Matrix.Translation([cop[0], cop[1], 0]);
836 this.popViewportObj();
837
838 // append the localToGlobal matrix of the stage.
839 var mat = this.getLocalToGlobalMatrix( stage );
840 glmat4.multiply( mat, v2s );
841 return mat;
842 }
843 },
823 844
824 localScreenToLocalWorld: { 845 localScreenToLocalWorld: {
825 value: function( objPt, elt ) { 846 value: function( objPt, elt ) {
@@ -967,6 +988,56 @@ exports.ViewUtils = Montage.create(Component, {
967 } 988 }
968 }, 989 },
969 990
991 getLocalToStageWorldMatrix: {
992 value: function( elt, shouldProject, shouldLocalTransform ) {
993 var mat = Matrix.I(4);
994 while (elt)
995 {
996 this.pushViewportObj( elt );
997 var cop = this.getCenterOfProjection();
998 var s2v = Matrix.Translation([-cop[0], -cop[1], 0]);
999 var objMat = this.getMatrixFromElement( elt );
1000 var projMat;
1001 if(shouldProject)
1002 {
1003 //projMat = Matrix.I(4).multiply( this.getPerspectiveDistFromElement(elt) );
1004 var pDist = this.getPerspectiveDistFromElement(elt);
1005 var projMat = glmat4.scale(Matrix.I(4), [pDist,pDist,pDist], []);
1006 projMat[11] = -1;
1007 projMat[15] = 1400;
1008 }
1009 var v2s = Matrix.Translation([cop[0], cop[1], 0]);
1010 this.popViewportObj();
1011
1012 // multiply all the matrices together
1013 //mat = s2v.multiply( mat );
1014 glmat4.multiply( s2v, mat, mat );
1015 if (elt === this._stageElement) break;
1016 //mat = objMat.multiply( mat );
1017 if (shouldLocalTransform) {
1018 glmat4.multiply( objMat, mat, mat );
1019 }
1020 if(shouldProject)
1021 {
1022 //mat = projMat.multiply( mat );
1023 glmat4.multiply( projMat, mat, mat );
1024 }
1025 //mat = v2s.multiply( mat );
1026 glmat4.multiply( v2s, mat, mat );
1027
1028 // offset to the parent
1029 var offset = this.getElementOffset( elt );
1030 var offMat = Matrix.Translation([offset[0], offset[1], 0]);
1031 //mat = offMat.multiply( mat );
1032 glmat4.multiply( offMat, mat, mat );
1033
1034 elt = elt.parentElement;
1035 }
1036
1037 return mat;
1038 }
1039 },
1040
970 getUpVectorFromMatrix: { 1041 getUpVectorFromMatrix: {
971 value: function( mat ) { 1042 value: function( mat ) {
972 //var inv = mat.inverse(); 1043 //var inv = mat.inverse();
diff --git a/js/tools/PenTool.js b/js/tools/PenTool.js
index 962f178d..32902cea 100755
--- a/js/tools/PenTool.js
+++ b/js/tools/PenTool.js
@@ -351,6 +351,10 @@ exports.PenTool = Montage.create(ShapeTool, {
351 351
352 //make the subpath dirty so it will get re-drawn 352 //make the subpath dirty so it will get re-drawn
353 this._selectedSubpath.makeDirty(); 353 this._selectedSubpath.makeDirty();
354 //this.DrawSubpathSVG(this._selectedSubpath);
355 }
356 //todo temp code only...remove this and uncomment the DrawSubpathSVG above
357 if (this._selectedSubpath){
354 this.DrawSubpathSVG(this._selectedSubpath); 358 this.DrawSubpathSVG(this._selectedSubpath);
355 } 359 }
356 360
@@ -825,6 +829,7 @@ exports.PenTool = Montage.create(ShapeTool, {
825 throw ("null drawing context in Pentool::DrawSubpathSVG"); 829 throw ("null drawing context in Pentool::DrawSubpathSVG");
826 ctx.save(); 830 ctx.save();
827 831
832 /*
828 var horizontalOffset = this.application.ninja.stage.userContentLeft; 833 var horizontalOffset = this.application.ninja.stage.userContentLeft;
829 var verticalOffset = this.application.ninja.stage.userContentTop; 834 var verticalOffset = this.application.ninja.stage.userContentTop;
830 //display the subpath as a sequence of cubic beziers 835 //display the subpath as a sequence of cubic beziers
@@ -854,34 +859,84 @@ exports.PenTool = Montage.create(ShapeTool, {
854 var p3y = subpath.getAnchor(0).getPosY()+ verticalOffset; 859 var p3y = subpath.getAnchor(0).getPosY()+ verticalOffset;
855 ctx.bezierCurveTo(p1x, p1y, p2x, p2y, p3x, p3y); 860 ctx.bezierCurveTo(p1x, p1y, p2x, p2y, p3x, p3y);
856 } 861 }
857 ctx.stroke(); 862 ctx.stroke();*/
858 863
859 864
860 //draw the stage world points by projecting them to screen space 865 //draw the stage world points by projecting them to screen space
861 //get the screen coords of this anchor from its stage world coord 866 //get the screen coords of this anchor from its stage world coord
862 ctx.beginPath(); 867 ctx.lineWidth = 1;//TODO replace hardcoded stroke width with some programmatically set value (should not be same as stroke width)
863 ctx.strokeStyle = "red"; 868 ctx.strokeStyle = "green";
864 var localToGlobalMat = ViewUtils.getLocalToGlobalMatrix(subpath.getCanvas()); 869 var localToGlobalMat = ViewUtils.getLocalToGlobalMatrix(subpath.getCanvas());
865 var currentLTWH = subpath.computeLeftTopWidthHeight(); 870
871 /*var currentLTWH = subpath.computeLeftTopWidthHeight();
866 var deltaX = currentLTWH[0] - parseInt(ElementMediator.getProperty(subpath.getCanvas(), "left")); 872 var deltaX = currentLTWH[0] - parseInt(ElementMediator.getProperty(subpath.getCanvas(), "left"));
867 var deltaY = currentLTWH[1] - parseInt(ElementMediator.getProperty(subpath.getCanvas(), "top")); 873 var deltaY = currentLTWH[1] - parseInt(ElementMediator.getProperty(subpath.getCanvas(), "top"));*/
868 874
869 var localCoord = subpath.getAnchorLocalCoord(0); 875 //var localCoord = subpath.getAnchorLocalCoord(0);
870 var sp = MathUtils.transformAndDivideHomogeneousPoint(localCoord,localToGlobalMat); 876 //var sp = MathUtils.transformAndDivideHomogeneousPoint(localCoord,localToGlobalMat);
871 //add the difference between the current left and top and the canvas left and top 877 //add the difference between the current left and top and the canvas left and top
872 sp[0]+=deltaX; sp[1]+=deltaY; 878 //sp[0]+=deltaX; sp[1]+=deltaY;
879 //ctx.moveTo(sp[0], sp[1]);
880
881 var widthAdjustment = -snapManager.getStageWidth()*0.5;
882 var heightAdjustment = -snapManager.getStageHeight()*0.5;
883 /*var stageWorldToGlobalMatrix = ViewUtils.getStageWorldToGlobalMatrix();
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, []);
888
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
890 c0 = MathUtils.transformAndDivideHomogeneousPoint(
891 [subpath.getAnchor(0).getPosX()+widthAdjustment,
892 subpath.getAnchor(0).getPosY()+heightAdjustment,
893 subpath.getAnchor(0).getPosZ()],
894 stageWorldToLocalMat);
895 c0 = MathUtils.transformAndDivideHomogeneousPoint(c0,localToGlobalMat); //convert from local coord to global (screen) coord
896 ctx.beginPath();
897 ctx.moveTo(c0[0],c0[1]);
898 var prevAnchor = subpath.getAnchor(0);
899 var currAnchor = null;
900 var numBezierCurves = numAnchors;
901 if (subpath.getIsClosed()){
902 numBezierCurves+=1;
903 }
873 904
874 ctx.moveTo(sp[0],sp[1]); 905 for (i = 1; i < numBezierCurves; i++) {
875 for (i = 1; i < numAnchors; i++) { 906 currAnchor = subpath.getAnchor(i%numAnchors);
876 localCoord = subpath.getAnchorLocalCoord(i); 907 /*localCoord = subpath.getAnchorLocalCoord(i);
877 sp = MathUtils.transformAndDivideHomogeneousPoint(localCoord,localToGlobalMat); 908 sp = MathUtils.transformAndDivideHomogeneousPoint(localCoord,localToGlobalMat);
878 //add the difference between the current left and top and the canvas left and top 909 //add the difference between the current left and top and the canvas left and top
879 sp[0]+=deltaX; sp[1]+=deltaY; 910 sp[0]+=deltaX; sp[1]+=deltaY;*/
880 ctx.lineTo(sp[0],sp[1]); 911
881 } 912 //ctx.lineTo(sp[0], sp[1]);
882 if (subpath.getIsClosed()){ 913
883 ctx.closePath(); 914 c1 = MathUtils.transformAndDivideHomogeneousPoint(
915 [prevAnchor.getNextX()+widthAdjustment,
916 prevAnchor.getNextY()+heightAdjustment,
917 prevAnchor.getNextZ()],
918 stageWorldToLocalMat);
919 c1 = MathUtils.transformAndDivideHomogeneousPoint(c1,localToGlobalMat); //convert from local coord to global (screen) coord
920
921 c2 = MathUtils.transformAndDivideHomogeneousPoint(
922 [currAnchor.getPrevX()+widthAdjustment,
923 currAnchor.getPrevY()+heightAdjustment,
924 currAnchor.getPrevZ()],
925 stageWorldToLocalMat);
926 c2 = MathUtils.transformAndDivideHomogeneousPoint(c2,localToGlobalMat); //convert from local coord to global (screen) coord
927
928 c3 = MathUtils.transformAndDivideHomogeneousPoint(
929 [currAnchor.getPosX()+widthAdjustment,
930 currAnchor.getPosY()+heightAdjustment,
931 currAnchor.getPosZ()],
932 stageWorldToLocalMat);
933 c3 = MathUtils.transformAndDivideHomogeneousPoint(c3,localToGlobalMat); //convert from local coord to global (screen) coord
934
935 ctx.bezierCurveTo(c1[0], c1[1], c2[0], c2[1], c3[0], c3[1]);
936 prevAnchor = currAnchor;
884 } 937 }
938
939