Add a smoothing amount parameter, and hide options based on checkboxes

4 files changed, 66 insertions, 14 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 608111bd..cbe4c242 100755
--- a/js/components/tools-properties/brush-properties.reel/brush-properties.html
+++ b/js/components/tools-properties/brush-properties.reel/brush-properties.html
@@ -33,7 +33,8 @@
                     "maxValue": 100,
                     "value": 100,
                     "decimalPlace": 10,
-                    "acceptableUnits" : ["px", "pt"]
+                    "acceptableUnits" : ["%"],
+                    "units" : "%"
                 }
             },
 
@@ -46,6 +47,20 @@
                     "maxValue": 90,
                     "value": 0,
                     "decimalPlace": 10,
+                    "acceptableUnits" : ["deg."],
+                    "units" : "deg."
+                }
+            },
+
+            "smoothingAmountHT": {
+                "module": "js/components/hottextunit.reel",
+                "name": "HotTextUnit",
+                "properties": {
+                    "element": {"#": "smoothingAmount"},
+                    "minValue": 0,
+                    "maxValue": 100,
+                    "value": 0,
+                    "decimalPlace": 10,
                     "acceptableUnits" : ["px", "pt"]
                 }
             },
@@ -58,8 +73,10 @@
                     "_strokeSize": {"@": "strokeSizeHT"},
                     "_strokeHardness": {"@": "strokeHardnessHT"},
                     "_doSmoothing": {"#": "doSmoothing"},
+                    "_smoothingAmount": {"@": "smoothingAmountHT"},
                     "_useCalligraphic":{"#": "useCalligraphic"},
-                    "_strokeAngle": {"@": "strokeAngleHT"}
+                    "_strokeAngle": {"@": "strokeAngleHT"},
+                    "_angleLabel": {"#": "angleLabel"}
                 }
             }
         }
@@ -75,8 +92,9 @@
                 <label class="label"> Hardness:</label>
                 <div id="strokeHardness" class="label"></div>
                 <label class="label"><input id="doSmoothing" type="checkbox" name="doSmoothingControl" class="checkBoxAlign"/>Smoothing</label>
+                <div id="smoothingAmount" class="label"></div>
                 <label class="label"><input id="useCalligraphic" type="checkbox" name="useCalligraphicControl" class="checkBoxAlign"/>Calligraphic</label>
-                <label class="label"> Angle:</label>
+                <label class="label" id="angleLabel"> Angle:</label>
                 <div id="strokeAngle" class="label"></div>
 
             </div>
diff --git a/js/components/tools-properties/brush-properties.reel/brush-properties.js b/js/components/tools-properties/brush-properties.reel/brush-properties.js
index e6faa0f0..fdcd50f8 100755
--- a/js/components/tools-properties/brush-properties.reel/brush-properties.js
+++ b/js/components/tools-properties/brush-properties.reel/brush-properties.js
@@ -9,6 +9,33 @@ var Component = require("montage/ui/component").Component;
 var ToolProperties = require("js/components/tools-properties/tool-properties").ToolProperties;
 
 exports.BrushProperties = Montage.create(ToolProperties, {
+    _subPrepare: {
+        value: function() {
+            this.handleChange(null);
+            this._useCalligraphic.addEventListener("change", this, false);
+            this._doSmoothing.addEventListener("change", this, false);
+        }
+    },
+    handleChange: {
+        value: function(event) {
+            if(this._useCalligraphic.checked) {
+                this._strokeAngle.element.style["display"] = "";
+                this._strokeAngle.visible = true;
+                this._angleLabel.style["display"] = "";
+            } else {
+                this._strokeAngle.element.style["display"] = "none";
+                this._strokeAngle.visible = false;
+                this._angleLabel.style["display"] = "none";
+            }
+            if(this._doSmoothing.checked) {
+                this._smoothingAmount.element.style["display"] = "";
+                this._smoothingAmount.visible = true;
+            } else {
+                this._smoothingAmount.element.style["display"] = "none";
+                this._smoothingAmount.visible = false;
+            }
+        }
+    },
     strokeSize: {
         get: function() { return this._strokeSize; }
     },
@@ -18,6 +45,9 @@ exports.BrushProperties = Montage.create(ToolProperties, {
     doSmoothing:{
         get: function() {return this._doSmoothing.checked; }
     },
+    smoothingAmount:{
+        get: function() {return this._smoothingAmount;}
+    },
     useCalligraphic: {
         get: function() {return this._useCalligraphic.checked;}
     },
diff --git a/js/lib/geom/brush-stroke.js b/js/lib/geom/brush-stroke.js
index 4c42539a..52f81ffe 100755
--- a/js/lib/geom/brush-stroke.js
+++ b/js/lib/geom/brush-stroke.js
@@ -39,10 +39,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;
@@ -125,7 +122,7 @@ 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]);
@@ -196,6 +193,10 @@ var BrushStroke = function GLBrushStroke() {
         this._strokeDoSmoothing = s;
     }
 
+    this.setSmoothingAmount = function(a){
+        this._strokeAmountSmoothing = a;
+    }
+
     this.setStrokeUseCalligraphic = function(c){
         this._strokeUseCalligraphic = c;
     }
@@ -252,7 +253,7 @@ var BrushStroke = function GLBrushStroke() {
             //**** add samples to the path if needed...linear interpolation for now
             //if (numPoints>1) {
             if (0){
-                var threshold = this._WETNESS_FACTOR*this._strokeWidth;
+                var threshold = this._MAX_SAMPLE_DISTANCE_THRESHOLD;
                 var prevPt = this._Points[0];
                 var prevIndex = 0;
                 for (var i=1;i<numPoints;i++){
@@ -283,7 +284,7 @@ var BrushStroke = function GLBrushStroke() {
                 }
             }
 
-            //todo 4-point subdivision iterations over continuous regions of 'long' segments
+            //instead of the following, may use 4-point subdivision iterations over continuous regions of 'long' segments
             // look at http://www.gvu.gatech.edu/~jarek/Split&Tweak/ for formula
             //**** add samples to the long sections of the path --- Catmull-Rom spline interpolation
             if (this._strokeDoSmoothing && numPoints>1) {
@@ -330,7 +331,7 @@ var BrushStroke = function GLBrushStroke() {
                 console.log("Inserted "+numInsertedPoints+" additional CatmullRom points");
 
                 //now do 3-4 iterations of Laplacian smoothing (setting the points to the average of their neighbors)
-                var numLaplacianIterations = 3; //todo figure out the proper number of Laplacian iterations (perhaps as a function of stroke width)
+                var numLaplacianIterations = this._strokeAmountSmoothing; 
                 for (var n=0;n<numLaplacianIterations;n++){
                     newPoints = this._Points;
                     for (var i=1;i<numPoints-1;i++){
diff --git a/js/tools/BrushTool.js b/js/tools/BrushTool.js
index 4ce9976a..d45d108e 100644
--- a/js/tools/BrushTool.js
+++ b/js/tools/BrushTool.js
@@ -85,7 +85,7 @@ exports.BrushTool = Montage.create(ShapeTool, {
 
                     var strokeHardness = 100;
                     if (this.options.strokeHardness){