diff options
Diffstat (limited to 'js')
-rw-r--r-- | js/helper-classes/RDGE/GLBrushStroke.js | 1 | ||||
-rw-r--r-- | js/helper-classes/RDGE/GLSubpath.js | 39 | ||||
-rw-r--r-- | js/tools/PenTool.js | 127 |
3 files changed, 82 insertions, 85 deletions
diff --git a/js/helper-classes/RDGE/GLBrushStroke.js b/js/helper-classes/RDGE/GLBrushStroke.js index 89292ad8..f9ed6619 100644 --- a/js/helper-classes/RDGE/GLBrushStroke.js +++ b/js/helper-classes/RDGE/GLBrushStroke.js | |||
@@ -6,7 +6,6 @@ No rights, expressed or implied, whatsoever to this software are provided by Mot | |||
6 | 6 | ||
7 | var VecUtils = require("js/helper-classes/3D/vec-utils").VecUtils; | 7 | var VecUtils = require("js/helper-classes/3D/vec-utils").VecUtils; |
8 | 8 | ||
9 | |||
10 | /////////////////////////////////////////////////////////////////////// | 9 | /////////////////////////////////////////////////////////////////////// |
11 | // Class GLBrushStroke | 10 | // Class GLBrushStroke |
12 | // representation a sequence points (polyline) created by brush tool. | 11 | // representation a sequence points (polyline) created by brush tool. |
diff --git a/js/helper-classes/RDGE/GLSubpath.js b/js/helper-classes/RDGE/GLSubpath.js index 25b12093..79940e06 100644 --- a/js/helper-classes/RDGE/GLSubpath.js +++ b/js/helper-classes/RDGE/GLSubpath.js | |||
@@ -155,6 +155,32 @@ function GLSubpath() { | |||
155 | return retAnchor; | 155 | return retAnchor; |
156 | } | 156 | } |
157 | 157 | ||
158 | this.deselectAnchorPoint = function(){ | ||
159 | this._selectedAnchorIndex = -1; | ||
160 | } | ||
161 | |||
162 | this.reversePath = function() { | ||
163 | var revAnchors = []; | ||
164 | var numAnchors = this._Anchors.length; | ||
165 | var lastIndex = numAnchors-1; | ||
166 | if (lastIndex<0){ | ||
167 | return; //cannot reverse empty path | ||
168 | } | ||
169 | for (var i=lastIndex;i>=0;i--) { | ||
170 | var newAnchor = new GLAnchorPoint(); | ||
171 | var oldAnchor = this._Anchors[i]; | ||
172 | newAnchor.setPos(oldAnchor.getPosX(),oldAnchor.getPosY(),oldAnchor.getPosZ()); | ||
173 | newAnchor.setPrevPos(oldAnchor.getNextX(),oldAnchor.getNextY(),oldAnchor.getNextZ()); | ||
174 | newAnchor.setNextPos(oldAnchor.getPrevX(),oldAnchor.getPrevY(),oldAnchor.getPrevZ()); | ||
175 | revAnchors.push(newAnchor); | ||
176 | } | ||
177 | if (this._selectedAnchorIndex >= 0){ | ||
178 | this._selectedAnchorIndex = (numAnchors-1) - this._selectedAnchorIndex; | ||
179 | } | ||
180 | this._Anchors = revAnchors; | ||
181 | this._dirty=true; | ||
182 | } | ||
183 | |||
158 | //remove all the anchor points | 184 | //remove all the anchor points |
159 | this.clearAllAnchors = function () { | 185 | this.clearAllAnchors = function () { |
160 | this._Anchors = []; | 186 | this._Anchors = []; |
@@ -220,7 +246,10 @@ function GLSubpath() { | |||
220 | //check whether the point is within the radius distance from the curve represented as a polyline in _samples | 246 | //check whether the point is within the radius distance from the curve represented as a polyline in _samples |
221 | //return the parametric distance along the curve if there is an intersection, else return null | 247 | //return the parametric distance along the curve if there is an intersection, else return null |
222 | //will assume that the BBox test is performed outside this function | 248 | //will assume that the BBox test is performed outside this function |
223 | 249 | if (endIndex<startIndex){ | |
250 | //go from startIndex to the end of the samples | ||
251 | endIndex = this._samples.length/3; | ||
252 | } | ||
224 | for (var i=startIndex; i<endIndex; i++){ | 253 | for (var i=startIndex; i<endIndex; i++){ |
225 | var seg0 = Vector.create([this._samples[3*i], this._samples[3*i + 1], this._samples[3*i + 2]]); | 254 | var seg0 = Vector.create([this._samples[3*i], this._samples[3*i + 1], this._samples[3*i + 2]]); |
226 | var j=i+1; | 255 | var j=i+1; |
@@ -386,6 +415,7 @@ function GLSubpath() { | |||
386 | if (this._isWithinBoundingBox(point, controlPoints, radius)) { | 415 | if (this._isWithinBoundingBox(point, controlPoints, radius)) { |
387 | //var intersectParam = this._checkIntersection(controlPoints, 0.0, 1.0, point, radius); | 416 | //var intersectParam = this._checkIntersection(controlPoints, 0.0, 1.0, point, radius); |
388 | var intersectParam = this._checkIntersectionWithSamples(this._anchorSampleIndex[i], this._anchorSampleIndex[nextIndex], point, radius); | 417 | var intersectParam = this._checkIntersectionWithSamples(this._anchorSampleIndex[i], this._anchorSampleIndex[nextIndex], point, radius); |
418 | console.log("intersectParam:"+intersectParam); | ||
389 | if (intersectParam){ | 419 | if (intersectParam){ |
390 | retCode = retCode | this.SEL_PATH; | 420 | retCode = retCode | this.SEL_PATH; |
391 | retParam = intersectParam-i; //make the retParam go from 0 to 1 | 421 | retParam = intersectParam-i; //make the retParam go from 0 to 1 |
@@ -1137,6 +1167,7 @@ function GLSubpath() { | |||
1137 | this.buildBuffers = function () { | 1167 | this.buildBuffers = function () { |
1138 | if (this._useCanvasDrawing) | 1168 | if (this._useCanvasDrawing) |
1139 | return; | 1169 | return; |
1170 | |||
1140 | // get the world | 1171 | // get the world |
1141 | var world = this.getWorld(); | 1172 | var world = this.getWorld(); |
1142 | if (!world) throw ("null world in GLSubpath buildBuffers"); | 1173 | if (!world) throw ("null world in GLSubpath buildBuffers"); |
@@ -1368,7 +1399,7 @@ function GLSubpath() { | |||
1368 | ctx.strokeStyle = "black"; | 1399 | ctx.strokeStyle = "black"; |
1369 | if (this._strokeColor) | 1400 | if (this._strokeColor) |
1370 | ctx.strokeStyle = MathUtils.colorToHex( this._strokeColor ); | 1401 | ctx.strokeStyle = MathUtils.colorToHex( this._strokeColor ); |
1371 | ctx.fillStyle = "blue"; | 1402 | ctx.fillStyle = "white"; |
1372 | if (this._fillColor) | 1403 | if (this._fillColor) |
1373 | ctx.fillStyle = MathUtils.colorToHex( this._fillColor ); | 1404 | ctx.fillStyle = MathUtils.colorToHex( this._fillColor ); |
1374 | var lineCap = ['butt','round','square']; | 1405 | var lineCap = ['butt','round','square']; |
@@ -1387,7 +1418,9 @@ function GLSubpath() { | |||
1387 | prevAnchor = currAnchor; | 1418 | prevAnchor = currAnchor; |
1388 | } | 1419 | } |
1389 | ctx.stroke(); | 1420 | ctx.stroke(); |
1390 | //ctx.fill(); | 1421 | if (this._isClosed){ |
1422 | ctx.fill(); | ||
1423 | } | ||
1391 | 1424 | ||
1392 | 1425 | ||
1393 | 1426 | ||
diff --git a/js/tools/PenTool.js b/js/tools/PenTool.js index 78344d18..3b03e0e7 100644 --- a/js/tools/PenTool.js +++ b/js/tools/PenTool.js | |||
@@ -5,6 +5,7 @@ No rights, expressed or implied, whatsoever to this software are provided by Mot | |||
5 | </copyright> */ | 5 | </copyright> */ |
6 | 6 | ||
7 | var ShapeTool = require("js/tools/ShapeTool").ShapeTool; | 7 | var ShapeTool = require("js/tools/ShapeTool").ShapeTool; |
8 | var ShapesController = require("js/controllers/elements/shapes-controller").ShapesController; | ||
8 | var DrawingToolBase = require("js/tools/drawing-tool-base").DrawingToolBase; | 9 | var DrawingToolBase = require("js/tools/drawing-tool-base").DrawingToolBase; |
9 | var defaultEventManager = require("montage/core/event/event-manager").defaultEventManager; | 10 | var defaultEventManager = require("montage/core/event/event-manager").defaultEventManager; |
10 | var Montage = require("montage/core/core").Montage; | 11 | var Montage = require("montage/core/core").Montage; |
@@ -187,6 +188,8 @@ exports.PenTool = Montage.create(ShapeTool, { | |||
187 | //we have picked the endpoint of this path...reverse the path if necessary | 188 | //we have picked the endpoint of this path...reverse the path if necessary |
188 | if (selAnchorIndex ===0){ | 189 | if (selAnchorIndex ===0){ |
189 | //reverse this path | 190 | //reverse this path |
191 | this._selectedSubpath.reversePath(); | ||
192 | selAnchorIndex = this._selectedSubpath.getSelectedAnchorIndex(); | ||
190 | } | 193 | } |
191 | this._isPickedEndPointInSelectPathMode = true; | 194 | this._isPickedEndPointInSelectPathMode = true; |
192 | } | 195 | } |
@@ -219,6 +222,7 @@ exports.PenTool = Montage.create(ShapeTool, { | |||
219 | } | 222 | } |
220 | } | 223 | } |
221 | } | 224 | } |
225 | //else if (whichPoint === this._selectedSubpath.SEL_NONE) { | ||
222 | if (whichPoint === this._selectedSubpath.SEL_NONE) { | 226 | if (whichPoint === this._selectedSubpath.SEL_NONE) { |
223 | if (this._entryEditMode !== this.ENTRY_SELECT_PATH) { | 227 | if (this._entryEditMode !== this.ENTRY_SELECT_PATH) { |
224 | //add an anchor point to end of the subpath, and make it the selected anchor point | 228 | //add an anchor point to end of the subpath, and make it the selected anchor point |
@@ -234,7 +238,18 @@ exports.PenTool = Montage.create(ShapeTool, { | |||
234 | } | 238 | } |
235 | } else { | 239 | } else { |
236 | if (this._isPickedEndPointInSelectPathMode){ | 240 | if (this._isPickedEndPointInSelectPathMode){ |
237 | 241 | //if (0){ | |
242 | //TODO clean up this code...very similar to the code block above | ||
243 | if (!this._selectedSubpath.getIsClosed()) { | ||
244 | this._selectedSubpath.addAnchor(new GLAnchorPoint()); | ||
245 | var newAnchor = this._selectedSubpath.getAnchor(this._selectedSubpath.getSelectedAnchorIndex()); | ||
246 | newAnchor.setPos(mouseDownPos[0], mouseDownPos[1], mouseDownPos[2]); | ||
247 | newAnchor.setPrevPos(mouseDownPos[0], mouseDownPos[1], mouseDownPos[2]); | ||
248 | newAnchor.setNextPos(mouseDownPos[0], mouseDownPos[1], mouseDownPos[2]); | ||
249 | |||
250 | //set the mode so that dragging will update the next and previous locations | ||
251 | this._editMode = this.EDIT_PREV_NEXT; | ||
252 | } | ||
238 | } | 253 | } |
239 | //if the edit mode was ENTRY_SELECT_PATH and no anchor point was selected, so we should de-select this path and revert to ENTRY_SELECT_NONE | 254 | //if the edit mode was ENTRY_SELECT_PATH and no anchor point was selected, so we should de-select this path and revert to ENTRY_SELECT_NONE |
240 | //this._entryEditMode = this.ENTRY_SELECT_NONE; //TODO revisit this after implementing code for adding points to any end of selected path | 255 | //this._entryEditMode = this.ENTRY_SELECT_NONE; //TODO revisit this after implementing code for adding points to any end of selected path |
@@ -352,10 +367,10 @@ exports.PenTool = Montage.create(ShapeTool, { | |||
352 | value: function() { | 367 | value: function() { |
353 | if (this._penCanvas!==null) { | 368 | if (this._penCanvas!==null) { |
354 | //obtain the 2D translation of the canvas due to the Selection tool...assuming this is called in Configure | 369 | //obtain the 2D translation of the canvas due to the Selection tool...assuming this is called in Configure |
355 | var penCanvasLeft = parseFloat(ElementMediator.getProperty(this._penCanvas, "left"));//parseFloat(DocumentControllerModule.DocumentController.GetElementStyle(this._penCanvas, "left")); | 370 | var penCanvasLeft = parseInt(ElementMediator.getProperty(this._penCanvas, "left"));//parseFloat(DocumentControllerModule.DocumentController.GetElementStyle(this._penCanvas, "left")); |
356 | var penCanvasTop = parseFloat(ElementMediator.getProperty(this._penCanvas, "top"));//parseFloat(DocumentControllerModule.DocumentController.GetElementStyle(this._penCanvas, "top")); | 371 | var penCanvasTop = parseFloat(ElementMediator.getProperty(this._penCanvas, "top"));//parseFloat(DocumentControllerModule.DocumentController.GetElementStyle(this._penCanvas, "top")); |
357 | var penCanvasWidth = this._penCanvas.width; | 372 | var penCanvasWidth = parseInt(ElementMediator.getProperty(this._penCanvas, "width"));//this._penCanvas.width; |
358 | var penCanvasHeight = this._penCanvas.height; | 373 | var penCanvasHeight = parseInt(ElementMediator.getProperty(this._penCanvas, "height"));//this._penCanvas.height; |
359 | var penCanvasOldX = penCanvasLeft + 0.5 * penCanvasWidth; | 374 | var penCanvasOldX = penCanvasLeft + 0.5 * penCanvasWidth; |
360 | var penCanvasOldY = penCanvasTop + 0.5 * penCanvasHeight; | 375 | var penCanvasOldY = penCanvasTop + 0.5 * penCanvasHeight; |
361 | 376 | ||
@@ -373,17 +388,20 @@ exports.PenTool = Montage.create(ShapeTool, { | |||
373 | 388 | ||
374 | ShowSelectedSubpath:{ | 389 | ShowSelectedSubpath:{ |
375 | value: function() { | 390 | value: function() { |
376 | var bboxMin = this._selectedSubpath.getBBoxMin(); | 391 | if (this._selectedSubpath){ |
377 | var bboxMax = this._selectedSubpath.getBBoxMax(); | 392 | this._selectedSubpath.createSamples(); //dirty bit is checked here |
378 | var bboxWidth = bboxMax[0] - bboxMin[0]; | 393 | var bboxMin = this._selectedSubpath.getBBoxMin(); |
379 | var bboxHeight = bboxMax[1] - bboxMin[1]; | 394 | var bboxMax = this._selectedSubpath.getBBoxMax(); |
380 | var bboxMid = Vector.create([0.5 * (bboxMax[0] + bboxMin[0]), 0.5 * (bboxMax[1] + bboxMin[1]), 0.5 * (bboxMax[2] + bboxMin[2])]); | 395 | var bboxWidth = bboxMax[0] - bboxMin[0]; |
381 | 396 | var bboxHeight = bboxMax[1] - bboxMin[1]; | |
382 | this._selectedSubpath.setCanvasX(bboxMid[0]); | 397 | var bboxMid = Vector.create([0.5 * (bboxMax[0] + bboxMin[0]), 0.5 * (bboxMax[1] + bboxMin[1]), 0.5 * (bboxMax[2] + bboxMin[2])]); |
383 | this._selectedSubpath.setCanvasY(bboxMid[1]); | 398 | |
384 | 399 | this._selectedSubpath.setCanvasX(bboxMid[0]); | |
385 | //call render shape with the bbox width and height | 400 | this._selectedSubpath.setCanvasY(bboxMid[1]); |
386 | this.RenderShape(bboxWidth, bboxHeight, this._penPlaneMat, bboxMid, this._penCanvas); | 401 | |
402 | //call render shape with the bbox width and height | ||
403 | this.RenderShape(bboxWidth, bboxHeight, this._penPlaneMat, bboxMid, this._penCanvas); | ||
404 | } | ||
387 | } | 405 | } |
388 | }, | 406 | }, |
389 | 407 | ||
@@ -429,11 +447,17 @@ exports.PenTool = Montage.create(ShapeTool, { | |||
429 | } | 447 | } |
430 | 448 | ||
431 | if (this._isNewPath) { | 449 | if (this._isNewPath) { |
432 | var strokeSize = 10.0; | 450 |