3 files changed, 747 insertions, 683 deletions

diff --git a/js/data/pi/pi-data.js b/js/data/pi/pi-data.js
index 157cbc64..c6cbc3cf 100755
--- a/js/data/pi/pi-data.js
+++ b/js/data/pi/pi-data.js
@@ -703,13 +703,14 @@ exports.PiData = Montage.create( Montage, {
                         {
                             type : "color",
                             prop: "border",
-                            id : "stroke"
+                            id : "stroke",
+                            visible: false
                         },
                         {
                             type : "color",
                             id : "fill",
                             prop: "background",
-                            visible : false,
+                            visible : true,
                             divider : true
                         }
                     ],
diff --git a/js/lib/geom/brush-stroke.js b/js/lib/geom/brush-stroke.js
index 09a7023c..d9c2ab53 100755
--- a/js/lib/geom/brush-stroke.js
+++ b/js/lib/geom/brush-stroke.js
@@ -45,7 +45,7 @@ var BrushStroke = function GLBrushStroke() {
     this._strokeAmountSmoothing = 0;
 
     // currently, brush does not support a fill region
-    this.canFill = false;
+    this.canFill = true;
 
     //threshold that tells us whether two samples are too far apart
     this._MAX_SAMPLE_DISTANCE_THRESHOLD = 5;
@@ -65,777 +65,840 @@ var BrushStroke = function GLBrushStroke() {
     this._planeMatInv = null;
     this._planeCenter = null;
     this._dragPlane = null;
+}; //BrushStroke class defition
 
-    /////////////////////////////////////////////////////////
-    // Property Accessors/Setters
-    /////////////////////////////////////////////////////////
-    this.setCanvas = function(c) {
-        this._canvas = c;
-    }
-
-    this.setWorld = function (world) {
-        this._world = world;
-    };
-
-    this.getWorld = function () {
-        return this._world;
-    };
-
-    this.geomType = function () {
-        return this.GEOM_TYPE_BRUSH_STROKE;
-    };
-
-    this.setDrawingTool = function (tool) {
-        this._drawingTool = tool;
-    };
-
-    this.getDrawingTool = function () {
-        return this._drawingTool;
-    };
-
-    this.setPlaneMatrix = function(planeMat){
-        this._planeMat = planeMat;
-    };
-
-    this.setPlaneMatrixInverse = function(planeMatInv){
-        this._planeMatInv = planeMatInv;
-    };
-
-    this.setPlaneCenter = function(pc){
-        this._planeCenter = pc;
-    };
-
-    this.setDragPlane = function(p){
-        this._dragPlane = p;
-    };
-
-    this.getNumPoints = function () {
-        if (this._LocalPoints.length)
-            return this._LocalPoints.length;
-        else
-            return this._Points.length;
-    };
-
-    this.getPoint = function (index) {
-        return this._Points[index].slice(0);
-    };
+BrushStroke.prototype = Object.create(GeomObj, {});
 
-    this.addPoint = function (pt) {
-        //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;
-            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){
-                this._Points.push(pt);
-                this._isDirty=true;
-                this._isInit = false;
-            }
-        } else {
+/////////////////////////////////////////////////////////
+// Property Accessors/Setters
+/////////////////////////////////////////////////////////
+BrushStroke.prototype.setCanvas = function(c) {
+    this._canvas = c;
+};
+
+BrushStroke.prototype.setWorld = function (world) {
+    this._world = world;
+};
+
+BrushStroke.prototype.getWorld = function () {
+    return this._world;
+};
+
+BrushStroke.prototype.geomType = function () {
+    return this.GEOM_TYPE_BRUSH_STROKE;
+};
+
+BrushStroke.prototype.setDrawingTool = function (tool) {
+    this._drawingTool = tool;
+};
+
+BrushStroke.prototype.getDrawingTool = function () {
+    return this._drawingTool;
+};
+
+BrushStroke.prototype.setPlaneMatrix = function(planeMat){
+    this._planeMat = planeMat;
+};
+
+BrushStroke.prototype.setPlaneMatrixInverse = function(planeMatInv){
+    this._planeMatInv = planeMatInv;
+};
+
+BrushStroke.prototype.setPlaneCenter = function(pc){
+    this._planeCenter = pc;
+};
+
+BrushStroke.prototype.setDragPlane = function(p){
+    this._dragPlane = p;
+};
+
+BrushStroke.prototype.getNumPoints = function () {
+    if (this._LocalPoints.length)
+        return this._LocalPoints.length;
+    else
+        return this._Points.length;
+};
+
+BrushStroke.prototype.getPoint = function (index) {
+    return this._Points[index].slice(0);
+};
+
+BrushStroke.prototype.addPoint = function (pt) {
+    //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;
+        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){
             this._Points.push(pt);
             this._isDirty=true;
             this._isInit = false;
         }
-    };
-    
-    this.insertPoint = function(pt, index){
-        this._Points.splice(index, 0, pt);
+    } else {
+        this._Points.push(pt);
         this._isDirty=true;
         this._isInit = false;
-    };
+    }
+};
 
-    this.isDirty = function(){
-        return this._isDirty;
-    };
+BrushStroke.prototype.insertPoint = function(pt, index){
+    this._Points.splice(index, 0, pt);
+    this._isDirty=true;
+    this._isInit = false;
+};
 
-    this.makeDirty = function(){
-        this._isDirty=true;
-    };
+BrushStroke.prototype.isDirty = function(){
+    return this._isDirty;
+};
 
-    this.getStageWorldCenter = function() {
-        return this._stageWorldCenter;
-    };
+BrushStroke.prototype.makeDirty = function(){
+    this._isDirty=true;
+};
 
-    this.getBBoxMin = function () {
-        return this._BBoxMin;
-    };
+BrushStroke.prototype.getStageWorldCenter = function() {
+    return this._stageWorldCenter;
+};
 
-    this.getBBoxMax = function () {
-        return this._BBoxMax;
-    };
+BrushStroke.prototype.getBBoxMin = function () {
+    return this._BBoxMin;
+};
 
-    this.getStrokeWidth = function () {
-        return this._strokeWidth;
-    };
+BrushStroke.prototype.getBBoxMax = function () {
+    return this._BBoxMax;
+};
 
-    this.setStrokeWidth = function (w) {
-        this._strokeWidth = w;
-        if (this._strokeWidth<1) {
-            this._strokeWidth = 1;
-        }
-        this._isDirty=true;
-    };
+BrushStroke.prototype.getStrokeWidth = function () {
+    return this._strokeWidth;
+};