5 files changed, 459 insertions, 230 deletions

diff --git a/js/lib/drawing/world.js b/js/lib/drawing/world.js
index fec6a478..e348f5e8 100755
--- a/js/lib/drawing/world.js
+++ b/js/lib/drawing/world.js
@@ -527,7 +527,7 @@ World.prototype.clearTree = function() {
         if (this._useWebGL) {
                 var root = this._rootNode;
                 root.children = new Array();
-                g_Engine.unregisterCanvas( this._canvas.rdgeid )
+                g_Engine.unregisterCanvas( this._canvas.rdgeid );
 
                 this.update( 0 );
                 this.draw();
@@ -540,8 +540,9 @@ World.prototype.updateMaterials = function( obj, time ) {
         var matArray = obj.getMaterialArray();
         if (matArray) {
                 var n = matArray.length;
-                for (var i=0;  i<n;  i++)
+                for (var i=0;  i<n;  i++) {
                         matArray[i].update( time );
+        }
         }
 
         this.updateMaterials( obj.getNext(),  time );
@@ -553,9 +554,8 @@ World.prototype.getNDCOrigin = function() {
   var pt = MathUtils.transformPoint( [0,0,0], this.getCameraMatInverse() );
   var projMat = Matrix.makePerspective( this.getFOV(), this.getAspect(), this.getZNear(), this.getZFar());
   var ndcPt = MathUtils.transformHomogeneousPoint( pt, projMat );
-  var ndcOrigin = MathUtils.applyHomogeneousCoordinate( ndcPt );
 
-  return ndcOrigin;
+  return  MathUtils.applyHomogeneousCoordinate( ndcPt );
 };
 
 World.prototype.worldToScreen = function(v) {
@@ -570,9 +570,8 @@ World.prototype.worldToScreen = function(v) {
         var x = v2[0],  y = v2[1],  z = v2[2];
 
         var h = this.getGLContext().viewportHeight/2.0, w = this.getGLContext().viewportWidth/2.0;
-        var x2 = w*(1 + x),  y2 = h*( 1 - y ),  z2 = z;
-
-        return [x2, y2, z2, 1];
+    var x2 = w * (1 + x), y2 = h * ( 1 - y );
+    return [x2, y2, z, 1];
 };
 
 World.prototype.screenToView = function( x, y ) {
@@ -942,6 +941,7 @@ World.prototype.importObjectsJSON = function( jObj,  parentGeomObj )
 World.prototype.importObjectJSON = function( jObj, parentGeomObj )
 {
         var type = jObj.type;
+    var BrushStroke = require("js/lib/geom/brush-stroke").BrushStroke;
 
         var obj;
         switch (type)
@@ -961,6 +961,11 @@ World.prototype.importObjectJSON = function( jObj, parentGeomObj )
             obj.importJSON( jObj );
             break;
 
+        case 6:     //brush stroke
+            obj = new BrushStroke();
+            obj.importJSON(jObj);
+            break;
+
                 default:
                         throw new Error( "Unrecognized object type: " + type );
                         break;
diff --git a/js/lib/geom/brush-stroke.js b/js/lib/geom/brush-stroke.js
index 4c42539a..22209815 100755
--- a/js/lib/geom/brush-stroke.js
+++ b/js/lib/geom/brush-stroke.js
@@ -4,9 +4,12 @@ No rights, expressed or implied, whatsoever to this software are provided by Mot
 (c) Copyright 2011 Motorola Mobility, Inc.  All Rights Reserved.
 </copyright> */
 
-// Todo: This entire class should be converted to a module
 var VecUtils = require("js/helper-classes/3D/vec-utils").VecUtils;
 var GeomObj = require("js/lib/geom/geom-obj").GeomObj;
+var CanvasController = require("js/controllers/elements/canvas-controller").CanvasController;
+var ViewUtils = require("js/helper-classes/3D/view-utils").ViewUtils;
+
+// Todo: This entire class should be converted to a module
 
 ///////////////////////////////////////////////////////////////////////
 // Class GLBrushStroke
@@ -17,20 +20,20 @@ var BrushStroke = function GLBrushStroke() {
     ///////////////////////////////////////////////////
     // Instance variables
     ///////////////////////////////////////////////////
-    this._Points = [];
+    this._Points = [];                      //current state of points in stage-world space (may be different from input)
+    this._LocalPoints = [];                 //_Points in local coordinates...do this before rendering the points in the canvas
+    this._OrigLocalPoints = [];             //copy of input points without any smoothing
+    this._stageWorldCenter  = [0,0,0];      //coordinate for the canvas midPoint: a 3D vector in stage world space
     this._BBoxMin = [0, 0, 0];
     this._BBoxMax = [0, 0, 0];
-    this._dirty = true;
-
-    //whether or not to use the canvas drawing to stroke/fill
-    this._useCanvasDrawing = true;
-
-    //the X and Y location of this subpath's canvas in stage world space of Ninja
-    this._canvasX = 0;
-    this._canvasY = 0;
+    this._isDirty = true;
+    this._isInit = false;
+    
+    //the HTML5 canvas that holds this brush stroke
+    this._canvas = null;
 
     //stroke information
-    this._strokeWidth = 0.0;
+    this._strokeWidth = 1.0;
     this._strokeColor = [0.4, 0.4, 0.4, 1.0];
     this._secondStrokeColor = [1, 0.4, 0.4, 1.0];
     this._strokeHardness = 100;
@@ -39,10 +42,7 @@ var BrushStroke = function GLBrushStroke() {
     this._strokeDoSmoothing = false;
     this._strokeUseCalligraphic = false;
     this._strokeAngle = 0;
-
-    //the wetness of the brush (currently this is multiplied to the square of the stroke width, but todo should be changed to not depend on stroke width entirely
-    //smaller value means more samples for the path
-    this._WETNESS_FACTOR = 0.25;
+    this._strokeAmountSmoothing = 0;
 
     //threshold that tells us whether two samples are too far apart
     this._MAX_SAMPLE_DISTANCE_THRESHOLD = 5;
@@ -51,7 +51,7 @@ var BrushStroke = function GLBrushStroke() {
     this._MIN_SAMPLE_DISTANCE_THRESHOLD = 2;
 
     //prevent extremely long paths that can take a long time to render
-    this._MAX_ALLOWED_SAMPLES = 500;
+    this._MAX_ALLOWED_SAMPLES = 5000;
 
     //drawing context
     this._world = null;
@@ -61,10 +61,15 @@ var BrushStroke = function GLBrushStroke() {
     this._planeMat = null;
     this._planeMatInv = null;
     this._planeCenter = null;
+    this._dragPlane = null;
 
     /////////////////////////////////////////////////////////
     // Property Accessors/Setters
     /////////////////////////////////////////////////////////
+    this.setCanvas = function(c) {
+        this._canvas = c;
+    }
+
     this.setWorld = function (world) {
         this._world = world;
     };
@@ -74,7 +79,7 @@ var BrushStroke = function GLBrushStroke() {
     };
 
     this.geomType = function () {
-        return this.GEOM_TYPE_CUBIC_BEZIER;
+        return this.GEOM_TYPE_BRUSH_STROKE;
     };
 
     this.setDrawingTool = function (tool) {
@@ -97,24 +102,15 @@ var BrushStroke = function GLBrushStroke() {
         this._planeCenter = pc;
     };
 
-    this.getCanvasX = function(){
-        return this._canvasX;
-    };
-
-    this.getCanvasY = function(){
-        return this._canvasY;
-    };
-
-    this.setCanvasX = function(cx){
-        this._canvasX=cx;
-    };
-
-    this.setCanvasY = function(cy){
-        this._canvasY=cy;
+    this.setDragPlane = function(p){
+        this._dragPlane = p;
     };
 
     this.getNumPoints = function () {
-        return this._Points.length;
+        if (this._LocalPoints.length)
+            return this._LocalPoints.length;
+        else
+            return this._Points.length;
     };
 
     this.getPoint = function (index) {
@@ -125,30 +121,38 @@ var BrushStroke = function GLBrushStroke() {
         //add the point only if it is some epsilon away from the previous point
         var numPoints = this._Points.length;
         if (numPoints>0) {
-            var threshold = this._MIN_SAMPLE_DISTANCE_THRESHOLD;//this._WETNESS_FACTOR*this._strokeWidth;
+            var threshold = this._MIN_SAMPLE_DISTANCE_THRESHOLD;
             var prevPt = this._Points[numPoints-1];
             var diffPt = [prevPt[0]-pt[0], prevPt[1]-pt[1]];
             var diffPtMag = Math.sqrt(diffPt[0]*diffPt[0] + diffPt[1]*diffPt[1]);
             if (diffPtMag>threshold){