aboutsummaryrefslogtreecommitdiff
path: root/js/helper-classes/RDGE/GLBrushStroke.js
diff options
context:
space:
mode:
authorPushkar Joshi2012-03-01 15:29:17 -0800
committerPushkar Joshi2012-03-01 15:29:17 -0800
commit0b7f2f54738d2c1ea480b9bac7d3a750b1ef4df6 (patch)
tree16309dcc8e50851bc75ab4ecd5a7c9fac85172ed /js/helper-classes/RDGE/GLBrushStroke.js
parent271a8f2b29d87d12c81d03e3f1e2c05b816a138d (diff)
downloadninja-0b7f2f54738d2c1ea480b9bac7d3a750b1ef4df6.tar.gz
first attempt at rendering the brush stroke as a collection of polylines (number of polylines equals the stroke width)
Diffstat (limited to 'js/helper-classes/RDGE/GLBrushStroke.js')
-rwxr-xr-xjs/helper-classes/RDGE/GLBrushStroke.js47
1 files changed, 45 insertions, 2 deletions
diff --git a/js/helper-classes/RDGE/GLBrushStroke.js b/js/helper-classes/RDGE/GLBrushStroke.js
index 5d773c2d..f5b0bce1 100755
--- a/js/helper-classes/RDGE/GLBrushStroke.js
+++ b/js/helper-classes/RDGE/GLBrushStroke.js
@@ -139,7 +139,8 @@ function GLBrushStroke() {
139 var numPoints = this._Points.length; 139 var numPoints = this._Points.length;
140 140
141 //**** add samples to the path if needed...linear interpolation for now 141 //**** add samples to the path if needed...linear interpolation for now
142 if (numPoints>1) { 142 //if (numPoints>1) {
143 if (0){
143 var threshold = this._WETNESS_FACTOR*this._strokeWidth; 144 var threshold = this._WETNESS_FACTOR*this._strokeWidth;
144 var prevPt = this._Points[0]; 145 var prevPt = this._Points[0];
145 var prevIndex = 0; 146 var prevIndex = 0;
@@ -331,7 +332,7 @@ function GLBrushStroke() {
331 } 332 }
332 */ 333 */
333 334
334 335 /*
335 var R2 = this._strokeWidth; 336 var R2 = this._strokeWidth;
336 var R = R2*0.5; 337 var R = R2*0.5;
337 var hardness = 0; //for a pencil, this is always 1 //TODO get hardness parameter from user interface 338 var hardness = 0; //for a pencil, this is always 1 //TODO get hardness parameter from user interface
@@ -359,6 +360,48 @@ function GLBrushStroke() {
359 //ctx.globalCompositeOperation = 'source-in'; 360 //ctx.globalCompositeOperation = 'source-in';
360 //ctx.rect(x-R, y-R, R2, R2); 361 //ctx.rect(x-R, y-R, R2, R2);
361 } 362 }
363 */
364
365 //todo test how to render the path as a bunch of moveTo and lineTos (for calligraphic brush styles)
366 var numTraces = this._strokeWidth;
367 var halfNumTraces = numTraces/2;
368 var deltaDisplacement = [1,0];//[this._strokeWidth/numTraces, 0]; //a horizontal line brush
369 var startPos = [-this._strokeWidth/2,0];
370 for (var t=0;t<numTraces;t++){
371 var disp = [startPos[0]+t*deltaDisplacement[0], startPos[1]+t*deltaDisplacement[1]];
372 //ctx.globalCompositeOperation = 'source-over';
373 var distFromMiddle = Math.abs(halfNumTraces-t);
374 var alphaVal = 1.0 - (distFromMiddle/halfNumTraces);
375 ctx.save();
376 ctx.lineWidth=this._strokeWidth/10;//4;
377 if (ctx.lineWidth<2)
378 ctx.lineWidth=2;
379 ctx.lineJoin="bevel";
380 ctx.lineCap="butt";
381 if (t<numTraces/2)
382 ctx.strokeStyle="rgba("+parseInt(255*this._strokeColor[0])+","+parseInt(255*this._strokeColor[1])+","+parseInt(255*this._strokeColor[2])+","+alphaVal+")";
383 else
384 ctx.strokeStyle="rgba("+255+","+parseInt(255*this._strokeColor[1])+","+parseInt(255*this._strokeColor[2])+","+alphaVal+")";
385 ctx.translate(disp[0],disp[1]);
386 ctx.beginPath();
387 ctx.moveTo(this._Points[0][0]-bboxMin[0], this._Points[0][1]-bboxMin[1]);
388 for (var i=0;i<numPoints;i++){
389 ctx.lineTo(this._Points[i][0]-bboxMin[0], this._Points[i][1]-bboxMin[1]);
390 }
391 ctx.stroke();
392 ctx.restore();
393 }
394
395 /*
396 ctx.beginPath();
397 ctx.moveTo(this._Points[0][0]-bboxMin[0], this._Points[0][1]-bboxMin[1]);
398 for (var i=1;i<numPoints;i++){
399 ctx.lineTo(this._Points[i][0]-bboxMin[0], this._Points[i][1]-bboxMin[1]);
400 }
401 ctx.lineWidth=1.0;
402 ctx.strokeStyle = "black";
403 ctx.stroke();
404 */
362 405
363 ctx.restore(); 406 ctx.restore();
364 } //render() 407 } //render()