5 files changed, 338 insertions, 559 deletions

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() {
     return [this._nextX, this._nextY, this._nextZ];
 };
 
+GLAnchorPoint.prototype.getAllPos = function() {
+    return [[this._prevX, this._prevY, this._prevZ],[this._x, this._y, this._z],[this._nextX, this._nextY, this._nextZ]];
+};
+
 //return the square of distance from passed in point to the anchor position
 GLAnchorPoint.prototype.getDistanceSq = function (x, y, z) {
     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() {
             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;
@@ -544,6 +544,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);
@@ -553,7 +557,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);
         }
 
 
@@ -665,8 +669,8 @@ var BrushStroke = function GLBrushStroke() {
         this._copyCoordinates3D(this._OrigLocalPoints, retObject.origLocalPoints); //todo <ditto>
 
         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
@@ -694,8 +698,8 @@ var BrushStroke = function GLBrushStroke() {
         this._copyCoordinates3D(jo.origLocalPoints, this._OrigLocalPoints); //todo <ditto>
 
         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/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() {
                 if(this._fillColor.gradientMode) {
                     if(this._fillColor.gradientMode === "radial") {
                         gradient = ctx.createRadialGradient(xCtr, yCtr, 0,
-                                                            xCtr, yCtr, Math.max(yScale, xScale));
+                                                            xCtr, yCtr, Math.max(this._width, this._height)/2);
                     } else {
-                        gradient = ctx.createLinearGradient(0, this._height/2, this._width, this._height/2);
+                        gradient = ctx.createLinearGradient(lineWidth/2, this._height/2, this._width-lineWidth, this._height/2);
                     }
                     colors = this._fillColor.color;
 
diff --git a/js/lib/geom/rectangle.js b/js/lib/geom/rectangle.js
index 91b1d426..fcd1c1bd 100755
--- a/js/lib/geom/rectangle.js
+++ b/js/lib/geom/rectangle.js
@@ -356,7 +356,9 @@ var Rectangle = function GLRectangle() {
                 // various declarations
                 var pt,  rad,  ctr,  startPt, bPts;
                 var width  = Math.round(this.getWidth()),
-                        height = Math.round(this.getHeight());
+                        height = Math.round(this.getHeight()),
+            hw = 0.5*width,
+            hh = 0.5*height;
 
                 pt = [inset, inset];    // top left corner
 
@@ -364,6 +366,12 @@ var Rectangle = function GLRectangle() {
                 var trRad = this._trRadius;
                 var blRad = this._blRadius;
                 var brRad = this._brRadius;
+        // limit the radii to half the rectangle dimension
+        var minDimen = hw < hh ? hw : hh;
+        if (tlRad > minDimen)  tlRad = minDimen;
+        if (blRad > minDimen)  blRad = minDimen;
+        if (brRad > minDimen)  brRad = minDimen;
+        if (trRad > minDimen)  trRad = minDimen;
 
                 if ((tlRad <= 0) && (blRad <= 0) && (brRad <= 0) && (trRad <= 0)) {
                         ctx.rect(pt[0], pt[1], width - 2*inset, height - 2*inset);
@@ -452,13 +460,13 @@ var Rectangle = function GLRectangle() {
                 // render the fill
                 ctx.beginPath();
                 if (this._fillColor) {
-            inset = Math.ceil( lw ) + 0.5;
+            inset = Math.ceil( lw ) - 0.5;
 
             if(this._fillColor.gradientMode) {
                 if(this._fillColor.gradientMode === "radial") {
-                    gradient = ctx.createRadialGradient(w/2, h/2, 0, w/2, h/2, Math.max(w/2, h/2)-inset);
+                    gradient = ctx.createRadialGradient(w/2, h/2, 0, w/2, h/2, Math.max(w, h)/2);
                 } else {
-                    gradient = ctx.createLinearGradient(inset, h/2, w-2*inset, h/2);
+                    gradient = ctx.createLinearGradient(inset/2, h/2, w-inset, h/2);
                 }
                 colors = this._fillColor.color;
 
@@ -486,11 +494,11 @@ var Rectangle = function GLRectangle() {
                 // render the stroke
                 ctx.beginPath();
                 if (this._strokeColor) {
-            inset = Math.ceil( 0.5*lw ) + 0.5;
+            inset = Math.ceil( 0.5*lw ) - 0.5;
 
             if(this._strokeColor.gradientMode) {
                 if(this._strokeColor.gradientMode === "radial") {
-                    gradient = ctx.createRadialGradient(w/2, h/2, Math.min(h/2, w/2)-inset, w/2, h/2, Math.max(h/2, w/2));
+                    gradient = ctx.createRadialGradient(w/2, h/2, Math.min(h, w)/2-inset, w/2, h/2, Math.max(h, w)/2);
                 } else {
                     gradient = ctx.createLinearGradient(0, h/2, w, h/2);
                 }
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;
 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]];
-}
-
-function SubpathOffsetTriangle(v0, v1, v2) {
-    this.v0 = v0;
-    this.v1 = v1;
-    this.v2 = v2;
-    this.n = [0,0,1]; //replace with the actual cross product later
-}
-
-function sortNumberAscending(a,b){
-    return a-b;
-}
-function sortNumberDescending(a,b){
-    return b-a;
-}
-function SegmentIntersections(){
-    this.paramArray = [];
-}
-
 ///////////////////////////////////////////////////////////////////////
 // Class GLSubpath
 //      representation a sequence of cubic bezier curves.
@@ -44,49 +21,42 @@ var GLSubpath = function GLSubpath() {
     ///////////////////////////////////////////////////
     // Instance variables
     ///////////////////////////////////////////////////
+
+    // NOTE:
+    //  This class contains functionality to store piecewise cubic bezier paths.
+    //  The coordinates of the paths are always in local, canvas space.
+    //  That is, the Z coordinate can be ignored (for now), and the paths are essentially in 2D.
+    //  All coordinates of the '_Samples' should lie within [0,0] and [width, height],
+    //      where width and height refer to the dimensions of the canvas for this path.
+    //  Whenever the the canvas dimensions change, the coordinates of the anchor points
+    //      and _Samples must be re-computed.
+
     this._Anchors = [];
     this._BBoxMin = [0, 0, 0];
     this._BBoxMax = [0, 0, 0];
+    this._canvasCenterLocalCoord = [0,0,0];
+