aboutsummaryrefslogtreecommitdiff
path: root/js
diff options
context:
space:
mode:
authorNivesh Rajbhandari2012-08-15 12:21:20 -0700
committerNivesh Rajbhandari2012-08-15 12:21:20 -0700
commitc88752d621069b12f978c1fd88ffdd52537a4657 (patch)
treef1fa9b705e323485e31858c2696ecf9c9604fde6 /js
parent0674dfbd067403fb7a8534e43985e41ec224c681 (diff)
downloadninja-c88752d621069b12f978c1fd88ffdd52537a4657.tar.gz
Allow rectangle and oval shapes to be created with 0 px stroke size. Line shapes' stroke size will still be restricted to a minimum of 1 px.v0.7.2
Signed-off-by: Nivesh Rajbhandari <mqg734@motorola.com>
Diffstat (limited to 'js')
-rwxr-xr-xjs/components/tools-properties/shape-properties.reel/shape-properties.html2
-rwxr-xr-xjs/components/tools-properties/shape-properties.reel/shape-properties.js2
-rwxr-xr-xjs/data/pi/pi-data.js2
-rwxr-xr-xjs/lib/geom/circle.js94
-rwxr-xr-xjs/lib/geom/rectangle.js2
5 files changed, 53 insertions, 49 deletions
diff --git a/js/components/tools-properties/shape-properties.reel/shape-properties.html b/js/components/tools-properties/shape-properties.reel/shape-properties.html
index 7503f257..959feec6 100755
--- a/js/components/tools-properties/shape-properties.reel/shape-properties.html
+++ b/js/components/tools-properties/shape-properties.reel/shape-properties.html
@@ -66,7 +66,7 @@ POSSIBILITY OF SUCH DAMAGE.
66 "prototype": "js/components/hottextunit.reel[HotTextUnit]", 66 "prototype": "js/components/hottextunit.reel[HotTextUnit]",
67 "properties": { 67 "properties": {
68 "element": {"#": "strokeControl"}, 68 "element": {"#": "strokeControl"},
69 "minValue": 1, 69 "minValue": 0,
70 "maxValue": 100, 70 "maxValue": 100,
71 "value": 1, 71 "value": 1,
72 "decimalPlace": 10, 72 "decimalPlace": 10,
diff --git a/js/components/tools-properties/shape-properties.reel/shape-properties.js b/js/components/tools-properties/shape-properties.reel/shape-properties.js
index 40ad0dd0..c5b22188 100755
--- a/js/components/tools-properties/shape-properties.reel/shape-properties.js
+++ b/js/components/tools-properties/shape-properties.reel/shape-properties.js
@@ -209,12 +209,14 @@ var ShapeProperties = exports.ShapeProperties = Montage.create(ToolProperties, {
209 this._fillColorCtrlIcon.style["display"] = "none"; 209 this._fillColorCtrlIcon.style["display"] = "none";
210 this._fillColorCtrlIcon.visible = false; 210 this._fillColorCtrlIcon.visible = false;
211 this.endDivider.style["display"] = "none"; 211 this.endDivider.style["display"] = "none";
212 this._strokeSize.minValue = 1;
212 } else { 213 } else {
213 this._fillColorCtrlContainer.style["display"] = ""; 214 this._fillColorCtrlContainer.style["display"] = "";
214 this._fillColorCtrlContainer.visible = true; 215 this._fillColorCtrlContainer.visible = true;
215 this._fillColorCtrlIcon.style["display"] = ""; 216 this._fillColorCtrlIcon.style["display"] = "";
216 this._fillColorCtrlIcon.visible = true; 217 this._fillColorCtrlIcon.visible = true;
217 this.endDivider.style["display"] = ""; 218 this.endDivider.style["display"] = "";
219 this._strokeSize.minValue = 0;
218 } 220 }
219 221
220 if (this._useWebGL.checked) { 222 if (this._useWebGL.checked) {
diff --git a/js/data/pi/pi-data.js b/js/data/pi/pi-data.js
index f36f11e6..489938d5 100755
--- a/js/data/pi/pi-data.js
+++ b/js/data/pi/pi-data.js
@@ -499,7 +499,7 @@ exports.PiData = Montage.create( Montage, {
499 prop : "strokeSize", 499 prop : "strokeSize",
500 label : "Stroke", 500 label : "Stroke",
501 inputFunction: parseFloat, 501 inputFunction: parseFloat,
502 min : 0, 502 min : 1,
503 max : 100, 503 max : 100,
504 value : 1, 504 value : 1,
505 unit : "px", 505 unit : "px",
diff --git a/js/lib/geom/circle.js b/js/lib/geom/circle.js
index 4995c2cb..28a99956 100755
--- a/js/lib/geom/circle.js
+++ b/js/lib/geom/circle.js
@@ -669,53 +669,33 @@ exports.Circle = Object.create(GeomObj, {
669 mat[5] = yScale; 669 mat[5] = yScale;
670 670
671 // set up the stroke style 671 // set up the stroke style
672 ctx.beginPath(); 672 if(lineWidth > 0) {
673 ctx.lineWidth = lineWidth; 673 ctx.beginPath();
674 if (this._strokeColor) { 674 ctx.lineWidth = lineWidth;
675 if(this._strokeColor.gradientMode) { 675 if (this._strokeColor) {
676 if(this._strokeColor.gradientMode === "radial") { 676 if(this._strokeColor.gradientMode) {
677 gradient = ctx.createRadialGradient(xCtr, yCtr, 0, 677 if(this._strokeColor.gradientMode === "radial") {
678 xCtr, yCtr, 0.5*Math.max(this._height, this._width)); 678 gradient = ctx.createRadialGradient(xCtr, yCtr, 0,
679 } else { 679 xCtr, yCtr, 0.5*Math.max(this._height, this._width));
680 gradient = ctx.createLinearGradient(0, this._height/2, this._width, this._height/2); 680 } else {
681 } 681 gradient = ctx.createLinearGradient(0, this._height/2, this._width, this._height/2);
682 colors = this._strokeColor.color; 682 }
683 683 colors = this._strokeColor.color;
684 len = colors.length;
685
686 for(j=0; j<len; j++) {
687 position = colors[j].position/100;
688 cs = colors[j].value;
689 gradient.addColorStop(position, "rgba(" + cs.r + "," + cs.g + "," + cs.b + "," + cs.a + ")");
690 }
691
692 ctx.strokeStyle = gradient;
693 684
694 } else { 685 len = colors.length;
695 c = "rgba(" + 255*this._strokeColor[0] + "," + 255*this._strokeColor[1] + "," + 255*this._strokeColor[2] + "," + this._strokeColor[3] + ")";
696 ctx.strokeStyle = c;
697 }
698 // draw the stroke
699 p = MathUtils.transformPoint( bezPts[0], mat );
700 ctx.moveTo( p[0], p[1] );
701 index = 1;
702 while (index < n) {
703 var p0 = MathUtils.transformPoint( bezPts[index], mat );
704 var p1 = MathUtils.transformPoint( bezPts[index+1], mat );
705 686
706 var x0 = p0[0], y0 = p0[1], 687 for(j=0; j<len; j++) {
707 x1 = p1[0], y1 = p1[1]; 688 position = colors[j].position/100;
708 ctx.quadraticCurveTo( x0, y0, x1, y1 ); 689 cs = colors[j].value;
709 index += 2; 690 gradient.addColorStop(position, "rgba(" + cs.r + "," + cs.g + "," + cs.b + "," + cs.a + ")");
710 } 691 }
711 692
712 if (MathUtils.fpSign(innerRad) > 0) { 693 ctx.strokeStyle = gradient;
713 // calculate the stroke matrix
714 xScale = 0.5*innerRad*this._width - 0.5*lineWidth;
715 yScale = 0.5*innerRad*this._height - 0.5*lineWidth;
716 mat[0] = xScale;
717 mat[5] = yScale;
718 694
695 } else {
696 c = "rgba(" + 255*this._strokeColor[0] + "," + 255*this._strokeColor[1] + "," + 255*this._strokeColor[2] + "," + this._strokeColor[3] + ")";
697 ctx.strokeStyle = c;
698 }
719 // draw the stroke 699 // draw the stroke
720 p = MathUtils.transformPoint( bezPts[0], mat ); 700 p = MathUtils.transformPoint( bezPts[0], mat );
721 ctx.moveTo( p[0], p[1] ); 701 ctx.moveTo( p[0], p[1] );
@@ -729,10 +709,32 @@ exports.Circle = Object.create(GeomObj, {
729 ctx.quadraticCurveTo( x0, y0, x1, y1 ); 709 ctx.quadraticCurveTo( x0, y0, x1, y1 );
730 index += 2; 710 index += 2;
731 } 711 }
732 }
733 712
734 // render the stroke 713 if (MathUtils.fpSign(innerRad) > 0) {
735 ctx.stroke(); 714 // calculate the stroke matrix
715 xScale = 0.5*innerRad*this._width - 0.5*lineWidth;
716 yScale = 0.5*innerRad*this._height - 0.5*lineWidth;
717 mat[0] = xScale;
718 mat[5] = yScale;
719
720 // draw the stroke
721 p = MathUtils.transformPoint( bezPts[0], mat );
722 ctx.moveTo( p[0], p[1] );
723 index = 1;
724 while (index < n) {
725 var p0 = MathUtils.transformPoint( bezPts[index], mat );
726 var p1 = MathUtils.transformPoint( bezPts[index+1], mat );
727
728 var x0 = p0[0], y0 = p0[1],
729 x1 = p1[0], y1 = p1[1];
730 ctx.quadraticCurveTo( x0, y0, x1, y1 );
731 index += 2;
732 }
733 }
734
735 // render the stroke
736 ctx.stroke();
737 }
736 } 738 }
737 } 739 }
738 } 740 }
diff --git a/js/lib/geom/rectangle.js b/js/lib/geom/rectangle.js
index f3db92af..b34a97ab 100755
--- a/js/lib/geom/rectangle.js
+++ b/js/lib/geom/rectangle.js
@@ -603,7 +603,7 @@ exports.Rectangle = Object.create(GeomObj, {
603 603
604 // render the stroke 604 // render the stroke
605 ctx.beginPath(); 605 ctx.beginPath();
606 if (this._strokeColor) { 606 if (this._strokeColor && (lw > 0)) {
607 inset = Math.ceil( 0.5*lw ) - 0.5; 607 inset = Math.ceil( 0.5*lw ) - 0.5;
608 608
609 if(this._strokeColor.gradientMode) { 609 if(this._strokeColor.gradientMode) {