10 files changed, 825 insertions, 383 deletions
diff --git a/js/components/tools-properties/brush-properties.reel/brush-properties.html b/js/components/tools-properties/brush-properties.reel/brush-properties.html
index 98442164..d9c35dc2 100755
--- a/js/components/tools-properties/brush-properties.reel/brush-properties.html
+++ b/js/components/tools-properties/brush-properties.reel/brush-properties.html
@@ -84,7 +84,7 @@
    </head>
    <body>
-        <div id="brushProperties" class="subToolHolderPanel">
+        <div data-montage-id="brushProperties" class="subToolHolderPanel">
            <div id="strokesContainer" class="leftLabel" style="margin-left:25px; padding-top: 3px;">
                <label class="label"> Width:</label>
                <div id="strokeSize" class="label"></div>
diff --git a/js/components/tools-properties/pen-properties.reel/pen-properties.html b/js/components/tools-properties/pen-properties.reel/pen-properties.html
index 74a3a747..acbedcac 100755
--- a/js/components/tools-properties/pen-properties.reel/pen-properties.html
+++ b/js/components/tools-properties/pen-properties.reel/pen-properties.html
@@ -39,7 +39,7 @@
    </head>
    <body>
-    <div id="penProperties" class="subToolHolderPanel">
+    <div data-montage-id="penProperties" class="subToolHolderPanel">
        <div id="strokesContainer" class="leftLabel" style="margin-left:25px; padding-top: 3px;">
            <label class="label"> Stroke:</label>
            <div id="strokeSize" class="label"></div>
