diff options
-rwxr-xr-x | js/components/gradientpicker.reel/gradientpicker.js | 3 | ||||
-rwxr-xr-x | js/controllers/elements/shapes-controller.js | 140 | ||||
-rwxr-xr-x | js/helper-classes/3D/snap-manager.js | 12 | ||||
-rwxr-xr-x | js/lib/drawing/world.js | 10 | ||||
-rwxr-xr-x | js/lib/geom/circle.js | 61 | ||||
-rwxr-xr-x | js/lib/geom/geom-obj.js | 80 | ||||
-rwxr-xr-x | js/lib/geom/line.js | 38 | ||||
-rwxr-xr-x | js/lib/geom/rectangle.js | 64 | ||||
-rwxr-xr-x | js/tools/EyedropperTool.js | 116 | ||||
-rwxr-xr-x | js/tools/SelectionTool.js | 28 | ||||
-rwxr-xr-x | js/tools/Translate3DToolBase.js | 1 | ||||
-rwxr-xr-x | js/tools/TranslateObject3DTool.js | 2 | ||||
-rwxr-xr-x | js/tools/modifier-tool-base.js | 12 |
13 files changed, 476 insertions, 91 deletions
diff --git a/js/components/gradientpicker.reel/gradientpicker.js b/js/components/gradientpicker.reel/gradientpicker.js index 0940be3c..cedeef50 100755 --- a/js/components/gradientpicker.reel/gradientpicker.js +++ b/js/components/gradientpicker.reel/gradientpicker.js | |||
@@ -397,7 +397,8 @@ exports.GradientPicker = Montage.create(Component, { | |||
397 | actionEvent.initEvent(type, true, true); | 397 | actionEvent.initEvent(type, true, true); |
398 | actionEvent.type = type; | 398 | actionEvent.type = type; |
399 | actionEvent.wasSetByCode = userInitiated; | 399 | actionEvent.wasSetByCode = userInitiated; |
400 | actionEvent.gradient = {stops: this.value, mode: this.mode, css: css}; | 400 | // TODO - mode seems to get reset to "rgb", so also setting a gradientMode property |
401 | actionEvent.gradient = {stops: this.value, mode: this.mode, gradientMode: this.mode, css: css}; | ||
401 | this.dispatchEvent(actionEvent); | 402 | this.dispatchEvent(actionEvent); |
402 | } | 403 | } |
403 | } | 404 | } |
diff --git a/js/controllers/elements/shapes-controller.js b/js/controllers/elements/shapes-controller.js index 3423a5a7..d72d9c14 100755 --- a/js/controllers/elements/shapes-controller.js +++ b/js/controllers/elements/shapes-controller.js | |||
@@ -259,24 +259,82 @@ exports.ShapesController = Montage.create(CanvasController, { | |||
259 | } | 259 | } |
260 | }, | 260 | }, |
261 | 261 | ||
262 | setColor: { | 262 | _setGradientMaterial: { |
263 | value: function(el, color, isFill) { | 263 | value: function(el, gradientMode, isFill) { |
264 | var webGl = color.webGlColor || color.color.webGlColor; | 264 | var m = "LinearGradientMaterial", |
265 | if(!webGl) | 265 | fm; |
266 | if(gradientMode === "radial") | ||
266 | { | 267 | { |
267 | webGl = this.application.ninja.colorController.colorModel.colorToWebGl(color.color); | 268 | m = "RadialGradientMaterial"; |
268 | } | 269 | } |
270 | |||
269 | if(isFill) | 271 | if(isFill) |
270 | { | 272 | { |
271 | el.elementModel.shapeModel.GLGeomObj.setFillColor(webGl); | 273 | if(el.elementModel.shapeModel.fillMaterial.getName() !== m) |
272 | this.setShapeProperty(el, "fill", webGl); | 274 | { |
273 | this.setShapeProperty(el, "background", color); | 275 | fm = Object.create(MaterialsModel.getMaterial(m)); |
276 | if(fm) | ||
277 | { | ||
278 | el.elementModel.shapeModel.GLGeomObj.setFillMaterial(fm); | ||
279 | el.elementModel.shapeModel.fillMaterial = fm; | ||
280 | el.elementModel.shapeModel.GLGeomObj.buildBuffers(); | ||
281 | } | ||
282 | } | ||
274 | } | 283 | } |
275 | else | 284 | else |
276 | { | 285 | { |
277 | el.elementModel.shapeModel.GLGeomObj.setStrokeColor(webGl); | 286 | if(el.elementModel.shapeModel.strokeMaterial.getName() !== m) |
278 | this.setShapeProperty(el, "stroke", webGl); | 287 | { |
279 | this.setShapeProperty(el, "border", color); | 288 | fm = Object.create(MaterialsModel.getMaterial(m)); |
289 | if(fm) | ||
290 | { | ||
291 | el.elementModel.shapeModel.GLGeomObj.setStrokeMaterial(fm); | ||
292 | el.elementModel.shapeModel.strokeMaterial = fm; | ||
293 | el.elementModel.shapeModel.GLGeomObj.buildBuffers(); | ||
294 | } | ||
295 | } | ||
296 | } | ||
297 | } | ||
298 | }, | ||
299 | |||
300 | setColor: { | ||
301 | value: function(el, color, isFill) { | ||
302 | var mode = color.mode, | ||
303 | webGl; | ||
304 | if(isFill) | ||
305 | { | ||
306 | if(mode) | ||
307 | { | ||
308 | switch (mode) { | ||
309 | case 'nocolor': | ||
310 | el.elementModel.shapeModel.GLGeomObj.setFillColor(null); | ||
311 | this.setShapeProperty(el, "fill", null); | ||
312 | this.setShapeProperty(el, "background", color); | ||
313 | el.elementModel.fill = null; | ||
314 | return; | ||
315 | case 'gradient': | ||
316 | if(el.elementModel.shapeModel.useWebGl) | ||
317 | { | ||
318 | this._setGradientMaterial(el, color.color.gradientMode, isFill); | ||
319 | } | ||
320 | el.elementModel.shapeModel.GLGeomObj.setFillColor({gradientMode:color.color.gradientMode, color:color.color.stops}); | ||
321 | el.elementModel.shapeModel.GLWorld.render(); | ||
322 | this.setShapeProperty(el, "fill", color.color.css); | ||
323 | this.setShapeProperty(el, "background", color); | ||
324 | el.elementModel.fill = color; | ||
325 | break; | ||
326 | default: | ||
327 | webGl = this.application.ninja.colorController.colorModel.colorToWebGl(color.color); | ||
328 | el.elementModel.shapeModel.GLGeomObj.setFillColor(webGl); | ||
329 | this.setShapeProperty(el, "fill", webGl); | ||
330 | this.setShapeProperty(el, "background", color); | ||
331 | el.elementModel.fill = color; | ||
332 | } | ||
333 | } | ||
334 | } | ||
335 | else | ||
336 | { | ||
337 | // Support for ink-bottle tool | ||
280 | if(color.strokeInfo) | 338 | if(color.strokeInfo) |
281 | { | 339 | { |
282 | var strokeWidth = this.GetValueInPixels(color.strokeInfo.strokeSize, | 340 | var strokeWidth = this.GetValueInPixels(color.strokeInfo.strokeSize, |
@@ -285,7 +343,67 @@ exports.ShapesController = Montage.create(CanvasController, { | |||
285 | this.setShapeProperty(el, "strokeSize", color.strokeInfo.strokeSize + " " | 343 | this.setShapeProperty(el, "strokeSize", color.strokeInfo.strokeSize + " " |
286 | + color.strokeInfo.strokeUnits); | 344 | + color.strokeInfo.strokeUnits); |
287 | } | 345 | } |
346 | |||
347 | if(mode) | ||
348 | { | ||
349 | switch (mode) { | ||
350 | case 'nocolor': | ||
351 | el.elementModel.shapeModel.GLGeomObj.setStrokeColor(null); | ||
352 | this.setShapeProperty(el, "stroke", null); | ||
353 | this.setShapeProperty(el, "border", color); | ||
354 | el.elementModel.fill = null; | ||
355 | return; | ||
356 | case 'gradient': | ||
357 | if(el.elementModel.shapeModel.useWebGl) | ||
358 | { | ||
359 | this._setGradientMaterial(el, color.color.gradientMode, isFill); | ||
360 | } | ||
361 | el.elementModel.shapeModel.GLGeomObj.setStrokeColor({gradientMode:color.color.gradientMode, color:color.color.stops}); | ||
362 | el.elementModel.shapeModel.GLWorld.render(); | ||
363 | this.setShapeProperty(el, "stroke", color.color.css); | ||
364 | this.setShapeProperty(el, "border", color); | ||
365 | el.elementModel.fill = color; | ||
366 | break; | ||
367 | default: | ||
368 | webGl = this.application.ninja.colorController.colorModel.colorToWebGl(color.color); | ||
369 | el.elementModel.shapeModel.GLGeomObj.setStrokeColor(webGl); | ||
370 | this.setShapeProperty(el, "stroke", webGl); | ||
371 | this.setShapeProperty(el, "border", color); | ||
372 | el.elementModel.fill = color; | ||
373 | } | ||
374 | } | ||
288 | } | 375 | } |
376 | |||
377 | |||
378 | |||
379 | |||
380 | |||
381 | |||
382 | // var webGl = color.webGlColor || color.color.webGlColor; | ||
383 | // if(!webGl) | ||
384 | // { | ||
385 | // webGl = this.application.ninja.colorController.colorModel.colorToWebGl(color.color); | ||
386 | // } | ||
387 | // if(isFill) | ||
388 | // { | ||
389 | // el.elementModel.shapeModel.GLGeomObj.setFillColor(webGl); | ||
390 | // this.setShapeProperty(el, "fill", webGl); | ||
391 | // this.setShapeProperty(el, "background", color); | ||
392 | // } | ||
393 | // else | ||
394 | // { | ||
395 | // el.elementModel.shapeModel.GLGeomObj.setStrokeColor(webGl); | ||
396 | // this.setShapeProperty(el, "stroke", webGl); | ||
397 | // this.setShapeProperty(el, "border", color); | ||
398 | // if(color.strokeInfo) | ||
399 | // { | ||
400 | // var strokeWidth = this.GetValueInPixels(color.strokeInfo.strokeSize, | ||
401 | // color.strokeInfo.strokeUnits); | ||
402 | // el.elementModel.shapeModel.GLGeomObj.setStrokeWidth(strokeWidth); | ||
403 | // this.setShapeProperty(el, "strokeSize", color.strokeInfo.strokeSize + " " | ||
404 | // + color.strokeInfo.strokeUnits); | ||
405 | // } | ||
406 | // } | ||
289 | el.elementModel.shapeModel.GLWorld.render(); | 407 | el.elementModel.shapeModel.GLWorld.render(); |
290 | } | 408 | } |
291 | }, | 409 | }, |
diff --git a/js/helper-classes/3D/snap-manager.js b/js/helper-classes/3D/snap-manager.js index cf8a91db..1caacd00 100755 --- a/js/helper-classes/3D/snap-manager.js +++ b/js/helper-classes/3D/snap-manager.js | |||
@@ -1978,12 +1978,20 @@ var SnapManager = exports.SnapManager = Montage.create(Component, { | |||
1978 | }, | 1978 | }, |
1979 | 1979 | ||
1980 | setupDragPlanes : { | 1980 | setupDragPlanes : { |
1981 | value: function( hitRec ) { | 1981 | value: function( hitRec, inGlobalMode ) { |
1982 | // get the location of the point in stage world space | 1982 | // get the location of the point in stage world space |
1983 | var elt = hitRec.get |