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.js428
1 files changed, 278 insertions, 150 deletions
</
diff --git a/js/controllers/elements/shapes-controller.js b/js/controllers/elements/shapes-controller.js
index c9164e3e..e9dde5fc 100755
--- a/js/controllers/elements/shapes-controller.js
+++ b/js/controllers/elements/shapes-controller.js
@@ -13,12 +13,71 @@ 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
78 this.application.ninja.elementMediator.setProperties([{element:el, properties:{left: l + "px", top: t + "px", width: w + "px", height:h + "px"}}], eventType, source);
79
80 }
22 el.elementModel.shapeModel.GLGeomObj.setStrokeWidth(val); 81 el.elementModel.shapeModel.GLGeomObj.setStrokeWidth(val);
23 el.elementModel.shapeModel.GLGeomObj.buildBuffers(); 82 el.elementModel.shapeModel.GLGeomObj.buildBuffers();
24 el.elementModel.shapeModel.GLWorld.render(); 83 el.elementModel.shapeModel.GLWorld.render();
@@ -68,43 +127,47 @@ exports.ShapesController = Montage.create(CanvasController, {
68 el.elementModel.shapeModel.GLWorld.render(); 127 el.elementModel.shapeModel.GLWorld.render();
69 break; 128 break;
70 case "useWebGl": 129 case "useWebGl":
71 var canvas = njModule.NJUtils.makeNJElement("canvas", "Canvas", "shape", el.className, true); 130 canvas = njModule.NJUtils.makeNJElement("canvas", "Canvas", "shape", el.className, true);
72 canvas.setAttribute("data-RDGE-id", njModule.NJUtils.generateRandom()); 131 canvas.setAttribute("data-RDGE-id", njModule.NJUtils.generateRandom());
73 canvas.width = el.width; 132 canvas.width = el.width;
74 canvas.height = el.height; 133 canvas.height = el.height;
75 canvas.elementModel = el.elementModel; 134 canvas.elementModel = el.elementModel;
76 this.application.ninja.currentDocument.documentRoot.replaceChild(canvas, el); 135 this.toggleWebGlMode(canvas, value);
77 NJevent("elementsRemoved", el); 136 this.application.ninja.elementMediator.replaceElement(canvas, el);
78 el = canvas; 137 break;
79 this.toggleWebGlMode(el, value);
80 el.elementModel.shapeModel.GLWorld.render();
81 this.application.ninja.selectionController.selectElement(el);
82 return;
83 case "strokeMaterial": 138 case "strokeMaterial":
84 var sm = Object.create(MaterialsModel.getMaterial(value)); 139 m = Object.create(MaterialsModel.getMaterial(value));
85 if(sm) 140 if(m)
86 { 141 {
87 el.elementModel.shapeModel.GLGeomObj.setStrokeMaterial(sm); 142 el.elementModel.shapeModel.GLGeomObj.setStrokeMaterial(m);
88 el.elementModel.shapeModel.strokeMaterial = sm; 143 color = this.getMaterialColor(value);
144 if(color)
145 {
146 el.elementModel.shapeModel.GLGeomObj.setStrokeColor(color);
147 }
89 el.elementModel.shapeModel.GLGeomObj.buildBuffers(); 148 el.elementModel.shapeModel.GLGeomObj.buildBuffers();
90 el.elementModel.shapeModel.GLWorld.render(); 149 el.elementModel.shapeModel.GLWorld.render();
91 } 150 }
92 break; 151 break;
93 case "fillMaterial": 152 case "fillMaterial":
94 var fm = Object.create(MaterialsModel.getMaterial(value)); 153 m = Object.create(MaterialsModel.getMaterial(value));
95 if(fm) 154 if(m)
96 { 155 {
97 el.elementModel.shapeModel.GLGeomObj.setFillMaterial(fm); 156 el.elementModel.shapeModel.GLGeomObj.setFillMaterial(m);
98 el.elementModel.shapeModel.fillMaterial = fm; 157 color = this.getMaterialColor(value);
158 if(color)
159 {
160 el.elementModel.shapeModel.GLGeomObj.setFillColor(color);
161 }
99 el.elementModel.shapeModel.GLGeomObj.buildBuffers(); 162 el.elementModel.shapeModel.GLGeomObj.buildBuffers();
100 el.elementModel.shapeModel.GLWorld.render(); 163 el.elementModel.shapeModel.GLWorld.render();
101 } 164 }
102 break; 165 break;
103 case "editStrokeMaterial": 166 case "editStrokeMaterial":
104 NJevent("showMaterialPopup",{materialId : el.elementModel.shapeModel.strokeMaterial.getName()}); 167 NJevent("showMaterialPopup",{materialId : this.getProperty(el, "strokeMaterial")});
105 break; 168 break;
106 case "editFillMaterial": 169 case "editFillMaterial":
107 NJevent("showMaterialPopup",{materialId : el.elementModel.shapeModel.fillMaterial.getName()}); 170 NJevent("showMaterialPopup",{materialId : this.getProperty(el, "fillMaterial")});
108 break; 171 break;
109 case "animate": 172 case "animate":
110 if(value) 173 if(value)
@@ -148,6 +211,7 @@ exports.ShapesController = Montage.create(CanvasController, {
148 default: 211 default:
149 CanvasController.setProperty(el, p, value); 212 CanvasController.setProperty(el, p, value);
150 } 213 }
214 this.application.ninja.documentController.activeDocument.needsSave = true;
151 } 215 }
152 }, 216 },
153 217
@@ -160,11 +224,13 @@ exports.ShapesController = Montage.create(CanvasController, {
160 case "trRadius": 224 case "trRadius":
161 case "blRadius": 225 case "blRadius":
162 case "brRadius": 226 case "brRadius":
163 case "border":
164 case "background":
165 case "useWebGl": 227 case "useWebGl":
166 case "animate": 228 case "animate":
167 return this.getShapeProperty(el, p); 229 return this.getShapeProperty(el, p);
230 case "border":
231 return this.getColor(el, false);
232 case "background":
233 return this.getColor(el, true);
168 case "strokeHardness": 234 case "strokeHardness":
169 if (el.elementModel && el.elementModel.shapeModel){ 235 if (el.elementModel && el.elementModel.shapeModel){
170 return el.elementModel.shapeModel.GLGeomObj.getStrokeHardness(); 236 return el.elementModel.shapeModel.GLGeomObj.getStrokeHardness();
@@ -203,11 +269,20 @@ exports.ShapesController = Montage.create(CanvasController, {
203 269
204 270
205 case "strokeMaterial": 271 case "strokeMaterial":
272 var sm = el.elementModel.shapeModel.GLGeomObj.getStrokeMaterial();
273 if(sm)
274 {
275 return sm.getName();
276 }
277 else
278 {
279 return "FlatMaterial";
280 }
206 case "fillMaterial": 281 case "fillMaterial":
207 var m = this.getShapeProperty(el, p); 282 var fm = el.elementModel.shapeModel.GLGeomObj.getFillMaterial();
208 if(m) 283 if(fm)
209 { 284 {
210 return this.getShapeProperty(el, p).getName(); 285 return fm.getName();