24 files changed, 353 insertions, 2265 deletions

diff --git a/js/helper-classes/RDGE/GLCircle.js b/js/helper-classes/RDGE/GLCircle.js
index 942eb528..08057778 100644
--- a/js/helper-classes/RDGE/GLCircle.js
+++ b/js/helper-classes/RDGE/GLCircle.js
@@ -133,6 +133,9 @@ function GLCircle()
         if (!world)  throw( "null world in buildBuffers" );
 
                 if (!world._useWebGL)  return;
+                
+                // make sure RDGE has the correct context
+                g_Engine.setContext( world.getCanvas().uuid );
 
          // create the gl buffer
         var gl = world.getGLContext();
diff --git a/js/helper-classes/RDGE/GLLine.js b/js/helper-classes/RDGE/GLLine.js
index 67379b52..1cd70575 100644
--- a/js/helper-classes/RDGE/GLLine.js
+++ b/js/helper-classes/RDGE/GLLine.js
@@ -114,6 +114,9 @@ function GLLine( world, xOffset, yOffset, width, height, slope, strokeSize, stro
         var world = this.getWorld();
         if (!world)  throw( "null world in buildBuffers" );
                 if (!world._useWebGL)  return;
+                
+                // make sure RDGE has the correct context
+                g_Engine.setContext( world.getCanvas().uuid );
 
          // create the gl buffer
         var gl = world.getGLContext();
diff --git a/js/helper-classes/RDGE/GLMaterial.js b/js/helper-classes/RDGE/GLMaterial.js
index e72b7908..642fab05 100644
--- a/js/helper-classes/RDGE/GLMaterial.js
+++ b/js/helper-classes/RDGE/GLMaterial.js
@@ -31,6 +31,11 @@ function GLMaterial( world )
 
         this._texture;
 
+        // vertex deformation variables
+        this._hasVertexDeformation = false;
+        this._vertexDeformationRange = [0, 0, 1, 1];    // (xMin, yMin, xMax, yMax)
+        this._vertexDeformationTolerance = 0.1;
+
         // RDGE variables
         this._shader;
         this._materialNode;
@@ -66,6 +71,12 @@ function GLMaterial( world )
         // Any material needing continuous rendering should override this method
         this.isAnimated                 = function()                    {  return false;                                        }
 
+        // the vertex shader can apply deformations requiring refinement in
+        // certain areas.
+        this.hasVertexDeformation                       = function()    {  return this._hasVertexDeformation;                   }
+        this.getVertexDeformationRange          = function()    {  return this._vertexDeformationRange.slice(); }       
+        this.getVertexDeformationTolerance      = function()    {  return this._vertexDeformationTolerance;             }
+
 
     ///////////////////////////////////////////////////////////////////////
     // Common Material Methods
diff --git a/js/helper-classes/RDGE/GLRectangle.js b/js/helper-classes/RDGE/GLRectangle.js
index 2899e476..e34532d2 100644
--- a/js/helper-classes/RDGE/GLRectangle.js
+++ b/js/helper-classes/RDGE/GLRectangle.js
@@ -210,8 +210,11 @@ function GLRectangle()
                 // get the world
                 var world = this.getWorld();
                 if (!world)  throw( "null world in buildBuffers" );
-
+                //console.log( "GLRectangle.buildBuffers " + world._worldCount );
                 if (!world._useWebGL)  return;
+                
+                // make sure RDGE has the correct context
+                g_Engine.setContext( world.getCanvas().uuid );
 
                 // create the gl buffer
                 var gl = world.getGLContext();
@@ -284,6 +287,7 @@ function GLRectangle()
                 xFill -= strokeSize;
                 yFill -= strokeSize;
                 var fillMaterial = this.makeFillMaterial();
+                //console.log( "fillMaterial: " + fillMaterial.getName() );
                 var fillPrim = this.createFill([x,y],  2*xFill,  2*yFill,  tlRadius, blRadius, brRadius, trRadius, fillMaterial);
         this._primArray.push( fillPrim );
                 this._materialNodeArray.push( fillMaterial.getMaterialNode() );
@@ -313,71 +317,72 @@ function GLRectangle()
                 var width  = Math.round(this.getWidth()),
                         height = Math.round(this.getHeight());
 
+                // get the top left point
                 pt = [inset, inset];    // top left corner
+                rad = this.getTLRadius() - inset;
+                if (rad < 0)  rad = 0;
+                pt[1] += rad;
+                if (MathUtils.fpSign(rad) == 0)  pt[1] = 0;
+                ctx.moveTo( pt[0],  pt[1] );
+
+                // get the bottom left point
+                pt = [inset, height - inset];
+                rad = this.getBLRadius() - inset;
+                if (rad < 0)  rad = 0;
+                pt[1] -= rad;
+                ctx.lineTo( pt[0],  pt[1] );
+
+                // get the bottom left arc
+                if (MathUtils.fpSign(rad) > 0)
+                {
+                        ctr = [ this.getBLRadius(),  height - this.getBLRadius() ];
+                        //this.renderQuadraticBezier( MathUtils.circularArcToBezier( ctr, pt, -0.5*Math.PI ), ctx  );
+                        ctx.arc( ctr[0], ctr[1],    rad,    Math.PI,   0.5*Math.PI,  true );
+                }
 
-                var tlRad = this._tlRadius; //top-left radius
-                var trRad = this._trRadius;
-                var blRad = this._blRadius;
-                var brRad = this._brRadius;
+                // do the bottom of the rectangle
+                pt = [width - inset,  height - inset];
+                rad = this.getBRRadius() - inset;
+                if (rad < 0)  rad = 0;
+                pt[0] -= rad;
+                ctx.lineTo( pt[0], pt[1] );
 
-                if ((tlRad <= 0) && (blRad <= 0) && (brRad <= 0) && (trRad <= 0))
+                // get the bottom right arc
+                if (MathUtils.fpSign(rad) > 0)
                 {
-                        ctx.rect(pt[0], pt[1], width - 2*inset, height - 2*inset);
+                        ctr = [width - this.getBRRadius(),  height - this.getBRRadius()];
+                        //this.renderQuadraticBezier( MathUtils.circularArcToBezier( ctr, pt, -0.5*Math.PI ), ctx  );
+                        ctx.arc( ctr[0], ctr[1],   rad,   0.5*Math.PI,  0.0,  true );
                 }
-                else
+
+                // get the right of the rectangle
+                pt = [width - inset,  inset];
+                rad = this.getTRRadius() - inset;
+                if (rad < 0)  rad = 0;
+                pt[1] += rad;
+                ctx.lineTo( pt[0], pt[1] );
+
+                // do the top right corner
+                if (MathUtils.fpSign(rad) > 0)
+                {
+                        ctr = [width - this.getTRRadius(),  this.getTRRadius()];
+                        //this.renderQuadraticBezier( MathUtils.circularArcToBezier( ctr, pt, -0.5*Math.PI ), ctx );
+                        ctx.arc( ctr[0], ctr[1],   rad,   0.0,  -0.5*Math.PI,  true );
+                }
+
+                // do the top of the rectangle
+                pt = [inset, inset]
+                rad = this.getTLRadius() - inset;
+                if (rad < 0)  rad = 0;
+                pt[0] += rad;
+                ctx.lineTo( pt[0], pt[1] );
+
+                // do the top left corner
+                if (MathUtils.fpSign(rad) > 0)
                 {
-                        // get the top left point
-                        rad = tlRad - inset;
-                        if (rad < 0)  rad = 0;
-                        pt[1] += rad;
-                        if (MathUtils.fpSign(rad) == 0)  pt[1] = inset;
-                        ctx.moveTo( pt[0],  pt[1] );
-
-                        // get the bottom left point
-                        pt = [inset, height - inset];
+                        ctr = [this.getTLRadius(),  this.getTLRadius()];
+                        //this.renderQuadraticBezier( MathUtils.circularArcToBezier( ctr, pt, -0.5*Math.PI ), ctx );
+                        ctx.arc( ctr[0], ctr[1],   rad,   -0.5*Math.PI,  Math.PI,  true );