diff options
Diffstat (limited to 'js/controllers/elements')
-rwxr-xr-x | js/controllers/elements/component-controller.js | 13 | ||||
-rwxr-xr-x | js/controllers/elements/element-controller.js | 65 | ||||
-rwxr-xr-x | js/controllers/elements/shapes-controller.js | 262 | ||||
-rwxr-xr-x | js/controllers/elements/stage-controller.js | 41 |
4 files changed, 314 insertions, 67 deletions
diff --git a/js/controllers/elements/component-controller.js b/js/controllers/elements/component-controller.js index 83450d0f..260ee8a0 100755 --- a/js/controllers/elements/component-controller.js +++ b/js/controllers/elements/component-controller.js | |||
@@ -11,6 +11,8 @@ 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,18 +21,20 @@ exports.ComponentController = Montage.create(ElementController, { | |||
19 | case "width": | 21 | case "width": |
20 | case "height": | 22 | case "height": |
21 | if(el.nodeName === "IMG" && (prop === "width" || prop === "height")) { | 23 | if(el.nodeName === "IMG" && (prop === "width" || prop === "height")) { |
22 | return this.application.ninja.currentDocument.getComponentFromElement(el)[prop]; | 24 | return component[prop]; |
23 | } else { | 25 | } else { |
24 | return ElementController.getProperty(el, prop, true); | 26 | return ElementController.getProperty(el, prop, true); |
25 | } | 27 | } |
26 | default: | 28 | default: |
27 | return this.application.ninja.currentDocument.getComponentFromElement(el)[prop]; | 29 | return component[prop]; |
28 | } | 30 | } |
29 | } | 31 | } |
30 | }, | 32 | }, |
31 | 33 | ||
32 | setProperty: { | 34 | setProperty: { |
33 | value: function(el, p, value) { | 35 | value: function(el, p, value) { |
36 | var component = el.controller || this.application.ninja.currentDocument.getComponentFromElement(el); | ||
37 | |||
34 | switch(p) { | 38 | switch(p) { |
35 | case "id": | 39 | case "id": |
36 | case "class": | 40 | case "class": |
@@ -39,15 +43,14 @@ exports.ComponentController = Montage.create(ElementController, { | |||
39 | case "width": | 43 | case "width": |
40 | case "height": | 44 | case "height": |
41 | if(el.nodeName === "IMG" && (p === "width" || p === "height")) { | 45 | if(el.nodeName === "IMG" && (p === "width" || p === "height")) { |
42 | this.application.ninja.currentDocument.getComponentFromElement(el)[p] = value; | 46 | component[p] = value; |
43 | } else { | 47 | } else { |
44 | ElementController.setProperty(el, p, value); | 48 | ElementController.setProperty(el, p, value); |
45 | } | 49 | } |
46 | break; | 50 | break; |
47 | default: | 51 | default: |
48 | if(p === "min" || p === "max") value = parseFloat(value); | 52 | if(p === "min" || p === "max") value = parseFloat(value); |
49 | 53 | component[p] = value; | |
50 | this.application.ninja.currentDocument.getComponentFromElement(el)[p] = value; | ||
51 | break; | 54 | break; |
52 | 55 | ||
53 | } | 56 | } |
diff --git a/js/controllers/elements/element-controller.js b/js/controllers/elements/element-controller.js index ec0335b4..b35251ad 100755 --- a/js/controllers/elements/element-controller.js +++ b/js/controllers/elements/element-controller.js | |||
@@ -51,31 +51,15 @@ var ElementController = exports.ElementController = Montage.create(NJComponent, | |||
51 | 51 | ||
52 | setAttribute: { | 52 | setAttribute: { |
53 | value: function(el, att, value) { | 53 | 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); | 54 | el.setAttribute(att, value); |
72 | } | 55 | } |
73 | }, | 56 | }, |
74 | 57 | ||
75 | //-------------------------------------------------------------------------------------------------------- | 58 | //-------------------------------------------------------------------------------------------------------- |
76 | // Routines to get/set color properties | 59 | // Routines to get/set color properties |
60 | // borderSide : "top", "right", "bottom", or "left" | ||
77 | getColor: { | 61 | getColor: { |
78 | value: function(el, isFill) { | 62 | value: function(el, isFill, borderSide) { |
79 | var colorObj, | 63 | var colorObj, |
80 | color, | 64 | color, |
81 | image; | 65 | image; |
@@ -87,22 +71,29 @@ var ElementController = exports.ElementController = Montage.create(NJComponent, | |||
87 | { | 71 | { |
88 | return el.elementModel.fill; | 72 | return el.elementModel.fill; |
89 | } | 73 | } |
90 | // return this.application.ninja.stylesController.getElementStyle(el, "background-color"); | ||
91 | //TODO: Once logic for color and gradient is established, this needs to be revised | 74 | //TODO: Once logic for color and gradient is established, this needs to be revised |
92 | color = this.getProperty(el, "background-color"); | 75 | color = this.getProperty(el, "background-color"); |
93 | image = this.getProperty(el, "background-image"); | 76 | image = this.getProperty(el, "background-image"); |
94 | } | 77 | } |
95 | else | 78 | else |
96 | { | 79 | { |
97 | // TODO - Need to figure out which border side user wants | 80 | // Try getting border color from specific side first |
98 | if(el.elementModel.stroke) | 81 | if(borderSide) |
99 | { | 82 | { |
100 | return el.elementModel.stroke; | 83 | color = this.getProperty(el, "border-" + borderSide + "-color"); |
84 | image = this.getProperty(el, "border-" + borderSide + "-image"); | ||
85 | } | ||
86 | |||
87 | // If no color was found, look up the shared border color | ||
88 | if(!color && !image) | ||
89 | { | ||
90 | if(el.elementModel.stroke) | ||
91 | { | ||
92 | return el.elementModel.stroke; | ||
93 | } | ||
94 | color = this.getProperty(el, "border-color"); | ||
95 | image = this.getProperty(el, "border-image"); | ||
101 | } | 96 | } |
102 | // TODO - Need to figure out which border side user wants | ||
103 | // return this.application.ninja.stylesController.getElementStyle(el, "border-color"); | ||
104 | color = this.getProperty(el, "border-color"); | ||
105 | image = this.getProperty(el, "border-image"); | ||
106 | } | 97 | } |
107 | 98 | ||
108 | if(color || image) { | 99 | if(color || image) { |
@@ -120,11 +111,15 @@ var ElementController = exports.ElementController = Montage.create(NJComponent, | |||
120 | { | 111 | { |
121 | el.elementModel.fill = colorObj; | 112 | el.elementModel.fill = colorObj; |
122 | } | 113 | } |
123 | else | 114 | else if(!borderSide) |
124 | { | 115 | { |
125 | // TODO - Need to update border style and width also | 116 | // TODO - Need to update border style and width also |
126 | el.elementModel.stroke = colorObj; | 117 | el.elementModel.stroke = colorObj; |
127 | } | 118 | } |
119 | else | ||
120 | { | ||
121 | // TODO - Should update specific border sides too | ||
122 | } | ||
128 | 123 | ||
129 | return colorObj; | 124 | return colorObj; |
130 | } | 125 | } |
@@ -233,22 +228,6 @@ var ElementController = exports.ElementController = Montage.create(NJComponent, | |||
233 | mat = this.transformStringToMat( xformStr ); | 228 | mat = this.transformStringToMat( xformStr ); |
234 | if (!mat) | 229 | if (!mat) |
235 | mat = Matrix.I(4); | 230 | mat = Matrix.I(4); |
236 | |||
237 | var zoom = this.application.ninja.elementMediator.getProperty(el, "zoom"); | ||
238 | if (zoom) | ||
239 | { | ||
240 | zoom = Number(zoom); | ||
241 | if (zoom != 1) | ||
242 | { | ||
243 | var zoomMat = Matrix.create( [ | ||
244 | [ zoom, 0, 0, 0], | ||
245 | [ 0, zoom, 0, 0], | ||
246 | [ 0, 0, zoom, 0], | ||
247 | [ 0, 0, 0, 1] | ||
248 | ] ); | ||
249 | glmat4.multiply( zoomMat, mat, mat ); | ||
250 | } | ||
251 | } | ||
252 | } | 231 | } |
253 | 232 | ||
254 | el.elementModel.props3D.matrix3d = mat; | 233 | el.elementModel.props3D.matrix3d = mat; |
diff --git a/js/controllers/elements/shapes-controller.js b/js/controllers/elements/shapes-controller.js index 3423a5a7..ef453bea 100755 --- a/js/controllers/elements/shapes-controller.js +++ b/js/controllers/elements/shapes-controller.js | |||
@@ -6,10 +6,9 @@ No rights, expressed or implied, whatsoever to this software are provided by Mot | |||
6 | 6 | ||
7 | var Montage = require("montage/core/core").Montage, | 7 | var Montage = require("montage/core/core").Montage, |
8 | CanvasController = require("js/controllers/elements/canvas-controller").CanvasController, | 8 | CanvasController = require("js/controllers/elements/canvas-controller").CanvasController, |
9 | njModule = require("js/lib/NJUtils"); | 9 | njModule = require("js/lib/NJUtils"), |
10 | 10 | World = require("js/lib/drawing/world").World, | |