performance improvement: add most of the GLSubpath functions to its prototype

1 files changed, 848 insertions, 1483 deletions

diff --git a/js/helper-classes/RDGE/GLSubpath.js b/js/helper-classes/RDGE/GLSubpath.js
index 2e4c1631..c4ca1b20 100644
--- a/js/helper-classes/RDGE/GLSubpath.js
+++ b/js/helper-classes/RDGE/GLSubpath.js
@@ -34,6 +34,7 @@ function SegmentIntersections(){
 //      representation a sequence of cubic bezier curves.
 //      Derived from class GLGeomObj
 ///////////////////////////////////////////////////////////////////////
+
 function GLSubpath() {
     ///////////////////////////////////////////////////
     // Instance variables
@@ -49,14 +50,6 @@ function GLSubpath() {
     
     this._UnprojectedAnchors = [];
 
-    //offset path samples and the points on the input path they map to
-    this._offsetPointsLeft = [];
-    this._offsetPointsRight = [];
-
-    //triangles determined by the offset points
-    this._offsetTrianglesLeft = [];
-    this._offsetTrianglesRight = [];
-
     //initially set the _dirty bit so we will construct samples
     this._dirty = true;
 
@@ -87,7 +80,6 @@ function GLSubpath() {
     this._planeMatInv = null;
     this._planeCenter = null;
 
-    // initialize the inherited members
     this.inheritedFrom = GLGeomObj;
     this.inheritedFrom();
 
@@ -104,728 +96,438 @@ function GLSubpath() {
     this._DEFAULT_STROKE_WIDTH = 20; //use only if stroke width not specified
     this._MAX_OFFSET_ANGLE = 10; //max angle (in degrees) between consecutive vectors from curve to offset path
 
-    /////////////////////////////////////////////////////////
-    // Property Accessors/Setters
-    /////////////////////////////////////////////////////////
-    this.setWorld = function (world) { this._world = world; }
-    this.getWorld = function () { return this._world; }
-    this.makeDirty = function () {this._dirty = true;}
-    this.geomType = function () { return this.GEOM_TYPE_CUBIC_BEZIER; }
-    this.setDrawingTool = function (tool) {this._drawingTool = tool;}
-    this.getDrawingTool = function () {return this._drawingTool;}
-    this.setPlaneMatrix = function(planeMat){this._planeMat = planeMat;}
-    this.setPlaneMatrixInverse = function(planeMatInv){this._planeMatInv = planeMatInv;}
-    this.setPlaneCenter = function(pc){this._planeCenter = pc;}
-
-    this.getCanvasX = function(){return this._canvasX;}
-    this.getCanvasY = function(){return this._canvasY;}
-    this.setCanvasX = function(cx){this._canvasX=cx;}
-    this.setCanvasY = function(cy){this._canvasY=cy;}
-        
-    this.getIsClosed = function () {return this._isClosed;}
-    this.setIsClosed = function (isClosed) { 
-        if (this._isClosed !== isClosed) {
-            this._isClosed = isClosed;  
-            this._dirty = true;
-        }
-    }
-    this.getNumAnchors = function () { return this._Anchors.length; }
-    this.getAnchor = function (index) { return this._Anchors[index]; } 
-    this.addAnchor = function (anchorPt) { 
-        this._Anchors.push(anchorPt);
-        this._selectedAnchorIndex = this._Anchors.length-1;
-        this._dirty = true;
-    }
+    // (current GLGeomObj complains if buildBuffers/render is added to GLSubpath prototype)
+    //buildBuffers
+    //  Build the stroke vertices, normals, textures and colors
+    //  Add that array data to the GPU using OpenGL data binding
+    this.buildBuffers = function () {
+        return; //no need to do anything for now
+    }//buildBuffers()
 
-    this.insertAnchor = function(anchorPt, index){
-        this._Anchors.splice(index, 0, anchorPt);
-    }
+    //render
+    //  specify how to render the subpath in Canvas2D
+    this.render = function () {
+        // get the world
+        var world = this.getWorld();
+        if (!world)  throw( "null world in subpath render" );
 
-    //remove and return anchor at specified index, return null on error
-    this.removeAnchor = function (index) { 
-        var retAnchor = null;
-        if (index < this._Anchors.length) {
-            retAnchor = this._Anchors.splice(index, 1);
-            this._dirty = true;
-        }
-        //deselect the removed anchor if necessary
-        if (this._selectedAnchorIndex === index){
-            this._selectedAnchorIndex = -1;
-        }
-        return retAnchor;
-    }
+         // get the context
+        var ctx = world.get2DContext();
+        if (!ctx)  throw ("null context in subpath render")
 
-    this.deselectAnchorPoint = function(){
-        this._selectedAnchorIndex = -1;
-    }
-    
-    this.reversePath = function() {
-        var revAnchors = [];
-        var numAnchors = this._Anchors.length;
-        var lastIndex = numAnchors-1;
-        if (lastIndex<0){
-            return; //cannot reverse empty path
+        var numAnchors = this.getNumAnchors();
+        if (numAnchors === 0)
+            return; //nothing to do for empty paths
+
+        ctx.save();
+
+        this.createSamples(); //dirty bit checked in this function...will generate a polyline representation
+        var bboxMin = this.getBBoxMin();
+        var bboxMax = this.getBBoxMax();
+        var bboxWidth = bboxMax[0] - bboxMin[0];
+        var bboxHeight = bboxMax[1] - bboxMin[1];
+        var bboxMid = Vector.create([0.5 * (bboxMax[0] + bboxMin[0]), 0.5 * (bboxMax[1] + bboxMin[1]), 0.5 * (bboxMax[2] + bboxMin[2])]);
+
+        ctx.clearRect(0, 0, bboxWidth, bboxHeight);
+
+
+        ctx.lineWidth = this._strokeWidth;
+        ctx.strokeStyle = "black";
+        if (this._strokeColor)
+            ctx.strokeStyle = MathUtils.colorToHex( this._strokeColor );
+        ctx.fillStyle = "white";
+        if (this._fillColor)
+            ctx.fillStyle = MathUtils.colorToHex( this._fillColor );
+        var lineCap = ['butt','round','square'];
+        ctx.lineCap = lineCap[1];
+        ctx.beginPath();
+        var prevAnchor = this.getAnchor(0);
+        ctx.moveTo(prevAnchor.getPosX()-bboxMin[0],prevAnchor.getPosY()-bboxMin[1]);
+        for (var i = 1; i < numAnchors; i++) {
+            var currAnchor = this.getAnchor(i);
+            ctx.bezierCurveTo(prevAnchor.getNextX()-bboxMin[0],prevAnchor.getNextY()-bboxMin[1], currAnchor.getPrevX()-bboxMin[0], currAnchor.getPrevY()-bboxMin[1], currAnchor.getPosX()-bboxMin[0], currAnchor.getPosY()-bboxMin[1]);
+            prevAnchor = currAnchor;
         }
-        for (var i=lastIndex;i>=0;i--) {
-            var newAnchor = new GLAnchorPoint();
-            var oldAnchor = this._Anchors[i];
-            newAnchor.setPos(oldAnchor.getPosX(),oldAnchor.getPosY(),oldAnchor.getPosZ());
-            newAnchor.setPrevPos(oldAnchor.getNextX(),oldAnchor.getNextY(),oldAnchor.getNextZ());
-            newAnchor.setNextPos(oldAnchor.getPrevX(),oldAnchor.getPrevY(),oldAnchor.getPrevZ());
-            revAnchors.push(newAnchor);
+        if (this._isClosed === true) {
+            var currAnchor = this.getAnchor(0);
+            ctx.bezierCurveTo(prevAnchor.getNextX()-bboxMin[0],prevAnchor.getNextY()-bboxMin[1], currAnchor.getPrevX()-bboxMin[0], currAnchor.getPrevY()-bboxMin[1], currAnchor.getPosX()-bboxMin[0], currAnchor.getPosY()-bboxMin[1]);
+            prevAnchor = currAnchor;
         }
-        if (this._selectedAnchorIndex >= 0){
-            this._selectedAnchorIndex = (numAnchors-1) - this._selectedAnchorIndex;
+        if (this._isClosed){
+            ctx.fill();
         }
-        this._Anchors = revAnchors;
-        this._dirty=true;
-    }
+        ctx.stroke();
 
-    //remove all the anchor points
-    this.clearAllAnchors = function () {
-        this._Anchors = [];
-        this._isClosed = false; 
-        this._dirty = true;
-    }
+        ctx.restore();
+    } //render()
 
-    this.insertAnchorAtParameter = function(index, param) {
-        if (index+1 >= this._Anchors.length && !this._isClosed) {
-            return;
-        }
-        //insert an anchor after the specified index using the parameter, using De Casteljau subdivision
-        var nextIndex = (index+1)%this._Anchors.length;
+    this.geomType = function () { return this.GEOM_TYPE_CUBIC_BEZIER; }
+} //function GLSubpath ...class definition
 
-        //build the De Casteljau points
-        var P0P1 = VecUtils.vecInterpolate(3, this._Anchors[index].getPos(), this._Anchors[index].getNext(), param);
-        var P1P2 = VecUtils.vecInterpolate(3, this._Anchors[index].getNext(), this._Anchors[nextIndex].getPrev(), param);
-        var P2P3 = VecUtils.vecInterpolate(3, this._Anchors[nextIndex].getPrev(), this._Anchors[nextIndex].getPos(), param);
 
-        var P0P1P2 = VecUtils.vecInterpolate(3, P0P1, P1P2, param);
-        var P1P2P3 = VecUtils.vecInterpolate(3, P1P2, P2P3, param);
-        var anchorPos = VecUtils.vecInterpolate(3, P0P1P2, P1P2P3, param);
 
 
-        //update the next of the anchor at index and prev of anchor at nextIndex
-        var isPrevCoincident = false;
-        var isNextCoincident = false;
-        if (VecUtils.vecDist( 3, P0P1, this._Anchors[index].getNext()) < this._SAMPLING_EPSILON) {
-            //no change to the next point
-            isPrevCoincident = true;
-        } else {
-            this._Anchors[index].setNextPos(P0P1[0], P0P1[1], P0P1[2]);
-        }
 
-        if (VecUtils.vecDist( 3, P2P3, this._Anchors[nextIndex].getPrev()) < this._SAMPLING_EPSILON) {
-            //no change to the prev point
-            isNextCoincident = true;
-        } else {
-            this._Anchors[nextIndex].setPrevPos(P2P3[0], P2P3[1], P2P3[2]);
-        }
 
-        //create a new anchor point
-        var newAnchor = new GLAnchorPoint();
+    /////////////////////////////////////////////////////////
+    // Property Accessors/Setters
+    /////////////////////////////////////////////////////////
+GLSubpath.prototype.setWorld = function (world) { this._world = world; }
+GLSubpath.prototype.getWorld = function () { return this._world; }