diff options
author | Nivesh Rajbhandari | 2012-04-16 16:06:24 -0700 |
---|---|---|
committer | Nivesh Rajbhandari | 2012-04-16 16:06:24 -0700 |
commit | c253192a08b499ea7be46fa5438d273e51f7ec5a (patch) | |
tree | 18a1f0e3679c0eb993a9dedb537035d3861f49ac /js/controllers/elements | |
parent | e19376c54eedd1f1c457ba405b2f110be376a559 (diff) | |
parent | 4b900ea5cd6bb77eb30cec8c03b9ec9fa662c1e9 (diff) | |
download | ninja-c253192a08b499ea7be46fa5438d273e51f7ec5a.tar.gz |
Merge branch 'refs/heads/ninja-internal' into WebGLFixes
Diffstat (limited to 'js/controllers/elements')
-rwxr-xr-x | js/controllers/elements/component-controller.js | 15 | ||||
-rwxr-xr-x | js/controllers/elements/element-controller.js | 115 | ||||
-rwxr-xr-x | js/controllers/elements/shapes-controller.js | 502 | ||||
-rwxr-xr-x | js/controllers/elements/stage-controller.js | 69 |
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 | ||
7 | var Montage = require("montage/core/core").Montage, | 7 | var Montage = require("montage/core/core").Montage, |
8 | NJComponent = require("js/lib/nj-base").NJComponent; | 8 | Component = require("montage/ui/component").Component; |
9 | 9 | ||
10 | var ElementController = exports.ElementController = Montage.create(NJComponent, { | 10 | exports.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", |