29 files changed, 876 insertions, 102 deletions

diff --git a/js/lib/drawing/world.js b/js/lib/drawing/world.js
index 08f9d319..71d0d098 100755
--- a/js/lib/drawing/world.js
+++ b/js/lib/drawing/world.js
@@ -466,6 +466,7 @@ World.prototype.updateObject = function (obj) {
     if (prims.length != materialNodes.length)
         throw new Error("inconsistent material and primitive counts");
     var nPrims = prims.length;
+        var iPrim = 0;
     var ctrTrNode;
     if (nPrims > 0)
     {
@@ -483,9 +484,13 @@ World.prototype.updateObject = function (obj) {
         );
         ctrTrNode.meshes = [];
 
-        ctrTrNode.attachMeshNode(this.renderer.id + "_prim_" + this._nodeCounter++, prims[0]);
         ctrTrNode.attachMaterial(materialNodes[0]);
+                while ((iPrim < nPrims) && (materialNodes[iPrim] == materialNodes[0]))
+                {
+                        ctrTrNode.attachMeshNode(this.renderer.id + "_prim_" + this._nodeCounter++, prims[iPrim]);
+                        iPrim++;
     }
+        }
 
     // delete all of the child nodes
     var i;
@@ -505,17 +510,19 @@ World.prototype.updateObject = function (obj) {
     }
     ctrTrNode.children = [];
 
-    for (var i = 1; i < nPrims; i++)
+        while (iPrim < nPrims)
     {
-        // get the next primitive
         childTrNode = RDGE.createTransformNode("objNode_" + this._nodeCounter++);
         ctrTrNode.insertAsChild(childTrNode);
+                var matNode = materialNodes[iPrim];
+                childTrNode.attachMaterial(matNode);
 
-        // attach the instanced box goe
-        var prim = prims[i];
-        childTrNode.attachMeshNode(this.renderer.id + "_prim_" + this._nodeCounter++, prim);
-        childTrNode.attachMaterial(materialNodes[i]);
+                while ((iPrim < nPrims) && (materialNodes[iPrim] == matNode))
+                {
+                        childTrNode.attachMeshNode(this.renderer.id + "_prim_" + this._nodeCounter++, prims[iPrim]);
+                        iPrim++;
     }
+        }
 
     // send a notification that the tree has changed
     this._notifier.sendNotification( this._notifier.OBJECT_CHANGE );
@@ -647,6 +654,7 @@ World.prototype.clearTree = function()
 
     if (this._useWebGL)
     {
+        this.stop();
         var root = this._rootNode;
         root.children = new Array();
         RDGE.globals.engine.unregisterCanvas( this._canvas.rdgeid );
diff --git a/js/lib/geom/circle.js b/js/lib/geom/circle.js
index e691f458..53847631 100755
--- a/js/lib/geom/circle.js
+++ b/js/lib/geom/circle.js
@@ -85,14 +85,28 @@ exports.Circle = Object.create(GeomObj, {
             } else {
                 this._strokeMaterial = MaterialsModel.getMaterial( MaterialsModel.getDefaultMaterialName() ).dup();
             }
-            if (strokeColor && this._strokeMaterial.hasProperty( "color" ))  this._strokeMaterial.setProperty( "color",  this._strokeColor );
+
+            if(strokeColor) {
+                if(this._strokeMaterial.hasProperty("color")) {
+                    this._strokeMaterial.setProperty( "color",  this._strokeColor );
+                } else if (this._strokeMaterial && (this._strokeMaterial.gradientType === this._strokeColor.gradientMode)) {
+                    this._strokeMaterial.setGradientData(this._strokeColor.color);
+                }
+            }
 
             if(fillMaterial) {
                 this._fillMaterial = fillMaterial.dup();
             } else {
                 this._fillMaterial = MaterialsModel.getMaterial(  MaterialsModel.getDefaultMaterialName() ).dup();
             }
-            if (fillColor && this._fillMaterial.hasProperty( "color" ))  this._fillMaterial.setProperty( "color",  this._fillColor );
+
+            if(fillColor) {
+                if(this._fillMaterial.hasProperty("color")) {
+                    this._fillMaterial.setProperty( "color",  this._fillColor );
+                } else if (this._fillMaterial && (this._fillMaterial.gradientType === this._fillColor.gradientMode)) {
+                    this._fillMaterial.setGradientData(this._fillColor.color);
+        }
+            }
         }
     },
 
@@ -308,7 +322,8 @@ exports.Circle = Object.create(GeomObj, {
             innerStrokeScaleMat[0] = xInnRad - xStroke;
             innerStrokeScaleMat[5] = yInnRad - yStroke;
 
-            var fillPrim,  strokePrim0,  strokePrim1;
+                        var i;
+                        var fillPrimArray,  strokePrim0Array,  strokePrim1Array;
             var fillMaterial,  strokeMaterial0,  strokeMaterial2;
 
             this._primArray = [];
@@ -322,42 +337,48 @@ exports.Circle = Object.create(GeomObj, {
                 var numStrokes = 1;
                 if(this._innerRadius !== 0) {
                     strokeMaterial0 = this.makeStrokeMaterial();
-                    strokePrim0 = this.generateOvalRing(x, y, reverseRotMat, innerStrokeScaleMat, innerRadiusScaleMat, nTriangles,  strokeMaterial0);
+                                        strokePrim0Array = this.generateOvalRing(x, y, reverseRotMat, innerStrokeScaleMat, innerRadiusScaleMat, nTriangles,  strokeMaterial0);
                 }
 
                 strokeMaterial2 = this.makeStrokeMaterial();
-                strokePrim1 = this.generateOvalRing(x, y, reverseRotMat, fillScaleMat, strokeScaleMat, nTriangles,  strokeMaterial2);
+                                strokePrim1Array = this.generateOvalRing(x, y, reverseRotMat, fillScaleMat, strokeScaleMat, nTriangles,  strokeMaterial2);
             }
 
-            if (strokePrim0) {
-                strokeMaterial0.fitToPrimitive( strokePrim0 );
-
-                this._primArray.push( strokePrim0 );
+                        if (strokePrim0Array) {
+                                strokeMaterial0.fitToPrimitiveArray( strokePrim0Array );
+                                for (i=0;  i<strokePrim0Array.length;  i++)
+                                {
+                                        this._primArray.push( strokePrim0Array[i] );
                 this._materialNodeArray.push( strokeMaterial0.getMaterialNode() );
             }
+                        }
 
-            if (strokePrim1) {
-                strokeMaterial2.fitToPrimitive( strokePrim1 );
-
-                this._primArray.push( strokePrim1 );
+                        if (strokePrim1Array) {
+                                strokeMaterial2.fitToPrimitiveArray( strokePrim1Array );
+                                for (i=0;  i<strokePrim1Array.length;  i++)
+                                {
+                                        this._primArray.push( strokePrim1Array[i] );
                 this._materialNodeArray.push( strokeMaterial2.getMaterialNode() );
             }
+                        }
 
             /////////////////////////////////////////////////////////////
             //  Fill
             fillMaterial = this.makeFillMaterial();
             if(this._innerRadius === 0) {
-                fillPrim = this.generateOval(x, y, mat, fillScaleMat, nTriangles,  fillMaterial);
+                                fillPrimArray = this.generateOval(x, y, mat, fillScaleMat, nTriangles,  fillMaterial);
             } else {
-                fillPrim = this.generateOvalRing(x, y, reverseRotMat, innerRadiusScaleMat, fillScaleMat, nTriangles,  fillMaterial);
+                                fillPrimArray = this.generateOvalRing(x, y, reverseRotMat, innerRadiusScaleMat, fillScaleMat, nTriangles,  fillMaterial);
             }
 
-            if (fillPrim) {
-                fillMaterial.fitToPrimitive( fillPrim );
+                        if (fillPrimArray) {
+