diff options
Diffstat (limited to 'js/tools/BrushTool.js')
-rw-r--r--[-rwxr-xr-x] | js/tools/BrushTool.js | 176 |
1 files changed, 90 insertions, 86 deletions
diff --git a/js/tools/BrushTool.js b/js/tools/BrushTool.js index 4d44326f..9a0ad583 100755..100644 --- a/js/tools/BrushTool.js +++ b/js/tools/BrushTool.js | |||
@@ -65,12 +65,30 @@ exports.BrushTool = Montage.create(ShapeTool, { | |||
65 | if (this._selectedBrushStroke === null){ | 65 | if (this._selectedBrushStroke === null){ |
66 | this._selectedBrushStroke = new GLBrushStroke(); | 66 | this._selectedBrushStroke = new GLBrushStroke(); |
67 | } | 67 | } |
68 | console.log("BrushTool Start"); | ||
69 | NJevent("enableStageMove");//stageManagerModule.stageManager.enableMouseMove(); | 68 | NJevent("enableStageMove");//stageManagerModule.stageManager.enableMouseMove(); |
70 | } //value: function (event) { | 69 | } //value: function (event) { |
71 | }, //HandleLeftButtonDown | 70 | }, //HandleLeftButtonDown |
72 | 71 | ||
72 | _getUnsnappedPosition: { | ||
73 | value: function(x,y){ | ||
74 | var elemSnap = snapManager.elementSnapEnabled(); | ||
75 | var gridSnap = snapManager.gridSnapEnabled(); | ||
76 | var alignSnap = snapManager.snapAlignEnabled(); | ||
73 | 77 | ||
78 | snapManager.enableElementSnap(false); | ||
79 | snapManager.enableGridSnap(false); | ||
80 | snapManager.enableSnapAlign(false); | ||
81 | |||
82 | var point = webkitConvertPointFromPageToNode(this.application.ninja.stage.canvas, new WebKitPoint(x,y)); | ||
83 | var unsnappedpos = DrawingToolBase.getHitRecPos(snapManager.snap(point.x, point.y, false)); | ||
84 | |||
85 | snapManager.enableElementSnap(elemSnap); | ||
86 | snapManager.enableGridSnap(gridSnap); | ||
87 | snapManager.enableSnapAlign(alignSnap); | ||
88 | |||
89 | return unsnappedpos; | ||
90 | } | ||
91 | }, | ||
74 | //need to override this function because the ShapeTool's definition contains a clearDrawingCanvas call - Pushkar | 92 | //need to override this function because the ShapeTool's definition contains a clearDrawingCanvas call - Pushkar |
75 | // might not need to override once we draw using OpenGL instead of SVG | 93 | // might not need to override once we draw using OpenGL instead of SVG |
76 | // Also took out all the snapping code for now...need to add that back | 94 | // Also took out all the snapping code for now...need to add that back |
@@ -84,20 +102,10 @@ exports.BrushTool = Montage.create(ShapeTool, { | |||
84 | } | 102 | } |
85 | 103 | ||
86 | if (this._isDrawing) { | 104 | if (this._isDrawing) { |
87 | snapManager.enableElementSnap(false); | 105 | var currMousePos = this._getUnsnappedPosition(event.pageX, event.pageY); |
88 | snapManager.enableGridSnap(false); | ||
89 | snapManager.enableSnapAlign(false); | ||
90 | //this.doDraw(event); | ||
91 | //var currMousePos = this.getMouseUpPos(); | ||
92 | //instead of doDraw call own DrawingTool | ||
93 | var point = webkitConvertPointFromPageToNode(this.application.ninja.stage.canvas, new WebKitPoint(event.pageX, event.pageY)); | ||
94 | var hitRecSnapPoint = DrawingToolBase.getUpdatedSnapPointNoAppLevelEnabling(point.x, point.y, true, this.mouseDownHitRec); | ||
95 | var currMousePos = DrawingToolBase.getHitRecPos(hitRecSnapPoint); | ||
96 | |||
97 | if (this._selectedBrushStroke){ | 106 | if (this._selectedBrushStroke){ |
98 | this._selectedBrushStroke.addPoint(currMousePos); | 107 | this._selectedBrushStroke.addPoint(currMousePos); |
99 | } | 108 | } |
100 | |||
101 | this.ShowCurrentBrushStrokeOnStage(); | 109 | this.ShowCurrentBrushStrokeOnStage(); |
102 | } //if (this._isDrawing) { | 110 | } //if (this._isDrawing) { |
103 | 111 | ||
@@ -123,7 +131,6 @@ exports.BrushTool = Montage.create(ShapeTool, { | |||
123 | 131 | ||
124 | this._isDrawing = false; | 132 | this._isDrawing = false; |
125 | this._hasDraw = false; | 133 | this._hasDraw = false; |
126 | console.log("BrushTool Stop"); | ||
127 | 134 | ||
128 | //TODO get these values from the options | 135 | //TODO get these values from the options |
129 | if (this._selectedBrushStroke){ | 136 | if (this._selectedBrushStroke){ |
@@ -192,92 +199,89 @@ exports.BrushTool = Montage.create(ShapeTool, { | |||
192 | 199 | ||
193 | 200 | ||
194 | RenderShape: { | 201 | RenderShape: { |
195 | value: function (w, h, planeMat, midPt, canvas) { | 202 | value: function (w, h, planeMat, midPt, canvas) { |
196 | if ((Math.floor(w) === 0) || (Math.floor(h) === 0)) { | 203 | if ((Math.floor(w) === 0) || (Math.floor(h) === 0)) { |
197 | return; | 204 | return; |
198 | } | 205 | } |
199 | 206 | ||
200 | var left = Math.round(midPt[0] - 0.5 * w); | 207 | var left = Math.round(midPt[0] - 0.5 * w); |
201 | var top = Math.round(midPt[1] - 0.5 * h); | 208 | var top = Math.round(midPt[1] - 0.5 * h); |
202 | 209 | ||
203 | if (!canvas) { | 210 | if (!canvas) { |
204 | var newCanvas = NJUtils.makeNJElement("canvas", "Brushstroke", "shape", {"data-RDGE-id": NJUtils.generateRandom()}, true); | 211 | var newCanvas = NJUtils.makeNJElement("canvas", "Brushstroke", "shape", {"data-RDGE-id": NJUtils.generateRandom()}, true); |
205 | var elementModel = TagTool.makeElement(w, h, planeMat, midPt, newCanvas); | 212 | var elementModel = TagTool.makeElement(w, h, planeMat, midPt, newCanvas); |
206 | ElementMediator.addElement(newCanvas, elementModel.data, true); | 213 | ElementMediator.addElement(newCanvas, elementModel.data, true); |
207 | 214 | ||
208 | // create all the GL stuff | 215 | // create all the GL stuff |
209 | var world = this.getGLWorld(newCanvas, this._useWebGL); | 216 | var world = this.getGLWorld(newCanvas, this._useWebGL); |
210 | //store a reference to this newly created canvas | 217 | //store a reference to this newly created canvas |
211 | this._brushStrokeCanvas = newCanvas; | 218 | this._brushStrokeCanvas = newCanvas; |
212 | 219 | ||
213 | var brushStroke = this._selectedBrushStroke; | 220 | var brushStroke = this._selectedBrushStroke; |
214 | if (brushStroke){ | 221 | if (brushStroke){ |
215 | brushStroke.setWorld(world); | 222 | brushStroke.setWorld(world); |
216 | 223 | ||
217 | brushStroke.setPlaneMatrix(planeMat); | 224 | brushStroke.setPlaneMatrix(planeMat); |
218 | var planeMatInv = glmat4.inverse( planeMat, [] ); | 225 | var planeMatInv = glmat4.inverse( planeMat, [] ); |
219 | brushStroke.setPlaneMatrixInverse(planeMatInv); | 226 | brushStroke.setPlaneMatrixInverse(planeMatInv); |
220 | brushStroke.setPlaneCenter(midPt); | 227 | brushStroke.setPlaneCenter(midPt); |
221 | 228 | ||
222 | world.addObject(brushStroke); | 229 | world.addObject(brushStroke); |
223 | world.render(); | 230 | world.render(); |
224 | //TODO this will not work if there are multiple shapes in the same canvas | 231 | //TODO this will not work if there are multiple shapes in the same canvas |
225 | newCanvas.elementModel.shapeModel.GLGeomObj = brushStroke; | 232 | newCanvas.elementModel.shapeModel.GLGeomObj = brushStroke; |
226 | } | 233 | } |
227 | } //if (!canvas) { | 234 | } //if (!canvas) { |
228 | else { | 235 | else { |
229 | |||
230 | var world = null; | ||
231 | if (canvas.elementModel.shapeModel && canvas.elementModel.shapeModel.GLWorld) { | ||
232 | world = canvas.elementModel.shapeModel.GLWorld; | ||
233 | } else { | ||
234 | world = this.getGLWorld(canvas, this._useWebGL);//this.options.use3D);//this.CreateGLWorld(planeMat, midPt, canvas, this._useWebGL);//fillMaterial, strokeMaterial); | ||
235 | } | ||
236 | 236 | ||
237 | var world = null; | ||
238 | if (canvas.elementModel.shapeModel && canvas.elementModel.shapeModel.GLWorld) { | ||
239 | world = canvas.elementModel.shapeModel.GLWorld; | ||
240 | } else { | ||
241 | world = this.getGLWorld(canvas, this._useWebGL); | ||
242 | } | ||
237 | 243 | ||
238 | if (this._entryEditMode !== this.ENTRY_SELECT_CANVAS){ | 244 | |
239 | //update the left and top of the canvas element | 245 | if (this._entryEditMode !== this.ENTRY_SELECT_CANVAS){ |
240 | var canvasArray=[canvas]; | 246 | //update the left and top of the canvas element |
241 | ElementMediator.setProperty(canvasArray, "left", [parseInt(left)+"px"],"Changing", "brushTool"); | 247 | var canvasArray=[canvas]; |
242 | ElementMediator.setProperty(canvasArray, "top", [parseInt(top) + "px"],"Changing", "brushTool"); | 248 | ElementMediator.setProperty(canvasArray, "left", [parseInt(left)+"px"],"Changing", "brushTool"); |
243 | canvas.width = w; | 249 | ElementMediator.setProperty(canvasArray, "top", [parseInt(top) + "px"],"Changing", "brushTool"); |
244 | canvas.height = h; | 250 | canvas.width = w; |
245 | //update the viewport and projection to reflect the new canvas width and height | 251 | canvas.height = h; |
246 | world.setViewportFromCanvas(canvas); | 252 | //update the viewport and projection to reflect the new canvas width and height |
247 | if (this._useWebGL){ | 253 | world.setViewportFromCanvas(canvas); |
248 | var cam = world.renderer.cameraManager().getActiveCamera(); | 254 | if (this._useWebGL){ |
249 | cam.setPerspective(world.getFOV(), world.getAspect(), world.getZNear(), world.getZFar()); | 255 | var cam = world.renderer.cameraManager().getActiveCamera(); |
256 | cam.setPerspective(world.getFOV(), world.getAspect(), world.getZNear(), world.getZFar()); | ||
257 | } | ||
250 | } | 258 | } |
251 | } | ||
252 | 259 | ||
253 | var brushStroke = this._selectedBrushStroke; | 260 | var brushStroke = this._selectedBrushStroke; |
254 | 261 | ||
255 | if (brushStroke){ | 262 | if (brushStroke){ |
256 | brushStroke.setDrawingTool(this); | 263 | brushStroke.setDrawingTool(this); |
257 | 264 | ||
258 | brushStroke.setPlaneMatrix(planeMat); | 265 | brushStroke.setPlaneMatrix(planeMat); |
259 | var planeMatInv = glmat4.inverse( planeMat, [] ); | 266 | var planeMatInv = glmat4.inverse( planeMat, [] ); |
260 | brushStroke.setPlaneMatrixInverse(planeMatInv); | 267 | brushStroke.setPlaneMatrixInverse(planeMatInv); |
261 | brushStroke.setPlaneCenter(midPt); | 268 | brushStroke.setPlaneCenter(midPt); |
262 | 269 | ||
263 | brushStroke.setWorld(world); | 270 | brushStroke.setWorld(world); |
264 | world.addIfNewObject(brushStroke); | 271 | world.addIfNewObject(brushStroke); |
265 | //world.addObject(subpath); | 272 | //world.addObject(subpath); |
266 | world.render(); | 273 | world.render(); |
267 | //TODO this will not work if there are multiple shapes in the same canvas | 274 | //TODO this will not work if there are multiple shapes in the same canvas |
268 | canvas.elementModel.shapeModel.GLGeomObj = brushStroke; | 275 | canvas.elementModel.shapeModel.GLGeomObj = brushStroke; |
269 | } | 276 | } |
270 | } //else of if (!canvas) { | 277 | } //else of if (!canvas) { |
271 | } //value: function (w, h, planeMat, midPt, canvas) { | 278 | } //value: function (w, h, planeMat, midPt, canvas) { |
272 | }, //RenderShape: { | 279 | }, //RenderShape: { |
280 | |||
273 | Configure: { | 281 | Configure: { |
274 | value: function (wasSelected) { | 282 | value: function (wasSelected) { |
275 | if (wasSelected) { | 283 | if (wasSelected) { |
276 | console.log("Picked BrushTool"); | 284 | console.log("Entered BrushTool"); |
277 | //todo these calls have no effect because the drawing-tool-base (in getInitialSnapPoint) overrides them with what's set at the application level | ||
278 | snapManager.enableElementSnap(false); | ||
279 | snapManager.enableGridSnap(false); | ||
280 | snapManager.enableSnapAlign(false); | ||
281 | } | 285 | } |
282 | else { | 286 | else { |
283 | console.log("Left BrushTool"); | 287 | console.log("Left BrushTool"); |