From 3fd098981077e40841c013a8ac305036d08a215b Mon Sep 17 00:00:00 2001 From: Pushkar Joshi Date: Tue, 27 Mar 2012 15:40:37 -0700 Subject: added cursors to the pen tool UI AND change cursor when the user hovers over an anchor point or handles of thte selected anchor --- js/lib/geom/sub-path.js | 51 +++++++++++++++++++++++++++++++------------------ 1 file changed, 32 insertions(+), 19 deletions(-) (limited to 'js/lib') diff --git a/js/lib/geom/sub-path.js b/js/lib/geom/sub-path.js index 7046673e..9bd9ad9a 100755 --- a/js/lib/geom/sub-path.js +++ b/js/lib/geom/sub-path.js @@ -567,37 +567,50 @@ GLSubpath.prototype._isWithinBoundingBox = function(point, ctrlPts, radius) { return true; }; +GLSubpath.prototype._checkAnchorIntersection = function(pickX, pickY, pickZ, radSq, anchorIndex, minDistance) { + var distSq = this._Anchors[anchorIndex].getDistanceSq(pickX, pickY, pickZ); + //check the anchor point + if (distSq < radSq && distSq=0 && this._selectedAnchorIndexx || this._BBoxMin[1]>y || this._BBoxMin[2]>z){ return false; } -- cgit v1.2.3 From 878743cbbb75f2fc84855ca27779597b67ab1a95 Mon Sep 17 00:00:00 2001 From: Pushkar Joshi Date: Mon, 2 Apr 2012 15:25:00 -0700 Subject: render the pen path with local coordinates, but use stage world coordinates to position the canvas on which the path is rendered AND add data-montage- to the ids in the pen and brush reels AND fix a bug with pen stroke transparency not working --- js/lib/geom/brush-stroke.js | 2 +- js/lib/geom/sub-path.js | 264 +++++++++++++++++++++++++++++++++++++++----- 2 files changed, 239 insertions(+), 27 deletions(-) (limited to 'js/lib') diff --git a/js/lib/geom/brush-stroke.js b/js/lib/geom/brush-stroke.js index 22209815..e93c9382 100755 --- a/js/lib/geom/brush-stroke.js +++ b/js/lib/geom/brush-stroke.js @@ -413,7 +413,7 @@ var BrushStroke = function GLBrushStroke() { this._LocalPoints[i][1]+= halfheight; //store the original points - this._OrigLocalPoints .push([this._LocalPoints[i][0],this._LocalPoints[i][1],this._LocalPoints[i][2]]); + this._OrigLocalPoints.push([this._LocalPoints[i][0],this._LocalPoints[i][1],this._LocalPoints[i][2]]); } //update the bbox with the same adjustment as was made for the local points above this._BBoxMax[0]+= halfwidth;this._BBoxMin[0]+= halfwidth; diff --git a/js/lib/geom/sub-path.js b/js/lib/geom/sub-path.js index 9bd9ad9a..19a1da3b 100755 --- a/js/lib/geom/sub-path.js +++ b/js/lib/geom/sub-path.js @@ -12,6 +12,7 @@ var AnchorPoint = require("js/lib/geom/anchor-point").AnchorPoint; var MaterialsModel = require("js/models/materials-model").MaterialsModel; // TODO Those function do not seems to be used. We should remove them +/* function SubpathOffsetPoint(pos, mapPos) { this.Pos = [pos[0],pos[1],pos[2]]; this.CurveMapPos = [mapPos[0], mapPos[1], mapPos[2]]; @@ -33,7 +34,7 @@ function sortNumberDescending(a,b){ function SegmentIntersections(){ this.paramArray = []; } - +*/ /////////////////////////////////////////////////////////////////////// // Class GLSubpath // representation a sequence of cubic bezier curves. @@ -49,15 +50,22 @@ var GLSubpath = function GLSubpath() { this._BBoxMax = [0, 0, 0]; this._isClosed = false; - this._samples = []; //polyline representation of this curve - this._sampleParam = []; //parametric distance of samples, within [0, N], where N is # of Bezier curves (=# of anchor points if closed, =#anchor pts -1 if open) + this._samples = []; //polyline representation of this curve in stage world space + this._sampleParam = []; //parametric distance of samples, within [0, N], where N is # of Bezier curves (=# of anchor points if closed, =#anchor pts -1 if open) this._anchorSampleIndex = []; //index within _samples corresponding to anchor points - + + this._LocalPoints = []; //polyline representation of this curve in canvas space + this._LocalBBoxMin = [0,0,0]; //bbox min point of _LocalPoints + this._LocalBBoxMax = [0,0,0]; //bbox max point of _LocalPoints + this._UnprojectedAnchors = []; //initially set the _dirty bit so we will construct samples this._dirty = true; + //initially set the local dirty bit so we will construct local coordinates + this._isLocalDirty = true; + //whether or not to use the canvas drawing to stroke/fill this._useCanvasDrawing = true; @@ -69,7 +77,7 @@ var GLSubpath = function GLSubpath() { this._canvasY = 0; //stroke information - this._strokeWidth = 0.0; + this._strokeWidth = 1.0; this._strokeColor = [0.4, 0.4, 0.4, 1.0]; this._strokeMaterial = null this._strokeStyle = "Solid"; @@ -109,6 +117,13 @@ var GLSubpath = function GLSubpath() { // return; //no need to do anything for now }; + this._offsetLocalCoord = function(deltaW, deltaH){ + var numPoints = this._LocalPoints.length; + for (var i=0;i pt[d]) { + bboxMin[d] = pt[d]; + } + if (bboxMax[d] < pt[d]) { + bboxMax[d] = pt[d]; + } + } + } + //save the center of the bbox for later use (while constructing the canvas) + var stageWorldCenter = VecUtils.vecInterpolate(3, bboxMin, bboxMax, 0.5); + + // ***** center the input stageworld data about the center of the bbox ***** + this._LocalPoints = []; + for (i=0;i== 2) { + //compute the //re-compute the bounding box (this also accounts for stroke width, so assume the stroke width is set) this.computeBoundingBox(true); + //set the local dirty bit so we will re-create the local coords before rendering + this._isLocalDirty = true; } //if (this._dirty) this._dirty = false; }; +GLSubpath.prototype.getLocalBBoxMidInStageWorld = function() { + var ViewUtils = require("js/helper-classes/3D/view-utils").ViewUtils; + //compute the plane center as the midpoint of the local bbox converted to stage world space + var bboxWidth=0, bboxHeight=0; + var bboxMid=[0,0,0]; + bboxWidth = this._LocalBBoxMax[0] - this._LocalBBoxMin[0]; + bboxHeight = this._LocalBBoxMax[1] - this._LocalBBoxMin[1]; + bboxMid = [0.5 * (this._LocalBBoxMax[0] + this._LocalBBoxMin[0]), 0.5 * (this._LocalBBoxMax[1] + this._LocalBBoxMin[1]), 0.5 * (this._LocalBBoxMax[2] + this._LocalBBoxMin[2])]; + var planeCenter = ViewUtils.localToStageWorld(bboxMid, this._canvas); + planeCenter[0]+=400; planeCenter[1]+=300; //todo replace these lines with the correct call for the offset + console.log("PEN: local midPt: "+ bboxMid +", stageWorld midPt: "+planeCenter); + return planeCenter; +} + +GLSubpath.prototype._computeLocalBoundingBox = function() { + this._LocalBBoxMin = [Infinity, Infinity, Infinity]; + this._LocalBBoxMax = [-Infinity, -Infinity, -Infinity]; + var numPoints = this._LocalPoints.length; + if (numPoints === 0) { + this._LocalBBoxMin = [0, 0, 0]; + this._LocalBBoxMax = [0, 0, 0]; + } else { + for (var i=0;i pt[d]) { + this._LocalBBoxMin[d] = pt[d]; + } + if (this._LocalBBoxMax[d] < pt[d]) { + this._LocalBBoxMax[d] = pt[d]; + } + }//for every dimension d from 0 to 2 + } + } + + //increase the bbox given the stroke width + var halfSW = this._strokeWidth*0.5; + this._LocalBBoxMin[0]-= halfSW;this._LocalBBoxMin[1]-= halfSW; + this._LocalBBoxMax[0]+= halfSW;this._LocalBBoxMax[1]+= halfSW; +}; + GLSubpath.prototype.computeBoundingBox = function(useSamples){ this._BBoxMin = [Infinity, Infinity, Infinity]; this._BBoxMax = [-Infinity, -Infinity, -Infinity]; @@ -1102,7 +1314,7 @@ GLSubpath.prototype.computeBoundingBox = function(useSamples){ for (var d = 0; d < 3; d++) { this._BBoxMin[d]-= this._strokeWidth/2; this._BBoxMax[d]+= this._strokeWidth/2; - }//for every dimension d from 0 to 2 + }//for every dimension d from 0 to 3 }; //returns v such that it is in [min,max] -- cgit v1.2.3 From c838f85d28acbf2fe208a4358aef9cac73b65fbc Mon Sep 17 00:00:00 2001 From: Pushkar Joshi Date: Tue, 3 Apr 2012 10:14:49 -0700 Subject: First attempt at preventing the drifting of the canvas due to floating point roundoff errors when constantly changing stroke width --- js/lib/geom/sub-path.js | 27 +++++++++++++++++++++++++-- 1 file changed, 25 insertions(+), 2 deletions(-) (limited to 'js/lib') diff --git a/js/lib/geom/sub-path.js b/js/lib/geom/sub-path.js index 19a1da3b..4ded360c 100755 --- a/js/lib/geom/sub-path.js +++ b/js/lib/geom/sub-path.js @@ -866,6 +866,27 @@ GLSubpath.prototype.getStrokeWidth = function () { return this._strokeWidth; }; +GLSubpath.prototype.translateSubpathPerCanvas = function(elemMediator){ + //check if the canvas was translated + var penCanvasLeft = parseInt(elemMediator.getProperty(this._canvas, "left"));//parseFloat(DocumentControllerModule.DocumentController.GetElementStyle(this._penCanvas, "left")); + var penCanvasTop = parseInt(elemMediator.getProperty(this._canvas, "top"));//parseFloat(DocumentControllerModule.DocumentController.GetElementStyle(this._penCanvas, "top")); + var penCanvasWidth = parseInt(elemMediator.getProperty(this._canvas, "width"));//this._penCanvas.width; + var penCanvasHeight = parseInt(elemMediator.getProperty(this._canvas, "height"));//this._penCanvas.height; + var penCanvasOldX = penCanvasLeft + 0.5 * penCanvasWidth; + var penCanvasOldY = penCanvasTop + 0.5 * penCanvasHeight; + + var translateCanvasX = penCanvasOldX - this._canvasX; + var translateCanvasY = penCanvasOldY - this._canvasY; + + //update the canvasX and canvasY parameters for this subpath and also translate the subpath points (since they're stored in stage world space) + if (Math.abs(translateCanvasX)>=1 || Math.abs(translateCanvasY)>=1){ + this.setCanvasX(translateCanvasX + this._canvasX); + this.setCanvasY(translateCanvasY + this._canvasY); + this.translateAnchors(translateCanvasX, translateCanvasY, 0); + } + this._dirty=true; +}; + GLSubpath.prototype.setStrokeWidth = function (w) { var diffStrokeWidth = w-Math.floor(this._strokeWidth);//if positive, then stroke width grew, else shrunk if (diffStrokeWidth === 0) @@ -874,11 +895,14 @@ GLSubpath.prototype.setStrokeWidth = function (w) { this._strokeWidth = w; this._dirty=true; + var ElementMediator = require("js/mediators/element-mediator").ElementMediator; + this.translateSubpathPerCanvas(ElementMediator); + // **** adjust the left, top, width, and height to adjust for the change in stroke width **** this.createSamples(); //dirty bit is checked here this.buildLocalCoord(); //local dirty bit is checked here - //build the width and height of this canvas by looking at local coordinates (X and Y needed only) + //build the width and height of this canvas by looking at local coordinates var bboxMin = this.getLocalBBoxMin(); var bboxMax = this.getLocalBBoxMax(); var bboxWidth = bboxMax[0] - bboxMin[0]; @@ -892,7 +916,6 @@ GLSubpath.prototype.setStrokeWidth = function (w) { var top = Math.round(bboxMid[1] - 0.5 * bboxHeight); var canvasArray=[this._canvas]; - var ElementMediator = require("js/mediators/element-mediator").ElementMediator; ElementMediator.setProperty(canvasArray, "width", [bboxWidth+"px"], "Changing", "penTool");//canvas.width = w; ElementMediator.setProperty(canvasArray, "height", [bboxHeight+"px"], "Changing", "penTool");//canvas.height = h; ElementMediator.setProperty(canvasArray, "left", [left+"px"],"Changing", "penTool");//DocumentControllerModule.DocumentController.SetElementStyle(canvas, "left", parseInt(left) + "px"); -- cgit v1.2.3 From 06970d710f7172ee5ab736ef082c7703c61bfd0c Mon Sep 17 00:00:00 2001 From: Pushkar Joshi Date: Tue, 3 Apr 2012 11:13:07 -0700 Subject: track the canvas top left position instead of the center position to figure out when to translate the subpath per canvas translation...this one seems to not drift (no floating point issues uncovered so far) --- js/lib/geom/sub-path.js | 45 +++++++++++++++++++++++---------------------- 1 file changed, 23 insertions(+), 22 deletions(-) (limited to 'js/lib') diff --git a/js/lib/geom/sub-path.js b/js/lib/geom/sub-path.js index 4ded360c..d8d74928 100755 --- a/js/lib/geom/sub-path.js +++ b/js/lib/geom/sub-path.js @@ -72,9 +72,9 @@ var GLSubpath = function GLSubpath() { //the canvas that will draw this subpath this._canvas = null; - //the X and Y location of this subpath's canvas in stage world space of Ninja - this._canvasX = 0; - this._canvasY = 0; + //the top left location of this subpath's canvas in screen space + this._canvasLeft = 0; + this._canvasTop = 0; //stroke information this._strokeWidth = 1.0; @@ -362,20 +362,20 @@ GLSubpath.prototype.setPlaneCenter = function(pc){ this._planeCenter = pc; }; -GLSubpath.prototype.getCanvasX = function(){ - return this._canvasX; +GLSubpath.prototype.getCanvasLeft = function(){ + return this._canvasLeft; }; -GLSubpath.prototype.getCanvasY = function(){ - return this._canvasY; +GLSubpath.prototype.getCanvasTop = function(){ + return this._canvasTop; }; -GLSubpath.prototype.setCanvasX = function(cx){ - this._canvasX=cx; +GLSubpath.prototype.setCanvasLeft = function(cx){ + this._canvasLeft=cx; }; -GLSubpath.prototype.setCanvasY = function(cy){ - this._canvasY=cy; +GLSubpath.prototype.setCanvasTop = function(cy){ + this._canvasTop=cy; }; GLSubpath.prototype.getIsClosed = function () { @@ -868,20 +868,17 @@ GLSubpath.prototype.getStrokeWidth = function () { GLSubpath.prototype.translateSubpathPerCanvas = function(elemMediator){ //check if the canvas was translated - var penCanvasLeft = parseInt(elemMediator.getProperty(this._canvas, "left"));//parseFloat(DocumentControllerModule.DocumentController.GetElementStyle(this._penCanvas, "left")); - var penCanvasTop = parseInt(elemMediator.getProperty(this._canvas, "top"));//parseFloat(DocumentControllerModule.DocumentController.GetElementStyle(this._penCanvas, "top")); - var penCanvasWidth = parseInt(elemMediator.getProperty(this._canvas, "width"));//this._penCanvas.width; - var penCanvasHeight = parseInt(elemMediator.getProperty(this._canvas, "height"));//this._penCanvas.height; - var penCanvasOldX = penCanvasLeft + 0.5 * penCanvasWidth; - var penCanvasOldY = penCanvasTop + 0.5 * penCanvasHeight; + var penCanvasCurrentLeft = parseInt(elemMediator.getProperty(this._canvas, "left"));//parseFloat(DocumentControllerModule.DocumentController.GetElementStyle(this._penCanvas, "left")); + var penCanvasCurrentTop = parseInt(elemMediator.getProperty(this._canvas, "top"));//parseFloat(DocumentControllerModule.DocumentController.GetElementStyle(this._penCanvas, "top")); - var translateCanvasX = penCanvasOldX - this._canvasX; - var translateCanvasY = penCanvasOldY - this._canvasY; + var translateCanvasX = Math.round(penCanvasCurrentLeft - this._canvasLeft); + var translateCanvasY = Math.round(penCanvasCurrentTop - this._canvasTop); - //update the canvasX and canvasY parameters for this subpath and also translate the subpath points (since they're stored in stage world space) + //update the left and top parameters for this subpath and also translate the subpath points (since they're stored in stage world space) if (Math.abs(translateCanvasX)>=1 || Math.abs(translateCanvasY)>=1){ - this.setCanvasX(translateCanvasX + this._canvasX); - this.setCanvasY(translateCanvasY + this._canvasY); + this.setCanvasLeft(penCanvasCurrentLeft); + this.setCanvasTop(penCanvasCurrentTop); + //todo does the canvas translation correspond to the translation in stage world space? this.translateAnchors(translateCanvasX, translateCanvasY, 0); } this._dirty=true; @@ -896,6 +893,8 @@ GLSubpath.prototype.setStrokeWidth = function (w) { this._dirty=true; var ElementMediator = require("js/mediators/element-mediator").ElementMediator; + + //translate the subpath in case the actual canvas location does not match where subpath thinks the canvas should be this.translateSubpathPerCanvas(ElementMediator); // **** adjust the left, top, width, and height to adjust for the change in stroke width **** @@ -920,6 +919,8 @@ GLSubpath.prototype.setStrokeWidth = function (w) { ElementMediator.setProperty(canvasArray, "height", [bboxHeight+"px"], "Changing", "penTool");//canvas.height = h; ElementMediator.setProperty(canvasArray, "left", [left+"px"],"Changing", "penTool");//DocumentControllerModule.DocumentController.SetElementStyle(canvas, "left", parseInt(left) + "px"); ElementMediator.setProperty(canvasArray, "top", [top + "px"],"Changing", "penTool");//DocumentControllerModule.DocumentController.SetElementStyle(canvas, "top", parseInt(top) + "px"); + this.setCanvasLeft(left); + this.setCanvasTop(top); }; GLSubpath.prototype.getStrokeMaterial = function () { -- cgit v1.2.3 From 79fb912bdaa22b8107bbddc93d1779820af80cf9 Mon Sep 17 00:00:00 2001 From: Pushkar Joshi Date: Tue, 3 Apr 2012 14:50:34 -0700 Subject: working File I/O for pen tool created paths and some minor bug fixes (correctly setting the canvas for brush stroke file I/O, correct plane matrix for file I/O) --- js/lib/drawing/world.js | 7 +- js/lib/geom/brush-stroke.js | 14 ++-- js/lib/geom/sub-path.js | 181 +++++++++++++++++++------------------------- 3 files changed, 91 insertions(+), 111 deletions(-) (limited to 'js/lib') diff --git a/js/lib/drawing/world.js b/js/lib/drawing/world.js index 5a054224..a1a5b5ae 100755 --- a/js/lib/drawing/world.js +++ b/js/lib/drawing/world.js @@ -943,7 +943,7 @@ World.prototype.importObjectJSON = function( jObj, parentGeomObj ) { var type = jObj.type; var BrushStroke = require("js/lib/geom/brush-stroke").BrushStroke; - + var SubPath = require("js/lib/geom/sub-path").SubPath; var obj; switch (type) { @@ -962,6 +962,11 @@ World.prototype.importObjectJSON = function( jObj, parentGeomObj ) obj.importJSON( jObj ); break; + case 5: //cubic bezier + obj = new SubPath(); + obj.importJSON(jObj); + break; + case 6: //brush stroke obj = new BrushStroke(); obj.importJSON(jObj); diff --git a/js/lib/geom/brush-stroke.js b/js/lib/geom/brush-stroke.js index e93c9382..2a751a89 100755 --- a/js/lib/geom/brush-stroke.js +++ b/js/lib/geom/brush-stroke.js @@ -541,6 +541,10 @@ var BrushStroke = function GLBrushStroke() { var bboxWidth = bboxMax[0] - bboxMin[0]; var bboxHeight = bboxMax[1] - bboxMin[1]; + if (!this._canvas){ + //set the canvas by querying the world + this._canvas = this.getWorld().getCanvas(); + } if (this._canvas) { var newLeft = Math.round(this._stageWorldCenter[0] - 0.5 * bboxWidth); var newTop = Math.round(this._stageWorldCenter[1] - 0.5 * bboxHeight); @@ -550,7 +554,7 @@ var BrushStroke = function GLBrushStroke() { CanvasController.setProperty(this._canvas, "width", bboxWidth+"px"); CanvasController.setProperty(this._canvas, "height", bboxHeight+"px"); - this._canvas.elementModel.shapeModel.GLWorld.setViewportFromCanvas(this._canvas); + //this._canvas.elementModel.shapeModel.GLWorld.setViewportFromCanvas(this._canvas); } @@ -662,8 +666,8 @@ var BrushStroke = function GLBrushStroke() { this._copyCoordinates3D(this._OrigLocalPoints, retObject.origLocalPoints); //todo retObject.stageWorldCenter = [this._stageWorldCenter[0],this._stageWorldCenter[1],this._stageWorldCenter[2]]; - retObject.planeMat = [this._planeMat[0],this._planeMat[1],this._planeMat[2],this._planeMat[3]]; - retObject.planeMatInv = [this._planeMatInv[0],this._planeMatInv[1],this._planeMatInv[2],this._planeMatInv[3]]; + retObject.planeMat = this._planeMat; + retObject.planeMatInv = this._planeMatInv; retObject.dragPlane = [this._dragPlane[0],this._dragPlane[1],this._dragPlane[2],this._dragPlane[3]]; //stroke appearance properties @@ -691,8 +695,8 @@ var BrushStroke = function GLBrushStroke() { this._copyCoordinates3D(jo.origLocalPoints, this._OrigLocalPoints); //todo this._stageWorldCenter = [jo.stageWorldCenter[0],jo.stageWorldCenter[1],jo.stageWorldCenter[2]]; - this._planeMat = [jo.planeMat[0], jo.planeMat[1],jo.planeMat[2],jo.planeMat[3]]; - this._planeMatInv = [jo.planeMatInv[0],jo.planeMatInv[1],jo.planeMatInv[2],jo.planeMatInv[3]]; + this._planeMat = jo.planeMat; + this._planeMatInv = jo.planeMatInv; this._dragPlane = [jo.dragPlane[0],jo.dragPlane[1],jo.dragPlane[2],jo.dragPlane[3]]; //stroke appearance properties diff --git a/js/lib/geom/sub-path.js b/js/lib/geom/sub-path.js index d8d74928..35070915 100755 --- a/js/lib/geom/sub-path.js +++ b/js/lib/geom/sub-path.js @@ -95,6 +95,7 @@ var GLSubpath = function GLSubpath() { this._planeMat = null; this._planeMatInv = null; this._planeCenter = null; + this._dragPlane = null; //used to query what the user selected, OR-able for future extensions this.SEL_NONE = 0; //nothing was selected @@ -130,7 +131,10 @@ var GLSubpath = function GLSubpath() { // get the world var world = this.getWorld(); if (!world) throw( "null world in subpath render" ); - + if (!this._canvas){ + //set the canvas by querying the world + this._canvas = this.getWorld().getCanvas(); + } // get the context var ctx = world.get2DContext(); if (!ctx) throw ("null context in subpath render"); @@ -145,42 +149,19 @@ var GLSubpath = function GLSubpath() { //build the coordinates of the samples in 2D (canvas) space (localDirty bit checked in buildLocalCoord this.buildLocalCoord(); - // + //figure the size of the area we will draw into var bboxWidth=0, bboxHeight=0; - //var bboxMid=[0,0,0]; if (useLocalCoord){ bboxWidth = this._LocalBBoxMax[0] - this._LocalBBoxMin[0]; bboxHeight = this._LocalBBoxMax[1] - this._LocalBBoxMin[1]; - //bboxMid = [0.5 * (this._LocalBBoxMax[0] + this._LocalBBoxMin[0]), 0.5 * (this._LocalBBoxMax[1] + this._LocalBBoxMin[1]), 0.5 * (this._LocalBBoxMax[2] + this._LocalBBoxMin[2])]; } else { var bboxMin = this.getBBoxMin(); var bboxMax = this.getBBoxMax(); bboxWidth = bboxMax[0] - bboxMin[0]; bboxHeight = bboxMax[1] - bboxMin[1]; - //bboxMid = [0.5 * (bboxMax[0] + bboxMin[0]), 0.5 * (bboxMax[1] + bboxMin[1]), 0.5 * (bboxMax[2] + bboxMin[2])]; } - if (this._canvas) { - /* - var ViewUtils = require("js/helper-classes/3D/view-utils").ViewUtils; - //compute the plane center as the midpoint of the local bbox converted to stage world space - var planeCenter = ViewUtils.localToStageWorld(bboxMid, this._canvas); - planeCenter[0]+=400; planeCenter[1]+=300; //todo replace these lines with the correct call for the offset - console.log("PEN: local bboxMid: "+ bboxMid +", stage-world bboxMid: "+ planeCenter); - var newLeft = planeCenter[0] - 0.5*bboxWidth; - console.log("PEN: newLeft: "+ newLeft +", bboxWidth: "+bboxWidth); - newLeft = Math.round(newLeft);//Math.round(this._planeCenter[0] - 0.5 * bboxWidth); - console.log("PEN: newLeft rounded: "+ newLeft); - var newTop = Math.round(planeCenter[1] - 0.5 * bboxHeight);//Math.round(this._planeCenter[1] - 0.5 * bboxHeight); - //assign the new position, width, and height as the canvas dimensions through the canvas controller - CanvasController.setProperty(this._canvas, "left", newLeft+"px"); - CanvasController.setProperty(this._canvas, "top", newTop+"px"); - CanvasController.setProperty(this._canvas, "width", bboxWidth+"px"); - CanvasController.setProperty(this._canvas, "height", bboxHeight+"px"); - this._canvas.elementModel.shapeModel.GLWorld.setViewportFromCanvas(this._canvas); - */ - } ctx.save(); ctx.clearRect(0, 0, bboxWidth, bboxHeight); @@ -354,6 +335,10 @@ GLSubpath.prototype.setPlaneMatrix = function(planeMat){ this._planeMat = planeMat; }; +GLSubpath.prototype.setDragPlane = function(p){ + this._dragPlane = p; +}; + GLSubpath.prototype.setPlaneMatrixInverse = function(planeMatInv){ this._planeMatInv = planeMatInv; }; @@ -867,6 +852,12 @@ GLSubpath.prototype.getStrokeWidth = function () { }; GLSubpath.prototype.translateSubpathPerCanvas = function(elemMediator){ + if (!this._canvas){ + if (!this.getWorld()) + return; //cannot do anything if there is no world + //set the canvas by querying the world + this._canvas = this.getWorld().getCanvas(); + } //check if the canvas was translated var penCanvasCurrentLeft = parseInt(elemMediator.getProperty(this._canvas, "left"));//parseFloat(DocumentControllerModule.DocumentController.GetElementStyle(this._penCanvas, "left")); var penCanvasCurrentTop = parseInt(elemMediator.getProperty(this._canvas, "top"));//parseFloat(DocumentControllerModule.DocumentController.GetElementStyle(this._penCanvas, "top")); @@ -1516,95 +1507,75 @@ GLSubpath.prototype.isPointInQuad2D = function(r0,r1,r2,r3,p){ return false; }; -GLSubpath.prototype.export = function() { - var rtnStr = "type: " + this.geomType() + "\n"; - - rtnStr += "strokeWidth: " + this._strokeWidth + "\n"; - rtnStr += "strokeStyle: " + this._strokeStyle + "\n"; - - rtnStr += "strokeMat: "; - if (this._strokeMaterial) - rtnStr += this._strokeMaterial.getName(); - else - rtnStr += "flatMaterial"; - rtnStr += "\n"; - - rtnStr += "fillMat: "; - if (this._fillMaterial) - rtnStr += this._fillMaterial.getName(); - else - rtnStr += "flatMaterial"; - rtnStr += "\n"; - - var isClosedStr = "false"; - if (this._isClosed) - isClosedStr = "true"; - rtnStr += "isClosed: " + isClosedStr + "\n"; - - //add the anchor points - var numAnchors = this._Anchors.length; - rtnStr += "numAnchors: " + numAnchors + "\n"; - for (var i=0;i= this._Anchors.length || index>=this._anchorSampleIndex.length){ + return null; + } + var anchorSampleIndex = this._anchorSampleIndex[index]; + if (anchorSampleIndex>=this._LocalPoints.length){ + return null; + } + var localCoord = this._LocalPoints[anchorSampleIndex].slice(0); + return localCoord; +}; + //buildLocalCoord GLSubpath.prototype.buildLocalCoord = function () { if (!this._isLocalDirty) { @@ -1435,6 +1474,8 @@ GLSubpath.prototype.makeFillMaterial = function() { }; GLSubpath.prototype.getNearVertex = function( eyePt, dir ){ + //todo BUILD A BBOX USING LOCAL COORD. (NO z NEEDED) + //get the parameters used for computing perspective transformation var bboxDim = []; var bboxMid = []; -- cgit v1.2.3 From 1a53fb6061688d3204e48d8617e9fed50a04b204 Mon Sep 17 00:00:00 2001 From: Pushkar Joshi Date: Fri, 6 Apr 2012 11:41:21 -0700 Subject: Don't update the plane matrix of subpaths that already have a plane matrix --- js/lib/geom/sub-path.js | 4 ++++ 1 file changed, 4 insertions(+) (limited to 'js/lib') diff --git a/js/lib/geom/sub-path.js b/js/lib/geom/sub-path.js index bca4e1c5..d784fbc6 100755 --- a/js/lib/geom/sub-path.js +++ b/js/lib/geom/sub-path.js @@ -338,6 +338,10 @@ GLSubpath.prototype.setPlaneMatrix = function(planeMat){ this._planeMat = planeMat; }; +GLSubpath.prototype.getPlaneMatrix = function(){ + return this._planeMat; +}; + GLSubpath.prototype.setDragPlane = function(p){ this._dragPlane = p; }; -- cgit v1.2.3 From dae3041e6b8269da3d593a44c09e2288bb434a02 Mon Sep 17 00:00:00 2001 From: Pushkar Joshi Date: Mon, 9 Apr 2012 15:55:10 -0700 Subject: snapping feedback for pen tool, correct for subpaths that may lie on rotated canvas, and with a rotated view --- js/lib/geom/sub-path.js | 29 +++++++++++++++++++++++++---- 1 file changed, 25 insertions(+), 4 deletions(-) (limited to 'js/lib') diff --git a/js/lib/geom/sub-path.js b/js/lib/geom/sub-path.js index d784fbc6..33bcfc9a 100755 --- a/js/lib/geom/sub-path.js +++ b/js/lib/geom/sub-path.js @@ -620,7 +620,28 @@ GLSubpath.prototype._isWithinBoundingBox = function(point, ctrlPts, radius) { return true; }; -GLSubpath.prototype._checkAnchorIntersection = function(pickX, pickY, pickZ, radSq, anchorIndex, minDistance) { +GLSubpath.prototype._checkAnchorIntersection = function(pickX, pickY, pickZ, radSq, anchorIndex, minDistance, useLocal) { + //if we are asked to use the local coordinate and the local coordinate for this anchor exists + if (useLocal && this._anchorSampleIndex.length>anchorIndex && this._LocalPoints.length > this._anchorSampleIndex[anchorIndex]) { + var localCoord = this._LocalPoints[this._anchorSampleIndex[anchorIndex]] + var distSq = VecUtils.vecDistSq(3, [pickX, pickY, pickZ], localCoord); + //check the anchor point + if (distSq < radSq && distSq=0 && this._selectedAnchorIndexanchorIndex && this._LocalPoints.length > this._anchorSampleIndex[anchorIndex]) { - var localCoord = this._LocalPoints[this._anchorSampleIndex[anchorIndex]] - var distSq = VecUtils.vecDistSq(3, [pickX, pickY, pickZ], localCoord); + if (useLocal && this._AnchorLocalCoords.length > anchorIndex) {//this._anchorSampleIndex.length>anchorIndex && this._LocalPoints.length > this._anchorSampleIndex[anchorIndex]) { + //var localCoord = this._LocalPoints[this._anchorSampleIndex[anchorIndex]]; + var anchorLocalCoord = this._AnchorLocalCoords[anchorIndex]; + var distSq = VecUtils.vecDistSq(3, [pickX, pickY, pickZ], anchorLocalCoord[1]); //check the anchor point if (distSq < radSq && distSq