aboutsummaryrefslogtreecommitdiff
path: root/js
diff options
context:
space:
mode:
Diffstat (limited to 'js')
-rwxr-xr-xjs/controllers/elements/element-controller.js13
-rwxr-xr-xjs/controllers/elements/shapes-controller.js12
-rwxr-xr-xjs/data/tools-data.js2
-rwxr-xr-xjs/stage/stage.reel/stage.js31
-rwxr-xr-xjs/tools/EyedropperTool.js199
-rwxr-xr-xjs/tools/FillTool.js3
-rwxr-xr-xjs/tools/InkBottleTool.js35
-rwxr-xr-xjs/tools/modifier-tool-base.js2
8 files changed, 263 insertions, 34 deletions
<
diff --git a/js/controllers/elements/element-controller.js b/js/controllers/elements/element-controller.js
index 65d26bdd..5eb75613 100755
--- a/js/controllers/elements/element-controller.js
+++ b/js/controllers/elements/element-controller.js
@@ -115,6 +115,7 @@ var ElementController = exports.ElementController = Montage.create(NJComponent,
115 } 115 }
116 else 116 else
117 { 117 {
118 // TODO - Need to update border style and width also
118 el.elementModel.stroke = colorObj; 119 el.elementModel.stroke = colorObj;
119 } 120 }
120 121
@@ -159,10 +160,22 @@ var ElementController = exports.ElementController = Montage.create(NJComponent,
159 case 'gradient': 160 case 'gradient':
160 this.setProperty(el, "border-image", color.color.css); 161 this.setProperty(el, "border-image", color.color.css);
161 this.setProperty(el, "border-color", "none"); 162 this.setProperty(el, "border-color", "none");
163 if(color.borderInfo)
164 {
165 this.setProperty(el, "border-width", color.borderInfo.borderWidth +
166 color.borderInfo.borderUnits);
167 this.setProperty(el, "border-style", color.borderInfo.borderStyle);
168 }
162 break; 169 break;
163 default: 170 default:
164 this.setProperty(el, "border-image", "none"); 171 this.setProperty(el, "border-image", "none");
165 this.setProperty(el, "border-color", color.color.css); 172 this.setProperty(el, "border-color", color.color.css);
173 if(color.borderInfo)
174 {
175 this.setProperty(el, "border-width", color.borderInfo.borderWidth +
176 color.borderInfo.borderUnits);
177 this.setProperty(el, "border-style", color.borderInfo.borderStyle);
178 }
166 } 179 }
167 } 180 }
168 el.elementModel.stroke = color; 181 el.elementModel.stroke = color;
diff --git a/js/controllers/elements/shapes-controller.js b/js/controllers/elements/shapes-controller.js
index 15a18a51..e0bff70c 100755
--- a/js/controllers/elements/shapes-controller.js
+++ b/js/controllers/elements/shapes-controller.js
@@ -250,6 +250,10 @@ exports.ShapesController = Montage.create(CanvasController, {
250 setColor: { 250 setColor: {
251 value: function(el, color, isFill) { 251 value: function(el, color, isFill) {
252 var webGl = color.webGlColor || color.color.webGlColor; 252 var webGl = color.webGlColor || color.color.webGlColor;
253 if(!webGl)
254 {
255 webGl = this.application.ninja.colorController.colorModel.colorToWebGl(color.color);
256 }
253 if(isFill) 257 if(isFill)
254 { 258 {
255 el.elementModel.shapeModel.GLGeomObj.setFillColor(webGl); 259 el.elementModel.shapeModel.GLGeomObj.setFillColor(webGl);
@@ -261,6 +265,14 @@ exports.ShapesController = Montage.create(CanvasController, {
261 el.elementModel.shapeModel.GLGeomObj.setStrokeColor(webGl); 265 el.elementModel.shapeModel.GLGeomObj.setStrokeColor(webGl);
262 this.setShapeProperty(el, "stroke", webGl); 266 this.setShapeProperty(el, "stroke", webGl);
263 this.setShapeProperty(el, "border", color); 267 this.setShapeProperty(el, "border", color);
268 if(color.strokeInfo)
269 {
270 var strokeWidth = this.GetValueInPixels(color.strokeInfo.strokeSize,
271 color.strokeInfo.strokeUnits);
272 el.elementModel.shapeModel.GLGeomObj.setStrokeWidth(strokeWidth);
273 this.setShapeProperty(el, "strokeSize", color.strokeInfo.strokeSize + " "
274 + color.strokeInfo.strokeUnits);
275 }
264 } 276 }
265 el.elementModel.shapeModel.GLWorld.render(); 277 el.elementModel.shapeModel.GLWorld.render();
266 } 278 }
diff --git a/js/data/tools-data.js b/js/data/tools-data.js
index de965dbc..f63d14ae 100755
--- a/js/data/tools-data.js
+++ b/js/data/tools-data.js
@@ -174,7 +174,7 @@ exports.ToolsData = Montage.create(Montage, {
174 "spriteSheet": true, 174 "spriteSheet": true,
175 "action": "EyedropperTool", 175 "action": "EyedropperTool",
176 "toolTip": "Eyedropper Tool", 176 "toolTip": "Eyedropper Tool",
177 "cursor": "url('images/tools/eyedropper_down.png'), default", 177 "cursor": "url('images/tools/eyedropper_down.png') 6 20, default",
178 "lastInGroup": false, 178 "lastInGroup": false,
179 "container": false, 179 "container": false,
180 "selected": false 180 "selected": false
diff --git a/js/stage/stage.reel/stage.js b/js/stage/stage.reel/stage.js
index 37b1df35..6a8afad4 100755
--- a/js/stage/stage.reel/stage.js
+++ b/js/stage/stage.reel/stage.js
@@ -518,12 +518,37 @@ exports.Stage = Montage.create(Component, {
518 */ 518 */
519 GetElement: { 519 GetElement: {
520 value: function(pos) { 520 value: function(pos) {
521 var point = webkitConvertPointFromPageToNode(this.canvas, new WebKitPoint(pos.pageX, pos.pageY)); 521 var point = webkitConvertPointFromPageToNode(this.canvas, new WebKitPoint(pos.pageX, pos.pageY)),
522 return this.application.ninja.currentDocument.GetElementFromPoint(point.x + this.scrollLeft,point.y + this.scrollTop); 522 elt = this.application.ninja.currentDocument.GetElementFromPoint(point.x + this.scrollLeft,point.y + this.scrollTop);
523
524 // workaround Chrome 3d bug
525 if(elt === this._viewport)
526 {
527 return this._getElementUsingSnapping(point);
528 } else {
529 return elt;
530 }
523 } 531 }
524 }, 532 },
525 533
526 534 /**
535 * _getElementUsingSnapping: Returns the object at point using snap manager
536 *
537 * @param: point
538 * @return: Returns the Object in the user document under the point
539 */
540 _getElementUsingSnapping: {
541 value: function(point) {
542 this.stageDeps.snapManager.enableElementSnap( true );
543 var hitRec = this.stageDeps.snapManager.snap(point.x, point.y, true);
544 this.stageDeps.snapManager.enableElementSnap( this.stageDeps.snapManager.elementSnapEnabledAppLevel() );
545 if (hitRec) {
546 return hitRec.getElement();
547 } else {
548 return null;
549 }
550 }
551 },
527 552
528 553
529 draw: { 554 draw: {
diff --git a/js/tools/EyedropperTool.js b/js/tools/EyedropperTool.js
index 795753d2..43286122 100755
--- a/js/tools/EyedropperTool.js
+++ b/js/tools/EyedropperTool.js
@@ -6,7 +6,8 @@ No rights, expressed or implied, whatsoever to this software are provided by Mot
6 6
7var Montage = require("montage/core/core").Montage, 7var Montage = require("montage/core/core").Montage,
8 ElementsMediator = require("js/mediators/element-mediator").ElementMediator, 8 ElementsMediator = require("js/mediators/element-mediator").ElementMediator,
9 9 drawUtils = require("js/helper-classes/3D/draw-utils").DrawUtils,
10 vecUtils = require("js/helper-classes/3D/vec-utils").VecUtils,
10 toolBase = require("js/tools/ToolBase").toolBase; 11 toolBase = require("js/tools/ToolBase").toolBase;
11 12
12exports.EyedropperTool = Montage.create(toolBase, { 13exports.EyedropperTool = Montage.create(toolBase, {
@@ -14,6 +15,9 @@ exports.EyedropperTool = Montage.create(toolBase, {
14 _isMouseDown: { value: false }, 15 _isMouseDown: { value: false },
15 _previousColor: { value: null}, 16 _previousColor: { value: null},
16 _color: { value: null}, 17 _color: { value: null},
18 _elementUnderMouse: { value: null },
19 _imageDataCanvas: { value: null },
20 _imageDataContext: { value: null },
17 21
18 Configure: { 22 Configure: {
19 value: function ( doActivate ) 23 value: function ( doActivate )
@@ -46,6 +50,13 @@ exports.EyedropperTool = Montage.create(toolBase, {
46 { 50 {
47 this._isMouseDown = false; 51 this._isMouseDown = false;
48 this._escape = false; 52 this._escape = false;
53 this._elementUnderMouse = null;
54 if(this._imageDataCanvas)
55 {
56 this.application.ninja.stage.element.removeChild(this._imageDataCanvas);
57 this._imageDataCanvas = null;
58 this._imageDataContext = null;
59 }
49 } 60 }
50 if(this._isMouseDown) 61 if(this._isMouseDown)
51 { 62 {
@@ -67,6 +78,14 @@ exports.EyedropperTool = Montage.create(toolBase, {
67 this._updateColor(this._color); 78 this._updateColor(this._color);
68 79
69 this._color = null; 80 this._color = null;
81
82 this._elementUnderMouse = null;
83 if(this._imageDataCanvas)
84 {
85 this.application.ninja.stage.element.removeChild(this._imageDataCanvas);
86 this._imageDataCanvas = null;
87 this._imageDataContext = null;
88 }
70 } 89 }
71 } 90 }
72 }, 91 },
@@ -95,27 +114,80 @@ exports.EyedropperTool = Montage.create(toolBase, {
95 114
96 _updateColorFromPoint: { 115 _updateColorFromPoint: {
97 value : function (event) { 116 value : function (event) {
98 var obj = this.application.ninja.stage.GetElement(event); 117 var c,
118 color,
119 obj = this.application.ninja.stage.GetElement(event);
99 if (obj) 120 if (obj)
100 { 121 {
101 // TODO - figure out if user clicked on a border - for now, just get fill 122 this._elementUnderMouse = obj;
102 var c = ElementsMediator.getColor(obj, true); 123 // Depending on the object type, we need to get different colors
103 if(c) 124 if(obj.elementModel.type === "IMG")
125 {
126 c = this._getColorAtPoint(obj, event);
127 if(c)
128 {
129 color = this.application.ninja.colorController.getColorObjFromCss(c);
130 }
131 }