From 79fb912bdaa22b8107bbddc93d1779820af80cf9 Mon Sep 17 00:00:00 2001
From: Pushkar Joshi
Date: Tue, 3 Apr 2012 14:50:34 -0700
Subject: working File I/O for pen tool created paths and some minor bug fixes
 (correctly setting the canvas for brush stroke file I/O, correct plane matrix
 for file I/O)

---
 js/document/html-document.js |   4 +
 js/lib/drawing/world.js      |   7 +-
 js/lib/geom/brush-stroke.js  |  14 ++--
 js/lib/geom/sub-path.js      | 181 ++++++++++++++++++-------------------------
 js/tools/PenTool.js          |   9 ++-
 5 files changed, 103 insertions(+), 112 deletions(-)

diff --git a/js/document/html-document.js b/js/document/html-document.js
index 42a7d537..5538229c 100755
--- a/js/document/html-document.js
+++ b/js/document/html-document.js
@@ -345,6 +345,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/lib/drawing/world.js b/js/lib/drawing/world.js
index 5a054224..a1a5b5ae 100755
--- a/js/lib/drawing/world.js
+++ b/js/lib/drawing/world.js
@@ -943,7 +943,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)
 	{
@@ -962,6 +962,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 e93c9382..2a751a89 100755
--- a/js/lib/geom/brush-stroke.js
+++ b/js/lib/geom/brush-stroke.js
@@ -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() {
 
             CanvasController.setProperty(this._canvas, "width", bboxWidth+"px");
             CanvasController.setProperty(this._canvas, "height", bboxHeight+"px");
-            this._canvas.elementModel.shapeModel.GLWorld.setViewportFromCanvas(this._canvas);
+            //this._canvas.elementModel.shapeModel.GLWorld.setViewportFromCanvas(this._canvas);
         }
 
 
@@ -662,8 +666,8 @@ var BrushStroke = function GLBrushStroke() {
         this._copyCoordinates3D(this._OrigLocalPoints, retObject.origLocalPoints); //todo <ditto>
 
         retObject.stageWorldCenter = [this._stageWorldCenter[0],this._stageWorldCenter[1],this._stageWorldCenter[2]];
-        retObject.planeMat = [this._planeMat[0],this._planeMat[1],this._planeMat[2],this._planeMat[3]];
-        retObject.planeMatInv = [this._planeMatInv[0],this._planeMatInv[1],this._planeMatInv[2],this._planeMatInv[3]];
+        retObject.planeMat = this._planeMat;
+        retObject.planeMatInv = this._planeMatInv;
         retObject.dragPlane = [this._dragPlane[0],this._dragPlane[1],this._dragPlane[2],this._dragPlane[3]];
 
         //stroke appearance properties
@@ -691,8 +695,8 @@ var BrushStroke = function GLBrushStroke() {
         this._copyCoordinates3D(jo.origLocalPoints, this._OrigLocalPoints); //todo <ditto>
 
         this._stageWorldCenter = [jo.stageWorldCenter[0],jo.stageWorldCenter[1],jo.stageWorldCenter[2]];
-        this._planeMat = [jo.planeMat[0], jo.planeMat[1],jo.planeMat[2],jo.planeMat[3]];
-        this._planeMatInv = [jo.planeMatInv[0],jo.planeMatInv[1],jo.planeMatInv[2],jo.planeMatInv[3]];
+        this._planeMat = jo.planeMat;
+        this._planeMatInv = jo.planeMatInv;
         this._dragPlane = [jo.dragPlane[0],jo.dragPlane[1],jo.dragPlane[2],jo.dragPlane[3]];
 
         //stroke appearance properties
diff --git a/js/lib/geom/sub-path.js b/js/lib/geom/sub-path.js
index d8d74928..35070915 100755
--- a/js/lib/geom/sub-path.js
+++ b/js/lib/geom/sub-path.js
@@ -95,6 +95,7 @@ var GLSubpath = function GLSubpath() {
     this._planeMat = null;
     this._planeMatInv = null;
     this._planeCenter = null;
+    this._dragPlane = null;
 
     //used to query what the user selected, OR-able for future extensions
     this.SEL_NONE = 0;          //nothing was selected
@@ -130,7 +131,10 @@ var GLSubpath = function GLSubpath() {
         // get the world
         var world = this.getWorld();
         if (!world)  throw( "null world in subpath render" );
-
+        if (!this._canvas){
+            //set the canvas by querying the world
+            this._canvas = this.getWorld().getCanvas();
+        }
         // get the context
         var ctx = world.get2DContext();
         if (!ctx)  throw ("null context in subpath render");
@@ -145,42 +149,19 @@ var GLSubpath = function GLSubpath() {
         //build the coordinates of the samples in 2D (canvas) space (localDirty bit checked in buildLocalCoord
         this.buildLocalCoord();
 
-        //
+        //figure the size of the area we will draw into
         var bboxWidth=0, bboxHeight=0;
-        //var bboxMid=[0,0,0];
         if (useLocalCoord){
             bboxWidth = this._LocalBBoxMax[0] - this._LocalBBoxMin[0];
             bboxHeight = this._LocalBBoxMax[1] - this._LocalBBoxMin[1];
-            //bboxMid = [0.5 * (this._LocalBBoxMax[0] + this._LocalBBoxMin[0]), 0.5 * (this._LocalBBoxMax[1] + this._LocalBBoxMin[1]), 0.5 * (this._LocalBBoxMax[2] + this._LocalBBoxMin[2])];
         }
         else {
             var bboxMin = this.getBBoxMin();
             var bboxMax = this.getBBoxMax();
             bboxWidth = bboxMax[0] - bboxMin[0];
             bboxHeight = bboxMax[1] - bboxMin[1];
-            //bboxMid = [0.5 * (bboxMax[0] + bboxMin[0]), 0.5 * (bboxMax[1] + bboxMin[1]), 0.5 * (bboxMax[2] + bboxMin[2])];
         }
 
-        if (this._canvas) {
-            /*
-            var ViewUtils = require("js/helper-classes/3D/view-utils").ViewUtils;
-            //compute the plane center as the midpoint of the local bbox converted to stage world space
-            var planeCenter =  ViewUtils.localToStageWorld(bboxMid, this._canvas);
-            planeCenter[0]+=400; planeCenter[1]+=300; //todo replace these lines with the correct call for the offset
-            console.log("PEN: local bboxMid: "+ bboxMid +", stage-world bboxMid: "+ planeCenter);
-            var newLeft = planeCenter[0] - 0.5*bboxWidth;
-            console.log("PEN: newLeft: "+ newLeft +", bboxWidth: "+bboxWidth);
-            newLeft = Math.round(newLeft);//Math.round(this._planeCenter[0] - 0.5 * bboxWidth);
-            console.log("PEN: newLeft rounded: "+ newLeft);
-            var newTop = Math.round(planeCenter[1] - 0.5 * bboxHeight);//Math.round(this._planeCenter[1] - 0.5 * bboxHeight);
-            //assign the new position, width, and height as the canvas dimensions through the canvas controller
-            CanvasController.setProperty(this._canvas, "left", newLeft+"px");
-            CanvasController.setProperty(this._canvas, "top", newTop+"px");
-            CanvasController.setProperty(this._canvas, "width", bboxWidth+"px");
-            CanvasController.setProperty(this._canvas, "height", bboxHeight+"px");
-            this._canvas.elementModel.shapeModel.GLWorld.setViewportFromCanvas(this._canvas);
-            */
-        }
         ctx.save();
         ctx.clearRect(0, 0, bboxWidth, bboxHeight);
 
@@ -354,6 +335,10 @@ GLSubpath.prototype.setPlaneMatrix = function(planeMat){
     this._planeMat = planeMat;
 };
 
+GLSubpath.prototype.setDragPlane = function(p){
+    this._dragPlane = p;
+};
+
 GLSubpath.prototype.setPlaneMatrixInverse = function(planeMatInv){
     this._planeMatInv = planeMatInv;
 };
@@ -867,6 +852,12 @@ GLSubpath.prototype.getStrokeWidth = function () {
 };
 
 GLSubpath.prototype.translateSubpathPerCanvas = function(elemMediator){
+    if (!this._canvas){
+        if (!this.getWorld())
+            return; //cannot do anything if there is no world
+        //set the canvas by querying the world
+        this._canvas = this.getWorld().getCanvas();
+    }
     //check if the canvas was translated
     var penCanvasCurrentLeft = parseInt(elemMediator.getProperty(this._canvas, "left"));//parseFloat(DocumentControllerModule.DocumentController.GetElementStyle(this._penCanvas, "left"));
     var penCanvasCurrentTop = parseInt(elemMediator.getProperty(this._canvas, "top"));//parseFloat(DocumentControllerModule.DocumentController.GetElementStyle(this._penCanvas, "top"));
@@ -1516,95 +1507,75 @@ GLSubpath.prototype.isPointInQuad2D = function(r0,r1,r2,r3,p){
     return false;
 };
 
-GLSubpath.prototype.export = function() {
-    var rtnStr = "type: " + this.geomType() + "\n";
-
-    rtnStr += "strokeWidth: "	+ this._strokeWidth	+ "\n";
-    rtnStr += "strokeStyle: "	+ this._strokeStyle	+ "\n";
-
-    rtnStr += "strokeMat: ";
-    if (this._strokeMaterial)
-        rtnStr += this._strokeMaterial.getName();
-    else
-        rtnStr += "flatMaterial";
-    rtnStr += "\n";
-
-    rtnStr += "fillMat: ";
-    if (this._fillMaterial)
-        rtnStr += this._fillMaterial.getName();
-    else
-        rtnStr += "flatMaterial";
-    rtnStr += "\n";
-
-    var isClosedStr = "false";
-    if (this._isClosed)
-        isClosedStr = "true";
-    rtnStr += "isClosed: "      + isClosedStr + "\n";
-
-    //add the anchor points
-    var numAnchors = this._Anchors.length;
-    rtnStr += "numAnchors: "    + numAnchors        + "\n";
-    for (var i=0;i<numAnchors;i++){
-        rtnStr += "anchor"+i+"x: " + this._Anchors[i].getPosX() + "\n";
-        rtnStr += "anchor"+i+"y: " + this._Anchors[i].getPosY() + "\n";
-        rtnStr += "anchor"+i+"z: " + this._Anchors[i].getPosZ() + "\n";
-
-        rtnStr += "anchor"+i+"prevx: " + this._Anchors[i].getPrevX() + "\n";
-        rtnStr += "anchor"+i+"prevy: " + this._Anchors[i].getPrevY() + "\n";
-        rtnStr += "anchor"+i+"prevz: " + this._Anchors[i].getPrevZ() + "\n";
-
-        rtnStr += "anchor"+i+"nextx: " + this._Anchors[i].getNextX() + "\n";
-        rtnStr += "anchor"+i+"nexty: " + this._Anchors[i].getNextY() + "\n";
-        rtnStr += "anchor"+i+"nextz: " + this._Anchors[i].getNextZ() + "\n";
-    }
-    return rtnStr;
-};
+GLSubpath.prototype.exportJSON = function() {
+    var retObject= new Object();
+    //the type of this object
+    retObject.type = this.geomType();
+    retObject.geomType = retObject.type;
 
-GLSubpath.prototype.import = function( importStr ) {
-    this._strokeWidth		= this.getPropertyFromString( "strokeWidth: ",	importStr );
-    this._strokeStyle		= this.getPropertyFromString( "strokeStyle: ",	importStr );
-    var strokeMaterialName	= this.getPropertyFromString( "strokeMat: ",	importStr );
-    var fillMaterialName	= this.getPropertyFromString( "fillMat: ",		importStr );
-
-    var strokeMat = MaterialsModel.getMaterial( strokeMaterialName );
-    if (!strokeMat) {
-        console.log( "object material not found in library: " + strokeMaterialName );
-        strokeMat = new FlatMaterial();
-    }
+    //the geometry for this object (anchor points in stage world space)
+    retObject.anchors = this._Anchors.slice(0);
+    retObject.isClosed = this._isClosed;
 
-    this._strokeMaterial = strokeMat;
+    //location of the canvas of this object
+    retObject.canvasLeft = this._canvasLeft;
+    retObject.canvasTop = this._canvasTop;
 
-    var fillMat = MaterialsModel.getMaterial( fillMaterialName );
-    if (!fillMat) {
-        console.log( "object material not found in library: " + fillMaterialName );
-        fillMat = new FlatMaterial();
-    }
+    retObject.planeCenter = [this._planeCenter[0],this._planeCenter[1],this._planeCenter[2]];
+    retObject.planeMat = this._planeMat;
+    retObject.planeMatInv = this._planeMatInv;
+    retObject.dragPlane = [this._dragPlane[0],this._dragPlane[1],this._dragPlane[2],this._dragPlane[3]];
 
-    this._fillMaterial = fillMat;
+    //stroke appearance properties
+    retObject.strokeWidth = this._strokeWidth;
+    retObject.strokeColor = this._strokeColor;
+    retObject.fillColor = this._fillColor;
+    return retObject;
+};
 
-    var isClosedStr = this.getPropertyFromString( "isClosed: ", importStr);
-    this._isClosed = isClosedStr === "true";
+GLSubpath.prototype.export = function() {
+    var jsonObject = this.exportJSON();
+    var stringified = JSON.stringify(jsonObject);
+    return "type: " + this.geomType() + "\n" + stringified;
+};
 
-    var numAnchors = this.getPropertyFromString("numAnchors: ", importStr);
-    for (var i=0;i<numAnchors;i++) {
-        var posX = this.getPropertyFromString("anchor"+i+"x", importStr);
-        var posY = this.getPropertyFromString("anchor"+i+"y", importStr);
-        var posZ = this.getPropertyFromString("anchor"+i+"z", importStr);
+GLSubpath.prototype.importJSON = function(jo) {
+    if (this.geomType()!== jo.geomType){
+        return;
+    }
+    //the geometry for this object
+    this._Anchors = [];
+    var i=0;
+    for (i=0;i<jo.anchors.length;i++){
+        this.addAnchor(new AnchorPoint());
+        var newAnchor = this.getAnchor(this.getSelectedAnchorIndex());
+        var ipAnchor = jo.anchors[i];
+        newAnchor.setPos(ipAnchor._x, ipAnchor._y, ipAnchor._z);
+        newAnchor.setPrevPos(ipAnchor._prevX, ipAnchor._prevY, ipAnchor._prevZ);
+        newAnchor.setNextPos(ipAnchor._nextX, ipAnchor._nextY, ipAnchor._nextZ);
+    }
+    this._isClosed = jo.isClosed;
 
-        var prevX = this.getPropertyFromString("anchor"+i+"prevx", importStr);
-        var prevY = this.getPropertyFromString("anchor"+i+"prevy", importStr);
-        var prevZ = this.getPropertyFromString("anchor"+i+"prevz", importStr);
+    //location of the canvas for this object
+    this._canvasLeft = jo.canvasLeft;
+    this._canvasTop = jo.canvasTop;
+    
+    this._planeCenter = [jo.planeCenter[0],jo.planeCenter[1],jo.planeCenter[2]];
+    this._planeMat = jo.planeMat;
+    this._planeMatInv = jo.planeMatInv;
+    this._dragPlane = [jo.dragPlane[0],jo.dragPlane[1],jo.dragPlane[2],jo.dragPlane[3]];
 
-        var nextX = this.getPropertyFromString("anchor"+i+"nextx", importStr);
-        var nextY = this.getPropertyFromString("anchor"+i+"nexty", importStr);
-        var nextZ = this.getPropertyFromString("anchor"+i+"nextz", importStr);
+    //stroke appearance properties
+    this._strokeWidth = jo.strokeWidth;
+    this._strokeColor = jo.strokeColor;
+    this._fillColor = jo.fillColor;
 
-        var newAnchor = new AnchorPoint();
-        newAnchor.setPos(posX, posY, posZ);
-        newAnchor.setPrevPos(prevX, prevY, prevZ);
-        newAnchor.setNextPos(nextX, nextY, nextZ);
-        this._selectedSubpath.addAnchor(newAnchor);
-    }
+    this._isDirty = true;
+};
+
+GLSubpath.prototype.import = function( importStr ) {
+    var jsonObject = JSON.parse(importStr);
+    this.importJSON(jsonObject);
 };
 
 GLSubpath.prototype.collidesWithPoint = function (x, y, z) {
diff --git a/js/tools/PenTool.js b/js/tools/PenTool.js
index 91b7606e..2eae6adc 100755
--- a/js/tools/PenTool.js
+++ b/js/tools/PenTool.js
@@ -68,6 +68,9 @@ exports.PenTool = Montage.create(ShapeTool, {
     //the plane matrix for the first click...so the entire path is on the same plane
     _penPlaneMat: { value: null, writable: true },
 
+    //the plane equation (in stage world space) for the current path being drawn
+    _dragPlane: {value: null, writable: true},
+
     //index of the anchor point that the user has hovered over
     _hoveredAnchorIndex: {value: -1, writable: true},
 
@@ -105,7 +108,9 @@ exports.PenTool = Montage.create(ShapeTool, {
             snapManager.enableSnapAlign(false);
 
             var point = webkitConvertPointFromPageToNode(this.application.ninja.stage.canvas, new WebKitPoint(x,y));
+            //todo fix this function to allow us to get the correct location (in 3D) for the mouse position
             var unsnappedpos = DrawingToolBase.getHitRecPos(snapManager.snap(point.x, point.y, false));
+            this._dragPlane = snapManager.getDragPlane();
 
             snapManager.enableElementSnap(elemSnap);
             snapManager.enableGridSnap(gridSnap);
@@ -214,6 +219,7 @@ exports.PenTool = Montage.create(ShapeTool, {
                         if (this._selectedSubpath.getIsClosed() && this._makeMultipleSubpaths) {
                             this._penCanvas = null;
                             this._penPlaneMat = null;
+                            this._dragPlane = null;
                             this._snapTarget = null;
                             this._selectedSubpath = new SubPath();
                             this._isNewPath = true;
@@ -404,7 +410,8 @@ exports.PenTool = Montage.create(ShapeTool, {
                 this._selectedSubpath.setPlaneMatrix(this._penPlaneMat);
                 var planeMatInv = glmat4.inverse( this._penPlaneMat, [] );
                 this._selectedSubpath.setPlaneMatrixInverse(planeMatInv);
-
+                this._selectedSubpath.setDragPlane(this._dragPlane);
+                
                 this._selectedSubpath.createSamples(); //dirty bit is checked here
                 this._selectedSubpath.buildLocalCoord(); //local dirty bit is checked here
 
-- 
cgit v1.2.3