13 files changed, 467 insertions, 230 deletions

diff --git a/js/document/html-document.js b/js/document/html-document.js
index 9a7755e6..f5816f64 100755
--- a/js/document/html-document.js
+++ b/js/document/html-document.js
@@ -152,13 +152,13 @@ exports.HTMLDocument = Montage.create(TextDocument, {
     glData: {
         get: function()
                 {
-                        var elt = this.iframe;
                         var elt = this.iframe.contentWindow.document.getElementById("UserContent");
                         this._glData = null;
                         if (elt)
                         {
-                                this._glData = new Array();
-                                this.collectGLData( elt,  this._glData );
+                                var cdm = new CanvasDataManager();
+                                this._glData = [];
+                                cdm.collectGLData( elt,  this._glData );
                         }
                                 
                         return this._glData
@@ -166,37 +166,12 @@ exports.HTMLDocument = Montage.create(TextDocument, {
 
         set: function(value)
                 {
-                        var nWorlds = value.length;
-                        for (var i=0;  i<nWorlds;  i++)
+                        var elt = this.iframe.contentWindow.document.getElementById("UserContent");
+                        if (elt)
                         {
-                                var importStr = value[i];
-                                var startIndex = importStr.indexOf( "id: " );
-                                if (startIndex >= 0)
-                                {
-                                        var endIndex = importStr.indexOf( "\n", startIndex );
-                                        if (endIndex > 0)
-                                        {
-                                                var id = importStr.substring( startIndex+4, endIndex );
-                                                var canvas = this.iframe.contentWindow.document.getElementById( id );
-                                                if (canvas)
-                                                {
-                                                        if (!canvas.elementModel)
-                                                        {
-                                                                NJUtils.makeElementModel(canvas, "Canvas", "shape", true);
-                                                        }
-                                                                
-                                                        if (canvas.elementModel)
-                                                        {
-                                                                if (canvas.elementModel.shapeModel.GLWorld)
-                                    canvas.elementModel.shapeModel.GLWorld.clearTree();
-
-                                                                var world = new GLWorld( canvas );
-                                                                canvas.elementModel.shapeModel.GLWorld = world;
-                                                                world.import( importStr );
-                                                        }
-                                                }
-                                        }
-                                }
+                                console.log( "load canvas data: " + value );
+                                var cdm = new CanvasDataManager();
+                                cdm.loadGLData(elt,  value);
                         }
                 }
     },
diff --git a/js/helper-classes/3D/view-utils.js b/js/helper-classes/3D/view-utils.js
index a2fac34f..bedda8bf 100755
--- a/js/helper-classes/3D/view-utils.js
+++ b/js/helper-classes/3D/view-utils.js
@@ -1226,6 +1226,14 @@ exports.ViewUtils = Montage.create(Component, {
             }
     },
 
+        getCurrentDocument:
+        {
+                value: function()
+                {
+                        return snapManagerModule.SnapManager.application.ninja.currentDocument;
+                }
+        },
+
         setStageZoom: {
         value:function( globalPt,  zoomFactor ) {
             var localPt;
diff --git a/js/helper-classes/RDGE/GLCircle.js b/js/helper-classes/RDGE/GLCircle.js
index 5b32547e..15ed6b6d 100755
--- a/js/helper-classes/RDGE/GLCircle.js
+++ b/js/helper-classes/RDGE/GLCircle.js
@@ -47,8 +47,8 @@ function GLCircle()
         
                         this._strokeWidth = strokeSize;
                         this._innerRadius = innerRadius;
-                        this._strokeColor = strokeColor;
-                        this._fillColor = fillColor;
+                        if (strokeColor)  this._strokeColor = strokeColor;
+                        if (fillColor)  this._fillColor = fillColor;
 
                         this._strokeStyle = strokeStyle;
                 }
@@ -135,7 +135,7 @@ function GLCircle()
                 if (!world._useWebGL)  return;
                 
                 // make sure RDGE has the correct context
-                g_Engine.setContext( world.getCanvas().uuid );
+                g_Engine.setContext( world.getCanvas().rdgeid );
 
          // create the gl buffer
         var gl = world.getGLContext();
@@ -398,59 +398,58 @@ function GLCircle()
                         // set up the fill style
                         ctx.beginPath();
                         ctx.lineWidth = 0;
-                        ctx.fillStyle   = "#990000";
                         if (this._fillColor)
                         {
                                 var c = "rgba(" + 255*this._fillColor[0] + "," + 255*this._fillColor[1] + "," + 255*this._fillColor[2] + "," + this._fillColor[3] + ")";  
                                 ctx.fillStyle = c;
-                        }
 
-                        // draw the fill
-                        ctx.beginPath();
-                        var p = MathUtils.transformPoint( bezPts[0],   mat );
-                        ctx.moveTo( p[0],  p[1] );
-                        var index = 1;
-                        while (index < n)
-                        {
-                                p0   = MathUtils.transformPoint( bezPts[index],  mat );
-                                p1 = MathUtils.transformPoint( bezPts[index+1],  mat );
+                                // draw the fill
+                                ctx.beginPath();
+                                var p = MathUtils.transformPoint( bezPts[0],   mat );
+                                ctx.moveTo( p[0],  p[1] );
+                                var index = 1;
+                                while (index < n)
+                                {
+                                        p0   = MathUtils.transformPoint( bezPts[index],  mat );
+                                        p1 = MathUtils.transformPoint( bezPts[index+1],  mat );
 
-                                x0 = p0[0];  y0 = p0[1];
-                                x1 = p1[0];  y1 = p1[1];
-                                ctx.quadraticCurveTo( x0,  y0,  x1, y1 );
-                                index += 2;
-                        }
+                                        x0 = p0[0];  y0 = p0[1];
+                                        x1 = p1[0];  y1 = p1[1];
+                                        ctx.quadraticCurveTo( x0,  y0,  x1, y1 );
+                                        index += 2;
+                                }
 
-                        if ( MathUtils.fpSign(innerRad) > 0)
-                        {
-                                xScale = 0.5*innerRad*this._width;
-                                yScale = 0.5*innerRad*this._height;
-                                mat[0] = xScale;
-                                mat[5] = yScale;
-
-                                // get the bezier points
-                                var bezPts = MathUtils.circularArcToBezier( Vector.create([0,0,0]), Vector.create([1,0,0]), -2.0*Math.PI );
-                                if (bezPts)
+                                if ( MathUtils.fpSign(innerRad) > 0)
                                 {
-                                        var n = bezPts.length;
-                                        p = MathUtils.transformPoint( bezPts[0],   mat );
-                                        ctx.moveTo( p[0],  p[1] );
-                                        index = 1;
-                                        while (index < n)
+                                        xScale = 0.5*innerRad*this._width;
+                                        yScale = 0.5*innerRad*this._height;
+                                        mat[0] = xScale;
+                                        mat[5] = yScale;
+
+                                        // get the bezier points
+                                        var bezPts = MathUtils.circularArcToBezier( Vector.create([0,0,0]), Vector.create([1,0,0]), -2.0*Math.PI );
+                                        if (bezPts)
                                         {
-                                                p0 = MathUtils.transformPoint( bezPts[index],    mat );
-                                                p1 = MathUtils.transformPoint( bezPts[index+1],  mat );
-
-                                                var x0 = p0[0],  y0 = p0[1],
-                                                        x1 = p1[0],  y1 = p1[1];
-                                                ctx.quadraticCurveTo( x0,  y0,  x1, y1 );
-                                                index += 2;
+                                                var n = bezPts.length;
+                                                p = MathUtils.transformPoint( bezPts[0],   mat );
+                                                ctx.moveTo( p[0],  p[1] );
+                                                index = 1;
+                                                while (index < n)
+                                                {
+                                                        p0 = MathUtils.transformPoint( bezPts[index],    mat );
+                                                        p1 = MathUtils.transformPoint( bezPts[index+1],  mat );
+
+                                                        var x0 = p0[0],  y0 = p0[1],
+                                                                x1 = p1[0],  y1 = p1[1];
+                                                        ctx.quadraticCurveTo( x0,  y0,  x1, y1 );
+                                                        index += 2;
+                                                }