diff options
Diffstat (limited to 'js/tools/ShapeTool.js')
-rwxr-xr-x | js/tools/ShapeTool.js | 75 |
1 files changed, 34 insertions, 41 deletions
diff --git a/js/tools/ShapeTool.js b/js/tools/ShapeTool.js index f3b5e92d..0562dbc2 100755 --- a/js/tools/ShapeTool.js +++ b/js/tools/ShapeTool.js | |||
@@ -53,40 +53,37 @@ exports.ShapeTool = Montage.create(DrawingTool, { | |||
53 | } | 53 | } |
54 | }, | 54 | }, |
55 | 55 | ||
56 | HandleLeftButtonUp: | 56 | HandleLeftButtonUp: { |
57 | { | 57 | value: function (event) { |
58 | value: function (event) | 58 | var canvas, drawData = this.getDrawingData(); |
59 | { | ||
60 | var drawData; | ||
61 | |||
62 | drawData = this.getDrawingData(); | ||
63 | 59 | ||
64 | if(drawData) { | 60 | if(drawData) { |
65 | var canvas; | ||
66 | if(!this._useExistingCanvas()) { | 61 | if(!this._useExistingCanvas()) { |
67 | canvas = NJUtils.makeNJElement("canvas", "Canvas", "shape", {"data-RDGE-id": NJUtils.generateRandom()}, true); | 62 | canvas = document.application.njUtils.make("canvas", {"data-RDGE-id": NJUtils.generateRandom()}, this.application.ninja.currentDocument); |
68 | var elementModel = TagTool.makeElement(~~drawData.width, ~~drawData.height, | 63 | document.application.njUtils.createModelWithShape(canvas); |
69 | drawData.planeMat, drawData.midPt, canvas, true); | ||
70 | 64 | ||
71 | canvas.elementModel.isShape = true; | 65 | var styles = document.application.njUtils.stylesFromDraw(canvas, ~~drawData.width, ~~drawData.height, drawData); |
72 | this.application.ninja.elementMediator.addElements(canvas, elementModel.data); | 66 | this.application.ninja.elementMediator.addElements(canvas, styles); |
73 | } else { | 67 | } else { |
74 | canvas = this._targetedElement; | 68 | canvas = this._targetedElement; |
69 | if (!canvas.getAttribute( "data-RDGE-id" )) | ||
70 | canvas.setAttribute( "data-RDGE-id", NJUtils.generateRandom() ); | ||
75 | canvas.elementModel.controller = ShapesController; | 71 | canvas.elementModel.controller = ShapesController; |
76 | if(!canvas.elementModel.shapeModel) { | 72 | if(!canvas.elementModel.shapeModel) { |
77 | canvas.elementModel.shapeModel = Montage.create(ShapeModel); | 73 | canvas.elementModel.shapeModel = Montage.create(ShapeModel); |
78 | } | 74 | } |
75 | this.application.ninja.elementMediator.addElements(canvas, canvas.elementModel.data); | ||
79 | } | 76 | } |
80 | } | 77 | } |
81 | 78 | ||
82 | this.endDraw(event); | 79 | this.endDraw(event); |
83 | 80 | ||
84 | this._isDrawing = false; | 81 | this._isDrawing = false; |
85 | this._hasDraw=false; | 82 | this._hasDraw=false; |
86 | 83 | ||
87 | this.DrawHandles(); | 84 | this.DrawHandles(); |
88 | } | 85 | } |
89 | }, | 86 | }, |
90 | 87 | ||
91 | onAddElements: { | 88 | onAddElements: { |
92 | value: function(el) { | 89 | value: function(el) { |
@@ -103,6 +100,9 @@ exports.ShapeTool = Montage.create(DrawingTool, { | |||
103 | if(wasSelected) { | 100 | if(wasSelected) { |
104 | this.AddCustomFeedback(); | 101 | this.AddCustomFeedback(); |
105 | this.application.ninja.elementMediator.addDelegate = this; | 102 | this.application.ninja.elementMediator.addDelegate = this; |
103 | if(this.application.ninja.currentSelectedContainer.nodeName === "CANVAS") { | ||
104 | this._targetedElement = this.application.ninja.currentSelectedContainer; | ||
105 | } | ||
106 | } else { | 106 | } else { |
107 | this.RemoveCustomFeedback(); | 107 | this.RemoveCustomFeedback(); |
108 | this.application.ninja.elementMediator.addDelegate = null; | 108 | this.application.ninja.elementMediator.addDelegate = null; |
@@ -138,7 +138,7 @@ exports.ShapeTool = Montage.create(DrawingTool, { | |||
138 | _showFeedbackOnMouseMove: { | 138 | _showFeedbackOnMouseMove: { |
139 | value: function (event) { | 139 | value: function (event) { |
140 | // TODO - This call is causing the canvas to redraw 3 times per mouse move | 140 | // TODO - This call is causing the canvas to redraw 3 times per mouse move |
141 | var targetedObject = this.application.ninja.stage.GetSelectableElement(event); | 141 | var targetedObject = this.application.ninja.stage.getElement(event, true); |
142 | 142 | ||
143 | if (targetedObject) { | 143 | if (targetedObject) { |
144 | if((targetedObject.nodeName === "CANVAS") && !ShapesController.isElementAShape(targetedObject)) | 144 | if((targetedObject.nodeName === "CANVAS") && !ShapesController.isElementAShape(targetedObject)) |
@@ -187,31 +187,24 @@ exports.ShapeTool = Montage.create(DrawingTool, { | |||
187 | } | 187 | } |
188 | }, | 188 | }, |
189 | 189 | ||
190 | createCanvas: { | ||
191 | value: function (left, top, w, h) | ||
192 | { | ||
193 | //var tmpDiv = document.createElement("canvas"); | ||
194 | var tmpDiv = NJUtils.makeNJElement("canvas", "Canvas", "block"); | ||
195 | var rules = { | ||
196 | 'position': 'absolute', | ||
197 | 'top' : top + 'px', | ||
198 | 'left' : left + 'px', | ||
199 | '-webkit-transform-style' : 'preserve-3d', | ||
200 | '-webkit-transform' : 'matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)' | ||
201 | }; | ||
202 | |||
203 | tmpDiv.width = w; | ||
204 | tmpDiv.height = h; | ||
205 | |||
206 | return {el: tmpDiv, rules: rules}; | ||
207 | } | ||
208 | }, | ||
209 | |||
210 | // We can draw on an existing canvas unless it has only a single shape object | 190 | // We can draw on an existing canvas unless it has only a single shape object |
211 | _useExistingCanvas: { | 191 | _useExistingCanvas: { |
212 | value: function() | 192 | value: function() |
213 | { | 193 | { |
214 | return (this._targetedElement && !ShapesController.isElementAShape(this._targetedElement)); | 194 | var target; |
195 | if (this._targetedElement && (this._targetedElement.nodeName === "CANVAS") && !ShapesController.isElementAShape(this._targetedElement)) | ||
196 | target = this._targetedElement; | ||
197 | else | ||
198 | { | ||
199 | var container = this.application.ninja.currentSelectedContainer; | ||
200 | if (container && (container.nodeName === "CANVAS")) | ||
201 | { | ||
202 | target = container; | ||
203 | this._targetedElement = target; | ||
204 | } | ||
205 | } | ||
206 | |||
207 | return target; | ||
215 | } | 208 | } |
216 | } | 209 | } |
217 | 210 | ||