diff options
Diffstat (limited to 'js/lib/geom')
-rwxr-xr-x | js/lib/geom/brush-stroke.js | 31 |
1 files changed, 16 insertions, 15 deletions
diff --git a/js/lib/geom/brush-stroke.js b/js/lib/geom/brush-stroke.js index ec2521ab..68b9110f 100755 --- a/js/lib/geom/brush-stroke.js +++ b/js/lib/geom/brush-stroke.js | |||
@@ -249,7 +249,7 @@ var BrushStroke = function GLBrushStroke() { | |||
249 | } | 249 | } |
250 | 250 | ||
251 | this.getStrokeAngle = function(){ | 251 | this.getStrokeAngle = function(){ |
252 | this._strokeAngle = a; | 252 | return this._strokeAngle; |
253 | } | 253 | } |
254 | 254 | ||
255 | this.getStrokeStyle = function () { | 255 | this.getStrokeStyle = function () { |
@@ -429,7 +429,12 @@ var BrushStroke = function GLBrushStroke() { | |||
429 | } | 429 | } |
430 | 430 | ||
431 | ctx.clearRect(0, 0, bboxWidth, bboxHeight); | 431 | ctx.clearRect(0, 0, bboxWidth, bboxHeight); |
432 | this.drawToContext(ctx, bboxMin[0], bboxMin[1]); | ||
433 | ctx.restore(); | ||
434 | } //this.render() | ||
432 | 435 | ||
436 | this.drawToContext = function(ctx, origX, origY){ | ||
437 | var numPoints = this.getNumPoints(); | ||
433 | if (this._strokeUseCalligraphic) { | 438 | if (this._strokeUseCalligraphic) { |
434 | //build the stamp for the brush stroke | 439 | //build the stamp for the brush stroke |
435 | var t=0; | 440 | var t=0; |
@@ -453,13 +458,11 @@ var BrushStroke = function GLBrushStroke() { | |||
453 | ctx.lineCap="butt"; | 458 | ctx.lineCap="butt"; |
454 | ctx.globalCompositeOperation = 'source-over'; | 459 | ctx.globalCompositeOperation = 'source-over'; |
455 | ctx.globalAlpha = this._strokeColor[3]; | 460 | ctx.globalAlpha = this._strokeColor[3]; |
456 | //ctx.lineWidth=this._strokeWidth/10;//todo figure out the correct formula for the line width | 461 | //todo figure out the correct formula for the line width |
457 | //if (ctx.lineWidth<2) | ||
458 | ctx.lineWidth=2; | 462 | ctx.lineWidth=2; |
459 | if (t===numTraces-1){ | 463 | if (t===numTraces-1){ |
460 | ctx.lineWidth = 1; | 464 | ctx.lineWidth = 1; |
461 | } | 465 | } |
462 | |||
463 | for (t=0;t<numTraces;t++){ | 466 | for (t=0;t<numTraces;t++){ |
464 | var disp = [brushStamp[t][0], brushStamp[t][1]]; | 467 | var disp = [brushStamp[t][0], brushStamp[t][1]]; |
465 | var alphaVal = 1.0; | 468 | var alphaVal = 1.0; |
@@ -470,17 +473,17 @@ var BrushStroke = function GLBrushStroke() { | |||
470 | } | 473 | } |
471 | 474 | ||
472 | ctx.save(); | 475 | ctx.save(); |
473 | |||
474 | ctx.strokeStyle="rgba("+parseInt(255*this._strokeColor[0])+","+parseInt(255*this._strokeColor[1])+","+parseInt(255*this._strokeColor[2])+","+alphaVal+")"; | 476 | ctx.strokeStyle="rgba("+parseInt(255*this._strokeColor[0])+","+parseInt(255*this._strokeColor[1])+","+parseInt(255*this._strokeColor[2])+","+alphaVal+")"; |
477 | |||
475 | //linearly interpolate between the two stroke colors | 478 | //linearly interpolate between the two stroke colors |
476 | var currStrokeColor = VecUtils.vecInterpolate(4, this._strokeColor, this._secondStrokeColor, t/numTraces); | 479 | var currStrokeColor = VecUtils.vecInterpolate(4, this._strokeColor, this._secondStrokeColor, t/numTraces); |
477 | //ctx.strokeStyle="rgba("+parseInt(255*currStrokeColor[0])+","+parseInt(255*currStrokeColor[1])+","+parseInt(255*currStrokeColor[2])+","+alphaVal+")"; | 480 | //ctx.strokeStyle="rgba("+parseInt(255*currStrokeColor[0])+","+parseInt(255*currStrokeColor[1])+","+parseInt(255*currStrokeColor[2])+","+alphaVal+")"; |
478 | 481 | ||
479 | ctx.translate(disp[0],disp[1]); | 482 | ctx.translate(disp[0],disp[1]); |
480 | ctx.beginPath(); | 483 | ctx.beginPath(); |
481 | ctx.moveTo(this._Points[0][0]-bboxMin[0], this._Points[0][1]-bboxMin[1]); | 484 | ctx.moveTo(this._Points[0][0]-origX, this._Points[0][1]-origY); |
482 | for (var i=0;i<numPoints;i++){ | 485 | for (var i=0;i<numPoints;i++){ |
483 | ctx.lineTo(this._Points[i][0]-bboxMin[0], this._Points[i][1]-bboxMin[1]); | 486 | ctx.lineTo(this._Points[i][0]-origX, this._Points[i][1]-origY); |
484 | } | 487 | } |
485 | ctx.stroke(); | 488 | ctx.stroke(); |
486 | ctx.restore(); | 489 | ctx.restore(); |
@@ -496,21 +499,19 @@ var BrushStroke = function GLBrushStroke() { | |||
496 | ctx.strokeStyle="rgba("+parseInt(255*this._strokeColor[0])+","+parseInt(255*this._strokeColor[1])+","+parseInt(255*this._strokeColor[2])+","+alphaVal+")"; | 499 | ctx.strokeStyle="rgba("+parseInt(255*this._strokeColor[0])+","+parseInt(255*this._strokeColor[1])+","+parseInt(255*this._strokeColor[2])+","+alphaVal+")"; |
497 | for (var l=0;l<numlayers;l++){ | 500 | for (var l=0;l<numlayers;l++){ |
498 | ctx.beginPath(); | 501 | ctx.beginPath(); |
499 | ctx.moveTo(this._Points[0][0]-bboxMin[0], this._Points[0][1]-bboxMin[1]); | 502 | ctx.moveTo(this._Points[0][0]-origX, this._Points[0][1]-origY); |
500 | if (numPoints===1){ | 503 | if (numPoints===1){ |
501 | //display a tiny segment as a single point | 504 | //display a tiny segment as a single point |
502 | ctx.lineTo(this._Points[0][0]-bboxMin[0], this._Points[0][1]-bboxMin[1]+0.01); | 505 | ctx.lineTo(this._Points[0][0]-origX, this._Points[0][1]-origY+0.01); |
503 | } | 506 | } |
504 | for (var i=1;i<numPoints;i++){ | 507 | for (var i=1;i<numPoints;i++){ |
505 | ctx.lineTo(this._Points[i][0]-bboxMin[0], this._Points[i][1]-bboxMin[1]); | 508 | ctx.lineTo(this._Points[i][0]-origX, this._Points[i][1]-origY); |
506 | } | 509 | } |
507 | ctx.lineWidth=2*l+minStrokeWidth; | 510 | ctx.lineWidth=2*l+minStrokeWidth; |
508 | ctx.stroke(); | 511 | ctx.stroke(); |
509 | } | 512 | }//for every layer l |
510 | } | 513 | } //if there is no calligraphic stroke |
511 | 514 | }; //this.drawToCanvas() | |
512 | ctx.restore(); | ||
513 | }; //render() | ||
514 | 515 | ||
515 | 516 | ||
516 | this.exportJSON = function(){ | 517 | this.exportJSON = function(){ |