aboutsummaryrefslogtreecommitdiff
path: root/js/lib/geom/circle.js
diff options
context:
space:
mode:
Diffstat (limited to 'js/lib/geom/circle.js')
-rwxr-xr-xjs/lib/geom/circle.js103
1 files changed, 90 insertions, 13 deletions
diff --git a/js/lib/geom/circle.js b/js/lib/geom/circle.js
index dd82a4cc..4b155b4c 100755
--- a/js/lib/geom/circle.js
+++ b/js/lib/geom/circle.js
@@ -61,6 +61,8 @@ var Circle = function GLCircle() {
61 } else { 61 } else {
62 this._fillMaterial = MaterialsModel.exportFlatMaterial(); 62 this._fillMaterial = MaterialsModel.exportFlatMaterial();
63 } 63 }
64
65 this.exportMaterials();
64 }; 66 };
65 67
66 /////////////////////////////////////////////////////////////////////// 68 ///////////////////////////////////////////////////////////////////////
@@ -442,16 +444,43 @@ var Circle = function GLCircle() {
442 var bezPts = MathUtils.circularArcToBezier( [0,0,0], [1,0,0], 2.0*Math.PI ); 444 var bezPts = MathUtils.circularArcToBezier( [0,0,0], [1,0,0], 2.0*Math.PI );
443 if (bezPts) { 445 if (bezPts) {
444 var n = bezPts.length; 446 var n = bezPts.length;
447 var gradient,
448 colors,
449 len,
450 j,
451 position,
452 cs,
453 c;
445 454
446 // set up the fill style 455 // set up the fill style
447 ctx.beginPath(); 456 ctx.beginPath();
448 ctx.lineWidth = 0; 457 ctx.lineWidth = 0;
449 if (this._fillColor) { 458 if (this._fillColor) {
450 var c = "rgba(" + 255*this._fillColor[0] + "," + 255*this._fillColor[1] + "," + 255*this._fillColor[2] + "," + this._fillColor[3] + ")"; 459 if(this._fillColor.gradientMode) {
451 ctx.fillStyle = c; 460 if(this._fillColor.gradientMode === "radial") {
452 461 gradient = ctx.createRadialGradient(xCtr, yCtr, 0,
462 xCtr, yCtr, Math.max(yScale, xScale));
463 } else {
464 gradient = ctx.createLinearGradient(0, this._height/2, this._width, this._height/2);
465 }
466 colors = this._fillColor.color;
467
468 len = colors.length;
469
470 for(j=0; j<len; j++) {
471 position = colors[j].position/100;
472 cs = colors[j].value;
473 gradient.addColorStop(position, "rgba(" + cs.r + "," + cs.g + "," + cs.b + "," + cs.a + ")");
474 }
475
476 ctx.fillStyle = gradient;
477
478 } else {
479 c = "rgba(" + 255*this._fillColor[0] + "," + 255*this._fillColor[1] + "," + 255*this._fillColor[2] + "," + this._fillColor[3] + ")";
480 ctx.fillStyle = c;
481 }
453 // draw the fill 482 // draw the fill
454 ctx.beginPath(); 483// ctx.beginPath();
455 var p = MathUtils.transformPoint( bezPts[0], mat ); 484 var p = MathUtils.transformPoint( bezPts[0], mat );
456 ctx.moveTo( p[0], p[1] ); 485 ctx.moveTo( p[0], p[1] );
457 var index = 1; 486 var index = 1;
@@ -504,9 +533,29 @@ var Circle = function GLCircle() {
504 ctx.beginPath(); 533 ctx.beginPath();
505 ctx.lineWidth = lineWidth; 534 ctx.lineWidth = lineWidth;
506 if (this._strokeColor) { 535 if (this._strokeColor) {
507 var c = "rgba(" + 255*this._strokeColor[0] + "," + 255*this._strokeColor[1] + "," + 255*this._strokeColor[2] + "," + this._strokeColor[3] + ")"; 536 if(this._strokeColor.gradientMode) {
508 ctx.strokeStyle = c; 537 if(this._strokeColor.gradientMode === "radial") {
509 538 gradient = ctx.createRadialGradient(xCtr, yCtr, Math.min(xScale, yScale),
539 xCtr, yCtr, 0.5*Math.max(this._height, this._width));
540 } else {
541 gradient = ctx.createLinearGradient(0, this._height/2, this._width, this._height/2);
542 }
543 colors = this._strokeColor.color;
544
545 len = colors.length;
546
547 for(j=0; j<len; j++) {
548 position = colors[j].position/100;
549 cs = colors[j].value;
550 gradient.addColorStop(position, "rgba(" + cs.r + "," + cs.g + "," + cs.b + "," + cs.a + ")");
551 }
552
553 ctx.strokeStyle = gradient;
554
555 } else {
556 c = "rgba(" + 255*this._strokeColor[0] + "," + 255*this._strokeColor[1] + "," + 255*this._strokeColor[2] + "," + this._strokeColor[3] + ")";
557 ctx.strokeStyle = c;
558 }
510 // draw the stroke 559 // draw the stroke
511 p = MathUtils.transformPoint( bezPts[0], mat ); 560 p = MathUtils.transformPoint( bezPts[0], mat );
512 ctx.moveTo( p[0], p[1] ); 561 ctx.moveTo( p[0], p[1] );
@@ -559,8 +608,20 @@ var Circle = function GLCircle() {
559 rtnStr += "strokeWidth: " + this._strokeWidth + "\n"; 608 rtnStr += "strokeWidth: " + this._strokeWidth + "\n";
560 rtnStr += "innerRadius: " + this._innerRadius + "\n"; 609 rtnStr += "innerRadius: " + this._innerRadius + "\n";
561 rtnStr += "strokeStyle: " + this._strokeStyle + "\n"; 610 rtnStr += "strokeStyle: " + this._strokeStyle + "\n";
562 rtnStr += "strokeColor: " + String(this._strokeColor) + "\n"; 611
563 rtnStr += "fillColor: " + String(this._fillColor) + "\n"; 612 if(this._strokeColor.gradientMode) {
613 rtnStr += "strokeGradientMode: " + this._strokeColor.gradientMode + "\n";
614 rtnStr += "strokeColor: " + this.gradientToString(this._strokeColor.color) + "\n";
615 } else {
616 rtnStr += "strokeColor: " + String(this._strokeColor) + "\n";
617 }
618
619 if(this._fillColor.gradientMode) {
620 rtnStr += "fillGradientMode: " + this._fillColor.gradientMode + "\n";
621 rtnStr += "fillColor: " + this.gradientToString(this._fillColor.color) + "\n";
622 } else {
623 rtnStr += "fillColor: " + String(this._fillColor) + "\n";
624 }
564 625
565 rtnStr += "strokeMat: "; 626 rtnStr += "strokeMat: ";
566 if (this._strokeMaterial) { 627 if (this._strokeMaterial) {
@@ -577,9 +638,10 @@ var Circle = function GLCircle() {
577 } else { 638 } else {
578 rtnStr += "flatMaterial"; 639 rtnStr += "flatMaterial";
579 } 640 }
580
581 rtnStr += "\n"; 641 rtnStr += "\n";
582 642
643 rtnStr += this.exportMaterials();
644
583 return rtnStr; 645 return rtnStr;
584 }; 646 };
585 647
@@ -593,8 +655,22 @@ var Circle = function GLCircle() {
593 this._strokeStyle = this.getPropertyFromString( "strokeStyle: ", importStr ); 655 this._strokeStyle = this.getPropertyFromString( "strokeStyle: ", importStr );
594 var strokeMaterialName = this.getPropertyFromString( "strokeMat: ", importStr ); 656 var strokeMaterialName = this.getPropertyFromString( "strokeMat: ", importStr );
595 var fillMaterialName = this.getPropertyFromString( "fillMat: ", importStr ); 657 var fillMaterialName = this.getPropertyFromString( "fillMat: ", importStr );
596 this._fillColor = eval( "[" + this.getPropertyFromString( "fillColor: ", importStr ) + "]" ); 658 if(importStr.indexOf("fillGradientMode: ") < 0) {
597 this._strokeColor = eval( "[" + this.getPropertyFromString( "strokeColor: ", importStr ) + "]" ); 659 this._fillColor = eval( "[" + this.getPropertyFromString( "fillColor: ", importStr ) + "]" );
660 } else {
661 this._fillColor = {};
662 this._fillColor.gradientMode = this.getPropertyFromString( "fillGradientMode: ", importStr );
663 this._fillColor.color = this.stringToGradient(this.getPropertyFromString( "fillColor: ", importStr ));
664 }
665
666 if(importStr.indexOf("strokeGradientMode: ") < 0)
667 {
668 this._strokeColor = eval( "[" + this.getPropertyFromString( "strokeColor: ", importStr ) + "]" );
669 } else {
670 this._strokeColor = {};
671 this._strokeColor.gradientMode = this.getPropertyFromString( "strokeGradientMode: ", importStr );
672 this._strokeColor.color = this.stringToGradient(this.getPropertyFromString( "strokeColor: ", importStr ));
673 }
598 674
599 var strokeMat = MaterialsModel.getMaterial( strokeMaterialName ); 675 var strokeMat = MaterialsModel.getMaterial( strokeMaterialName );
600 if (!strokeMat) { 676 if (!strokeMat) {
@@ -609,8 +685,9 @@ var Circle = function GLCircle() {
609 console.log( "object material not found in library: " + fillMaterialName ); 685 console.log( "object material not found in library: " + fillMaterialName );
610 fillMat = MaterialsModel.exportFlatMaterial(); 686 fillMat = MaterialsModel.exportFlatMaterial();
611 } 687 }
612
613 this._fillMaterial = fillMat; 688 this._fillMaterial = fillMat;
689
690 this.importMaterials( importStr );
614 }; 691 };
615 692
616 this.collidesWithPoint = function( x, y ) { 693 this.collidesWithPoint = function( x, y ) {