diff --git a/js/document/html-document.js b/js/document/html-document.js
index e96c9943..93720f0f 100755
--- a/js/document/html-document.js
+++ b/js/document/html-document.js
@@ -338,6 +338,10 @@ exports.HTMLDocument = Montage.create(TextDocument, {
                        elementModel.pi = "BrushStrokePi";
                                                break;
+                    case root.GEOM_TYPE_CUBIC_BEZIER:
+                        elementModel.selection = "Subpath";
+                        elementModel.pi = "SubpathPi";
+                        break;
                                        default:
                                                console.log( "geometry type not supported for file I/O, " + root.geomType());
diff --git a/js/helper-classes/3D/view-utils.js b/js/helper-classes/3D/view-utils.js
index a72b7906..35f4a568 100755
--- a/js/helper-classes/3D/view-utils.js
+++ b/js/helper-classes/3D/view-utils.js
@@ -242,7 +242,6 @@ exports.ViewUtils = Montage.create(Component, {
            var worldPt = MathUtils.transformPoint( viewPt, mat );
            var stageWorldPt = this.postViewToStageWorld( worldPt, elt );
            this.popViewportObj();
            return stageWorldPt;
        }
    },
@@ -788,6 +787,7 @@ exports.ViewUtils = Montage.create(Component, {
        }
    },
+    /*
    getStageWorldToGlobalMatrix: {
        value: function() {
            var stage = this.application.ninja.currentDocument.documentRoot;
@@ -821,6 +821,26 @@ exports.ViewUtils = Montage.create(Component, {
            return mat;
        }
    },
+    */
+    getStageWorldToGlobalMatrix:
+    {
+        value: function()
+        {
+            var stage = this.application.ninja.currentDocument.documentRoot;
+            this.pushViewportObj( stage );
+            // put the point into screen space of the stage - requires
+            // a translation to the top/left only
+            var cop = this.getCenterOfProjection();
+            var v2s = Matrix.Translation([cop[0], cop[1], 0]);
+            this.popViewportObj();
+            // append the localToGlobal matrix of the stage.
+            var mat = this.getLocalToGlobalMatrix( stage );
+            glmat4.multiply( mat, v2s );
+            return mat;
+        }
+    },
    localScreenToLocalWorld: {
        value: function( objPt,  elt ) {
@@ -968,6 +988,56 @@ exports.ViewUtils = Montage.create(Component, {
        }
    },
+    getLocalToStageWorldMatrix: {
+        value: function( elt, shouldProject, shouldLocalTransform ) {
+            var mat = Matrix.I(4);
+            while (elt)
+            {
+                this.pushViewportObj( elt );
+                    var cop = this.getCenterOfProjection();
+                    var s2v = Matrix.Translation([-cop[0], -cop[1], 0]);
+                    var objMat = this.getMatrixFromElement( elt );
+                    var projMat;
+                    if(shouldProject)
+                    {
+                        //projMat = Matrix.I(4).multiply( this.getPerspectiveDistFromElement(elt) );
+                        var pDist = this.getPerspectiveDistFromElement(elt);
+                        var projMat = glmat4.scale(Matrix.I(4), [pDist,pDist,pDist], []);
+                        projMat[11] = -1;
+                        projMat[15] = 1400;
+                    }
+                    var v2s = Matrix.Translation([cop[0], cop[1], 0]);
+                this.popViewportObj();
+                // multiply all the matrices together
+                //mat = s2v.multiply( mat );
+                glmat4.multiply( s2v, mat, mat );
+                if (elt === this._stageElement)  break;
+                //mat = objMat.multiply( mat );
+                if (shouldLocalTransform) {
+                    glmat4.multiply( objMat, mat, mat );
+                }
+                if(shouldProject)
+                {
+                    //mat = projMat.multiply( mat );
+                    glmat4.multiply( projMat, mat, mat );
+                }
+                //mat = v2s.multiply( mat );
+                glmat4.multiply( v2s, mat, mat );
+                // offset to the parent
+                var offset = this.getElementOffset( elt );
+                var offMat = Matrix.Translation([offset[0], offset[1], 0]);
+                //mat = offMat.multiply( mat );
+                glmat4.multiply( offMat, mat, mat );
+                elt = elt.parentElement;
+            }
+            return mat;
+        }
+    },
    getUpVectorFromMatrix: {
        value: function( mat )    {
            //var inv = mat.inverse();
diff --git a/js/lib/drawing/world.js b/js/lib/drawing/world.js
index 657c849f..d84a6aab 100755
--- a/js/lib/drawing/world.js
+++ b/js/lib/drawing/world.js
@@ -866,7 +866,7 @@ World.prototype.importObjectJSON = function( jObj, parentGeomObj )
 {
        var type = jObj.type;
    var BrushStroke = require("js/lib/geom/brush-stroke").BrushStroke;
+    var SubPath = require("js/lib/geom/sub-path").SubPath;
        var obj;
        switch (type)
        {
@@ -885,6 +885,11 @@ World.prototype.importObjectJSON = function( jObj, parentGeomObj )
            obj.importJSON( jObj );
            break;
+        case 5:     //cubic bezier
+            obj = new SubPath();
+            obj.importJSON(jObj);
+            break;
        case 6:     //brush stroke
            obj = new BrushStroke();
            obj.importJSON(jObj);
diff --git a/js/lib/geom/brush-stroke.js b/js/lib/geom/brush-stroke.js
index 26ac42e9..8c5ffef3 100755
--- a/js/lib/geom/brush-stroke.js
+++ b/js/lib/geom/brush-stroke.js
@@ -413,7 +413,7 @@ var BrushStroke = function GLBrushStroke() {
            this._LocalPoints[i][1]+= halfheight;
            //store the original points
-            this._OrigLocalPoints   .push([this._LocalPoints[i][0],this._LocalPoints[i][1],this._LocalPoints[i][2]]);
+            this._OrigLocalPoints.push([this._LocalPoints[i][0],this._LocalPoints[i][1],this._LocalPoints[i][2]]);
        }
        //update the bbox with the same adjustment as was made for the local points above
        this._BBoxMax[0]+= halfwidth;this._BBoxMin[0]+= halfwidth;
@@ -541,6 +541,10 @@ var BrushStroke = function GLBrushStroke() {
        var bboxWidth = bboxMax[0] - bboxMin[0];
        var bboxHeight = bboxMax[1] - bboxMin[1];
+        if (!this._canvas){
+            //set the canvas by querying the world
+            this._canvas = this.getWorld().getCanvas();
+        }
        if (this._canvas) {
            var newLeft = Math.round(this._stageWorldCenter[0] - 0.5 * bboxWidth);
            var newTop = Math.round(this._stageWorldCenter[1] - 0.5 * bboxHeight);
@@ -550,7 +554,7 @@ var BrushStroke = function GLBrushStroke() {

diff --git a/js/components/tools-properties/brush-properties.reel/brush-properties.html b/js/components/tools-properties/brush-properties.reel/brush-properties.html index 98442164..d9c35dc2 100755 --- a/js/components/tools-properties/brush-properties.reel/brush-properties.html +++ b/js/components/tools-properties/brush-properties.reel/brush-properties.html
@@ -84,7 +84,7 @@
84	</head>	84	</head>
85		85
86	<body>	86	<body>
87	<div id="brushProperties" class="subToolHolderPanel">	87	<div data-montage-id="brushProperties" class="subToolHolderPanel">
88	<div id="strokesContainer" class="leftLabel" style="margin-left:25px; padding-top: 3px;">	88	<div id="strokesContainer" class="leftLabel" style="margin-left:25px; padding-top: 3px;">
89	<label class="label"> Width:</label>	89	<label class="label"> Width:</label>
90	<div id="strokeSize" class="label"></div>	90	<div id="strokeSize" class="label"></div>


diff --git a/js/components/tools-properties/pen-properties.reel/pen-properties.html b/js/components/tools-properties/pen-properties.reel/pen-properties.html index 74a3a747..acbedcac 100755 --- a/js/components/tools-properties/pen-properties.reel/pen-properties.html +++ b/js/components/tools-properties/pen-properties.reel/pen-properties.html
@@ -39,7 +39,7 @@
39	</head>	39	</head>
40		40
41	<body>	41	<body>
42	<div id="penProperties" class="subToolHolderPanel">	42	<div data-montage-id="penProperties" class="subToolHolderPanel">
43	<div id="strokesContainer" class="leftLabel" style="margin-left:25px; padding-top: 3px;">	43	<div id="strokesContainer" class="leftLabel" style="margin-left:25px; padding-top: 3px;">
44	<label class="label"> Stroke:</label>	44	<label class="label"> Stroke:</label>
45	<div id="strokeSize" class="label"></div>	45	<div id="strokeSize" class="label"></div>


diff --git a/js/document/html-document.js b/js/document/html-document.js index e96c9943..93720f0f 100755 --- a/js/document/html-document.js +++ b/js/document/html-document.js
@@ -338,6 +338,10 @@ exports.HTMLDocument = Montage.create(TextDocument, {
338	elementModel.pi = "BrushStrokePi";	338	elementModel.pi = "BrushStrokePi";
339	break;	339	break;
340		340
		341	case root.GEOM_TYPE_CUBIC_BEZIER:
		342	elementModel.selection = "Subpath";
		343	elementModel.pi = "SubpathPi";
		344	break;
341		345
342	default:	346	default:
343	console.log( "geometry type not supported for file I/O, " + root.geomType());	347	console.log( "geometry type not supported for file I/O, " + root.geomType());


diff --git a/js/helper-classes/3D/view-utils.js b/js/helper-classes/3D/view-utils.js index a72b7906..35f4a568 100755 --- a/js/helper-classes/3D/view-utils.js +++ b/js/helper-classes/3D/view-utils.js
@@ -242,7 +242,6 @@ exports.ViewUtils = Montage.create(Component, {
242	var worldPt = MathUtils.transformPoint( viewPt, mat );	242	var worldPt = MathUtils.transformPoint( viewPt, mat );
243	var stageWorldPt = this.postViewToStageWorld( worldPt, elt );	243	var stageWorldPt = this.postViewToStageWorld( worldPt, elt );
244	this.popViewportObj();	244	this.popViewportObj();
245
246	return stageWorldPt;	245	return stageWorldPt;
247	}	246	}
248	},	247	},
@@ -788,6 +787,7 @@ exports.ViewUtils = Montage.create(Component, {
788	}	787	}
789	},	788	},
790		789
		790	/*
791	getStageWorldToGlobalMatrix: {	791	getStageWorldToGlobalMatrix: {
792	value: function() {	792	value: function() {
793	var stage = this.application.ninja.currentDocument.documentRoot;	793	var stage = this.application.ninja.currentDocument.documentRoot;
@@ -821,6 +821,26 @@ exports.ViewUtils = Montage.create(Component, {
821	return mat;	821	return mat;
822	}	822	}
823	},	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	},
824		844
825	localScreenToLocalWorld: {	845	localScreenToLocalWorld: {
826	value: function( objPt, elt ) {	846	value: function( objPt, elt ) {
@@ -968,6 +988,56 @@ exports.ViewUtils = Montage.create(Component, {
968	}	988	}
969	},	989	},
970		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
971	getUpVectorFromMatrix: {	1041	getUpVectorFromMatrix: {
972	value: function( mat ) {	1042	value: function( mat ) {
973	//var inv = mat.inverse();	1043	//var inv = mat.inverse();


diff --git a/js/lib/drawing/world.js b/js/lib/drawing/world.js index 657c849f..d84a6aab 100755 --- a/js/lib/drawing/world.js +++ b/js/lib/drawing/world.js
@@ -866,7 +866,7 @@ World.prototype.importObjectJSON = function( jObj, parentGeomObj )
866	{	866	{
867	var type = jObj.type;	867	var type = jObj.type;
868	var BrushStroke = require("js/lib/geom/brush-stroke").BrushStroke;	868	var BrushStroke = require("js/lib/geom/brush-stroke").BrushStroke;
869		869	var SubPath = require("js/lib/geom/sub-path").SubPath;
870	var obj;	870	var obj;
871	switch (type)	871	switch (type)
872	{	872	{
@@ -885,6 +885,11 @@ World.prototype.importObjectJSON = function( jObj, parentGeomObj )
885	obj.importJSON( jObj );	885	obj.importJSON( jObj );
886	break;	886	break;
887		887
		888	case 5: //cubic bezier
		889	obj = new SubPath();
		890	obj.importJSON(jObj);
		891	break;
		892
888	case 6: //brush stroke	893	case 6: //brush stroke
889	obj = new BrushStroke();	894	obj = new BrushStroke();
890	obj.importJSON(jObj);	895	obj.importJSON(jObj);


diff --git a/js/lib/geom/brush-stroke.js b/js/lib/geom/brush-stroke.js index 26ac42e9..8c5ffef3 100755 --- a/js/lib/geom/brush-stroke.js +++ b/js/lib/geom/brush-stroke.js
@@ -413,7 +413,7 @@ var BrushStroke = function GLBrushStroke() {
413	this._LocalPoints[i][1]+= halfheight;	413	this._LocalPoints[i][1]+= halfheight;
414		414
415	//store the original points	415	//store the original points
416	this._OrigLocalPoints .push([this._LocalPoints[i][0],this._LocalPoints[i][1],this._LocalPoints[i][2]]);	416	this._OrigLocalPoints.push([this._LocalPoints[i][0],this._LocalPoints[i][1],this._LocalPoints[i][2]]);
417	}	417	}
418	//update the bbox with the same adjustment as was made for the local points above	418	//update the bbox with the same adjustment as was made for the local points above
419	this._BBoxMax[0]+= halfwidth;this._BBoxMin[0]+= halfwidth;	419	this._BBoxMax[0]+= halfwidth;this._BBoxMin[0]+= halfwidth;
@@ -541,6 +541,10 @@ var BrushStroke = function GLBrushStroke() {
541	var bboxWidth = bboxMax[0] - bboxMin[0];	541	var bboxWidth = bboxMax[0] - bboxMin[0];
542	var bboxHeight = bboxMax[1] - bboxMin[1];	542	var bboxHeight = bboxMax[1] - bboxMin[1];
543		543
		544	if (!this._canvas){
		545	//set the canvas by querying the world
		546	this._canvas = this.getWorld().getCanvas();
		547	}
544	if (this._canvas) {	548	if (this._canvas) {
545	var newLeft = Math.round(this._stageWorldCenter[0] - 0.5 * bboxWidth);	549	var newLeft = Math.round(this._stageWorldCenter[0] - 0.5 * bboxWidth);
546	var newTop = Math.round(this._stageWorldCenter[1] - 0.5 * bboxHeight);	550	var newTop = Math.round(this._stageWorldCenter[1] - 0.5 * bboxHeight);
@@ -550,7 +554,7 @@ var BrushStroke = function GLBrushStroke() {
550		554