aboutsummaryrefslogtreecommitdiff
path: root/js
diff options
context:
space:
mode:
Diffstat (limited to 'js')
-rwxr-xr-xjs/controllers/elements/shapes-controller.js135
-rwxr-xr-xjs/tools/LineTool.js2
-rwxr-xr-xjs/tools/OvalTool.js4
-rwxr-xr-xjs/tools/RectTool.js4
-rwxr-xr-xjs/tools/ShapeTool.js27
5 files changed, 87 insertions, 85 deletions
diff --git a/js/controllers/elements/shapes-controller.js b/js/controllers/elements/shapes-controller.js
index 5d3cf060..a6859361 100755
--- a/js/controllers/elements/shapes-controller.js
+++ b/js/controllers/elements/shapes-controller.js
@@ -14,7 +14,10 @@ exports.ShapesController = Montage.create(CanvasController, {
14 14
15 setProperty: { 15 setProperty: {
16 value: function(el, p, value) { 16 value: function(el, p, value) {
17 var val = parseInt(value); 17 var val = parseInt(value),
18 canvas,
19 m,
20 color;
18 switch(p) { 21 switch(p) {
19 case "strokeSize": 22 case "strokeSize":
20 // TODO - For now, just handling px units. 23 // TODO - For now, just handling px units.
@@ -68,32 +71,39 @@ exports.ShapesController = Montage.create(CanvasController, {
68 el.elementModel.shapeModel.GLWorld.render(); 71 el.elementModel.shapeModel.GLWorld.render();
69 break; 72 break;
70 case "useWebGl": 73 case "useWebGl":
71 var canvas = njModule.NJUtils.makeNJElement("canvas", "Canvas", "shape", el.className, true); 74 canvas = njModule.NJUtils.makeNJElement("canvas", "Canvas", "shape", el.className, true);
72 canvas.setAttribute("data-RDGE-id", njModule.NJUtils.generateRandom()); 75 canvas.setAttribute("data-RDGE-id", njModule.NJUtils.generateRandom());
73 canvas.width = el.width; 76 canvas.width = el.width;
74 canvas.height = el.height; 77 canvas.height = el.height;
75 this.application.ninja.elementMediator.replaceElement(el, canvas); 78 this.application.ninja.elementMediator.replaceElement(el, canvas);
76 NJevent("elementDeleted", el); 79 NJevent("elementDeleted", el);
77 el = canvas; 80 this.toggleWebGlMode(canvas, value);
78 this.toggleWebGlMode(el, value); 81 NJevent("elementAdded", canvas);
79 el.elementModel.shapeModel.GLWorld.render(); 82 break;
80 this.application.ninja.selectionController.selectElement(el);
81 this.application.ninja.documentController.activeDocument.needsSave = true;
82 return;
83 case "strokeMaterial": 83 case "strokeMaterial":
84 var sm = Object.create(MaterialsModel.getMaterial(value)); 84 m = Object.create(MaterialsModel.getMaterial(value));
85 if(sm) 85 if(m)
86 { 86 {
87 el.elementModel.shapeModel.GLGeomObj.setStrokeMaterial(sm); 87 el.elementModel.shapeModel.GLGeomObj.setStrokeMaterial(m);
88 color = this.getMaterialColor(value);
89 if(color)
90 {
91 el.elementModel.shapeModel.GLGeomObj.setStrokeColor(color);
92 }
88 el.elementModel.shapeModel.GLGeomObj.buildBuffers(); 93 el.elementModel.shapeModel.GLGeomObj.buildBuffers();
89 el.elementModel.shapeModel.GLWorld.render(); 94 el.elementModel.shapeModel.GLWorld.render();
90 } 95 }
91 break; 96 break;
92 case "fillMaterial": 97 case "fillMaterial":
93 var fm = Object.create(MaterialsModel.getMaterial(value)); 98 m = Object.create(MaterialsModel.getMaterial(value));
94 if(fm) 99 if(m)
95 { 100 {
96 el.elementModel.shapeModel.GLGeomObj.setFillMaterial(fm); 101 el.elementModel.shapeModel.GLGeomObj.setFillMaterial(m);
102 color = this.getMaterialColor(value);
103 if(color)
104 {
105 el.elementModel.shapeModel.GLGeomObj.setFillColor(color);
106 }
97 el.elementModel.shapeModel.GLGeomObj.buildBuffers(); 107 el.elementModel.shapeModel.GLGeomObj.buildBuffers();
98 el.elementModel.shapeModel.GLWorld.render(); 108 el.elementModel.shapeModel.GLWorld.render();
99 } 109 }
@@ -621,64 +631,83 @@ exports.ShapesController = Montage.create(CanvasController, {
621 631
622 if(jObj.webGL) 632 if(jObj.webGL)
623 { 633 {
624 // Set Linear/Radial Gradient Material for children geometry if color in canvas 2d has gradient 634 if(child.strokeColor)
625 if(child.strokeColor && child.strokeColor.gradientMode)
626 { 635 {
627 if(child.strokeColor.gradientMode === "radial") 636 if(child.strokeColor.gradientMode)
628 { 637 {
629 child.strokeMat = "RadialGradientMaterial"; 638 // Set Linear/Radial Gradient Material for children geometry if color in canvas 2d has gradient
630 } 639 if(child.strokeColor.gradientMode === "radial")
631 else 640 {
641 child.strokeMat = "RadialGradientMaterial";
642 }
643 else
644 {
645 child.strokeMat = "LinearGradientMaterial";
646 }
647 }
648 else if( (child.strokeMat === "RadialGradientMaterial") ||
649 (child.strokeMat === "LinearGradientMaterial") )
632 { 650 {
633 child.strokeMat = "LinearGradientMaterial"; 651 // Set Flat Material for children geometry if color has been changed to solid
652 child.strokeMat = "FlatMaterial";
634 } 653 }
635 } 654 }
636 655
637 if(child.fillColor && child.fillColor.gradientMode) 656 if(child.fillColor)
638 { 657 {
639 if(child.fillColor.gradientMode === "radial") 658 if(child.fillColor.gradientMode)
640 { 659 {
641 child.fillMat = "RadialGradientMaterial"; 660 // Set Linear/Radial Gradient Material for children geometry if color in canvas 2d has gradient
661 if(child.fillColor.gradientMode === "radial")
662 {
663 child.fillMat = "RadialGradientMaterial";
664 }
665 else
666 {
667 child.fillMat = "LinearGradientMaterial";
668 }
642 } 669 }
643 else 670 else if( (child.fillMat === "RadialGradientMaterial") ||
671 (child.fillMat === "LinearGradientMaterial") )
644 { 672 {
645 child.fillMat = "LinearGradientMaterial"; 673 // Set Flat Material for children geometry if color has been changed to solid
674 child.fillMat = "FlatMaterial";
646 } 675 }
647 } 676 }
648 } 677 }
649// else
650// {
651// // Set flat color for children geometry if color in WebGL has been changed to solid
652// if(child.strokeColor && !child.strokeColor.gradientMode)
653// {
654// if(child.strokeColor.gradientMode === "radial")
655// {
656// child.strokeMat = "RadialGradientMaterial";
657// }
658// else
659// {
660// child.strokeMat = "LinearGradientMaterial";
661// }
662// }
663//
664// if(child.fillColor && child.fillColor.gradientMode)
665// {
666// if(child.fillColor.gradientMode === "radial")
667// {
668// child.fillMat = "RadialGradientMaterial";
669// }
670// else
671// {
672// child.fillMat = "LinearGradientMaterial";
673// }
674// }
675// }
676 } 678 }
677 } 679 }
678 } 680 }
679 681
680 return jObj; 682 return jObj;
681 } 683 }
684 },
685
686 getMaterialColor: {
687 value: function(m)
688 {
689 var css,
690 colorObj;
691 if(m === "LinearGradientMaterial")
692 {
693 css = "-webkit-gradient(linear, left top, right top, from(rgb(255, 0, 0)), color-stop(0.3, rgb(0, 255, 0)), color-stop(0.6, rgb(0, 0, 255)), to(rgb(0, 255, 255)))";
694 }
695 else if(m === "RadialGradientMaterial")
696 {
697 css = "-webkit-radial-gradient(50% 50%, ellipse cover, rgb(255, 0, 0) 0%, rgb(0, 255, 0) 30%, rgb(0, 0, 255) 60%, rgb(0, 255, 255) 100%)";
698 }
699
700 if(css)
701 {
702 colorObj = this.application.ninja.colorController.getColorObjFromCss(css);
703 if(colorObj)
704 {
705 return {gradientMode:colorObj.color.gradientMode, color:colorObj.color.stops};
706 }
707 }
708
709 return null;
710 }
682 } 711 }
683 712
684}); 713});
diff --git a/js/tools/LineTool.js b/js/tools/LineTool.js
index 499a6b9d..9b22c629 100755
--- a/js/tools/LineTool.js
+++ b/js/tools/LineTool.js
@@ -216,7 +216,7 @@ exports.LineTool = Montage.create(ShapeTool, {
216 {