aboutsummaryrefslogtreecommitdiff
path: root/js/controllers/elements/shapes-controller.js
diff options
context:
space:
mode:
Diffstat (limited to 'js/controllers/elements/shapes-controller.js')
-rwxr-xr-xjs/controllers/elements/shapes-controller.js395
1 files changed, 259 insertions, 136 deletions
diff --git a/js/controllers/elements/shapes-controller.js b/js/controllers/elements/shapes-controller.js
index c9164e3e..14cdc473 100755
--- a/js/controllers/elements/shapes-controller.js
+++ b/js/controllers/elements/shapes-controller.js
@@ -13,12 +13,74 @@ var Montage = require("montage/core/core").Montage,
13exports.ShapesController = Montage.create(CanvasController, { 13exports.ShapesController = Montage.create(CanvasController, {
14 14
15 setProperty: { 15 setProperty: {
16 value: function(el, p, value) { 16 value: function(el, p, value, eventType, source) {
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.
21 this.setShapeProperty(el, "strokeSize", value); 24 this.setShapeProperty(el, "strokeSize", value);
25 // TODO - For now, just handle Line, Rectangle and Oval. Eventually, move this into each class's
26 // setStrokeWidth code like SubPath and BrushStroke do.
27 var geomType = el.elementModel.shapeModel.GLGeomObj.geomType();
28 if( (geomType > 0) && (geomType < 4) )
29 {
30 // Changing stroke size should grow/shrink the shape from the center.
31 var delta = ~~(val - el.elementModel.shapeModel.GLGeomObj.getStrokeWidth()),
32 l = this.application.ninja.elementMediator.getProperty(el, "left", parseInt),
33 t = this.application.ninja.elementMediator.getProperty(el, "top", parseInt),
34 w = this.application.ninja.elementMediator.getProperty(el, "width", parseInt),
35 h = this.application.ninja.elementMediator.getProperty(el, "height", parseInt);
36
37 if(geomType === 3)
38 {
39 var slope = el.elementModel.shapeModel.slope;
40 // set the dimensions
41 if(slope === "horizontal")
42 {
43 h = Math.max(val, 1);
44 t -= ~~(delta/2);
45 }
46 else if(slope === "vertical")
47 {
48 w = Math.max(val, 1);
49 l -= ~~(delta/2);
50 }
51 else
52 {
53 var oldXAdj = el.elementModel.shapeModel.GLGeomObj.getXAdj();
54 var oldYAdj = el.elementModel.shapeModel.GLGeomObj.getYAdj();
55 var theta = Math.atan(el.elementModel.shapeModel.slope);
56 var xAdj = Math.abs((val/2)*Math.sin(theta));
57 var yAdj = Math.abs((val/2)*Math.cos(theta));
58 var dX = ~~(xAdj*2 - oldXAdj*2);
59 var dY = ~~(yAdj*2 - oldYAdj*2);
60
61 l -= dX;
62 t -= dY;
63 w += dX*2;
64 h += dY*2;
65
66 el.elementModel.shapeModel.GLGeomObj.setXAdj(xAdj);
67 el.elementModel.shapeModel.GLGeomObj.setYAdj(yAdj);
68 }
69 }
70 else
71 {
72 l -= ~~(delta/2);
73 t -= ~~(delta/2);
74 w += delta;
75 h += delta;
76 }
77 this.application.ninja.elementMediator.setProperties([el],
78 { "left": [l + "px"],
79 "top": [t + "px"],
80 "width": [w + "px"],
81 "height": [h + "px"] },
82 eventType, source );
83 }
22 el.elementModel.shapeModel.GLGeomObj.setStrokeWidth(val); 84 el.elementModel.shapeModel.GLGeomObj.setStrokeWidth(val);
23 el.elementModel.shapeModel.GLGeomObj.buildBuffers(); 85 el.elementModel.shapeModel.GLGeomObj.buildBuffers();
24 el.elementModel.shapeModel.GLWorld.render(); 86 el.elementModel.shapeModel.GLWorld.render();
@@ -68,43 +130,47 @@ exports.ShapesController = Montage.create(CanvasController, {
68 el.elementModel.shapeModel.GLWorld.render(); 130 el.elementModel.shapeModel.GLWorld.render();
69 break; 131 break;
70 case "useWebGl": 132 case "useWebGl":
71 var canvas = njModule.NJUtils.makeNJElement("canvas", "Canvas", "shape", el.className, true); 133 canvas = njModule.NJUtils.makeNJElement("canvas", "Canvas", "shape", el.className, true);
72 canvas.setAttribute("data-RDGE-id", njModule.NJUtils.generateRandom()); 134 canvas.setAttribute("data-RDGE-id", njModule.NJUtils.generateRandom());
73 canvas.width = el.width; 135 canvas.width = el.width;
74 canvas.height = el.height; 136 canvas.height = el.height;
75 canvas.elementModel = el.elementModel; 137 canvas.elementModel = el.elementModel;
76 this.application.ninja.currentDocument.documentRoot.replaceChild(canvas, el); 138 this.toggleWebGlMode(canvas, value);
77 NJevent("elementsRemoved", el); 139 this.application.ninja.elementMediator.replaceElement(canvas, el);
78 el = canvas; 140 break;
79 this.toggleWebGlMode(el, value);
80 el.elementModel.shapeModel.GLWorld.render();
81 this.application.ninja.selectionController.selectElement(el);
82 return;
83 case "strokeMaterial": 141 case "strokeMaterial":
84 var sm = Object.create(MaterialsModel.getMaterial(value)); 142 m = Object.create(MaterialsModel.getMaterial(value));
85 if(sm) 143 if(m)
86 { 144 {
87 el.elementModel.shapeModel.GLGeomObj.setStrokeMaterial(sm); 145 el.elementModel.shapeModel.GLGeomObj.setStrokeMaterial(m);
88 el.elementModel.shapeModel.strokeMaterial = sm; 146 color = this.getMaterialColor(value);
147 if(color)
148 {
149 el.elementModel.shapeModel.GLGeomObj.setStrokeColor(color);
150 }
89 el.elementModel.shapeModel.GLGeomObj.buildBuffers(); 151 el.elementModel.shapeModel.GLGeomObj.buildBuffers();
90 el.elementModel.shapeModel.GLWorld.render(); 152 el.elementModel.shapeModel.GLWorld.render();
91 } 153 }
92 break; 154 break;
93 case "fillMaterial": 155 case "fillMaterial":
94 var fm = Object.create(MaterialsModel.getMaterial(value)); 156 m = Object.create(MaterialsModel.getMaterial(value));
95 if(fm) 157 if(m)
96 { 158 {
97 el.elementModel.shapeModel.GLGeomObj.setFillMaterial(fm); 159 el.elementModel.shapeModel.GLGeomObj.setFillMaterial(m);
98 el.elementModel.shapeModel.fillMaterial = fm; 160 color = this.getMaterialColor(value);
161 if(color)
162 {
163 el.elementModel.shapeModel.GLGeomObj.setFillColor(color);
164 }
99 el.elementModel.shapeModel.GLGeomObj.buildBuffers(); 165 el.elementModel.shapeModel.GLGeomObj.buildBuffers();
100 el.elementModel.shapeModel.GLWorld.render(); 166 el.elementModel.shapeModel.GLWorld.render();
101 } 167 }
102 break; 168 break;
103 case "editStrokeMaterial": 169 case "editStrokeMaterial":
104 NJevent("showMaterialPopup",{materialId : el.elementModel.shapeModel.strokeMaterial.getName()}); 170 NJevent("showMaterialPopup",{materialId : this.getProperty(el, "strokeMaterial")});
105 break; 171 break;
106 case "editFillMaterial": 172 case "editFillMaterial":
107 NJevent("showMaterialPopup",{materialId : el.elementModel.shapeModel.fillMaterial.getName()}); 173 NJevent("showMaterialPopup",{materialId : this.getProperty(el, "fillMaterial")});
108 break; 174 break;
109 case "animate": 175 case "animate":
110 if(value) 176 if(value)
@@ -148,6 +214,7 @@ exports.ShapesController = Montage.create(CanvasController, {
148 default: 214 default:
149 CanvasController.setProperty(el, p, value); 215 CanvasController.setProperty(el, p, value);
150 } 216 }
217 this.application.ninja.documentController.activeDocument.needsSave = true;
151 } 218 }
152 }, 219 },
153 220
@@ -160,11 +227,13 @@ exports.ShapesController = Montage.create(CanvasController, {
160 case "trRadius": 227 case "trRadius":
161 case "blRadius": 228 case "blRadius":
162 case "brRadius": 229 case "brRadius":
163 case "border":
164 case "background":
165 case "useWebGl": 230 case "useWebGl":
166 case "animate": 231 case "animate":
167 return this.getShapeProperty(el, p); 232 return this.getShapeProperty(el, p);
233 case "border":
234 return this.getColor(el, false);
235 case "background":
236 return this.getColor(el, true);
168 case "strokeHardness": 237 case "strokeHardness":
169 if (el.elementModel && el.elementModel.shapeModel){ 238 if (el.elementModel && el.elementModel.shapeModel){
170 return el.elementModel.shapeModel.GLGeomObj.getStrokeHardness(); 239 return el.elementModel.shapeModel.GLGeomObj.getStrokeHardness();
@@ -203,11 +272,20 @@ exports.ShapesController = Montage.create(CanvasController, {
203 272
204 273
205 case "strokeMaterial": 274 case "strokeMaterial":
275 var sm = el.elementModel.shapeModel.GLGeomObj.getStrokeMaterial();
276 if(sm)
277 {
278 return sm.getName();
279 }
280 else
281 {
282 return "FlatMaterial";
283 }
206 case "fillMaterial": 284 case "fillMaterial":
207 var m = this.getShapeProperty(el, p); 285 var fm = el.elementModel.shapeModel.GLGeomObj.getFillMaterial();
208 if(m)