diff options
Diffstat (limited to 'js')
-rwxr-xr-x | js/document/templates/montage-html/default_html.css | 4 | ||||
-rwxr-xr-x | js/tools/FillTool.js | 20 | ||||
-rwxr-xr-x | js/tools/InkBottleTool.js | 21 | ||||
-rwxr-xr-x | js/tools/ShapeTool.js | 11 | ||||
-rwxr-xr-x | js/tools/modifier-tool-base.js | 5 |
5 files changed, 51 insertions, 10 deletions
diff --git a/js/document/templates/montage-html/default_html.css b/js/document/templates/montage-html/default_html.css index 6c2b415f..424c5801 100755 --- a/js/document/templates/montage-html/default_html.css +++ b/js/document/templates/montage-html/default_html.css | |||
@@ -70,8 +70,8 @@ body | |||
70 | -webkit-transform: perspective(1400) matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); | 70 | -webkit-transform: perspective(1400) matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); |
71 | } | 71 | } |
72 | 72 | ||
73 | .elem-red-outline { | 73 | .active-element-outline { |
74 | outline: red solid thin; | 74 | outline: #adff2f solid 2px; |
75 | } | 75 | } |
76 | 76 | ||
77 | .nj-preset-transition { | 77 | .nj-preset-transition { |
diff --git a/js/tools/FillTool.js b/js/tools/FillTool.js index 4b07ae83..746f20cf 100755 --- a/js/tools/FillTool.js +++ b/js/tools/FillTool.js | |||
@@ -17,11 +17,12 @@ var Montage = require("montage/core/core").Montage, | |||
17 | exports.FillTool = Montage.create(ModifierToolBase, { | 17 | exports.FillTool = Montage.create(ModifierToolBase, { |
18 | _canSnap: { value: false }, | 18 | _canSnap: { value: false }, |
19 | _canColor: { value: true }, | 19 | _canColor: { value: true }, |
20 | _targetedElement: { value: null }, | ||
20 | 21 | ||
21 | HandleMouseMove: { | 22 | HandleMouseMove: { |
22 | value : function (event) | 23 | value : function (event) |
23 | { | 24 | { |
24 | var obj = this.application.ninja.stage.GetElement(event); | 25 | var obj = this.application.ninja.stage.GetSelectableElement(event); |
25 | var cursor = "url('images/cursors/fill.png') 14 14, default"; | 26 | var cursor = "url('images/cursors/fill.png') 14 14, default"; |
26 | var canColor = true; | 27 | var canColor = true; |
27 | if (obj) | 28 | if (obj) |
@@ -31,6 +32,23 @@ exports.FillTool = Montage.create(ModifierToolBase, { | |||
31 | { | 32 | { |
32 | cursor = "url('images/cursors/nofill.png') 14 14, default"; | 33 | cursor = "url('images/cursors/nofill.png') 14 14, default"; |
33 | canColor = false; | 34 | canColor = false; |
35 | if(this._targetedElement) | ||
36 | { | ||
37 | this._targetedElement.classList.remove("active-element-outline"); | ||
38 | this._targetedElement = null; | ||
39 | } | ||
40 | } | ||
41 | else | ||
42 | { | ||
43 | if (obj !== this._targetedElement) | ||
44 | { | ||
45 | if(this._targetedElement) | ||
46 | { | ||
47 | this._targetedElement.classList.remove("active-element-outline"); | ||
48 | } | ||
49 | } | ||
50 | this._targetedElement = obj; | ||
51 | this._targetedElement.classList.add("active-element-outline"); | ||
34 | } | 52 | } |
35 | } | 53 | } |
36 | this.application.ninja.stage.drawingCanvas.style.cursor = cursor; | 54 | this.application.ninja.stage.drawingCanvas.style.cursor = cursor; |
diff --git a/js/tools/InkBottleTool.js b/js/tools/InkBottleTool.js index 8340ef50..95c2e71d 100755 --- a/js/tools/InkBottleTool.js +++ b/js/tools/InkBottleTool.js | |||
@@ -11,11 +11,12 @@ var Montage = require("montage/core/core").Montage, | |||
11 | exports.InkBottleTool = Montage.create(ModifierToolBase, { | 11 | exports.InkBottleTool = Montage.create(ModifierToolBase, { |
12 | _canSnap: { value: false }, | 12 | _canSnap: { value: false }, |
13 | _canColor: { value: true }, | 13 | _canColor: { value: true }, |
14 | _targetedElement: { value: null }, | ||
14 | 15 | ||
15 | HandleMouseMove: { | 16 | HandleMouseMove: { |
16 | value : function (event) | 17 | value : function (event) |
17 | { | 18 | { |
18 | var obj = this.application.ninja.stage.GetElement(event); | 19 | var obj = this.application.ninja.stage.GetSelectableElement(event); |
19 | var cursor = "url('images/cursors/ink.png') 6 11, default"; | 20 | var cursor = "url('images/cursors/ink.png') 6 11, default"; |
20 | var canColor = true; | 21 | var canColor = true; |
21 | if (obj) | 22 | if (obj) |
@@ -25,7 +26,25 @@ exports.InkBottleTool = Montage.create(ModifierToolBase, { | |||
25 | { | 26 | { |
26 | cursor = "url('images/cursors/ink_no.png') 6 11, default"; | 27 | cursor = "url('images/cursors/ink_no.png') 6 11, default"; |
27 | canColor = false; | 28 | canColor = false; |
29 | if(this._targetedElement) | ||
30 | { | ||
31 | this._targetedElement.classList.remove("active-element-outline"); | ||
32 | this._targetedElement = null; | ||
33 | } | ||
28 | } | 34 | } |
35 | else | ||
36 | { | ||
37 | if (obj !== this._targetedElement) | ||
38 | { | ||
39 | if(this._targetedElement) | ||
40 | { | ||
41 | this._targetedElement.classList.remove("active-element-outline"); | ||
42 | } | ||
43 | } | ||
44 | this._targetedElement = obj; | ||
45 | this._targetedElement.classList.add("active-element-outline"); | ||
46 | } | ||
47 | |||
29 | } | 48 | } |
30 | this.application.ninja.stage.drawingCanvas.style.cursor = cursor; | 49 | this.application.ninja.stage.drawingCanvas.style.cursor = cursor; |
31 | this._canColor = canColor; | 50 | this._canColor = canColor; |
diff --git a/js/tools/ShapeTool.js b/js/tools/ShapeTool.js index 85009bc2..92284d78 100755 --- a/js/tools/ShapeTool.js +++ b/js/tools/ShapeTool.js | |||
@@ -119,7 +119,7 @@ exports.ShapeTool = Montage.create(DrawingTool, { | |||
119 | RemoveCustomFeedback: { | 119 | RemoveCustomFeedback: { |
120 | value: function (event) { | 120 | value: function (event) { |
121 | if (this._targetedElement) { | 121 | if (this._targetedElement) { |
122 | this._targetedElement.classList.remove("elem-red-outline"); | 122 | this._targetedElement.classList.remove("active-element-outline"); |
123 | this._targetedElement = null; | 123 | this._targetedElement = null; |
124 | } | 124 | } |
125 | 125 | ||
@@ -136,23 +136,22 @@ exports.ShapeTool = Montage.create(DrawingTool, { | |||
136 | _showFeedbackOnMouseMove: { | 136 | _showFeedbackOnMouseMove: { |
137 | value: function (event) { | 137 | value: function (event) { |
138 | // TODO - This call is causing the canvas to redraw 3 times per mouse move | 138 | // TODO - This call is causing the canvas to redraw 3 times per mouse move |
139 | var targetedObject = this.application.ninja.stage.GetElement(event); | 139 | var targetedObject = this.application.ninja.stage.GetSelectableElement(event); |
140 | 140 | ||
141 | if (targetedObject) { | 141 | if (targetedObject) { |
142 | // TODO - Clean this up | ||
143 | if((targetedObject.nodeName === "CANVAS") && !ShapesController.isElementAShape(targetedObject)) | 142 | if((targetedObject.nodeName === "CANVAS") && !ShapesController.isElementAShape(targetedObject)) |
144 | { | 143 | { |
145 | if (targetedObject !== this._targetedElement) { | 144 | if (targetedObject !== this._targetedElement) { |
146 | if(this._targetedElement) | 145 | if(this._targetedElement) |
147 | { | 146 | { |
148 | this._targetedElement.classList.remove("elem-red-outline"); | 147 | this._targetedElement.classList.remove("active-element-outline"); |
149 | } | 148 | } |
150 | this._targetedElement = targetedObject; | 149 | this._targetedElement = targetedObject; |
151 | this._targetedElement.classList.add("elem-red-outline"); | 150 | this._targetedElement.classList.add("active-element-outline"); |
152 | } | 151 | } |
153 | } | 152 | } |
154 | else if (this._targetedElement) { | 153 | else if (this._targetedElement) { |
155 | this._targetedElement.classList.remove("elem-red-outline"); | 154 | this._targetedElement.classList.remove("active-element-outline"); |
156 | this._targetedElement = null; | 155 | this._targetedElement = null; |
157 | } | 156 | } |
158 | } | 157 | } |
diff --git a/js/tools/modifier-tool-base.js b/js/tools/modifier-tool-base.js index f58ecb53..a1812650 100755 --- a/js/tools/modifier-tool-base.js +++ b/js/tools/modifier-tool-base.js | |||
@@ -758,6 +758,11 @@ exports.ModifierToolBase = Montage.create(DrawingTool, { | |||
758 | snapManager.enableGridSnap( snapManager.gridSnapEnabledAppLevel() ); | 758 | snapManager.enableGridSnap( snapManager.gridSnapEnabledAppLevel() ); |
759 | this.eventManager.removeEventListener( "toolOptionsChange", this, false); | 759 | this.eventManager.removeEventListener( "toolOptionsChange", this, false); |
760 | this.eventManager.removeEventListener( "toolDoubleClick", this, false); | 760 | this.eventManager.removeEventListener( "toolDoubleClick", this, false); |
761 | |||
762 | if (this._targetedElement) { | ||
763 | this._targetedElement.classList.remove("active-element-outline"); | ||
764 | this._targetedElement = null; | ||
765 | } | ||
761 | } | 766 | } |
762 | } | 767 | } |
763 | }, | 768 | }, |