6 files changed, 2420 insertions, 2124 deletions

diff --git a/js/lib/geom/brush-stroke.js b/js/lib/geom/brush-stroke.js
index 519e0433..09a7023c 100755
--- a/js/lib/geom/brush-stroke.js
+++ b/js/lib/geom/brush-stroke.js
@@ -835,7 +835,7 @@ var BrushStroke = function GLBrushStroke() {
 
 }; //function BrushStroke ...class definition
 
-BrushStroke.prototype = new GeomObj();
+BrushStroke.prototype = Object.create(GeomObj, {});
 
 BrushStroke.prototype._CatmullRomSplineInterpolate = function(ctrlPts, t)
 {
diff --git a/js/lib/geom/circle.js b/js/lib/geom/circle.js
index 218dcfa6..425b869a 100755
--- a/js/lib/geom/circle.js
+++ b/js/lib/geom/circle.js
@@ -7,705 +7,801 @@ No rights, expressed or implied, whatsoever to this software are provided by Mot
 var GeomObj =           require("js/lib/geom/geom-obj").GeomObj;
 var ShapePrimitive =    require("js/lib/geom/shape-primitive").ShapePrimitive;
 var MaterialsModel = require("js/models/materials-model").MaterialsModel;
+var drawUtils           = require("js/helper-classes/3D/draw-utils").DrawUtils;
+var vecUtils            = require("js/helper-classes/3D/vec-utils").VecUtils;
+
 ///////////////////////////////////////////////////////////////////////
 // Class GLCircle
 //      GL representation of a circle.
 //      Derived from class GLGeomObj
 //              The position and dimensions of the stroke, fill, and inner Radius should be in pixels
 ///////////////////////////////////////////////////////////////////////
-var Circle = function GLCircle() {
-
-        this.init = function( world, xOffset, yOffset, width, height, strokeSize, strokeColor, fillColor, innerRadius, strokeMaterial, fillMaterial, strokeStyle) {
-                ///////////////////////////////////////////////////////////////////////
-                // Instance variables
-                ///////////////////////////////////////////////////////////////////////
-                this._width = 2.0;
-                this._height = 2.0;
-                this._xOffset = 0;
-                this._yOffset = 0;
-
-                this._radius = 2.0;
-                this._strokeWidth = 0.25;
-                this._innerRadius = 0;
-
-                this._ovalHeight = this._ovalHeight = 2.0 * this._radius;
-
-                this._strokeStyle = "Solid";
-
-                this._aspectRatio = 1.0;
-
-                if (arguments.length > 0) {
-                        this._width = width;
-                        this._height = height;
-                        this._xOffset = xOffset;
-                        this._yOffset = yOffset;
-        
-                        this._strokeWidth = strokeSize;
-                        this._innerRadius = innerRadius;
-                        this._strokeColor = strokeColor;
-                        this._fillColor = fillColor;
-
-                        this._strokeStyle = strokeStyle;
-                }
-
-                this.m_world = world;
-
-                if(strokeMaterial){
-                        this._strokeMaterial = strokeMaterial;
-        } else {
-                        this._strokeMaterial = MaterialsModel.getMaterial( MaterialsModel.getDefaultMaterialName() );
-        }
+exports.Circle = Object.create(GeomObj, {
+
+    ///////////////////////////////////////////////////////////////////////
+    // Instance variables
+    ///////////////////////////////////////////////////////////////////////
+    _width: { value : 2.0, writable: true },
+    _height: { value : 2.0, writable: true },
+    _xOffset: { value : 0, writable: true },
+    _yOffset: { value : 0, writable: true },
+
+    _radius: { value : 2.0, writable: true },
+    _strokeWidth: { value : 0.25, writable: true },
+    _innerRadius: { value : 0, writable: true },
+    _ovalHeight: { value : 4.0, writable: true },
+    _strokeStyle: { value : "Solid", writable: true },
+    _aspectRatio: { value : 1.0, writable: true },
+
+        init: {
+        value: function(world, xOffset, yOffset, width, height, strokeSize, strokeColor, fillColor, innerRadius, strokeMaterial, fillMaterial, strokeStyle) {
+            if(arguments.length > 0) {
+                this._width = width;
+                this._height = height;
+                this._xOffset = xOffset;
+                this._yOffset = yOffset;
+                this._ovalHeight = 2.0 * this._radius;
+
+                this._strokeWidth = strokeSize;
+                this._innerRadius = innerRadius;
+                this._strokeColor = strokeColor;
+                this._fillColor = fillColor;
+
+                this._strokeStyle = strokeStyle;
+
+                this._matrix = Matrix.I(4);
+                //this._matrix[12] = xOffset;
+                //this._matrix[13] = yOffset;
+            }
+
+            this.m_world = world;
 
-                if(fillMaterial) {
-                        this._fillMaterial = fillMaterial;
-        } else {
-                        this._fillMaterial = MaterialsModel.getMaterial(  MaterialsModel.getDefaultMaterialName() );
+            if(strokeMaterial) {
+                this._strokeMaterial = strokeMaterial;
+            } else {
+                this._strokeMaterial = MaterialsModel.getMaterial( MaterialsModel.getDefaultMaterialName() );
+            }
+
+            if(fillMaterial) {
+                this._fillMaterial = fillMaterial;
+            } else {
+                this._fillMaterial = MaterialsModel.getMaterial(  MaterialsModel.getDefaultMaterialName() );
+            }
         }
-        };
+    },
 
     ///////////////////////////////////////////////////////////////////////
     // Property Accessors
     ///////////////////////////////////////////////////////////////////////
-        this.getStrokeWidth = function() {
-        return this._strokeWidth;
-    };
-
-        this.setStrokeWidth = function(w) {
-        this._strokeWidth = w;
-    };
-
-        this.getStrokeMaterial = function() {
-        return this._strokeMaterial;
-    };
+    // TODO - Use getters/setters in the future
+    getStrokeWidth: {
+        value: function() {
+            return this._strokeWidth;
+        }
+    },
 
-        this.setStrokeMaterial = function(m) {
-        this._strokeMaterial = m;
-    };
+    setStrokeWidth: {
+        value: function(w) {
+            this._strokeWidth = w;
+        }
+    },
 
-        this.getFillMaterial = function() {
-        return this._fillMaterial;
-    };
+    getStrokeMaterial: {
+        value: function() {
+            return this._strokeMaterial;
+        }
+    },
 
-        this.setFillMaterial = function(m) {
-        this._fillMaterial = m;
-    };
+    setStrokeMaterial: {
+        value: function(m) {
+            this._strokeMaterial = m;
+        }
+    },
 
-        this.getRadius = function() {
-        return this._radius;
-    };
+    getFillMaterial: {
+        value: function() {
+            return this._fillMaterial;
+        }
+    },
 
-        this.setRadius = function(r) {
-        this._radius = r;
-    };
+    setFillMaterial: {
+        value: function(m) {
+            this._fillMaterial = m;
+        }
+    },
 
-        this.getWorld = function() {
-        return this._world;
-    };
+    getRadius: {
+        value: function() {
+            return this._radius;
+        }
+    },
 
-        this.setWorld = function(w) {
-        this._world = w;
-    };
+    setRadius: {
+        value: function(r) {
+            this._radius = r;
+        }
+    },
 
-    this.getInnerRadius = function() {
-        return this._innerRadius;
-    };
+    getInnerRadius: {
+        value: function() {
+            return this._innerRadius;
+        }
+    },
 
-        this.setInnerRadius = function(r) {
-        this._innerRadius = r;
-    };
+    setInnerRadius: {
+        value: function(r) {
+            this._innerRadius = r;
+        }
+    },
 
-    this.getStrokeStyle = function() {
-        return this._strokeStyle;
-    };
-        this.setStrokeStyle     = function(s) {
-        this._strokeStyle = s;
-    };
+    getStrokeStyle: {
+        value: function() {
+            return this._strokeStyle;
+        }
+    },
 
-        this.getWidth = function() {
-        return this._width;
-    };
+    setStrokeStyle: {
+        value: function(s) {
+            this._strokeStyle = s;
+        }
+    },
 
-        this.setWidth = function(w) {
-        this._width = w;
-    };
+    getWidth: {
+        value: function() {
+            return this._width;
+        }
+    },
 
-        this.getHeight = function() {
-        return this._height;
-    };
+    setWidth: {
+        value: function(w) {
+            this._width = w;
+        }