From 923e760bf4a16baa82e81da6d38e671620664e8f Mon Sep 17 00:00:00 2001 From: Nivesh Rajbhandari Date: Wed, 25 Jul 2012 14:34:59 -0700 Subject: Support line shape drawing inside existing canvases. Signed-off-by: Nivesh Rajbhandari --- js/lib/geom/line.js | 13 ++++++++++-- js/tools/LineTool.js | 56 ++++++++++++++++++++++++++++------------------------ 2 files changed, 41 insertions(+), 28 deletions(-) (limited to 'js') diff --git a/js/lib/geom/line.js b/js/lib/geom/line.js index eec4f6d9..df65ee86 100755 --- a/js/lib/geom/line.js +++ b/js/lib/geom/line.js @@ -537,6 +537,15 @@ exports.Line = Object.create(GeomObj, { ctx.strokeStyle = c; } + var viewUtils = require("js/helper-classes/3D/view-utils").ViewUtils; + viewUtils.pushViewportObj( world.getCanvas() ); + var cop = viewUtils.getCenterOfProjection(); + viewUtils.popViewportObj(); + var xCtr = cop[0] + this._xOffset, yCtr = cop[1] - this._yOffset; + var xLeft = xCtr - 0.5*this.getWidth(), yTop = yCtr - 0.5*this.getHeight(); + var xDist = cop[0] - xLeft, yDist = cop[1] - yTop; + var xOff = 0.5*world.getViewportWidth() - xDist, yOff = 0.5*world.getViewportHeight() - yDist; + // get the points var p0, p1; if(this._slope === "vertical") { @@ -554,8 +563,8 @@ exports.Line = Object.create(GeomObj, { } // draw the line - ctx.moveTo( p0[0], p0[1] ); - ctx.lineTo( p1[0], p1[1] ); + ctx.moveTo( p0[0]+xOff, p0[1]+yOff ); + ctx.lineTo( p1[0]+xOff, p1[1]+yOff ); ctx.stroke(); } } diff --git a/js/tools/LineTool.js b/js/tools/LineTool.js index f0d96c3c..4ec327b5 100755 --- a/js/tools/LineTool.js +++ b/js/tools/LineTool.js @@ -97,34 +97,38 @@ exports.LineTool = Montage.create(ShapeTool, { if(this.drawData) { w = Math.floor(this.drawData.width); h = Math.floor(this.drawData.height); + // set the dimensions + if(slope === "horizontal") { + h = Math.max(this._strokeSize, 1); + w = Math.max(w, 1); + } else if(slope === "vertical") { + w = Math.max(this._strokeSize, 1); + h = Math.max(h, 1); + } else { + // else make the line's stroke fit inside the canvas by growing the canvas + var theta = Math.atan(slope); + xAdj = Math.abs((this._strokeSize/2)*Math.sin(theta)); + yAdj = Math.abs((this._strokeSize/2)*Math.cos(theta)); + + w += ~~(xAdj*2); + h += ~~(yAdj*2); + } + if(!this._useExistingCanvas()) { - // set the dimensions - if(slope === "horizontal") { - h = Math.max(this._strokeSize, 1); - w = Math.max(w, 1); - } else if(slope === "vertical") { - w = Math.max(this._strokeSize, 1); - h = Math.max(h, 1); - } else { - // else make the line's stroke fit inside the canvas by growing the canvas - var theta = Math.atan(slope); - xAdj = Math.abs((this._strokeSize/2)*Math.sin(theta)); - yAdj = Math.abs((this._strokeSize/2)*Math.cos(theta)); - - w += ~~(xAdj*2); - h += ~~(yAdj*2); - } - - canvas = document.application.njUtils.make("canvas", {"data-RDGE-id": NJUtils.generateRandom()}, this.application.ninja.currentDocument); - - var styles = document.application.njUtils.stylesFromDraw(canvas, w, h, this.drawData); - this.application.ninja.elementMediator.addElements(canvas, styles); - } else { - canvas = this._targetedElement; - canvas.elementModel.controller = ShapesController; - if(!canvas.elementModel.shapeModel) { - canvas.elementModel.shapeModel = Montage.create(ShapeModel); + + canvas = document.application.njUtils.make("canvas", {"data-RDGE-id": NJUtils.generateRandom()}, this.application.ninja.currentDocument); + + var styles = document.application.njUtils.stylesFromDraw(canvas, w, h, this.drawData); + this.application.ninja.elementMediator.addElements(canvas, styles); + } else { + canvas = this._targetedElement; + if (!canvas.getAttribute( "data-RDGE-id" )) + canvas.setAttribute( "data-RDGE-id", NJUtils.generateRandom() ); + canvas.elementModel.controller = ShapesController; + if(!canvas.elementModel.shapeModel) { + canvas.elementModel.shapeModel = Montage.create(ShapeModel); } + this.RenderShape(w, h, this.drawData.planeMat, this.drawData.midPt, canvas, slope, xAdj, yAdj); } } } -- cgit v1.2.3