2 files changed, 195 insertions, 89 deletions

diff --git a/js/helper-classes/RDGE/GLBrushStroke.js b/js/helper-classes/RDGE/GLBrushStroke.js
index fdf1595c..8fb6ab25 100755
--- a/js/helper-classes/RDGE/GLBrushStroke.js
+++ b/js/helper-classes/RDGE/GLBrushStroke.js
@@ -67,7 +67,23 @@ function GLBrushStroke() {
 
     this.getNumPoints = function () { return this._Points.length; }
     this.getPoint = function (index) { return this._Points[index]; }
-    this.addPoint = function (anchorPt) { this._Points.push(anchorPt); this._dirty=true; }
+    this.addPoint = function (pt)
+    {
+        //add the point if it is some epsilon away from the previous point
+        var doAddPoint=true;
+        var numPoints = this._Points.length;
+        if (numPoints>0) {
+            var prevPt = this._Points[numPoints-1];
+            var diffPt = [prevPt[0]-pt[0], prevPt[1]-pt[1]];
+            var diffPtMag = diffPt[0]*diffPt[0] + diffPt[1]*diffPt[1];
+            if (diffPtMag<16)//TODO hook this up to the variable that measures flow/wetness of the paint brush...a smaller number-> more samples
+                doAddPoint=false;
+        }
+        if (doAddPoint) {
+            this._Points.push(pt);
+            this._dirty=true;
+        }
+    }
     this.insertPoint = function(pt, index){ this._Points.splice(index, 0, pt); this._dirty=true;}
     this.isDirty = function(){return this._dirty;}
     this.makeDirty = function(){this._dirty=true;}
@@ -167,7 +183,8 @@ function GLBrushStroke() {
         var bboxWidth = bboxMax[0] - bboxMin[0];
         var bboxHeight = bboxMax[1] - bboxMin[1];
         ctx.clearRect(0, 0, bboxWidth, bboxHeight);
-/*
+
+        /*
         ctx.lineWidth = this._strokeWidth;
         ctx.strokeStyle = "black";
         if (this._strokeColor)
@@ -185,7 +202,91 @@ function GLBrushStroke() {
             ctx.lineTo(pt[0]-bboxMin[0], pt[1]-bboxMin[1]);
         }
         ctx.stroke();
- */
+        */
+
+        var isDebug = false;
+        var prevPt = this._Points[0];
+        var prevX = prevPt[0]-bboxMin[0];
+        var prevY = prevPt[1]-bboxMin[1];
+        prevPt = [prevX,prevY];
+        for (var i = 1; i < numPoints; i++) {
+            var pt = this._Points[i];
+            ctx.globalCompositeOperation = 'source-over';
+            var x = pt[0]-bboxMin[0];
+            var y = pt[1]-bboxMin[1];
+            pt = [x,y];
+
+            //vector from prev to current pt
+            var seg = VecUtils.vecSubtract(2, pt, prevPt);
+            var segDir = VecUtils.vecNormalize(2, seg, 1.0);
+
+            var segMidPt = VecUtils.vecInterpolate(2, pt, prevPt, 0.5);
+            var w2 = this._strokeWidth*0.5;
+            var segDirOrtho = [w2*segDir[1], -w2*segDir[0]];
+            
+            //add half the strokewidth to the segMidPt
+            var lgStart = VecUtils.vecAdd(2, segMidPt, segDirOrtho);
+            var lgEnd = VecUtils.vecSubtract(2, segMidPt, segDirOrtho);
+
+            ctx.save();
+            ctx.beginPath();
+
+            if (isDebug) {
+                ctx.strokeStyle="black";
+                ctx.lineWidth = 1;
+
+                ctx.moveTo(lgStart[0], lgStart[1]);
+                ctx.lineTo(lgEnd[0], lgEnd[1]);
+                ctx.stroke();
+            }
+
+            var lg = ctx.createLinearGradient(lgStart[0], lgStart[1], lgEnd[0], lgEnd[1]);
+            lg.addColorStop(1, 'rgba(0,0,0,0.0)');
+            lg.addColorStop(0.5,'rgba(255,0,0,1.0)');
+            lg.addColorStop(0, 'rgba(0,0,0,0.0)');
+            ctx.fillStyle = lg;
+
+            if (isDebug){
+                ctx.strokeStyle="blue";
+                ctx.lineWidth=0.5;
+            }
+            ctx.moveTo(prevX-w2, prevY);
+            ctx.lineTo(prevX+w2, prevY);
+            ctx.lineTo(x+w2, y);
+            ctx.lineTo(x-w2, y);
+            ctx.lineTo(prevX-w2, prevY);
+            ctx.fill();
+            ctx.closePath();
+
+            ctx.restore();
+
+            prevPt = pt;
+            prevX = x;
+            prevY = y;
+        }
+        
+
+        if (isDebug)
+            ctx.stroke();
+
+        if (isDebug){
+            //draw the skeleton of this stroke
+            ctx.lineWidth = 1;
+            ctx.strokeStyle = "black";
+            var pt = this._Points[0];
+            ctx.beginPath();
+            ctx.moveTo(pt[0]-bboxMin[0],pt[1]-bboxMin[1]);
+            for (var i = 1; i < numPoints; i++) {
+                pt = this._Points[i];
+                var x = pt[0]-bboxMin[0];
+                var y = pt[1]-bboxMin[1];
+                ctx.lineTo(x,y);
+            }
+            ctx.stroke();
+        }
+
+
+        /*
         var R2 = this._strokeWidth;
         var R = R2*0.5;
         var hardness = 0.25; //for a pencil, this is always 1 //TODO get hardness parameter from user interface
@@ -209,6 +310,7 @@ function GLBrushStroke() {
             //ctx.globalCompositeOperation = 'source-in';
             //ctx.rect(x-R, y-R, R2, R2);
         }
+        */
         ctx.restore();
     } //render()
 
diff --git a/js/tools/BrushTool.js b/js/tools/BrushTool.js
index 4d44326f..9a0ad583 100755..100644
--- a/js/tools/BrushTool.js
+++ b/js/tools/BrushTool.js
@@ -65,12 +65,30 @@ exports.BrushTool = Montage.create(ShapeTool, {
                 if (this._selectedBrushStroke === null){
                     this._selectedBrushStroke = new GLBrushStroke();
                 }
-                console.log("BrushTool Start");
                 NJevent("enableStageMove");//stageManagerModule.stageManager.enableMouseMove();
             } //value: function (event) {
         }, //HandleLeftButtonDown
 
+        _getUnsnappedPosition: {
+            value: function(x,y){
+                var elemSnap = snapManager.elementSnapEnabled();
+                var gridSnap = snapManager.gridSnapEnabled();
+                var alignSnap = snapManager.snapAlignEnabled();
 
+                snapManager.enableElementSnap(false);
+                snapManager.enableGridSnap(false);
+                snapManager.enableSnapAlign(false);
+
+                var point = webkitConvertPointFromPageToNode(this.application.ninja.stage.canvas, new WebKitPoint(x,y));
+                var unsnappedpos = DrawingToolBase.getHitRecPos(snapManager.snap(point.x, point.y, false));
+
+                snapManager.enableElementSnap(elemSnap);
+                snapManager.enableGridSnap(gridSnap);
+                snapManager.enableSnapAlign(alignSnap);
+
+                return unsnappedpos;
+            }
+        },
         //need to override this function because the ShapeTool's definition contains a clearDrawingCanvas call  - Pushkar
         //  might not need to override once we draw using OpenGL instead of SVG
         // Also took out all the snapping code for now...need to add that back
@@ -84,20 +102,10 @@ exports.BrushTool = Montage.create(ShapeTool, {
                 }
 
                 if (this._isDrawing) {
-                    snapManager.enableElementSnap(false);
-                    snapManager.enableGridSnap(false);
-                    snapManager.enableSnapAlign(false);
-                    //this.doDraw(event);
-                    //var currMousePos = this.getMouseUpPos();
-                    //instead of doDraw call own DrawingTool
-                    var point = webkitConvertPointFromPageToNode(this.application.ninja.stage.canvas, new WebKitPoint(event.pageX, event.pageY));
-                    var hitRecSnapPoint = DrawingToolBase.getUpdatedSnapPointNoAppLevelEnabling(point.x, point.y, true, this.mouseDownHitRec);
-                    var currMousePos = DrawingToolBase.getHitRecPos(hitRecSnapPoint);
-
+                    var currMousePos = this._getUnsnappedPosition(event.pageX, event.pageY);
                     if (this._selectedBrushStroke){
                        this._selectedBrushStroke.addPoint(currMousePos);
                     }
-
                     this.ShowCurrentBrushStrokeOnStage();
                 } //if (this._isDrawing) {
 
@@ -123,7 +131,6 @@ exports.BrushTool = Montage.create(ShapeTool, {
 
                 this._isDrawing = false;
                 this._hasDraw = false;
-                console.log("BrushTool Stop");
 
                 //TODO get these values from the options
                 if (this._selectedBrushStroke){
@@ -192,92 +199,89 @@ exports.BrushTool = Montage.create(ShapeTool, {
 
 
         RenderShape: {
-        value: function (w, h, planeMat, midPt, canvas) {
+