diff options
Diffstat (limited to 'js/controllers')
-rwxr-xr-x | js/controllers/elements/element-controller.js | 94 | ||||
-rwxr-xr-x | js/controllers/elements/shapes-controller.js | 101 |
2 files changed, 153 insertions, 42 deletions
diff --git a/js/controllers/elements/element-controller.js b/js/controllers/elements/element-controller.js index 01e132d7..941e05ba 100755 --- a/js/controllers/elements/element-controller.js +++ b/js/controllers/elements/element-controller.js | |||
@@ -5,7 +5,8 @@ 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 | Component = require("montage/ui/component").Component; | 8 | Component = require("montage/ui/component").Component, |
9 | njModule = require("js/lib/NJUtils"); | ||
9 | 10 | ||
10 | exports.ElementController = Montage.create(Component, { | 11 | exports.ElementController = Montage.create(Component, { |
11 | 12 | ||
@@ -162,28 +163,12 @@ exports.ElementController = Montage.create(Component, { | |||
162 | el.elementModel.stroke = null; | 163 | el.elementModel.stroke = null; |
163 | return; | 164 | return; |
164 | case 'gradient': | 165 | case 'gradient': |
165 | if(color.borderInfo) { | ||
166 | if(color.borderInfo.borderWidth) { | ||
167 | this.setProperty(el, "border-width", color.borderInfo.borderWidth + color.borderInfo.borderUnits); | ||
168 | } | ||
169 | if(color.borderInfo.borderStyle) { | ||
170 | this.setProperty(el, "border-style", color.borderInfo.borderStyle); | ||
171 | } | ||
172 | } | ||
173 | this.setGradientBorder(el, color.color.gradientMode, color.color.css); | 166 | this.setGradientBorder(el, color.color.gradientMode, color.color.css); |
174 | break; | 167 | break; |
175 | default: | 168 | default: |
176 | this.setProperty(el, "border-image", "none"); | 169 | this.setProperty(el, "border-image", "none"); |
177 | this.setProperty(el, "border-image-slice", ""); | 170 | this.setProperty(el, "border-image-slice", ""); |
178 | this.setProperty(el, "border-color", color.color.css); | 171 | this.setProperty(el, "border-color", color.color.css); |
179 | if(color.borderInfo) { | ||
180 | if(color.borderInfo.borderWidth) { | ||
181 | this.setProperty(el, "border-width", color.borderInfo.borderWidth + color.borderInfo.borderUnits); | ||
182 | } | ||
183 | if(color.borderInfo.borderStyle) { | ||
184 | this.setProperty(el, "border-style", color.borderInfo.borderStyle); | ||
185 | } | ||
186 | } | ||
187 | } | 172 | } |
188 | } | 173 | } |
189 | el.elementModel.stroke = color; | 174 | el.elementModel.stroke = color; |
@@ -211,20 +196,83 @@ exports.ElementController = Montage.create(Component, { | |||
211 | }, | 196 | }, |
212 | 197 | ||
213 | getStroke: { | 198 | getStroke: { |
214 | value: function(el) { | 199 | value: function(el, stroke) { |
215 | // TODO - Need to figure out which border side user wants | 200 | var strokeInfo = {}, |
216 | return this.application.ninja.stylesController.getElementStyle(el, "border"); | 201 | color, |
202 | borderWidth, | ||
203 | border; | ||
204 | if(stroke.colorInfo) { | ||
205 | strokeInfo.colorInfo = {}; | ||
206 | color = this.getColor(el, false); | ||
207 | if(color && color.color) { | ||
208 | strokeInfo.colorInfo.mode = color.mode; | ||
209 | strokeInfo.colorInfo.color = color.color; | ||
210 | } else { | ||
211 | strokeInfo.colorInfo.mode = "nocolor"; | ||
212 | strokeInfo.colorInfo.color = null; | ||
213 | } | ||
214 | } | ||
215 | if(stroke.borderInfo) { | ||
216 | // TODO - Need to figure out which border side user wants | ||
217 | strokeInfo.borderInfo = {}; | ||
218 | if(stroke.borderInfo.borderWidth) { | ||
219 | borderWidth = this.getProperty(el, "border-width"); | ||
220 | if(borderWidth) { | ||
221 | border = njModule.NJUtils.getValueAndUnits(borderWidth); | ||
222 | strokeInfo.borderInfo.borderWidth = border[0]; | ||
223 | strokeInfo.borderInfo.borderUnits = border[1]; | ||
224 | } | ||
225 | } | ||
226 | if(stroke.borderInfo.borderStyle) { | ||
227 | strokeInfo.borderInfo.borderStyle = this.getProperty(el, "border-style"); | ||
228 | } | ||
229 | } | ||
230 | return strokeInfo; | ||
217 | } | 231 | } |
218 | }, | 232 | }, |
219 | 233 | ||
220 | setStroke: { | 234 | setStroke: { |
221 | value: function(el, stroke) { | 235 | value: function(el, stroke) { |
222 | this.application.ninja.stylesController.setElementStyle(el, "border-width", stroke.borderWidth + stroke.borderUnits); | 236 | if(stroke.borderInfo) { |
223 | this.application.ninja.stylesController.setElementStyle(el, "border-style", stroke.borderStyle); | 237 | if(stroke.borderInfo.borderWidth) { |
224 | this.setColor(el, stroke.color, false); | 238 | this.application.ninja.stylesController.setElementStyle(el, "border-width", stroke.borderInfo.borderWidth + stroke.borderInfo.borderUnits); |
239 | } | ||
240 | if(stroke.borderInfo.borderStyle) { | ||
241 | this.application.ninja.stylesController.setElementStyle(el, "border-style", stroke.borderInfo.borderStyle); | ||
242 | } | ||
243 | } | ||
244 | if(stroke.colorInfo) { | ||
245 | this.setColor(el, stroke.colorInfo, false); | ||
246 | } | ||
225 | } | 247 | } |
226 | }, | 248 | }, |
227 | 249 | ||
250 | getFill: { | ||
251 | value: function(el, fill) { | ||
252 | var fillInfo = {}, | ||
253 | color; | ||
254 | if(fill.colorInfo) { | ||
255 | fillInfo.colorInfo = {}; | ||
256 | color = this.getColor(el, true); | ||
257 | if(color && color.color) { | ||
258 | fillInfo.colorInfo.mode = color.mode; | ||
259 | fillInfo.colorInfo.color = color.color; | ||
260 | } else { | ||
261 | fillInfo.colorInfo.mode = "nocolor"; | ||
262 | fillInfo.colorInfo.color = null; | ||
263 | } | ||
264 | } | ||
265 | return fillInfo; | ||
266 | } | ||
267 | }, | ||
268 | |||
269 | setFill: { | ||
270 | value: function(el, fill) { | ||
271 | if(fill.colorInfo) { | ||
272 | this.setColor(el, fill.colorInfo, true); | ||
273 | } | ||
274 | } | ||
275 | }, | ||
228 | //-------------------------------------------------------------------------------------------------------- | 276 | //-------------------------------------------------------------------------------------------------------- |
229 | // Routines to get/set 3D properties | 277 | // Routines to get/set 3D properties |
230 | get3DProperty: { | 278 | get3DProperty: { |
diff --git a/js/controllers/elements/shapes-controller.js b/js/controllers/elements/shapes-controller.js index 626dedb6..845e7dc2 100755 --- a/js/controllers/elements/shapes-controller.js +++ b/js/controllers/elements/shapes-controller.js | |||
@@ -551,12 +551,6 @@ exports.ShapesController = Montage.create(CanvasController, { | |||
551 | el.elementModel.shapeModel.GLGeomObj.setStrokeColor(webGl); | 551 | el.elementModel.shapeModel.GLGeomObj.setStrokeColor(webGl); |
552 | } | 552 | } |
553 | } | 553 | } |
554 | |||
555 | // Support for ink-bottle tool | ||
556 | if(color.strokeInfo) | ||
557 | { | ||
558 | this.setProperty(el, "strokeSize", color.strokeInfo.strokeSize + " " + color.strokeInfo.strokeUnits); | ||
559 | } | ||
560 | } | 554 | } |
561 | el.elementModel.shapeModel.GLWorld.render(); | 555 | el.elementModel.shapeModel.GLWorld.render(); |
562 | this.application.ninja.currentDocument.model.needsSave = true; | 556 | this.application.ninja.currentDocument.model.needsSave = true; |
@@ -564,23 +558,92 @@ exports.ShapesController = Montage.create(CanvasController, { | |||
564 | }, | 558 | }, |
565 | 559 | ||
566 | getStroke: { | 560 | getStroke: { |
567 | value: function(el) { | 561 | value: function(el, stroke) { |
568 | // TODO - Need to figure out which border side user wants | 562 | var strokeInfo = {}, |
569 | var size = this.getShapeProperty(el, "strokeSize"); | 563 | color, |
570 | var color = this.getShapeProperty(el, "stroke"); | 564 | strokeWidth, |
571 | return {stroke:color, strokeSize:size}; | 565 | strokeSize; |
566 | if(stroke.colorInfo) { | ||
567 | strokeInfo.colorInfo = {}; | ||
568 | color = this.getColor(el, false); | ||
569 | if(color && color.color) { | ||
570 | strokeInfo.colorInfo.mode = color.mode; | ||
571 | strokeInfo.colorInfo.color = color.color; | ||
572 | } else { | ||
573 | strokeInfo.colorInfo.mode = "nocolor"; | ||
574 | strokeInfo.colorInfo.color = null; | ||
575 | } | ||
576 | } | ||
577 | if(stroke.shapeInfo) { | ||
578 | strokeInfo.shapeInfo = {}; | ||
579 | strokeWidth = this.getProperty(el, "strokeSize"); | ||
580 | if(strokeWidth) { | ||
581 | strokeSize = njModule.NJUtils.getValueAndUnits(strokeWidth); | ||
582 | strokeInfo.shapeInfo.strokeSize = strokeSize[0]; | ||
583 | strokeInfo.shapeInfo.strokeUnits = strokeSize[1]; | ||
584 | } | ||
585 | } | ||
586 | if(stroke.webGLInfo) { | ||
587 | strokeInfo.webGLInfo = {}; | ||
588 | if(this.getShapeProperty(el, "useWebGl")) { | ||
589 | strokeInfo.webGLInfo.material = this.getProperty(el, "strokeMaterial"); | ||
590 | } else { | ||
591 | strokeInfo.webGLInfo.material = null; | ||
592 | } | ||
593 | } | ||
594 | return strokeInfo; | ||
572 | } | 595 | } |
573 | }, | 596 | }, |
574 | 597 | ||
575 | setStroke: { | 598 | setStroke: { |
576 | value: function(el, stroke) { | 599 | value: function(el, stroke, eventType, source) { |
577 | el.elementModel.shapeModel.GLGeomObj.setStrokeColor(stroke.color.webGlColor); | 600 | if(stroke.colorInfo) { |
578 | var strokeWidth = this.GetValueInPixels(stroke.strokeSize, stroke.strokeUnits); | 601 | this.setColor(el, stroke.colorInfo, false); |
579 | el.elementModel.shapeModel.G |