Merge pull request #159 from mqg734/WebGLMaterials

3D tools, eyedropper, fill, ink-bucket, gradients and shape fixes.

6 files changed, 126 insertions, 60 deletions

diff --git a/js/lib/NJUtils.js b/js/lib/NJUtils.js
index 904aa41e..67bb59c4 100755
--- a/js/lib/NJUtils.js
+++ b/js/lib/NJUtils.js
@@ -94,7 +94,10 @@ exports.NJUtils = Object.create(Object.prototype, {
     ///// TODO: find a different place for this function
     makeElementModel: {
         value: function(el, selection, controller, isShape) {
-            var p3d = Montage.create(Properties3D).init(el);
+            var p3d = Montage.create(Properties3D);
+            if(selection === "Stage") {
+                p3d.init(el, true);
+            }
             var shapeProps = null;
             var pi = controller + "Pi";
 
@@ -136,7 +139,8 @@ exports.NJUtils = Object.create(Object.prototype, {
                     controller: { value: ControllerFactory.getController(controller)},
                     pi:         { value: pi},
                     props3D:    { value: p3d},
-                    shapeModel: { value: shapeProps}
+                    shapeModel: { value: shapeProps},
+                    isShape:    { value: isShape}
             });
 
         }
@@ -168,6 +172,7 @@ exports.NJUtils = Object.create(Object.prototype, {
                         // TODO - Need more info about the shape
                         selection = "canvas";
                         controller = "shape";
+                        isShape = true;
                     }
                     else
                     {
@@ -179,6 +184,9 @@ exports.NJUtils = Object.create(Object.prototype, {
                     break;
             }
             this.makeElementModel(el, selection, controller, isShape);
+            if(el.elementModel && el.elementModel.props3D) {
+                el.elementModel.props3D.init(el, (selection === "Stage"));
+            }
         }
     },
 
diff --git a/js/lib/drawing/world.js b/js/lib/drawing/world.js
index 657c849f..945c9883 100755
--- a/js/lib/drawing/world.js
+++ b/js/lib/drawing/world.js
@@ -854,7 +854,7 @@ World.prototype.importObjectsJSON = function (jObj, parentGeomObj) {
 
         // determine if we have children
     if (jObj.children) {
-                var nKids = ojObjbj.chilodren.length;
+                var nKids = jObj.children.length;
         for (var i = 0; i < nKids; i++) {
                         var child = jObj.children[i];
                         this.importObjectsJSON( child, gObj );
diff --git a/js/lib/geom/circle.js b/js/lib/geom/circle.js
index 7fa78b12..1073c2db 100755
--- a/js/lib/geom/circle.js
+++ b/js/lib/geom/circle.js
@@ -42,8 +42,8 @@ var Circle = function GLCircle() {
         
                         this._strokeWidth = strokeSize;
                         this._innerRadius = innerRadius;
-                        if (strokeColor)  this._strokeColor = strokeColor;
-                        if (fillColor)  this._fillColor = fillColor;
+                        this._strokeColor = strokeColor;
+                        this._fillColor = fillColor;
 
                         this._strokeStyle = strokeStyle;
                 }
@@ -631,6 +631,21 @@ var Circle = function GLCircle() {
                 this._strokeStyle               = jObj.strokeStyle;
                 var strokeMaterialName  = jObj.strokeMat;
                 var fillMaterialName    = jObj.fillMat;
+
+        var strokeMat = MaterialsModel.getMaterial( strokeMaterialName );
+        if (!strokeMat) {
+            console.log( "object material not found in library: " + strokeMaterialName );
+            strokeMat = MaterialsModel.getMaterial(  MaterialsModel.getDefaultMaterialName() );
+        }
+        this._strokeMaterial = strokeMat;
+
+        var fillMat = MaterialsModel.getMaterial( fillMaterialName );
+        if (!fillMat) {
+            console.log( "object material not found in library: " + fillMaterialName );
+            fillMat = MaterialsModel.getMaterial(  MaterialsModel.getDefaultMaterialName() );
+        }
+        this._fillMaterial = fillMat;
+
                 this.importMaterialsJSON( jObj.materials );
         };
 
diff --git a/js/lib/geom/geom-obj.js b/js/lib/geom/geom-obj.js
index bb5b4a9a..2cde8a75 100755
--- a/js/lib/geom/geom-obj.js
+++ b/js/lib/geom/geom-obj.js
@@ -1,8 +1,8 @@
 /* <copyright>
-This file contains proprietary software owned by Motorola Mobility, Inc.<br/>
-No rights, expressed or implied, whatsoever to this software are provided by Motorola Mobility, Inc. hereunder.<br/>
-(c) Copyright 2011 Motorola Mobility, Inc.  All Rights Reserved.
-</copyright> */
+ This file contains proprietary software owned by Motorola Mobility, Inc.<br/>
+ No rights, expressed or implied, whatsoever to this software are provided by Motorola Mobility, Inc. hereunder.<br/>
+ (c) Copyright 2011 Motorola Mobility, Inc.  All Rights Reserved.
+ </copyright> */
 
 var MaterialsModel = require("js/models/materials-model").MaterialsModel;
 
@@ -144,46 +144,65 @@ var GeomObj = function GLGeomObj() {
     this.setMaterialColor = function (c, type) {
         var i = 0,
             nMats = 0;
-        if (c.gradientMode) {
-            // Gradient support
-            if (this._materialArray && this._materialTypeArray) {
-                nMats = this._materialArray.length;
-            }
-
-            var stops = [],
-                colors = c.color;
+        if (c) {
+            if (c.gradientMode) {
+                // Gradient support
+                if (this._materialArray && this._materialTypeArray) {
+                    nMats = this._materialArray.length;
+                }
 
-            var len = colors.length;
-            // TODO - Current shaders only support 4 color stops
-            if (len > 4) {
-                len = 4;
-            }
+                var stops = [],
+                    colors = c.color;
 
-            for (var n = 0; n < len; n++) {
-                var position = colors[n].position / 100;
-                var cs = colors[n].value;
-                var stop = [cs.r / 255, cs.g / 255, cs.b / 255, cs.a];
-                stops.push(stop);
+                var len = colors.length;
+                // TODO - Current shaders only support 4 color stops
+                if (len > 4) {
+                    len = 4;
+                }
 
-                if (nMats === this._materialTypeArray.length) {
-                    for (i = 0; i < nMats; i++) {
-                        if (this._materialTypeArray[i] == type) {
-                            this._materialArray[i].setProperty("color" + (n + 1), stop.slice(0));
-                            this._materialArray[i].setProperty("colorStop" + (n + 1), position);
+                for (var n = 0; n < len; n++) {
+                    var position = colors[n].position / 100;
+                    var cs = colors[n].value;
+                    var stop = [cs.r / 255, cs.g / 255, cs.b / 255, cs.a];
+                    stops.push(stop);
+
+                    if (nMats === this._materialTypeArray.length) {
+                        for (i = 0; i < nMats; i++) {
+                            if (this._materialTypeArray[i] == type) {
+                                this._materialArray[i].setProperty("color" + (n + 1), stop.slice(0));
+                                this._materialArray[i].setProperty("colorStop" + (n + 1), position);
+                            }
                         }
                     }
                 }
-            }
-            if (type === "fill") {
-                this._fillColor = c;
+                if (type === "fill") {
+                    this._fillColor = c;
+                } else {
+                    this._strokeColor = c;
+                }
             } else {
-                this._strokeColor = c;
+                if (type === "fill") {
+                    this._fillColor = c.slice(0);
+                } else {
+                    this._strokeColor = c.slice(0);
+                }
+
+                if (this._materialArray && this._materialTypeArray) {
+                    nMats = this._materialArray.length;
+                    if (nMats === this._materialTypeArray.length) {
+                        for (i = 0; i < nMats; i++) {
+                            if (this._materialTypeArray[i] == type) {
+                                this._materialArray[i].setProperty("color", c.slice(0));
+                            }
+                        }
+                    }
+                }
             }
         } else {
             if (type === "fill") {
-                this._fillColor = c.slice(0);
+                this._fillColor = null;
             } else {
-                this._strokeColor = c.slice(0);
+                this._strokeColor = null;
             }
 
             if (this._materialArray && this._materialTypeArray) {
@@ -191,7 +210,8 @@ var GeomObj = function GLGeomObj() {
                 if (nMats === this._materialTypeArray.length) {
                     for (i = 0; i < nMats; i++) {
                         if (this._materialTypeArray[i] == type) {
-                            this._materialArray[i].setProperty("color", c.slice(0));
+                            // TODO - Not sure how to set color to null values in shaders
+                            this._materialArray[i].setProperty("color", [0, 0, 0, 0]);
                         }