diff options
Diffstat (limited to 'js/lib')
-rwxr-xr-x | js/lib/drawing/world.js | 7 | ||||
-rwxr-xr-x | js/lib/geom/anchor-point.js | 4 | ||||
-rwxr-xr-x | js/lib/geom/brush-stroke.js | 16 | ||||
-rwxr-xr-x | js/lib/geom/circle.js | 4 | ||||
-rwxr-xr-x | js/lib/geom/rectangle.js | 20 | ||||
-rwxr-xr-x | js/lib/geom/sub-path.js | 853 |
6 files changed, 344 insertions, 560 deletions
diff --git a/js/lib/drawing/world.js b/js/lib/drawing/world.js index eb06e59d..50fa735a 100755 --- a/js/lib/drawing/world.js +++ b/js/lib/drawing/world.js | |||
@@ -985,7 +985,7 @@ World.prototype.importObjectJSON = function( jObj, parentGeomObj ) | |||
985 | { | 985 | { |
986 | var type = jObj.type; | 986 | var type = jObj.type; |
987 | var BrushStroke = require("js/lib/geom/brush-stroke").BrushStroke; | 987 | var BrushStroke = require("js/lib/geom/brush-stroke").BrushStroke; |
988 | 988 | var SubPath = require("js/lib/geom/sub-path").SubPath; | |
989 | var obj; | 989 | var obj; |
990 | switch (type) | 990 | switch (type) |
991 | { | 991 | { |
@@ -1004,6 +1004,11 @@ World.prototype.importObjectJSON = function( jObj, parentGeomObj ) | |||
1004 | obj.importJSON( jObj ); | 1004 | obj.importJSON( jObj ); |
1005 | break; | 1005 | break; |
1006 | 1006 | ||
1007 | case 5: //cubic bezier | ||
1008 | obj = new SubPath(); | ||
1009 | obj.importJSON(jObj); | ||
1010 | break; | ||
1011 | |||
1007 | case 6: //brush stroke | 1012 | case 6: //brush stroke |
1008 | obj = new BrushStroke(); | 1013 | obj = new BrushStroke(); |
1009 | obj.importJSON(jObj); | 1014 | obj.importJSON(jObj); |
diff --git a/js/lib/geom/anchor-point.js b/js/lib/geom/anchor-point.js index 0e9f65ea..d254681c 100755 --- a/js/lib/geom/anchor-point.js +++ b/js/lib/geom/anchor-point.js | |||
@@ -221,6 +221,10 @@ GLAnchorPoint.prototype.getNext = function() { | |||
221 | return [this._nextX, this._nextY, this._nextZ]; | 221 | return [this._nextX, this._nextY, this._nextZ]; |
222 | }; | 222 | }; |
223 | 223 | ||
224 | GLAnchorPoint.prototype.getAllPos = function() { | ||
225 | return [[this._prevX, this._prevY, this._prevZ],[this._x, this._y, this._z],[this._nextX, this._nextY, this._nextZ]]; | ||
226 | }; | ||
227 | |||
224 | //return the square of distance from passed in point to the anchor position | 228 | //return the square of distance from passed in point to the anchor position |
225 | GLAnchorPoint.prototype.getDistanceSq = function (x, y, z) { | 229 | GLAnchorPoint.prototype.getDistanceSq = function (x, y, z) { |
226 | return (this._x - x) * (this._x - x) + (this._y - y) * (this._y - y) + (this._z - z) * (this._z - z); | 230 | return (this._x - x) * (this._x - x) + (this._y - y) * (this._y - y) + (this._z - z) * (this._z - z); |
diff --git a/js/lib/geom/brush-stroke.js b/js/lib/geom/brush-stroke.js index 743dab85..efd21c4a 100755 --- a/js/lib/geom/brush-stroke.js +++ b/js/lib/geom/brush-stroke.js | |||
@@ -416,7 +416,7 @@ var BrushStroke = function GLBrushStroke() { | |||
416 | this._LocalPoints[i][1]+= halfheight; | 416 | this._LocalPoints[i][1]+= halfheight; |
417 | 417 | ||
418 | //store the original points | 418 | //store the original points |
419 | this._OrigLocalPoints .push([this._LocalPoints[i][0],this._LocalPoints[i][1],this._LocalPoints[i][2]]); | 419 | this._OrigLocalPoints.push([this._LocalPoints[i][0],this._LocalPoints[i][1],this._LocalPoints[i][2]]); |
420 | } | 420 | } |
421 | //update the bbox with the same adjustment as was made for the local points above | 421 | //update the bbox with the same adjustment as was made for the local points above |
422 | this._BBoxMax[0]+= halfwidth;this._BBoxMin[0]+= halfwidth; | 422 | this._BBoxMax[0]+= halfwidth;this._BBoxMin[0]+= halfwidth; |
@@ -544,6 +544,10 @@ var BrushStroke = function GLBrushStroke() { | |||
544 | var bboxWidth = bboxMax[0] - bboxMin[0]; | 544 | var bboxWidth = bboxMax[0] - bboxMin[0]; |
545 | var bboxHeight = bboxMax[1] - bboxMin[1]; | 545 | var bboxHeight = bboxMax[1] - bboxMin[1]; |
546 | 546 | ||
547 | if (!this._canvas){ | ||
548 | //set the canvas by querying the world | ||
549 | this._canvas = this.getWorld().getCanvas(); | ||
550 | } | ||
547 | if (this._canvas) { | 551 | if (this._canvas) { |
548 | var newLeft = Math.round(this._stageWorldCenter[0] - 0.5 * bboxWidth); | 552 | var newLeft = Math.round(this._stageWorldCenter[0] - 0.5 * bboxWidth); |
549 | var newTop = Math.round(this._stageWorldCenter[1] - 0.5 * bboxHeight); | 553 | var newTop = Math.round(this._stageWorldCenter[1] - 0.5 * bboxHeight); |
@@ -553,7 +557,7 @@ var BrushStroke = function GLBrushStroke() { | |||
553 | 557 | ||
554 | CanvasController.setProperty(this._canvas, "width", bboxWidth+"px"); | 558 | CanvasController.setProperty(this._canvas, "width", bboxWidth+"px"); |
555 | CanvasController.setProperty(this._canvas, "height", bboxHeight+"px"); | 559 | CanvasController.setProperty(this._canvas, "height", bboxHeight+"px"); |
556 | this._canvas.elementModel.shapeModel.GLWorld.setViewportFromCanvas(this._canvas); | 560 | //this._canvas.elementModel.shapeModel.GLWorld.setViewportFromCanvas(this._canvas); |
557 | } | 561 | } |
558 | 562 | ||
559 | 563 | ||
@@ -665,8 +669,8 @@ var BrushStroke = function GLBrushStroke() { | |||
665 | this._copyCoordinates3D(this._OrigLocalPoints, retObject.origLocalPoints); //todo <ditto> | 669 | this._copyCoordinates3D(this._OrigLocalPoints, retObject.origLocalPoints); //todo <ditto> |
666 | 670 | ||
667 | retObject.stageWorldCenter = [this._stageWorldCenter[0],this._stageWorldCenter[1],this._stageWorldCenter[2]]; | 671 | retObject.stageWorldCenter = [this._stageWorldCenter[0],this._stageWorldCenter[1],this._stageWorldCenter[2]]; |
668 | retObject.planeMat = [this._planeMat[0],this._planeMat[1],this._planeMat[2],this._planeMat[3]]; | 672 | retObject.planeMat = this._planeMat; |
669 | retObject.planeMatInv = [this._planeMatInv[0],this._planeMatInv[1],this._planeMatInv[2],this._planeMatInv[3]]; | 673 | retObject.planeMatInv = this._planeMatInv; |
670 | retObject.dragPlane = [this._dragPlane[0],this._dragPlane[1],this._dragPlane[2],this._dragPlane[3]]; | 674 | retObject.dragPlane = [this._dragPlane[0],this._dragPlane[1],this._dragPlane[2],this._dragPlane[3]]; |
671 | 675 | ||
672 | //stroke appearance properties | 676 | //stroke appearance properties |
@@ -694,8 +698,8 @@ var BrushStroke = function GLBrushStroke() { | |||
694 | this._copyCoordinates3D(jo.origLocalPoints, this._OrigLocalPoints); //todo <ditto> | 698 | this._copyCoordinates3D(jo.origLocalPoints, this._OrigLocalPoints); //todo <ditto> |
695 | 699 | ||
696 | this._stageWorldCenter = [jo.stageWorldCenter[0],jo.stageWorldCenter[1],jo.stageWorldCenter[2]]; | 700 | this._stageWorldCenter = [jo.stageWorldCenter[0],jo.stageWorldCenter[1],jo.stageWorldCenter[2]]; |
697 | this._planeMat = [jo.planeMat[0], jo.planeMat[1],jo.planeMat[2],jo.planeMat[3]]; | 701 | this._planeMat = jo.planeMat; |
698 | this._planeMatInv = [jo.planeMatInv[0],jo.planeMatInv[1],jo.planeMatInv[2],jo.planeMatInv[3]]; | 702 | this._planeMatInv = jo.planeMatInv; |
699 | this._dragPlane = [jo.dragPlane[0],jo.dragPlane[1],jo.dragPlane[2],jo.dragPlane[3]]; | 703 | this._dragPlane = [jo.dragPlane[0],jo.dragPlane[1],jo.dragPlane[2],jo.dragPlane[3]]; |
700 | 704 | ||
701 | //stroke appearance properties | 705 | //stroke appearance properties |
diff --git a/js/lib/geom/circle.js b/js/lib/geom/circle.js index 1073c2db..218dcfa6 100755 --- a/js/lib/geom/circle.js +++ b/js/lib/geom/circle.js | |||
@@ -457,9 +457,9 @@ var Circle = function GLCircle() { | |||
457 | if(this._fillColor.gradientMode) { | 457 | if(this._fillColor.gradientMode) { |
458 | if(this._fillColor.gradientMode === "radial") { | 458 | if(this._fillColor.gradientMode === "radial") { |
459 | gradient = ctx.createRadialGradient(xCtr, yCtr, 0, | 459 | gradient = ctx.createRadialGradient(xCtr, yCtr, 0, |
460 | xCtr, yCtr, Math.max(yScale, xScale)); | 460 | xCtr, yCtr, Math.max(this._width, this._height)/2); |
461 | } else { | 461 | } else { |
462 | gradient = ctx.createLinearGradient(0, this._height/2, this._width, this._height/2); | 462 | gradient = ctx.createLinearGradient(lineWidth/2, this._height/2, this._width-lineWidth, this._height/2); |
463 | } | 463 | } |
464 | colors = this._fillColor.color; | 464 | colors = this._fillColor.color; |
465 | 465 | ||
diff --git a/js/lib/geom/rectangle.js b/js/lib/geom/rectangle.js index 304b9c19..51db0dd0 100755 --- a/js/lib/geom/rectangle.js +++ b/js/lib/geom/rectangle.js | |||
@@ -360,7 +360,9 @@ var Rectangle = function GLRectangle() | |||
360 | // various declarations | 360 | // various declarations |
361 | var pt, rad, ctr, startPt, bPts; | 361 | var pt, rad, ctr, startPt, bPts; |
362 | var width = Math.round(this.getWidth()), | 362 | var width = Math.round(this.getWidth()), |
363 | height = Math.round(this.getHeight()); | 363 | height = Math.round(this.getHeight()), |
364 | hw = 0.5*width, | ||
365 | hh = 0.5*height; | ||
364 | 366 | ||
365 | pt = [inset, inset]; // top left corner | 367 | pt = [inset, inset]; // top left corner |
366 | 368 | ||
@@ -368,6 +370,12 @@ var Rectangle = function GLRectangle() | |||
368 | var trRad = this._trRadius; | 370 | var trRad = this._trRadius; |
369 | var blRad = this._blRadius; | 371 | var blRad = this._blRadius; |
370 | var brRad = this._brRadius; | 372 | var brRad = this._brRadius; |
373 | // limit the radii to half the rectangle dimension | ||
374 | var minDimen = hw < hh ? hw : hh; | ||
375 | if (tlRad > minDimen) tlRad = minDimen; | ||
376 | if (blRad > minDimen) blRad = minDimen; | ||
377 | if (brRad > minDimen) brRad = minDimen; | ||
378 | if (trRad > minDimen) trRad = minDimen; | ||
371 | 379 | ||
372 | if ((tlRad <= 0) && (blRad <= 0) && (brRad <= 0) && (trRad <= 0)) { | 380 | if ((tlRad <= 0) && (blRad <= 0) && (brRad <= 0) && (trRad <= 0)) { |
373 | ctx.rect(pt[0], pt[1], width - 2*inset, height - 2*inset); | 381 | ctx.rect(pt[0], pt[1], width - 2*inset, height - 2*inset); |
@@ -456,13 +464,13 @@ var Rectangle = function GLRectangle() | |||
456 | // render the fill | 464 | // render the fill |
457 | ctx.beginPath(); | 465 | ctx.beginPath(); |
458 | if (this._fillColor) { | 466 | if (this._fillColor) { |
459 | inset = Math.ceil( lw ) + 0.5; | 467 | inset = Math.ceil( lw ) - 0.5; |
460 | 468 | ||
461 | if(this._fillColor.gradientMode) { | 469 | if(this._fillColor.gradientMode) { |
462 | if(this._fillColor.gradientMode === "radial") { | 470 | if(this._fillColor.gradientMode === "radial") { |
463 | gradient = ctx.createRadialGradient(w/2, h/2, 0, w/2, h/2, Math.max(w/2, h/2)-inset); | 471 | gradient = ctx.createRadialGradient(w/2, h/2, 0, w/2, h/2, Math.max(w, h)/2); |
464 | } else { | 472 | } else { |
465 | gradient = ctx.createLinearGradient(inset, h/2, w-2*inset, h/2); | 473 | gradient = ctx.createLinearGradient(inset/2, h/2, w-inset, h/2); |
466 | } | 474 | } |
467 | colors = this._fillColor.color; | 475 | colors = this._fillColor.color; |
468 | 476 | ||
@@ -490,11 +498,11 @@ var Rectangle = function GLRectangle() | |||
490 | // render the stroke | 498 | // render the stroke |
491 | ctx.beginPath(); | 499 | ctx.beginPath(); |
492 | if (this._strokeColor) { | 500 | if (this._strokeColor) { |
493 | inset = Math.ceil( 0.5*lw ) + 0.5; | 501 | inset = Math.ceil( 0.5*lw ) - 0.5; |
494 | 502 | ||
495 | if(this._strokeColor.gradientMode) { | 503 | if(this._strokeColor.gradientMode) { |
496 | if(this._strokeColor.gradientMode === "radial") { | 504 | if(this._strokeColor.gradientMode === "radial") { |
497 | gradient = ctx.createRadialGradient(w/2, h/2, Math.min(h/2, w/2)-inset, w/2, h/2, Math.max(h/2, w/2)); | 505 | gradient = ctx.createRadialGradient(w/2, h/2, Math.min(h, w)/2-inset, w/2, h/2, Math.max(h, w)/2); |
498 | } else { | 506 | } else { |
499 | gradient = ctx.createLinearGradient(0, h/2, w, h/2); | 507 | gradient = ctx.createLinearGradient(0, h/2, w, h/2); |
500 | } | 508 | } |
diff --git a/js/lib/geom/sub-path.js b/js/lib/geom/sub-path.js index 7046673e..56c94df3 100755 --- a/js/lib/geom/sub-path.js +++ b/js/lib/geom/sub-path.js | |||
@@ -11,29 +11,6 @@ var GeomObj = require("js/lib/geom/geom-obj").GeomObj; | |||
11 | var AnchorPoint = require("js/lib/geom/anchor-point").AnchorPoint; | 11 | var AnchorPoint = require("js/lib/geom/anchor-point").AnchorPoint; |
12 | var MaterialsModel = require("js/models/materials-model").MaterialsModel; | 12 | var MaterialsModel = require("js/models/materials-model").MaterialsModel; |
13 | 13 | ||
14 | // TODO Those function do not seems to be used. We should remove them | ||
15 | function SubpathOffsetPoint(pos, mapPos) { | ||
16 | this.Pos = [pos[0],pos[1],pos[2]]; | ||
17 | this.CurveMapPos = [mapPos[0], mapPos[1], mapPos[2]]; | ||
18 | } | ||
19 | |||
20 | function SubpathOffsetTriangle(v0, v1, v2) { | ||
21 | this.v0 = v0; | ||
22 | this.v1 = v1; | ||
23 | this.v2 = v2; | ||
24 | this.n = [0,0,1]; //replace with the actual cross product later | ||
25 | } | ||
26 | |||
27 | function sortNumberAscending(a,b){ | ||
28 | return a-b; | ||
29 | } | ||
30 | function sortNumberDescending(a,b){ | ||
31 | return b-a; | ||
32 | } | ||
33 | function SegmentIntersections(){ | ||
34 | this.paramArray = []; | ||
35 | } | ||
36 | |||
37 | /////////////////////////////////////////////////////////////////////// | 14 | /////////////////////////////////////////////////////////////////////// |
38 | // Class GLSubpath | 15 | // Class GLSubpath |
39 | // representation a sequence of cubic bezier curves. | <