aboutsummaryrefslogtreecommitdiff
path: root/js/controllers/elements
diff options
context:
space:
mode:
Diffstat (limited to 'js/controllers/elements')
-rwxr-xr-xjs/controllers/elements/component-controller.js15
-rwxr-xr-xjs/controllers/elements/element-controller.js115
-rwxr-xr-xjs/controllers/elements/shapes-controller.js502
-rwxr-xr-xjs/controllers/elements/stage-controller.js69
4 files changed, 466 insertions, 235 deletions
diff --git a/js/controllers/elements/component-controller.js b/js/controllers/elements/component-controller.js
index 83450d0f..d902e4a1 100755
--- a/js/controllers/elements/component-controller.js
+++ b/js/controllers/elements/component-controller.js
@@ -11,43 +11,48 @@ exports.ComponentController = Montage.create(ElementController, {
11 11
12 getProperty: { 12 getProperty: {
13 value: function(el, prop) { 13 value: function(el, prop) {
14 var component = el.controller || this.application.ninja.currentDocument.getComponentFromElement(el);
15
14 switch(prop) { 16 switch(prop) {
15 case "id": 17 case "id":
16 case "class": 18 case "class":
19 case "-webkit-transform-style":
17 case "left": 20 case "left":
18 case "top": 21 case "top":
19 case "width": 22 case "width":
20 case "height": 23 case "height":
21 if(el.nodeName === "IMG" && (prop === "width" || prop === "height")) { 24 if(el.nodeName === "IMG" && (prop === "width" || prop === "height")) {
22 return this.application.ninja.currentDocument.getComponentFromElement(el)[prop]; 25 return component[prop];
23 } else { 26 } else {
24 return ElementController.getProperty(el, prop, true); 27 return ElementController.getProperty(el, prop, true);
25 } 28 }
26 default: 29 default:
27 return this.application.ninja.currentDocument.getComponentFromElement(el)[prop]; 30 return component[prop];
28 } 31 }
29 } 32 }
30 }, 33 },
31 34
32 setProperty: { 35 setProperty: {
33 value: function(el, p, value) { 36 value: function(el, p, value) {
37 var component = el.controller || this.application.ninja.currentDocument.getComponentFromElement(el);
38
34 switch(p) { 39 switch(p) {
35 case "id": 40 case "id":
36 case "class": 41 case "class":
42 case "-webkit-transform-style":
37 case "left": 43 case "left":
38 case "top": 44 case "top":
39 case "width": 45 case "width":
40 case "height": 46 case "height":
41 if(el.nodeName === "IMG" && (p === "width" || p === "height")) { 47 if(el.nodeName === "IMG" && (p === "width" || p === "height")) {
42 this.application.ninja.currentDocument.getComponentFromElement(el)[p] = value; 48 component[p] = value;
43 } else { 49 } else {
44 ElementController.setProperty(el, p, value); 50 ElementController.setProperty(el, p, value);
45 } 51 }
46 break; 52 break;
47 default: 53 default:
48 if(p === "min" || p === "max") value = parseFloat(value); 54 if(p === "min" || p === "max") value = parseFloat(value);
49 55 component[p] = value;
50 this.application.ninja.currentDocument.getComponentFromElement(el)[p] = value;
51 break; 56 break;
52 57
53 } 58 }
diff --git a/js/controllers/elements/element-controller.js b/js/controllers/elements/element-controller.js
index 9f00604f..2ac84452 100755
--- a/js/controllers/elements/element-controller.js
+++ b/js/controllers/elements/element-controller.js
@@ -5,22 +5,27 @@ No rights, expressed or implied, whatsoever to this software are provided by Mot
5</copyright> */ 5</copyright> */
6 6
7var Montage = require("montage/core/core").Montage, 7var Montage = require("montage/core/core").Montage,
8 NJComponent = require("js/lib/nj-base").NJComponent; 8 Component = require("montage/ui/component").Component;
9 9
10var ElementController = exports.ElementController = Montage.create(NJComponent, { 10exports.ElementController = Montage.create(Component, {
11 11
12 addElement: { 12 addElement: {
13 value: function(el, styles) { 13 value: function(el, styles) {
14 this.application.ninja.currentDocument.documentRoot.appendChild(el); 14 this.application.ninja.currentDocument.documentRoot.appendChild(el);
15 // Nested elements - 15 // Nested elements - TODO make sure the CSS is correct before nesting elements
16 // TODO make sure the CSS is correct before nesting elements
17 // this.application.ninja.currentSelectedContainer.appendChild(el); 16 // this.application.ninja.currentSelectedContainer.appendChild(el);
18 this.application.ninja.stylesController.setElementStyles(el, styles); 17 if(styles) {
18 this.application.ninja.stylesController.setElementStyles(el, styles);
19 }
19 } 20 }
20 }, 21 },
21 22
23 // Remove the element from the DOM and clear the GLWord.
22 removeElement: { 24 removeElement: {
23 value: function(el) { 25 value: function(el) {
26 if(el.elementModel && el.elementModel.shapeModel && el.elementModel.shapeModel.GLWorld) {
27 el.elementModel.shapeModel.GLWorld.clearTree();
28 }
24 el.parentNode.removeChild(el); 29 el.parentNode.removeChild(el);
25 } 30 }
26 }, 31 },
@@ -51,23 +56,6 @@ var ElementController = exports.ElementController = Montage.create(NJComponent,
51 56
52 setAttribute: { 57 setAttribute: {
53 value: function(el, att, value) { 58 value: function(el, att, value) {
54 if(att === "id") {
55 if(value === "") {
56 el.setAttribute(att, value);
57 return;
58 }
59
60 // Then check if this is a valid id by the following spec: http://www.w3.org/TR/REC-html40/types.html#h-6.2
61 var regexID = /^([a-zA-Z])+([a-zA-Z0-9_\.\:\-])+/;
62 if(!regexID.test(value)) {
63 alert("Invalid ID");
64 return;
65 } else if (this.application.ninja.currentDocument._document.getElementById(value) !== null) {
66 alert("The following ID: " + value + " is already in Use");
67 }
68
69 }
70
71 el.setAttribute(att, value); 59 el.setAttribute(att, value);
72 } 60 }
73 }, 61 },
@@ -240,26 +228,9 @@ var ElementController = exports.ElementController = Montage.create(NJComponent,
240 228
241 if (el) 229 if (el)
242 { 230 {
243 var xformStr = this.application.ninja.elementMediator.getProperty(el, "-webkit-transform"); 231 mat = this.application.ninja.stylesController.getMatrixFromElement(el, false);
244 if (xformStr) 232 if (!mat) {
245 mat = this.transformStringToMat( xformStr );
246 if (!mat)
247 mat = Matrix.I(4); 233 mat = Matrix.I(4);
248
249 var zoom = this.application.ninja.elementMediator.getProperty(el, "zoom");
250 if (zoom)
251 {
252 zoom = Number(zoom);
253 if (zoom != 1)
254 {
255 var zoomMat = Matrix.create( [
256 [ zoom, 0, 0, 0],
257 [ 0, zoom, 0, 0],
258 [ 0, 0, zoom, 0],
259 [ 0, 0, 0, 1]
260 ] );
261 glmat4.multiply( zoomMat, mat, mat );
262 }
263 } 234 }
264 } 235 }
265 236
@@ -277,25 +248,7 @@ var ElementController = exports.ElementController = Montage.create(NJComponent,
277 } 248 }
278 else 249 else
279 { 250 {
280 var dist = 1400; 251 var dist = this.application.ninja.stylesController.getPerspectiveDistFromElement(el, false);
281
282 var str = this.getProperty(el, "-webkit-transform");
283 if (str)
284 {
285 var index1 = str.indexOf( "perspective(");
286 if (index1 >= 0)
287 {
288 index1 += 12; // do not include 'perspective('
289 var index2 = str.indexOf( ")", index1 );
290 if (index2 >= 0)
291 {
292 var substr = str.substr( index1, (index2-index1));
293 if (substr && (substr.length > 0))
294 dist = MathUtils.styleToNumber( substr );
295 }
296 }
297 }
298
299 el.elementModel.props3D.perspectiveDist = dist; 252 el.elementModel.props3D.perspectiveDist = dist;
300 return dist; 253 return dist;
301 } 254 }
@@ -309,9 +262,17 @@ var ElementController = exports.ElementController = Montage.create(NJComponent,
309 mat = props[index]["mat"]; 262 mat = props[index]["mat"];
310 this.application.ninja.stylesController.setElementStyle(el, 263 this.application.ninja.stylesController.setElementStyle(el,
311 "-webkit-transform", 264 "-webkit-transform",
312 "perspective(" + dist + ") " +
313 "matrix3d(" + MathUtils.scientificToDecimal(mat, 5) + ")"); 265 "matrix3d(" + MathUtils.scientificToDecimal(mat, 5) + ")");
314 266
267 this.application.ninja.stylesController.setElementStyle(el,