diff options
Diffstat (limited to 'js/controllers/elements')
-rwxr-xr-x | js/controllers/elements/canvas-controller.js | 8 | ||||
-rwxr-xr-x | js/controllers/elements/element-controller.js | 112 | ||||
-rwxr-xr-x | js/controllers/elements/shapes-controller.js | 9 | ||||
-rwxr-xr-x | js/controllers/elements/stage-controller.js | 58 |
4 files changed, 65 insertions, 122 deletions
diff --git a/js/controllers/elements/canvas-controller.js b/js/controllers/elements/canvas-controller.js index b5df3911..7af7e824 100755 --- a/js/controllers/elements/canvas-controller.js +++ b/js/controllers/elements/canvas-controller.js | |||
@@ -33,13 +33,5 @@ exports.CanvasController = Montage.create(ElementController, { | |||
33 | ElementController.setProperty(el, p, value); | 33 | ElementController.setProperty(el, p, value); |
34 | } | 34 | } |
35 | } | 35 | } |
36 | }, | ||
37 | |||
38 | setProperties: { | ||
39 | value: function(el, props, index) { | ||
40 | for(var p in props) { | ||
41 | el.elementModel.controller.setProperty(el, p, props[p][index]); | ||
42 | } | ||
43 | } | ||
44 | } | 36 | } |
45 | }); \ No newline at end of file | 37 | }); \ No newline at end of file |
diff --git a/js/controllers/elements/element-controller.js b/js/controllers/elements/element-controller.js index 2ac84452..35a543ac 100755 --- a/js/controllers/elements/element-controller.js +++ b/js/controllers/elements/element-controller.js | |||
@@ -47,10 +47,10 @@ exports.ElementController = Montage.create(Component, { | |||
47 | }, | 47 | }, |
48 | 48 | ||
49 | setProperties: { | 49 | setProperties: { |
50 | value: function(el, props, index) { | 50 | value: function(element, properties) { |
51 | for(var p in props) { | 51 | for(var property in properties) { |
52 | this.application.ninja.stylesController.setElementStyle(el, p, props[p][index]); | 52 | this.application.ninja.stylesController.setElementStyle(element, property, properties[property]); |
53 | } | 53 | } |
54 | } | 54 | } |
55 | }, | 55 | }, |
56 | 56 | ||
@@ -65,37 +65,29 @@ exports.ElementController = Montage.create(Component, { | |||
65 | // borderSide : "top", "right", "bottom", or "left" | 65 | // borderSide : "top", "right", "bottom", or "left" |
66 | getColor: { | 66 | getColor: { |
67 | value: function(el, isFill, borderSide) { | 67 | value: function(el, isFill, borderSide) { |
68 | var colorObj, | 68 | var colorObj, color, image; |
69 | color, | ||
70 | image; | ||
71 | 69 | ||
72 | // Return cached value if one exists | 70 | // Return cached value if one exists |
73 | if(isFill) | 71 | if(isFill) { |
74 | { | 72 | if(el.elementModel.fill) { |
75 | if(el.elementModel.fill) | ||
76 | { | ||
77 | return el.elementModel.fill; | 73 | return el.elementModel.fill; |
78 | } | 74 | } |
79 | //TODO: Once logic for color and gradient is established, this needs to be revised | 75 | //TODO: Once logic for color and gradient is established, this needs to be revised |
80 | color = this.getProperty(el, "background-color"); | 76 | color = this.getProperty(el, "background-color"); |
81 | image = this.getProperty(el, "background-image"); | 77 | image = this.getProperty(el, "background-image"); |
82 | } | 78 | } else { |
83 | else | ||
84 | { | ||
85 | // Try getting border color from specific side first | 79 | // Try getting border color from specific side first |
86 | if(borderSide) | 80 | if(borderSide) { |
87 | { | ||
88 | color = this.getProperty(el, "border-" + borderSide + "-color"); | 81 | color = this.getProperty(el, "border-" + borderSide + "-color"); |
89 | image = this.getProperty(el, "border-" + borderSide + "-image"); | 82 | image = this.getProperty(el, "border-" + borderSide + "-image"); |
90 | } | 83 | } |
91 | 84 | ||
92 | // If no color was found, look up the shared border color | 85 | // If no color was found, look up the shared border color |
93 | if(!color && !image) | 86 | if(!color && !image) { |
94 | { | 87 | if(el.elementModel.stroke) { |
95 | if(el.elementModel.stroke) | ||
96 | { | ||
97 | return el.elementModel.stroke; | 88 | return el.elementModel.stroke; |
98 | } | 89 | } |
90 | |||
99 | color = this.getProperty(el, "border-color"); | 91 | color = this.getProperty(el, "border-color"); |
100 | image = this.getProperty(el, "border-image"); | 92 | image = this.getProperty(el, "border-image"); |
101 | } | 93 | } |
@@ -112,17 +104,12 @@ exports.ElementController = Montage.create(Component, { | |||
112 | } | 104 | } |
113 | 105 | ||
114 | // Update cache | 106 | // Update cache |
115 | if(isFill) | 107 | if(isFill) { |
116 | { | ||
117 | el.elementModel.fill = colorObj; | 108 | el.elementModel.fill = colorObj; |
118 | } | 109 | } else if(!borderSide) { |
119 | else if(!borderSide) | ||
120 | { | ||
121 | // TODO - Need to update border style and width also | 110 | // TODO - Need to update border style and width also |
122 | el.elementModel.stroke = colorObj; | 111 | el.elementModel.stroke = colorObj; |
123 | } | 112 | } else { |
124 | else | ||
125 | { | ||
126 | // TODO - Should update specific border sides too | 113 | // TODO - Should update specific border sides too |
127 | } | 114 | } |
128 | 115 | ||
@@ -133,10 +120,9 @@ exports.ElementController = Montage.create(Component, { | |||
133 | setColor: { | 120 | setColor: { |
134 | value: function(el, color, isFill) { | 121 | value: function(el, color, isFill) { |
135 | var mode = color.mode; | 122 | var mode = color.mode; |
136 | if(isFill) | 123 | |
137 | { | 124 | if(isFill) { |
138 | if(mode) | 125 | if(mode) { |
139 | { | ||
140 | switch (mode) { | 126 | switch (mode) { |
141 | case 'nocolor': | 127 | case 'nocolor': |
142 | this.setProperty(el, "background-image", "none"); | 128 | this.setProperty(el, "background-image", "none"); |
@@ -152,12 +138,10 @@ exports.ElementController = Montage.create(Component, { | |||
152 | this.setProperty(el, "background-color", color.color.css); | 138 | this.setProperty(el, "background-color", color.color.css); |
153 | } | 139 | } |
154 | } | 140 | } |
141 | |||
155 | el.elementModel.fill = color; | 142 | el.elementModel.fill = color; |
156 | } | 143 | } else { |
157 | else | 144 | if(mode) { |
158 | { | ||
159 | if(mode) | ||
160 | { | ||
161 | switch (mode) { | 145 | switch (mode) { |
162 | case 'nocolor': | 146 | case 'nocolor': |
163 | this.setProperty(el, "border-image", "none"); | 147 | this.setProperty(el, "border-image", "none"); |
@@ -167,20 +151,16 @@ exports.ElementController = Montage.create(Component, { | |||
167 | case 'gradient': | 151 | case 'gradient': |
168 | this.setProperty(el, "border-image", color.color.css); | 152 | this.setProperty(el, "border-image", color.color.css); |
169 | this.setProperty(el, "border-color", "none"); | 153 | this.setProperty(el, "border-color", "none"); |
170 | if(color.borderInfo) | 154 | if(color.borderInfo) { |
171 | { | 155 | this.setProperty(el, "border-width", color.borderInfo.borderWidth + color.borderInfo.borderUnits); |
172 | this.setProperty(el, "border-width", color.borderInfo.borderWidth + | ||
173 | color.borderInfo.borderUnits); | ||
174 | this.setProperty(el, "border-style", color.borderInfo.borderStyle); | 156 | this.setProperty(el, "border-style", color.borderInfo.borderStyle); |
175 | } | 157 | } |
176 | break; | 158 | break; |
177 | default: | 159 | default: |
178 | this.setProperty(el, "border-image", "none"); | 160 | this.setProperty(el, "border-image", "none"); |
179 | this.setProperty(el, "border-color", color.color.css); | 161 | this.setProperty(el, "border-color", color.color.css); |
180 | if(color.borderInfo) | 162 | if(color.borderInfo) { |
181 | { | 163 | this.setProperty(el, "border-width", color.borderInfo.borderWidth + color.borderInfo.borderUnits); |
182 | this.setProperty(el, "border-width", color.borderInfo.borderWidth + | ||
183 | color.borderInfo.borderUnits); | ||
184 | this.setProperty(el, "border-style", color.borderInfo.borderStyle); | 164 | this.setProperty(el, "border-style", color.borderInfo.borderStyle); |
185 | } | 165 | } |
186 | } | 166 | } |
@@ -209,8 +189,7 @@ exports.ElementController = Montage.create(Component, { | |||
209 | // Routines to get/set 3D properties | 189 | // Routines to get/set 3D properties |
210 | get3DProperty: { | 190 | get3DProperty: { |
211 | value: function(el, prop) { | 191 | value: function(el, prop) { |
212 | if(el.elementModel && el.elementModel.props3D) | 192 | if(el.elementModel && el.elementModel.props3D) { |
213 | { | ||
214 | return el.elementModel.props3D[prop]; | 193 | return el.elementModel.props3D[prop]; |
215 | } | 194 | } |
216 | } | 195 | } |
@@ -218,16 +197,12 @@ exports.ElementController = Montage.create(Component, { | |||
218 | 197 | ||
219 | getMatrix: { | 198 | getMatrix: { |
220 | value: function(el) { | 199 | value: function(el) { |
221 | if(el.elementModel && el.elementModel.props3D && el.elementModel.props3D.matrix3d) | 200 | if(el.elementModel && el.elementModel.props3D && el.elementModel.props3D.matrix3d) { |
222 | { | ||
223 | return el.elementModel.props3D.matrix3d.slice(0); | 201 | return el.elementModel.props3D.matrix3d.slice(0); |
224 | } | 202 | } else { |
225 | else | ||
226 | { | ||
227 | var mat; | 203 | var mat; |
228 | 204 | ||
229 | if (el) | 205 | if (el) { |
230 | { | ||
231 | mat = this.application.ninja.stylesController.getMatrixFromElement(el, false); | 206 | mat = this.application.ninja.stylesController.getMatrixFromElement(el, false); |
232 | if (!mat) { | 207 | if (!mat) { |
233 | mat = Matrix.I(4); | 208 | mat = Matrix.I(4); |
@@ -242,12 +217,9 @@ exports.ElementController = Montage.create(Component, { | |||
242 | 217 | ||