From abeb9f1e23679200bb2f4a3ccbcebfb37645975c Mon Sep 17 00:00:00 2001 From: Pushkar Joshi Date: Thu, 9 Feb 2012 10:45:50 -0800 Subject: first phase of simple resampling to prevent tiny segments --- js/tools/BrushTool.js | 170 ++++++++++++++++++++++++++------------------------ 1 file changed, 87 insertions(+), 83 deletions(-) (limited to 'js/tools') diff --git a/js/tools/BrushTool.js b/js/tools/BrushTool.js index ce8ffbb9..97df84a0 100644 --- a/js/tools/BrushTool.js +++ b/js/tools/BrushTool.js @@ -65,12 +65,30 @@ exports.BrushTool = Montage.create(ShapeTool, { if (this._selectedBrushStroke === null){ this._selectedBrushStroke = new GLBrushStroke(); } - console.log("BrushTool Start"); NJevent("enableStageMove");//stageManagerModule.stageManager.enableMouseMove(); } //value: function (event) { }, //HandleLeftButtonDown + _getUnsnappedPosition: { + value: function(x,y){ + var elemSnap = snapManager.elementSnapEnabled(); + var gridSnap = snapManager.gridSnapEnabled(); + var alignSnap = snapManager.snapAlignEnabled(); + snapManager.enableElementSnap(false); + snapManager.enableGridSnap(false); + snapManager.enableSnapAlign(false); + + var point = webkitConvertPointFromPageToNode(this.application.ninja.stage.canvas, new WebKitPoint(x,y)); + var unsnappedpos = DrawingToolBase.getHitRecPos(snapManager.snap(point.x, point.y, false)); + + snapManager.enableElementSnap(elemSnap); + snapManager.enableGridSnap(gridSnap); + snapManager.enableSnapAlign(alignSnap); + + return unsnappedpos; + } + }, //need to override this function because the ShapeTool's definition contains a clearDrawingCanvas call - Pushkar // might not need to override once we draw using OpenGL instead of SVG // Also took out all the snapping code for now...need to add that back @@ -84,20 +102,10 @@ exports.BrushTool = Montage.create(ShapeTool, { } if (this._isDrawing) { - snapManager.enableElementSnap(false); - snapManager.enableGridSnap(false); - snapManager.enableSnapAlign(false); - //this.doDraw(event); - //var currMousePos = this.getMouseUpPos(); - //instead of doDraw call own DrawingTool - var point = webkitConvertPointFromPageToNode(this.application.ninja.stage.canvas, new WebKitPoint(event.pageX, event.pageY)); - var hitRecSnapPoint = DrawingToolBase.getUpdatedSnapPointNoAppLevelEnabling(point.x, point.y, true, this.mouseDownHitRec); - var currMousePos = DrawingToolBase.getHitRecPos(hitRecSnapPoint); - + var currMousePos = this._getUnsnappedPosition(event.pageX, event.pageY); if (this._selectedBrushStroke){ this._selectedBrushStroke.addPoint(currMousePos); } - this.ShowCurrentBrushStrokeOnStage(); } //if (this._isDrawing) { @@ -123,7 +131,6 @@ exports.BrushTool = Montage.create(ShapeTool, { this._isDrawing = false; this._hasDraw = false; - console.log("BrushTool Stop"); //TODO get these values from the options if (this._selectedBrushStroke){ @@ -192,92 +199,89 @@ exports.BrushTool = Montage.create(ShapeTool, { RenderShape: { - value: function (w, h, planeMat, midPt, canvas) { - if ((Math.floor(w) === 0) || (Math.floor(h) === 0)) { - return; - } + value: function (w, h, planeMat, midPt, canvas) { + if ((Math.floor(w) === 0) || (Math.floor(h) === 0)) { + return; + } - var left = Math.round(midPt[0] - 0.5 * w); - var top = Math.round(midPt[1] - 0.5 * h); + var left = Math.round(midPt[0] - 0.5 * w); + var top = Math.round(midPt[1] - 0.5 * h); - if (!canvas) { - var newCanvas = NJUtils.makeNJElement("canvas", "Brushstroke", "shape", null, true); - var elementModel = TagTool.makeElement(w, h, planeMat, midPt, newCanvas); - ElementMediator.addElement(newCanvas, elementModel.data, true); + if (!canvas) { + var newCanvas = NJUtils.makeNJElement("canvas", "Brushstroke", "shape", null, true); + var elementModel = TagTool.makeElement(w, h, planeMat, midPt, newCanvas); + ElementMediator.addElement(newCanvas, elementModel.data, true); - // create all the GL stuff - var world = this.getGLWorld(newCanvas, this._useWebGL); - //store a reference to this newly created canvas - this._brushStrokeCanvas = newCanvas; + // create all the GL stuff + var world = this.getGLWorld(newCanvas, this._useWebGL); + //store a reference to this newly created canvas + this._brushStrokeCanvas = newCanvas; - var brushStroke = this._selectedBrushStroke; - if (brushStroke){ - brushStroke.setWorld(world); + var brushStroke = this._selectedBrushStroke; + if (brushStroke){ + brushStroke.setWorld(world); - brushStroke.setPlaneMatrix(planeMat); - var planeMatInv = glmat4.inverse( planeMat, [] ); - brushStroke.setPlaneMatrixInverse(planeMatInv); - brushStroke.setPlaneCenter(midPt); + brushStroke.setPlaneMatrix(planeMat); + var planeMatInv = glmat4.inverse( planeMat, [] ); + brushStroke.setPlaneMatrixInverse(planeMatInv); + brushStroke.setPlaneCenter(midPt); - world.addObject(brushStroke); - world.render(); - //TODO this will not work if there are multiple shapes in the same canvas - newCanvas.elementModel.shapeModel.GLGeomObj = brushStroke; - } - } //if (!canvas) { - else { - - var world = null; - if (canvas.elementModel.shapeModel && canvas.elementModel.shapeModel.GLWorld) { - world = canvas.elementModel.shapeModel.GLWorld; - } else { - world = this.getGLWorld(canvas, this._useWebGL);//this.options.use3D);//this.CreateGLWorld(planeMat, midPt, canvas, this._useWebGL);//fillMaterial, strokeMaterial); - } + world.addObject(brushStroke); + world.render(); + //TODO this will not work if there are multiple shapes in the same canvas + newCanvas.elementModel.shapeModel.GLGeomObj = brushStroke; + } + } //if (!canvas) { + else { + var world = null; + if (canvas.elementModel.shapeModel && canvas.elementModel.shapeModel.GLWorld) { + world = canvas.elementModel.shapeModel.GLWorld; + } else { + world = this.getGLWorld(canvas, this._useWebGL); + } - if (this._entryEditMode !== this.ENTRY_SELECT_CANVAS){ - //update the left and top of the canvas element - var canvasArray=[canvas]; - ElementMediator.setProperty(canvasArray, "left", [parseInt(left)+"px"],"Changing", "brushTool"); - ElementMediator.setProperty(canvasArray, "top", [parseInt(top) + "px"],"Changing", "brushTool"); - canvas.width = w; - canvas.height = h; - //update the viewport and projection to reflect the new canvas width and height - world.setViewportFromCanvas(canvas); - if (this._useWebGL){ - var cam = world.renderer.cameraManager().getActiveCamera(); - cam.setPerspective(world.getFOV(), world.getAspect(), world.getZNear(), world.getZFar()); + + if (this._entryEditMode !== this.ENTRY_SELECT_CANVAS){ + //update the left and top of the canvas element + var canvasArray=[canvas]; + ElementMediator.setProperty(canvasArray, "left", [parseInt(left)+"px"],"Changing", "brushTool"); + ElementMediator.setProperty(canvasArray, "top", [parseInt(top) + "px"],"Changing", "brushTool"); + canvas.width = w; + canvas.height = h; + //update the viewport and projection to reflect the new canvas width and height + world.setViewportFromCanvas(canvas); + if (this._useWebGL){ + var cam = world.renderer.cameraManager().getActiveCamera(); + cam.setPerspective(world.getFOV(), world.getAspect(), world.getZNear(), world.getZFar()); + } } - } - var brushStroke = this._selectedBrushStroke; + var brushStroke = this._selectedBrushStroke; - if (brushStroke){ - brushStroke.setDrawingTool(this); + if (brushStroke){ + brushStroke.setDrawingTool(this); - brushStroke.setPlaneMatrix(planeMat); - var planeMatInv = glmat4.inverse( planeMat, [] ); - brushStroke.setPlaneMatrixInverse(planeMatInv); - brushStroke.setPlaneCenter(midPt); + brushStroke.setPlaneMatrix(planeMat); + var planeMatInv = glmat4.inverse( planeMat, [] ); + brushStroke.setPlaneMatrixInverse(planeMatInv); + brushStroke.setPlaneCenter(midPt); - brushStroke.setWorld(world); - world.addIfNewObject(brushStroke); - //world.addObject(subpath); - world.render(); - //TODO this will not work if there are multiple shapes in the same canvas - canvas.elementModel.shapeModel.GLGeomObj = brushStroke; - } - } //else of if (!canvas) { - } //value: function (w, h, planeMat, midPt, canvas) { - }, //RenderShape: { + brushStroke.setWorld(world); + world.addIfNewObject(brushStroke); + //world.addObject(subpath); + world.render(); + //TODO this will not work if there are multiple shapes in the same canvas + canvas.elementModel.shapeModel.GLGeomObj = brushStroke; + } + } //else of if (!canvas) { + } //value: function (w, h, planeMat, midPt, canvas) { + }, //RenderShape: { + Configure: { value: function (wasSelected) { if (wasSelected) { - console.log("Picked BrushTool"); - //todo these calls have no effect because the drawing-tool-base (in getInitialSnapPoint) overrides them with what's set at the application level - snapManager.enableElementSnap(false); - snapManager.enableGridSnap(false); - snapManager.enableSnapAlign(false); + console.log("Entered BrushTool"); } else { console.log("Left BrushTool"); -- cgit v1.2.3 From 9d3589feb0174c09d1c1bac405660f8900259c7d Mon Sep 17 00:00:00 2001 From: hwc487 Date: Wed, 22 Feb 2012 04:44:07 -0800 Subject: Adding bug fixes. --- js/tools/RotateStage3DTool.js | 7 ++++++- js/tools/ZoomTool.js | 2 +- 2 files changed, 7 insertions(+), 2 deletions(-) (limited to 'js/tools') diff --git a/js/tools/RotateStage3DTool.js b/js/tools/RotateStage3DTool.js index ca2a8bf3..2b312e53 100755 --- a/js/tools/RotateStage3DTool.js +++ b/js/tools/RotateStage3DTool.js @@ -131,9 +131,14 @@ exports.RotateStage3DTool = Montage.create(Rotate3DToolBase, { var iMat = Matrix.I(4); ElementsMediator.setMatrix(this.application.ninja.currentDocument.documentRoot, iMat, false); - this.application.ninja.currentDocument.documentRoot.elementModel.props3D.m_transformCtr = null; + // let the document and stage manager know about the zoom change + this.application.ninja.stage._firstDraw = true; + this.application.ninja.documentBar.zoomFactor = 100; + this.application.ninja.currentDocument.iframe.style.zoom = 1.0; + this.application.ninja.stage._firstDraw = false; + // TODO - Any updates to the stage should redraw stage's children. Move this to mediator? this.application.ninja.stage.updatedStage = true; diff --git a/js/tools/ZoomTool.js b/js/tools/ZoomTool.js index 4b6705c1..93caf984 100755 --- a/js/tools/ZoomTool.js +++ b/js/tools/ZoomTool.js @@ -146,7 +146,7 @@ exports.ZoomTool = Montage.create(DrawingTool, { var dx = Math.abs(point.x - this.downPoint.x), dy = Math.abs(point.y - this.downPoint.y); - if ((dx >= 4) || (dy >= 4)) + if ((dx >= 10) || (dy >= 10)) { // Drawing the Marquee if(this.options.selectedElement==="zoomInTool") -- cgit v1.2.3 From d0661d6c587aced68a68e36a5ec4e81f8a2096e8 Mon Sep 17 00:00:00 2001 From: hwc487 Date: Thu, 23 Feb 2012 16:57:55 -0800 Subject: bug fixes for canvas 2d shape drawing. --- js/tools/LineTool.js | 5 ++++- 1 file changed, 4 insertions(+), 1 deletion(-) (limited to 'js/tools') diff --git a/js/tools/LineTool.js b/js/tools/LineTool.js index 233316a5..0a7c0534 100755 --- a/js/tools/LineTool.js +++ b/js/tools/LineTool.js @@ -42,7 +42,10 @@ exports.LineTool = Montage.create(ShapeTool, { } this._strokeSize = ShapesController.GetValueInPixels(this.options.strokeSize.value, this.options.strokeSize.units, null); - this._strokeColor = this.application.ninja.colorController.colorToolbar.stroke.color.css; + if (this.application.ninja.colorController.colorToolbar.stroke.color) + this._strokeColor = this.application.ninja.colorController.colorToolbar.stroke.color.css; + else + this._strokeColor = [0,0,0,1]; this.startDraw(event); } }, -- cgit v1.2.3 From 8dd707776024ff067064e7841810d04f2f7a1df7 Mon Sep 17 00:00:00 2001 From: Nivesh Rajbhandari Date: Fri, 24 Feb 2012 11:55:15 -0800 Subject: Adjusting fill and ink bottle cursors to match the tips of the icons. Signed-off-by: Nivesh Rajbhandari --- js/tools/FillTool.js | 4 ++-- js/tools/InkBottleTool.js | 4 ++-- 2 files changed, 4 insertions(+), 4 deletions(-) (limited to 'js/tools') diff --git a/js/tools/FillTool.js b/js/tools/FillTool.js index 46d76a19..4b07ae83 100755 --- a/js/tools/FillTool.js +++ b/js/tools/FillTool.js @@ -22,14 +22,14 @@ exports.FillTool = Montage.create(ModifierToolBase, { value : function (event) { var obj = this.application.ninja.stage.GetElement(event); - var cursor = "url('images/cursors/fill.png') 17 12, default"; + var cursor = "url('images/cursors/fill.png') 14 14, default"; var canColor = true; if (obj) { var name = obj.nodeName; if ((name !== 'CANVAS') && (name !== 'DIV')) { - cursor = "url('images/cursors/nofill.png') 17 12, default"; + cursor = "url('images/cursors/nofill.png') 14 14, default"; canColor = false; } } diff --git a/js/tools/InkBottleTool.js b/js/tools/InkBottleTool.js index 2be74ada..8340ef50 100755 --- a/js/tools/InkBottleTool.js +++ b/js/tools/InkBottleTool.js @@ -16,14 +16,14 @@ exports.InkBottleTool = Montage.create(ModifierToolBase, { value : function (event) { var obj = this.application.ninja.stage.GetElement(event); - var cursor = "url('images/cursors/ink.png') 17 12, default"; + var cursor = "url('images/cursors/ink.png') 6 11, default"; var canColor = true; if (obj) { var name = obj.nodeName; if ((name !== 'CANVAS') && (name !== 'DIV')) { - cursor = "url('images/cursors/ink_no.png') 17 12, default"; + cursor = "url('images/cursors/ink_no.png') 6 11, default"; canColor = false; } } -- cgit v1.2.3 From 818ec3b66d4394d80fcffbfcee82b40fe1477319 Mon Sep 17 00:00:00 2001 From: Nivesh Rajbhandari Date: Fri, 24 Feb 2012 11:56:42 -0800 Subject: Distinguish between border top/right/bottom/left colors. Also, fall back to snapping routine when selecting only if the active tool allows snapping. Signed-off-by: Nivesh Rajbhandari --- js/tools/EyedropperTool.js | 81 ++++++++++++++++++++++++++++------------------ 1 file changed, 49 insertions(+), 32 deletions(-) (limited to 'js/tools') diff --git a/js/tools/EyedropperTool.js b/js/tools/EyedropperTool.js index d007da39..710c96ef 100755 --- a/js/tools/EyedropperTool.js +++ b/js/tools/EyedropperTool.js @@ -18,6 +18,7 @@ exports.EyedropperTool = Montage.create(toolBase, { _elementUnderMouse: { value: null }, _imageDataCanvas: { value: null }, _imageDataContext: { value: null }, + _canSnap: { value: false }, Configure: { value: function ( doActivate ) @@ -143,10 +144,14 @@ exports.EyedropperTool = Montage.create(toolBase, { { this._deleteImageDataCanvas(); - c = ElementsMediator.getColor(obj, this._isOverBackground(obj, event)); - if(c) + c = this._getColorFromElement(obj, event); + if(typeof(c) === "string") + { + color = this.application.ninja.colorController.getColorObjFromCss(c); + } + else { - color = this.application.ninja.colorController.getColorObjFromCss(c.color.css); + color = c; } } @@ -202,51 +207,63 @@ exports.EyedropperTool = Montage.create(toolBase, { }, // TODO - We don't want to calculate this repeatedly - _isOverBackground: { + _getColorFromElement: { value: function(elt, event) { - var border = ElementsMediator.getProperty(elt, "border", parseFloat); - + var border = ElementsMediator.getProperty(elt, "border"), + borderWidth, + bounds3D, + innerBounds, + pt, + bt, + br, + bb, + bl, + xAdj, + yAdj, + tmpPt, + x, + y; if(border) { - var bounds3D, - innerBounds = [], - pt = webkitConvertPointFromPageToNode(this.application.ninja.stage.canvas, new WebKitPoint(event.pageX, event.pageY)), - bt = ElementsMediator.getProperty(elt, "border-top", parseFloat), - br = ElementsMediator.getProperty(elt, "border-right", parseFloat), - bb = ElementsMediator.getProperty(elt, "border-bottom", parseFloat), - bl = ElementsMediator.getProperty(elt, "border-left", parseFloat); - -// this.application.ninja.stage.viewUtils.setViewportObj( elt ); bounds3D = this.application.ninja.stage.viewUtils.getElementViewBounds3D( elt ); -// console.log("bounds"); -// console.dir(bounds3D); + innerBounds = []; + pt = webkitConvertPointFromPageToNode(this.application.ninja.stage.canvas, + new WebKitPoint(event.pageX, event.pageY)); + borderWidth = parseFloat(border); + if(isNaN(borderWidth)) + { + bt = ElementsMediator.getProperty(elt, "border-top", parseFloat); + br = ElementsMediator.getProperty(elt, "border-right", parseFloat); + bb = ElementsMediator.getProperty(elt, "border-bottom", parseFloat); + bl = ElementsMediator.getProperty(elt, "border-left", parseFloat); + borderWidth = 0; + } + xAdj = bl || borderWidth; + yAdj = bt || borderWidth; - var xAdj = bl || border, - yAdj = bt || border; innerBounds.push([bounds3D[0][0] + xAdj, bounds3D[0][1] + yAdj, 0]); - yAdj += bb || border; + yAdj = bb || borderWidth; innerBounds.push([bounds3D[1][0] + xAdj, bounds3D[1][1] - yAdj, 0]); - xAdj += br || border; + xAdj = br || borderWidth; innerBounds.push([bounds3D[2][0] - xAdj, bounds3D[2][1] - yAdj, 0]); - yAdj = bt || border; + yAdj = bt || borderWidth; innerBounds.push([bounds3D[3][0] - xAdj, bounds3D[3][1] + yAdj, 0]); -// console.log("innerBounds"); -// console.dir(innerBounds); - var tmpPt = this.application.ninja.stage.viewUtils.globalToLocal([pt.x, pt.y], elt); - var x = tmpPt[0], - y = tmpPt[1]; + tmpPt = this.application.ninja.stage.viewUtils.globalToLocal([pt.x, pt.y], elt); + x = tmpPt[0]; + y = tmpPt[1]; - if(x < innerBounds[0][0]) return false; - if(x > innerBounds[2][0]) return false; - if(y < innerBounds[0][1]) return false; - if(y > innerBounds[1][1]) return false; + if(x < innerBounds[0][0]) return ElementsMediator.getProperty(elt, "border-left-color"); + if(x > innerBounds[2][0]) return ElementsMediator.getProperty(elt, "border-right-color"); + if(y < innerBounds[0][1]) return ElementsMediator.getProperty(elt, "border-top-color"); + if(y > innerBounds[1][1]) return ElementsMediator.getProperty(elt, "border-bottom-color"); } - return true; + + return ElementsMediator.getColor(elt, true); } }, -- cgit v1.2.3 From 9ef05a0e137d3d38e9a6b5d94851227440ac0fbc Mon Sep 17 00:00:00 2001 From: Nivesh Rajbhandari Date: Fri, 24 Feb 2012 16:48:14 -0800 Subject: Moved all color updating routines to a single function. Signed-off-by: Nivesh Rajbhandari --- js/tools/EyedropperTool.js | 110 ++++++++++++++++++++++++++------------------- 1 file changed, 64 insertions(+), 46 deletions(-) (limited to 'js/tools') diff --git a/js/tools/EyedropperTool.js b/js/tools/EyedropperTool.js index 710c96ef..11c15158 100755 --- a/js/tools/EyedropperTool.js +++ b/js/tools/EyedropperTool.js @@ -71,7 +71,7 @@ exports.EyedropperTool = Montage.create(toolBase, { this._escape = false; } - this._updateColor(this._color); + this._updateColor(this._color, true); this._color = null; @@ -86,18 +86,7 @@ exports.EyedropperTool = Montage.create(toolBase, { if(this._color && this._color.value) { var color = this.application.ninja.colorController.getColorObjFromCss(this._previousColor); - - if (color && color.value) { - color.value.wasSetByCode = true; - color.value.type = 'change'; - if (color.value.a) { - this.application.ninja.colorController.colorModel.alpha = {value: color.value.a, - wasSetByCode: true, - type: 'change'}; - } - this.application.ninja.colorController.colorModel[color.mode] = color.value; - this._color = null; - } + this._updateColor(color, true); } this._escape = true; } @@ -151,21 +140,11 @@ exports.EyedropperTool = Montage.create(toolBase, { } else { - color = c; + color = this.application.ninja.colorController.getColorObjFromCss(c.color.css); } } - if (color && color.value) { - color.value.wasSetByCode = true; - color.value.type = 'changing'; - if (color.value.a) { - this.application.ninja.colorController.colorModel.alpha = {value: color.value.a, - wasSetByCode: true, - type: 'changing'}; - } - this.application.ninja.colorController.colorModel[color.mode] = color.value; - this._color = color; - } + this._updateColor(color, false); } else { @@ -177,32 +156,75 @@ exports.EyedropperTool = Montage.create(toolBase, { }, _updateColor: { - value: function(color) { - if (color && color.value) { - var input = this.application.ninja.colorController.colorModel.input; + value: function(color, updateColorToolBar) { + var eventType = "changing"; + if(updateColorToolBar) + { + eventType = "change"; + if (color && color.value) + { + var input = this.application.ninja.colorController.colorModel.input; + + if(input === "fill") + { + this.application.ninja.colorController.colorToolbar.fill_btn.color(color.mode, color.value); + } + else + { + this.application.ninja.colorController.colorToolbar.stroke_btn.color(color.mode, color.value); + } + + // Updating color chips will set the input type to "chip", so set it back here. + this.application.ninja.colorController.colorModel.input = input; + } + } + + if(color) + { + if(color.color) + { + color.color.wasSetByCode = true; + color.color.type = eventType; + } - if(input === "fill") + if(color.mode === "gradient") { - this.application.ninja.colorController.colorToolbar.fill_btn.color(color.mode, color.value); + this.application.ninja.colorController.colorModel["gradient"] = + {value: color.color, wasSetByCode: true, type: eventType}; } else { - this.application.ninja.colorController.colorToolbar.stroke_btn.color(color.mode, color.value); + if (color.color.a !== undefined) + { + this.application.ninja.colorController.colorModel.alpha = + {value: color.color.a, wasSetByCode: true, type: eventType}; + } + if(color.color.mode) + { + this.application.ninja.colorController.colorModel[color.color.mode] = color.color; + } + else + { + this.application.ninja.colorController.colorModel["rgb"] = color.color; + } } - // Updating color chips will set the input type to "chip", so set it back here. - this.application.ninja.colorController.colorModel.input = input; - - color.value.wasSetByCode = true; - color.value.type = 'change'; - if (color.value.a) { - this.application.ninja.colorController.colorModel.alpha = {value: color.value.a, - wasSetByCode: true, - type: 'change'}; + if(updateColorToolBar) + { + this._previousColor = color.color.css; } - this.application.ninja.colorController.colorModel[color.mode] = color.value; - this._previousColor = color.value.css; } + else + { + this.application.ninja.colorController.colorModel.alpha = {value: 1, wasSetByCode: true, type: eventType}; + this.application.ninja.colorController.colorModel.applyNoColor(); + if(updateColorToolBar) + { + this._previousColor = "none"; + } + } + + this._color = color; } }, @@ -288,8 +310,6 @@ exports.EyedropperTool = Montage.create(toolBase, { this._imageDataCanvas.width = w; this._imageDataCanvas.height = h; -// this.application.ninja.currentDocument.documentRoot.appendChild(this._imageDataCanvas); - this._imageDataContext = this._imageDataCanvas.getContext("2d"); this._imageDataContext.drawImage(elt, 0, 0); } @@ -306,7 +326,6 @@ exports.EyedropperTool = Montage.create(toolBase, { _getColorFromCanvas: { value: function(ctx, pt) { -// var imageData = ctx.getImageData(pt.x, pt.y, 1, 1).data; var imageData = ctx.getImageData(pt[0], pt[1], 1, 1).data; if(imageData) { @@ -324,7 +343,6 @@ exports.EyedropperTool = Montage.create(toolBase, { { if(this._imageDataCanvas) { -// this.application.ninja.currentDocument.documentRoot.removeChild(this._imageDataCanvas); this._imageDataCanvas = null; this._imageDataContext = null; } -- cgit v1.2.3 From b194efa0556806593b29eb197250df462e89fcc4 Mon Sep 17 00:00:00 2001 From: hwc487 Date: Mon, 27 Feb 2012 14:03:11 -0800 Subject: Enable shift key constraint for Pan Tool. --- js/tools/PanTool.js | 23 +++++++++++++++++++++++ 1 file changed, 23 insertions(+) (limited to 'js/tools') diff --git a/js/tools/PanTool.js b/js/tools/PanTool.js index 71301d46..0537a27b 100755 --- a/js/tools/PanTool.js +++ b/js/tools/PanTool.js @@ -81,6 +81,14 @@ exports.PanTool = Montage.create(toolBase, { this._altKeyDown = true; } + else if (event.shiftKey) + { + if (!this._shiftKeyDown) + { + this._shiftKeyDown = true; + this._shiftPt = this._lastGPt.slice(); + } + } } }, @@ -90,6 +98,10 @@ exports.PanTool = Montage.create(toolBase, { this._altKeyDown = false; } + else if (event.keyCode === Keyboard.SHIFT) + { + this._shiftKeyDown = false; + } } }, @@ -221,6 +233,7 @@ exports.PanTool = Montage.create(toolBase, var tmpLocal = MathUtils.transformAndDivideHomogeneousPoint( this._globalPt, globalToLocalMat ); this._lastGPt = this._globalPt.slice(); + this._shiftPt = this._lastGPt.slice(); this._lastY = this._lastGPt[1]; // set up the matrices we will be needing @@ -285,6 +298,16 @@ exports.PanTool = Montage.create(toolBase, this._globalPt[2] += dy; gPt = [this._lastGPt[0], this._lastGPt[1], this._globalPt[2]]; } + else if (this._shiftKeyDown) + { + var dx = Math.abs( this._shiftPt[0] - gPt[0] ), + dy = Math.abs( this._shiftPt[1] - gPt[1] ); + + if (dx >= dy) + gPt[1] = this._shiftPt[1]; + else + gPt[0] = this._shiftPt[0]; + } // update the scrollbars var deltaGPt = VecUtils.vecSubtract(2, gPt, this._lastGPt); -- cgit v1.2.3 From ef38731ae2769dcb2247db599cdfe62d38e34b28 Mon Sep 17 00:00:00 2001 From: Nivesh Rajbhandari Date: Mon, 27 Feb 2012 15:39:16 -0800 Subject: Reset translation values as well when double-clicking to reset the rotation values. Signed-off-by: Nivesh Rajbhandari --- js/tools/Rotate3DToolBase.js | 11 ++++------- js/tools/Translate3DToolBase.js | 1 - 2 files changed, 4 insertions(+), 8 deletions(-) (limited to 'js/tools') diff --git a/js/tools/Rotate3DToolBase.js b/js/tools/Rotate3DToolBase.js index aa91b2f4..b04e8b0a 100755 --- a/js/tools/Rotate3DToolBase.js +++ b/js/tools/Rotate3DToolBase.js @@ -447,16 +447,13 @@ exports.Rotate3DToolBase = Montage.create(ModifierToolBase, { iMat; for(var i = 0; i < len; i++) { - // Reset to the identity matrix but retain the rotation values + // Reset to the identity matrix item = this._targets[i]; - elt = item.elt; - - // Reset to the identity matrix but retain the translation values iMat = Matrix.I(4); mat = item.mat; - iMat[12] = mat[12]; - iMat[13] = mat[13]; - iMat[14] = mat[14]; +// iMat[12] = mat[12]; +// iMat[13] = mat[13]; +// iMat[14] = mat[14]; dist = this._undoArray[i].dist; diff --git a/js/tools/Translate3DToolBase.js b/js/tools/Translate3DToolBase.js index cbf76830..3d9191da 100755 --- a/js/tools/Translate3DToolBase.js +++ b/js/tools/Translate3DToolBase.js @@ -85,7 +85,6 @@ exports.Translate3DToolBase = Montage.create(ModifierToolBase, { // Reset to the identity matrix but retain the rotation values item = this._targets[i]; - elt = item.elt; mat = item.mat.slice(0); mat[12] = 0; mat[13] = 0; -- cgit v1.2.3 From 7cbd26d475eaad817042692f9116f9a24ae60997 Mon Sep 17 00:00:00 2001 From: Pushkar Joshi Date: Tue, 28 Feb 2012 10:24:06 -0800 Subject: Bug fixes: 1152: allow deleting of multiple paths from inside pen tool 1128: keyboard hotkey shortcut 'P' for pen tool 941: changing width or height of the path scales the path --- js/tools/PenTool.js | 77 +++++++++++++++++++++++++++++++++++++---------------- 1 file changed, 54 insertions(+), 23 deletions(-) (limited to 'js/tools') diff --git a/js/tools/PenTool.js b/js/tools/PenTool.js index 7749d525..bb9c71e7 100755 --- a/js/tools/PenTool.js +++ b/js/tools/PenTool.js @@ -955,33 +955,64 @@ exports.PenTool = Montage.create(ShapeTool, { handleDelete:{ value: function(event){ - //clear the selected subpath...the only new additions to this function w.r.t. ToolBase - if (this._selectedSubpath){ - if (this._selectedSubpath.getSelectedAnchorIndex()>=0){ - this._hoveredAnchorIndex=-1; - this._selectedSubpath.removeAnchor(this._selectedSubpath.getSelectedAnchorIndex()); - this._selectedSubpath.createSamples(); - //clear the canvas - this.application.ninja.stage.clearDrawingCanvas();//stageManagerModule.stageManager.clearDrawingCanvas(); - this.DrawSubpathAnchors(this._selectedSubpath); - this.ShowSelectedSubpath(); + var len = this.application.ninja.selectedElements.length; + if (len===0) { + //clear the selected subpath...the only new additions to this function w.r.t. ToolBase + if (this._selectedSubpath){ + if (this._selectedSubpath.getSelectedAnchorIndex()>=0){ + this._hoveredAnchorIndex=-1; + this._selectedSubpath.removeAnchor(this._selectedSubpath.getSelectedAnchorIndex()); + this._selectedSubpath.createSamples(); + //clear the canvas + this.application.ninja.stage.clearDrawingCanvas();//stageManagerModule.stageManager.clearDrawingCanvas(); + this.DrawSubpathAnchors(this._selectedSubpath); + this.ShowSelectedSubpath(); + } + else { + this._selectedSubpath.clearAllAnchors(); //perhaps unnecessary + this._selectedSubpath = null; + //clear the canvas + this.application.ninja.stage.clearDrawingCanvas();//stageManagerModule.stageManager.clearDrawingCanvas(); + + //undo/redo...go through ElementController and NJEvent + var els = []; + ElementController.removeElement(this._penCanvas); + els.push(this._penCanvas); + NJevent( "deleteSelection", els ); + this._penCanvas = null; + } + } + //do nothing if there was no selected subpath and if there was no selection + } + else { + + //undo/redo...go through ElementMediator (see ElementMediator.handleDeleting() from where the much of this function is copied) + //clear the canvas + this.application.ninja.stage.clearDrawingCanvas();//stageManagerModule.stageManager.clearDrawingCanvas(); + var els = []; + for(var i = 0; i=0 && this._hoveredAnchorIndex=0 && this._hoveredAnchorIndex --- js/tools/SelectionTool.js | 3 +++ 1 file changed, 3 insertions(+) (limited to 'js/tools') diff --git a/js/tools/SelectionTool.js b/js/tools/SelectionTool.js index 37029e8c..83d52d52 100755 --- a/js/tools/SelectionTool.js +++ b/js/tools/SelectionTool.js @@ -305,6 +305,9 @@ var SelectionTool = exports.SelectionTool = Montage.create(ModifierToolBase, { newHeight.push(_h + "px"); viewUtils.setMatrixForElement(elt, previousMat); + + this._targets[i].mat = previousMat; + this._targets[i].matInv = glmat4.inverse(previousMat, []); } } if(addToUndoStack) -- cgit v1.2.3 From f931c48a7d0bcf1222cf05787e3294839ed0b9fb Mon Sep 17 00:00:00 2001 From: Pushkar Joshi Date: Wed, 29 Feb 2012 09:47:41 -0800 Subject: resample the brush stroke so we don't have gaps if the path is drawn rapidly, and, allow to change the stroke color, and, more efficient stroke rendering by drawing translated radial gradients (instead of creating new gradients for each stroke sample) --- js/tools/BrushTool.js | 12 +++++++----- 1 file changed, 7 insertions(+), 5 deletions(-) (limited to 'js/tools') diff --git a/js/tools/BrushTool.js b/js/tools/BrushTool.js index 9a0ad583..776d914c 100644 --- a/js/tools/BrushTool.js +++ b/js/tools/BrushTool.js @@ -64,6 +64,11 @@ exports.BrushTool = Montage.create(ShapeTool, { //start a new brush stroke if (this._selectedBrushStroke === null){ this._selectedBrushStroke = new GLBrushStroke(); + if (this.application.ninja.colorController.colorToolbar.stroke.webGlColor){ + this._selectedBrushStroke.setStrokeColor(this.application.ninja.colorController.colorToolbar.stroke.webGlColor); + } + //TODO get these values from the options + this._selectedBrushStroke.setStrokeWidth(20); } NJevent("enableStageMove");//stageManagerModule.stageManager.enableMouseMove(); } //value: function (event) { @@ -132,10 +137,7 @@ exports.BrushTool = Montage.create(ShapeTool, { this._isDrawing = false; this._hasDraw = false; - //TODO get these values from the options - if (this._selectedBrushStroke){ - this._selectedBrushStroke.setStrokeWidth(20); - } + //display the previously drawn stroke in a separate canvas this.RenderCurrentBrushStroke(); @@ -150,7 +152,7 @@ exports.BrushTool = Montage.create(ShapeTool, { //clear the canvas before we draw anything else this.application.ninja.stage.clearDrawingCanvas(); if (this._selectedBrushStroke && this._selectedBrushStroke.getNumPoints()>0){ - this._selectedBrushStroke.computeMetaGeometry(); + //this._selectedBrushStroke.computeMetaGeometry(); var ctx = this.application.ninja.stage.drawingContext;//stageManagerModule.stageManager.drawingContext; if (ctx === null) throw ("null drawing context in Brushtool::ShowCurrentBrushStrokeOnStage"); -- cgit v1.2.3 From 46fb52be241dced940d46629c809a09c86ed4438 Mon Sep 17 00:00:00 2001 From: Pushkar Joshi Date: Wed, 29 Feb 2012 11:38:33 -0800 Subject: changed the registration point of the brush tool icon and added a temporary check to prevent extremely long brush strokes --- js/tools/BrushTool.js | 6 +++++- 1 file changed, 5 insertions(+), 1 deletion(-) (limited to 'js/tools') diff --git a/js/tools/BrushTool.js b/js/tools/BrushTool.js index 776d914c..fec89eb2 100644 --- a/js/tools/BrushTool.js +++ b/js/tools/BrushTool.js @@ -67,6 +67,10 @@ exports.BrushTool = Montage.create(ShapeTool, { if (this.application.ninja.colorController.colorToolbar.stroke.webGlColor){ this._selectedBrushStroke.setStrokeColor(this.application.ninja.colorController.colorToolbar.stroke.webGlColor); } + //add this point to the brush stroke in case the user does a mouse up before doing a mouse move + var currMousePos = this._getUnsnappedPosition(event.pageX, event.pageY); + this._selectedBrushStroke.addPoint(currMousePos); + //TODO get these values from the options this._selectedBrushStroke.setStrokeWidth(20); } @@ -108,7 +112,7 @@ exports.BrushTool = Montage.create(ShapeTool, { if (this._isDrawing) { var currMousePos = this._getUnsnappedPosition(event.pageX, event.pageY); - if (this._selectedBrushStroke){ + if (this._selectedBrushStroke && this._selectedBrushStroke.getNumPoints()<100){ this._selectedBrushStroke.addPoint(currMousePos); } this.ShowCurrentBrushStrokeOnStage(); -- cgit v1.2.3 From a89e30ab834a48be32b6122e0c8ac1e0c3ed43e8 Mon Sep 17 00:00:00 2001 From: Nivesh Rajbhandari Date: Wed, 29 Feb 2012 11:58:28 -0800 Subject: Fix for performance issue when moving shapes. We don't need to call render except if the geometry and materials change. This is more easy to see with shapes like the brush tool. Signed-off-by: Nivesh Rajbhandari --- js/tools/SelectionTool.js | 16 +++++++++++++++- 1 file changed, 15 insertions(+), 1 deletion(-) (limited to 'js/tools') diff --git a/js/tools/SelectionTool.js b/js/tools/SelectionTool.js index 83d52d52..caa9e8d6 100755 --- a/js/tools/SelectionTool.js +++ b/js/tools/SelectionTool.js @@ -312,12 +312,26 @@ var SelectionTool = exports.SelectionTool = Montage.create(ModifierToolBase, { } if(addToUndoStack) { - ElementsMediator.setProperties(this.application.ninja.selectedElements, + // if we have a delta, that means the transform handles were used and + // we should update the width and height too. Otherwise, just update left and top. + if(this._delta) + { + ElementsMediator.setProperties(this.application.ninja.selectedElements, { "left": newLeft, "top": newTop, "width": newWidth, "height": newHeight }, "Change", "selectionTool", { "left" : previousLeft, "top" : previousTop, "width": previousWidth, "height": previousHeight} ); + } + else + { + ElementsMediator.setProperties(this.application.ninja.selectedElements, + { "left": newLeft, "top": newTop }, + "Change", + "selectionTool", + { "left" : previousLeft, "top" : previousTop } + ); + } } // Save previous value for undo/redo this._undoArray = []; -- cgit v1.2.3