From 46defc9bd11bf077efd672c72787a3b67da1a178 Mon Sep 17 00:00:00 2001
From: hwc487
Date: Mon, 12 Mar 2012 14:59:08 -0700
Subject: Uber material changes for IO

---
 .../RDGE/src/core/script/MeshManager.js            |   2 +-
 .../RDGE/src/core/script/run_state.js              |  16 +--
 js/lib/geom/geom-obj.js                            |   6 +-
 js/lib/rdge/materials/flat-material.js             |   6 -
 js/lib/rdge/materials/uber-material.js             | 122 ++++++++++++++++++---
 5 files changed, 121 insertions(+), 31 deletions(-)

(limited to 'js')

diff --git a/js/helper-classes/RDGE/src/core/script/MeshManager.js b/js/helper-classes/RDGE/src/core/script/MeshManager.js
index 43813078..7dfc79d4 100755
--- a/js/helper-classes/RDGE/src/core/script/MeshManager.js
+++ b/js/helper-classes/RDGE/src/core/script/MeshManager.js
@@ -69,7 +69,7 @@ MeshManager.prototype.deleteMesh = function (name)
 	if (model)
 	{
 		g_Engine.ctxMan.forEach(function(context)
-		{
+		{
 			context.renderer.deletePrimitive(model.primitive);
 		});
 
diff --git a/js/helper-classes/RDGE/src/core/script/run_state.js b/js/helper-classes/RDGE/src/core/script/run_state.js
index acdb6797..a5981caa 100755
--- a/js/helper-classes/RDGE/src/core/script/run_state.js
+++ b/js/helper-classes/RDGE/src/core/script/run_state.js
@@ -30,9 +30,9 @@ RunState.prototype.Init = function()
 		this.userRunState.init();
 	}
 
-	if (this.hasUserState && this.userRunState && this.userRunState.onRunState)
-		this.userRunState.onRunState();
-
+	if (this.hasUserState && this.userRunState && this.userRunState.onRunState)
+		this.userRunState.onRunState();
+
 
 	////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
 
@@ -97,11 +97,11 @@ RunState.prototype.ReInit = function()
 	if(!this.initialized)
 	{
 		this.Init();
-	}
-	else
-	{
-		if (this.hasUserState && this.userRunState && this.userRunState.onRunState)
-			this.userRunState.onRunState();
+	}
+	else
+	{
+		if (this.hasUserState && this.userRunState && this.userRunState.onRunState)
+			this.userRunState.onRunState();
 	}
 }
 
diff --git a/js/lib/geom/geom-obj.js b/js/lib/geom/geom-obj.js
index 1a197832..35ebadb9 100755
--- a/js/lib/geom/geom-obj.js
+++ b/js/lib/geom/geom-obj.js
@@ -285,9 +285,11 @@ var GeomObj = function GLGeomObj() {
 			if (mat)
 				mat.import( importStr );
 
-			var endIndex = importStr.indexOf( "endMaterial\n" );
+			// pull off the end of the material 
+			var endMat = "endMaterial\n";
+			var endIndex = importStr.indexOf( endMat );
 			if (endIndex < 0)  break;
-			importStr = importStr.substr( endIndex );
+			importStr = importStr.substr( endIndex + endMat.length );
 		}
 	}
 
diff --git a/js/lib/rdge/materials/flat-material.js b/js/lib/rdge/materials/flat-material.js
index 97e4f646..fff0e68e 100755
--- a/js/lib/rdge/materials/flat-material.js
+++ b/js/lib/rdge/materials/flat-material.js
@@ -102,13 +102,7 @@ var FlatMaterial = function FlatMaterial() {
         try
         {
             var color  = eval( "[" + pu.nextValue( "color: " ) + "]" );
-
             this.setProperty( "color",  color);
-
-            var endKey = "endMaterial\n";
-            var index = importStr.indexOf( endKey );
-            index += endKey.length;
-            rtnStr = importStr.substr( index );
         }
         catch (e)
         {
diff --git a/js/lib/rdge/materials/uber-material.js b/js/lib/rdge/materials/uber-material.js
index 655d8e2a..8ec5b05c 100755
--- a/js/lib/rdge/materials/uber-material.js
+++ b/js/lib/rdge/materials/uber-material.js
@@ -4,6 +4,7 @@
  (c) Copyright 2011 Motorola Mobility, Inc.  All Rights Reserved.
  </copyright> */
 
+var MaterialParser = require("js/lib/rdge/materials/material-parser").MaterialParser;
 var Material = require("js/lib/rdge/materials/material").Material;
 
 var UberMaterial = function UberMaterial() {
@@ -375,19 +376,111 @@ var UberMaterial = function UberMaterial() {
         var endKey = "endMaterial\n";
         var index = importStr.indexOf( endKey );
         index += endKey.length;
-        importStr = importStr.substr( index );
+        importStr = importStr.slice( 0, index );
 		var pu = new MaterialParser( importStr );
 
 		var matProps = pu.nextValue( "materialProps: " );
 		if (matProps)
 		{
-			var ambientColor  = Number( pu.nextValue( "ambientColor: "  ));	 this.setProperty( "ambientColor", ambientColor );
-			var diffuseColor  = Number( pu.nextValue( "diffuseColor: "  ));	 this.setProperty( "diffuseColor", diffuseColor );
-			var specularColor = Number( pu.nextValue( "specularColor: " ));	 this.setProperty( "specularColor", specularColor );
-			var specularPower = Number( pu.nextValue( "specularPower: " ));  this.setProperty( "specularPower", specularPower );
+			var ambientColor  = eval( "[" + pu.nextValue("ambientColor: ")   + ']' );	 this.setProperty( "ambientColor", ambientColor );
+			var diffuseColor  = eval( "[" + pu.nextValue( "diffuseColor: ")  + ']' );	 this.setProperty( "diffuseColor", diffuseColor );
+			var specularColor = eval( "[" + pu.nextValue( "specularColor: ") + ']' );	 this.setProperty( "specularColor", specularColor );
+			var specularPower = eval( "[" + pu.nextValue( "specularPower: ") + ']' );    this.setProperty( "specularPower", specularPower );
 		}
 
-		var lightProps = pu.nextValue( "theLights" );
+		var lightProps = pu.nextValue( "lightProps: " );
+		if (lightProps)
+		{
+			this._lights = [];
+			var lightStr;
+			for (var i=0;  i<this._MAX_LIGHTS;  i++)
+			{
+				var type = pu.nextValue( "light" + i + ": " );
+				if (type)
+				{
+						var light = new Object;
+						switch (type)
+						{
+							case "directional":
+								lightStr = pu.nextValue( 'light' + i + 'Dir: ');
+								light.direction = eval( "[" + lightStr + "]" );
+								break;
+
+							case "spot":
+								lightStr = pu.nextValue( 'light' + i + 'Pos: ' );
+								light.position =  eval( "[" + lightStr + "]" );
+
+								lightStr = pu.nextValue( 'light' + i + 'OuterSpotCutoff: ' );
+								light['spotInnerCutoff'] = Number( lightStr );
+
+								lightStr = pu.nextValue( 'light' + i + 'InnerSpotCutoff: ' );
+								light['spotOuterCutoff'] = Number( lightStr );
+								break;
+
+							case "point":
+								lightStr = pu.nextValue( 'light' + i + 'Pos: ' );
+								light.position =  eval( "[" + lightStr + "]" );
+
+								lightStr = pu.nextValue( 'light' + i + 'Attenuation: ' );
+								light.attenuation =  eval( "[" + lightStr + "]" );
+								break;
+
+							default:
+								throw new Error( "unrecognized light type on import: " + type );
+								break;
+						}
+
+						// common to all lights
+						light.diffuseColor = eval( "[" + pu.nextValue( 'light' + i + 'Color: ') + "]" );
+						light.specularColor = eval( "[" + pu.nextValue( 'light' + i + 'SpecularColor: ') + "]" );
+
+						// push the light
+						this._lights.push( light );
+				}
+				else
+					this._lights[i] = 'undefined';
+
+				// advance to the next light
+				var endLightKey = "endMaterial\n";
+				index = importStr.indexOf( endLightKey );
+				if (index < 0)  throw new Error( "ill-formed light encountered in import" );
+				index += endLightKey.length;
+				importStr = importStr.slice( 0, index );
+
+			}
+
+			if (this._lights.length > 0)
+			{
+				this._ubershaderCaps.lighting =
+				{
+					'light0' : this._lights[0],
+					'light1' : this._lights[1],
+					'light2' : this._lights[2],        
+					'light3' : this._lights[3]                                     
+				}
+			}
+		}
+
+		var diffuseMap = pu.nextValue( "diffuseMap: "  )
+		if(diffuseMap)
+			this.setProperty( "diffuseMap", diffuseMap );
+
+		var normalMap = pu.nextValue( "normalMap: "  );
+		if(normalMap)
+			this.setProperty( "normalMap", normalMap );
+
+		var specularMap = pu.nextValue( "specularMap: "  );
+		if(specularMap)
+			this.setProperty( "specularMap", specularMap );
+
+		var environmentMap = pu.nextValue( "environmentMap: "  );
+		if(environmentMap)
+		{
+			this.setProperty( "environmentMap", environmentMap );
+			this.setProperty( "environmentAmount", Number( pu.nextValue( "envReflection" ) ) );
+		}
+
+		this.rebuildShader();
 	}
 
 	this.export = function()
@@ -428,20 +521,18 @@ var UberMaterial = function UberMaterial() {
 					else if (light.type === 'spot')
 					{
 						exportStr += 'light' + i + 'Pos: ' + light['position'] + '\n';
-
-						var deg2Rad = Math.PI / 180;
-						exportStr += 'light' + i + 'Spot: ' + [ Math.cos( ( light['spotInnerCutoff'] || 45.0 )  * deg2Rad ), 
-																Math.cos( ( light['spotOuterCutoff'] || 90.0 ) * deg2Rad )] + '\n';
+						exportStr += 'light' + i + 'SpotInnerCutoff: ' + light['spotInnerCutoff'] + '\n';
+						exportStr += 'light' + i + 'SpotOuterCutoff: ' + light['spotOuterCutoff'] + '\n';
 					}
 					else		// light.type === 'point'
 					{
-						exportStr += 'light' + i + 'Pos: ' + (light['position'] || [ 0, 0, 0 ]) ;
-						exportStr += 'light' + i + 'Attenuation: ' + (light['attenuation'] || [ 1, 0, 0 ]) ;
+						exportStr += 'light' + i + 'Pos: ' + (light['position'] || [ 0, 0, 0 ]) + '\n';
+						exportStr += 'light' + i + 'Attenuation: ' + (light['attenuation'] || [ 1, 0, 0 ]) + '\n';
 					}
 
 					// common to all lights
-					exportStr += 'light' + i + 'Color: ' + light['diffuseColor'] || [ 1,1,1,1 ] + '\n';
-					exportStr += 'light' + i + 'SpecularColor: ' + light['specularColor'] || [ 1, 1, 1, 1 ] + '\n'; 
+					exportStr += 'light' + i + 'Color: ' + (light['diffuseColor'] || [ 1,1,1,1 ]) + '\n';
+					exportStr += 'light' + i + 'SpecularColor: ' + (light['specularColor'] || [ 1, 1, 1, 1 ]) + '\n'; 
 					
 					exportStr += "endlight\n";          
 				}
@@ -466,7 +557,10 @@ var UberMaterial = function UberMaterial() {
 			exportStr += "specularMap: " + caps.specularMap.texture + "\n";
 
 		if(typeof caps.environmentMap != 'undefined')
+		{
 			exportStr += "environmentMap: " + caps.environmentMap.texture + "\n";
+			exportStr += "envReflection: " + caps.environmentMap.envReflection + "\n";
+		}
 		
 		// every material needs to terminate like this
 		exportStr += "endMaterial\n";
-- 
cgit v1.2.3


From 9b40878fcc82d3ec08361e30d2029de261f0f80e Mon Sep 17 00:00:00 2001
From: hwc487
Date: Tue, 13 Mar 2012 16:32:46 -0700
Subject: Fixed BumpMetal material

---
 js/document/html-document.js      | 12 +++++--
 js/helper-classes/3D/vec-utils.js | 71 ++++++++++++++++++++++++++++++++++++++-
 2 files changed, 80 insertions(+), 3 deletions(-)

(limited to 'js')

diff --git a/js/document/html-document.js b/js/document/html-document.js
index 051490f5..f4ec3184 100755
--- a/js/document/html-document.js
+++ b/js/document/html-document.js
@@ -207,9 +207,17 @@ exports.HTMLDocument = Montage.create(TextDocument, {
 		},
         set: function(value) {
 			var elt = this.documentRoot;
-			if (elt) {
+			if (elt)
+			{
 				var nWorlds= value.length;
-				for (var i=0;  i<nWorlds;  i++) {
+				for (var i=0;  i<nWorlds;  i++)
+				{
+					/*
+					// Use this code to test the runtime version of WebGL
+					var cdm = new CanvasDataManager();
+					cdm.loadGLData(elt,  value,  null );
+					*/
+
 					var importStr = value[i];
 					var startIndex = importStr.indexOf( "id: " );
 					if (startIndex >= 0) {
diff --git a/js/helper-classes/3D/vec-utils.js b/js/helper-classes/3D/vec-utils.js
index 3db95ab7..e6db4a8d 100755
--- a/js/helper-classes/3D/vec-utils.js
+++ b/js/helper-classes/3D/vec-utils.js
@@ -191,5 +191,74 @@ var VecUtils = exports.VecUtils = Object.create(Object.prototype,
 
             return vec;
         }
-    }
+    },
+
+	matI :
+	{
+		value: function(dimen)
+		{
+			var mat = [];
+			for (var i=0;  i<dimen*dimen;  i++)  mat.push(0);
+
+			var index = 0;
+			for (var i=0;  i<dimen;  i++)
+			{
+				mat[index] = 1.0;
+				index += dimen + 1;
+			}
+	
+			return mat;	
+		}
+	},
+
+	matTranslation:
+	{
+		value: function (vec)
+		{
+			var mat = Matrix.I(4);
+			glmat4.translate(mat, vec);
+			return mat;
+		}
+	},
+
+	matRotationX:
+	{
+		value: function( angle )
+		{
+			var mat = Matrix.I(4);
+			glmat4.rotateX(mat, angle);
+			return mat;
+		}
+	},
+
+	matRotationY:
+	{
+		value: function( angle )
+		{
+			var mat = Matrix.I(4);
+			glmat4.rotateY(mat, angle);
+			return mat;
+		}
+	},
+
+	matRotationZ:
+	{
+		value: function( angle )
+		{
+			var mat = Matrix.I(4);
+			glmat4.rotateZ(mat, angle);
+			return mat;
+		}
+	},
+
+	matRotation:
+	{
+		value: function(angle, axis)
+		{
+			var mat = Matrix.I(4);
+			glmat4.rotate(mat, angle, axis);
+			return mat;
+		}
+	},
+
 });
\ No newline at end of file
-- 
cgit v1.2.3


From e065244ac75d1d0f25fd5c75cb58e714a13fe16b Mon Sep 17 00:00:00 2001
From: Jonathan Duran
Date: Wed, 14 Mar 2012 08:59:17 -0700
Subject: Squashed commit of the following:

merge master into timeline

Signed-off-by: Jonathan Duran <jduran@motorola.com>
---
 .../gradientpicker.reel/gradientpicker.js          |   22 +-
 .../brush-properties.reel/brush-properties.html    |   56 +-
 .../brush-properties.reel/brush-properties.js      |   26 +-
 .../treeview/ninja-leaf.reel/ninja-leaf.css        |   14 +-
 js/components/ui/icon-list-basic/icon.reel/icon.js |   14 +-
 .../ui/tree-basic/treeItem.reel/treeItem.js        |   14 +-
 js/controllers/document-controller.js              |   50 +-
 js/controllers/elements/element-controller.js      |   32 +-
 js/controllers/elements/shapes-controller.js       |  140 +-
 js/controllers/selection-controller.js             |   19 +-
 js/controllers/styles-controller.js                |   10 +-
 js/data/menu-data.js                               |    6 +
 js/document/html-document.js                       |  149 +-
 js/helper-classes/3D/draw-utils.js                 |  140 +-
 js/helper-classes/3D/math-utils.js                 |    5 +-
 js/helper-classes/3D/snap-manager.js               |   12 +-
 js/helper-classes/RDGE/rdge-compiled.js            |   64 +-
 .../RDGE/runtime/CanvasDataManager.js              |   98 --
 js/helper-classes/RDGE/runtime/GLRuntime.js        |  159 --
 js/helper-classes/RDGE/src/core/script/engine.js   |   15 +
 js/helper-classes/RDGE/src/core/script/fx/ssao.js  |    2 +-
 .../RDGE/src/core/script/init_state.js             |   12 +-
 js/helper-classes/RDGE/src/core/script/jshader.js  |    8 +-
 js/helper-classes/RDGE/src/core/script/renderer.js |    1 +
 .../RDGE/src/core/script/scenegraphNodes.js        |    2 +-
 .../RDGE/src/core/script/utilities.js              |    4 +-
 js/helper-classes/RDGE/src/tools/rdge-compiled.js  |   64 +-
 js/helper-classes/backup-delete/GLBrushStroke.js   |  174 +-
 js/helper-classes/backup-delete/GLCircle.js        |    3 +-
 js/helper-classes/backup-delete/GLGeomObj.js       |   46 +
 js/helper-classes/backup-delete/GLRectangle.js     |    2 +
 js/helper-classes/backup-delete/GLSubpath.js       |  147 +-
 js/helper-classes/backup-delete/GLWorld.js         |   71 +-
 .../backup-delete/Materials/BumpMetalMaterial.js   |   39 +-
 .../backup-delete/Materials/DeformMaterial.js      |    2 +-
 .../backup-delete/Materials/FlatMaterial.js        |   34 +-
 .../backup-delete/Materials/FlyMaterial.js         |    2 +-
 .../backup-delete/Materials/JuliaMaterial.js       |    2 +-
 .../Materials/KeleidoscopeMaterial.js              |    2 +-
 .../Materials/LinearGradientMaterial.js            |    2 +-
 .../backup-delete/Materials/MandelMaterial.js      |    2 +-
 .../backup-delete/Materials/PlasmaMaterial.js      |    2 +-
 .../backup-delete/Materials/PulseMaterial.js       |    5 +-
 .../backup-delete/Materials/RadialBlurMaterial.js  |    2 +-
 .../Materials/RadialGradientMaterial.js            |    6 +-
 .../Materials/ReliefTunnelMaterial.js              |    2 +-
 .../Materials/SquareTunnelMaterial.js              |    2 +-
 .../backup-delete/Materials/StarMaterial.js        |    2 +-
 .../backup-delete/Materials/TaperMaterial.js       |    4 +-
 .../backup-delete/Materials/TunnelMaterial.js      |    2 +-
 .../backup-delete/Materials/TwistMaterial.js       |    2 +-
 .../backup-delete/Materials/TwistVertMaterial.js   |    2 +-
 .../backup-delete/Materials/UberMaterial.js        |   73 +-
 .../backup-delete/Materials/WaterMaterial.js       |    4 +-
 .../backup-delete/Materials/ZInvertMaterial.js     |    2 +-
 js/io/system/ninjalibrary.js                       |   10 +-
 js/io/system/ninjalibrary.json                     |    2 +-
 js/io/ui/file-picker/file-picker-controller.js     |    2 +-
 js/io/ui/file-picker/file-picker-model.js          |    6 +
 .../picker-navigator.reel/picker-navigator.js      |    7 +-
 js/io/ui/save-as-dialog.reel/save-as-dialog.js     |    4 +-
 js/lib/NJUtils.js                                  |   34 +-
 js/lib/drawing/world.js                            |  102 +-
 js/lib/geom/brush-stroke.js                        |  329 ++--
 js/lib/geom/circle.js                              |  103 +-
 js/lib/geom/geom-obj.js                            |  210 ++-
 js/lib/geom/line.js                                |   57 +-
 js/lib/geom/rectangle.js                           |  111 +-
 js/lib/geom/sub-path.js                            |   86 +-
 js/lib/rdge/materials/bump-metal-material.js       |   10 +-
 js/lib/rdge/materials/deform-material.js           |    2 +-
 js/lib/rdge/materials/flat-material.js             |   41 +-
 js/lib/rdge/materials/fly-material.js              |    2 +-
 js/lib/rdge/materials/julia-material.js            |    2 +-
 js/lib/rdge/materials/keleidoscope-material.js     |    2 +-
 js/lib/rdge/materials/linear-gradient-material.js  |    2 +-
 js/lib/rdge/materials/mandel-material.js           |    2 +-
 js/lib/rdge/materials/plasma-material.js           |   37 +-
 js/lib/rdge/materials/pulse-material.js            |   11 +-
 js/lib/rdge/materials/radial-blur-material.js      |    9 +-
 js/lib/rdge/materials/radial-gradient-material.js  |    7 +-
 js/lib/rdge/materials/relief-tunnel-material.js    |    2 +-
 js/lib/rdge/materials/square-tunnel-material.js    |    2 +-
 js/lib/rdge/materials/star-material.js             |    2 +-
 js/lib/rdge/materials/taper-material.js            |    8 +-
 js/lib/rdge/materials/tunnel-material.js           |    2 +-
 js/lib/rdge/materials/twist-material.js            |    2 +-
 js/lib/rdge/materials/twist-vert-material.js       |    6 +-
 js/lib/rdge/materials/uber-material.js             |  109 +-
 js/lib/rdge/materials/water-material.js            |    2 +-
 js/lib/rdge/materials/z-invert-material.js         |    2 +-
 js/mediators/element-mediator.js                   |   15 +-
 js/mediators/io-mediator.js                        |   93 +-
 js/models/color-model.js                           |    3 +
 js/panels/Color/colorbutton-manager.js             |   44 -
 .../ColorPanelPopup.scssc                          |  Bin 15335 -> 0 bytes
 .../ColorPanelPopup.scssc                          |  Bin 17879 -> 0 bytes
 .../ColorPanelBase.scssc                           |  Bin 23592 -> 0 bytes
 .../Color/colorchippopup.reel/colorchippopup.html  |   63 -
 .../Color/colorchippopup.reel/colorchippopup.js    |  590 -------
 js/panels/Color/colorchippopup.reel/config.rb      |    9 -
 .../colorchippopup.reel/css/colorchippopup.css     |  239 ---
 .../colorchippopup.reel/css/colorchippopup.scss    |  240 ---
 .../Color/colorchippopup.reel/img/icon_bitmap.png  |  Bin 3072 -> 0 bytes
 .../colorchippopup.reel/img/icon_colorwheel.png    |  Bin 3420 -> 0 bytes
 .../colorchippopup.reel/img/icon_gradient.png      |  Bin 2815 -> 0 bytes
 .../Color/colorchippopup.reel/img/icon_nofill.png  |  Bin 2951 -> 0 bytes
 js/panels/Color/colorchippopup.reel/img/knob.png   |  Bin 1036 -> 0 bytes
 js/panels/Color/colorpanel.js                      |   53 -
 .../Color/colorpanelbase.reel/colorpanelbase.html  |   76 -
 .../Color/colorpanelbase.reel/colorpanelbase.js    | 1654 --------------------
 js/panels/Color/colorpanelbase.reel/config.rb      |    9 -
 .../colorpanelbase.reel/css/colorpanelbase.css     |  332 ----
 .../colorpanelbase.reel/css/colorpanelbase.scss    |  339 ----
 .../Color/colorpanelbase.reel/img/icon_default.png |  Bin 3011 -> 0 bytes
 .../Color/colorpanelbase.reel/img/icon_nocolor.png |  Bin 3036 -> 0 bytes
 .../Color/colorpanelbase.reel/img/icon_swap.png    |  Bin 2961 -> 0 bytes
 js/panels/Color/colorpanelbase.reel/img/knob.png   |  Bin 1036 -> 0 bytes
 .../colorpanelpopup.reel/colorpanelpopup.html      |   68 -
 .../Color/colorpanelpopup.reel/colorpanelpopup.js  |  466 ------
 js/panels/Color/colorpanelpopup.reel/config.rb     |    9 -
 .../colorpanelpopup.reel/css/colorpanelpopup.css   |  239 ---
 .../colorpanelpopup.reel/css/colorpanelpopup.scss  |  240 ---
 .../Color/colorpanelpopup.reel/img/icon_bitmap.png |  Bin 3072 -> 0 bytes
 .../colorpanelpopup.reel/img/icon_colorwheel.png   |  Bin 3420 -> 0 bytes
 .../colorpanelpopup.reel/img/icon_gradient.png     |  Bin 2815 -> 0 bytes
 .../Color/colorpanelpopup.reel/img/icon_nofill.png |  Bin 2951 -> 0 bytes
 js/panels/Color/colorpanelpopup.reel/img/knob.png  |  Bin 1036 -> 0 bytes
 js/panels/Color/colorpopup-manager.js              |  529 -------
 .../Color/colortoolbar.reel/colortoolbar.html      |   54 -
 js/panels/Color/colortoolbar.reel/colortoolbar.js  |  138 --
 js/panels/Color/colortoolbar.reel/config.rb        |    9 -
 .../Color/colortoolbar.reel/css/colortoolbar.css   |   45 -
 .../Color/colortoolbar.reel/css/colortoolbar.scss  |   52 -
 js/panels/color/colorbutton-manager.js             |   44 +
 .../color/colorchippopup.reel/colorchippopup.html  |   63 +
 .../color/colorchippopup.reel/colorchippopup.js    |  590 +++++++
 js/panels/color/colorchippopup.reel/config.rb      |    9 +
 .../colorchippopup.reel/css/colorchippopup.css     |  239 +++
 .../colorchippopup.reel/css/colorchippopup.scss    |  240 +++
 .../color/colorchippopup.reel/img/icon_bitmap.png  |  Bin 0 -> 3072 bytes
 .../colorchippopup.reel/img/icon_colorwheel.png    |  Bin 0 -> 3420 bytes
 .../colorchippopup.reel/img/icon_gradient.png      |  Bin 0 -> 2815 bytes
 .../color/colorchippopup.reel/img/icon_nofill.png  |  Bin 0 -> 2951 bytes
 js/panels/color/colorchippopup.reel/img/knob.png   |  Bin 0 -> 1036 bytes
 js/panels/color/colorpanel.js                      |   53 +
 .../color/colorpanelbase.reel/colorpanelbase.html  |   76 +
 .../color/colorpanelbase.reel/colorpanelbase.js    | 1654 ++++++++++++++++++++
 js/panels/color/colorpanelbase.reel/config.rb      |    9 +
 .../colorpanelbase.reel/css/colorpanelbase.css     |  332 ++++
 .../colorpanelbase.reel/css/colorpanelbase.scss    |  339 ++++
 .../color/colorpanelbase.reel/img/icon_default.png |  Bin 0 -> 3011 bytes
 .../color/colorpanelbase.reel/img/icon_nocolor.png |  Bin 0 -> 3036 bytes
 .../color/colorpanelbase.reel/img/icon_swap.png    |  Bin 0 -> 2961 bytes
 js/panels/color/colorpanelbase.reel/img/knob.png   |  Bin 0 -> 1036 bytes
 .../colorpanelpopup.reel/colorpanelpopup.html      |   68 +
 .../color/colorpanelpopup.reel/colorpanelpopup.js  |  466 ++++++
 js/panels/color/colorpanelpopup.reel/config.rb     |    9 +
 .../colorpanelpopup.reel/css/colorpanelpopup.css   |  239 +++
 .../colorpanelpopup.reel/css/colorpanelpopup.scss  |  240 +++
 .../color/colorpanelpopup.reel/img/icon_bitmap.png |  Bin 0 -> 3072 bytes
 .../colorpanelpopup.reel/img/icon_colorwheel.png   |  Bin 0 -> 3420 bytes
 .../colorpanelpopup.reel/img/icon_gradient.png     |  Bin 0 -> 2815 bytes
 .../color/colorpanelpopup.reel/img/icon_nofill.png |  Bin 0 -> 2951 bytes
 js/panels/color/colorpanelpopup.reel/img/knob.png  |  Bin 0 -> 1036 bytes
 js/panels/color/colorpopup-manager.js              |  529 +++++++
 .../color/colortoolbar.reel/colortoolbar.html      |   54 +
 js/panels/color/colortoolbar.reel/colortoolbar.js  |  138 ++
 js/panels/color/colortoolbar.reel/config.rb        |    9 +
 .../color/colortoolbar.reel/css/colortoolbar.css   |   45 +
 .../color/colortoolbar.reel/css/colortoolbar.scss  |   52 +
 js/panels/presets/content.reel/content.css         |    4 +-
 js/panels/properties.reel/properties.js            |    4 +-
 js/preloader/Preloader.js                          |    2 +
 js/stage/layout.js                                 |   10 +-
 js/stage/stage-view.reel/stage-view.js             |    5 +-
 js/tools/BrushTool.js                              |   41 +-
 js/tools/EyedropperTool.js                         |  133 +-
 js/tools/PenTool.js                                |   18 +-
 js/tools/SelectionTool.js                          |   28 +-
 js/tools/Translate3DToolBase.js                    |    1 -
 js/tools/TranslateObject3DTool.js                  |    2 +-
 js/tools/modifier-tool-base.js                     |   12 +-
 183 files changed, 7917 insertions(+), 6551 deletions(-)
 delete mode 100644 js/helper-classes/RDGE/runtime/CanvasDataManager.js
 delete mode 100644 js/helper-classes/RDGE/runtime/GLRuntime.js
 delete mode 100755 js/panels/Color/colorbutton-manager.js
 delete mode 100755 js/panels/Color/colorchippopup.reel/.sass-cache/2fbca323ccf38cf180e7675ba0d8d3e07adeffea/ColorPanelPopup.scssc
 delete mode 100755 js/panels/Color/colorchippopup.reel/.sass-cache/6f8390f69a31f1a976968b9c18d0824d78460db2/ColorPanelPopup.scssc
 delete mode 100755 js/panels/Color/colorchippopup.reel/.sass-cache/de22270a8ac487505e8876f1cd16286e094a5127/ColorPanelBase.scssc
 delete mode 100755 js/panels/Color/colorchippopup.reel/colorchippopup.html
 delete mode 100755 js/panels/Color/colorchippopup.reel/colorchippopup.js
 delete mode 100755 js/panels/Color/colorchippopup.reel/config.rb
 delete mode 100755 js/panels/Color/colorchippopup.reel/css/colorchippopup.css
 delete mode 100755 js/panels/Color/colorchippopup.reel/css/colorchippopup.scss
 delete mode 100755 js/panels/Color/colorchippopup.reel/img/icon_bitmap.png
 delete mode 100755 js/panels/Color/colorchippopup.reel/img/icon_colorwheel.png
 delete mode 100755 js/panels/Color/colorchippopup.reel/img/icon_gradient.png
 delete mode 100755 js/panels/Color/colorchippopup.reel/img/icon_nofill.png
 delete mode 100755 js/panels/Color/colorchippopup.reel/img/knob.png
 delete mode 100755 js/panels/Color/colorpanel.js
 delete mode 100755 js/panels/Color/colorpanelbase.reel/colorpanelbase.html
 delete mode 100755 js/panels/Color/colorpanelbase.reel/colorpanelbase.js
 delete mode 100755 js/panels/Color/colorpanelbase.reel/config.rb
 delete mode 100755 js/panels/Color/colorpanelbase.reel/css/colorpanelbase.css
 delete mode 100755 js/panels/Color/colorpanelbase.reel/css/colorpanelbase.scss
 delete mode 100755 js/panels/Color/colorpanelbase.reel/img/icon_default.png
 delete mode 100755 js/panels/Color/colorpanelbase.reel/img/icon_nocolor.png
 delete mode 100755 js/panels/Color/colorpanelbase.reel/img/icon_swap.png
 delete mode 100755 js/panels/Color/colorpanelbase.reel/img/knob.png
 delete mode 100755 js/panels/Color/colorpanelpopup.reel/colorpanelpopup.html
 delete mode 100755 js/panels/Color/colorpanelpopup.reel/colorpanelpopup.js
 delete mode 100755 js/panels/Color/colorpanelpopup.reel/config.rb
 delete mode 100755 js/panels/Color/colorpanelpopup.reel/css/colorpanelpopup.css
 delete mode 100755 js/panels/Color/colorpanelpopup.reel/css/colorpanelpopup.scss
 delete mode 100755 js/panels/Color/colorpanelpopup.reel/img/icon_bitmap.png
 delete mode 100755 js/panels/Color/colorpanelpopup.reel/img/icon_colorwheel.png
 delete mode 100755 js/panels/Color/colorpanelpopup.reel/img/icon_gradient.png
 delete mode 100755 js/panels/Color/colorpanelpopup.reel/img/icon_nofill.png
 delete mode 100755 js/panels/Color/colorpanelpopup.reel/img/knob.png
 delete mode 100755 js/panels/Color/colorpopup-manager.js
 delete mode 100755 js/panels/Color/colortoolbar.reel/colortoolbar.html
 delete mode 100755 js/panels/Color/colortoolbar.reel/colortoolbar.js
 delete mode 100755 js/panels/Color/colortoolbar.reel/config.rb
 delete mode 100755 js/panels/Color/colortoolbar.reel/css/colortoolbar.css
 delete mode 100755 js/panels/Color/colortoolbar.reel/css/colortoolbar.scss
 create mode 100755 js/panels/color/colorbutton-manager.js
 create mode 100755 js/panels/color/colorchippopup.reel/colorchippopup.html
 create mode 100755 js/panels/color/colorchippopup.reel/colorchippopup.js
 create mode 100755 js/panels/color/colorchippopup.reel/config.rb
 create mode 100755 js/panels/color/colorchippopup.reel/css/colorchippopup.css
 create mode 100755 js/panels/color/colorchippopup.reel/css/colorchippopup.scss
 create mode 100755 js/panels/color/colorchippopup.reel/img/icon_bitmap.png
 create mode 100755 js/panels/color/colorchippopup.reel/img/icon_colorwheel.png
 create mode 100755 js/panels/color/colorchippopup.reel/img/icon_gradient.png
 create mode 100755 js/panels/color/colorchippopup.reel/img/icon_nofill.png
 create mode 100755 js/panels/color/colorchippopup.reel/img/knob.png
 create mode 100755 js/panels/color/colorpanel.js
 create mode 100755 js/panels/color/colorpanelbase.reel/colorpanelbase.html
 create mode 100755 js/panels/color/colorpanelbase.reel/colorpanelbase.js
 create mode 100755 js/panels/color/colorpanelbase.reel/config.rb
 create mode 100755 js/panels/color/colorpanelbase.reel/css/colorpanelbase.css
 create mode 100755 js/panels/color/colorpanelbase.reel/css/colorpanelbase.scss
 create mode 100755 js/panels/color/colorpanelbase.reel/img/icon_default.png
 create mode 100755 js/panels/color/colorpanelbase.reel/img/icon_nocolor.png
 create mode 100755 js/panels/color/colorpanelbase.reel/img/icon_swap.png
 create mode 100755 js/panels/color/colorpanelbase.reel/img/knob.png
 create mode 100755 js/panels/color/colorpanelpopup.reel/colorpanelpopup.html
 create mode 100755 js/panels/color/colorpanelpopup.reel/colorpanelpopup.js
 create mode 100755 js/panels/color/colorpanelpopup.reel/config.rb
 create mode 100755 js/panels/color/colorpanelpopup.reel/css/colorpanelpopup.css
 create mode 100755 js/panels/color/colorpanelpopup.reel/css/colorpanelpopup.scss
 create mode 100755 js/panels/color/colorpanelpopup.reel/img/icon_bitmap.png
 create mode 100755 js/panels/color/colorpanelpopup.reel/img/icon_colorwheel.png
 create mode 100755 js/panels/color/colorpanelpopup.reel/img/icon_gradient.png
 create mode 100755 js/panels/color/colorpanelpopup.reel/img/icon_nofill.png
 create mode 100755 js/panels/color/colorpanelpopup.reel/img/knob.png
 create mode 100755 js/panels/color/colorpopup-manager.js
 create mode 100755 js/panels/color/colortoolbar.reel/colortoolbar.html
 create mode 100755 js/panels/color/colortoolbar.reel/colortoolbar.js
 create mode 100755 js/panels/color/colortoolbar.reel/config.rb
 create mode 100755 js/panels/color/colortoolbar.reel/css/colortoolbar.css
 create mode 100755 js/panels/color/colortoolbar.reel/css/colortoolbar.scss

(limited to 'js')

diff --git a/js/components/gradientpicker.reel/gradientpicker.js b/js/components/gradientpicker.reel/gradientpicker.js
index da4e8c0f..b10f6624 100755
--- a/js/components/gradientpicker.reel/gradientpicker.js
+++ b/js/components/gradientpicker.reel/gradientpicker.js
@@ -213,21 +213,13 @@ exports.GradientPicker = Montage.create(Component, {
     removeStop: {
     	enumerable: false,
     	value: function(stop) {
-    		//Removing stops
-    		this.element._components.stopsContainer.removeChild(stop);
-    		//Stopping events related to this current stop
-    		this.removeStopMoving();
-    		//Resetting stops if less than 2
     		var i, buttons = this.element._components.stopsContainer.getElementsByTagName('button');
-    		if (buttons.length < 2) {
-    			//Removing remaining stops prior to resetting
-    			for (i=0; buttons[i]; i++) {
-    				this.element._components.stopsContainer.removeChild(buttons[i].stop);
-    			}
-    			//Nulling then adding defaults
-    			this.value = null;
-    			this.addDefaultStops();
-    			this._dispatchEvent('change', false);
+    		//
+    		if (buttons.length > 2) {
+    			//Removing stops
+    			this.element._components.stopsContainer.removeChild(stop);
+    			//Stopping events related to this current stop
+    			this.removeStopMoving();
     		}
     	}
     },
@@ -327,7 +319,7 @@ exports.GradientPicker = Montage.create(Component, {
     		//
     		this.application.ninja.colorController.colorPopupManager.hideColorChipPopup();
     		//
-    		if ((e._event.y+this.hack.y) > this.element._trackY+50 || (e._event.y+this.hack.y) < this.element._trackY) {
+    		if ((e._event.y+this.hack.y) > this.element._trackY+70 || (e._event.y+this.hack.y) < this.element._trackY) {
     			this.removeStop(this.currentStop);
     		}
     		//
diff --git a/js/components/tools-properties/brush-properties.reel/brush-properties.html b/js/components/tools-properties/brush-properties.reel/brush-properties.html
index 38f7f856..608111bd 100755
--- a/js/components/tools-properties/brush-properties.reel/brush-properties.html
+++ b/js/components/tools-properties/brush-properties.reel/brush-properties.html
@@ -11,12 +11,55 @@
 
         <script type="text/montage-serialization">
         {
+            "strokeSizeHT": {
+                "module": "js/components/hottextunit.reel",
+                "name": "HotTextUnit",
+                "properties": {
+                    "element": {"#": "strokeSize"},
+                    "minValue": 1,
+                    "maxValue": 100,
+                    "value": 1,
+                    "decimalPlace": 10,
+                    "acceptableUnits" : ["px", "pt"]
+                }
+            },
+
+            "strokeHardnessHT": {
+                "module": "js/components/hottextunit.reel",
+                "name": "HotTextUnit",
+                "properties": {
+                    "element": {"#": "strokeHardness"},
+                    "minValue": 0,
+                    "maxValue": 100,
+                    "value": 100,
+                    "decimalPlace": 10,
+                    "acceptableUnits" : ["px", "pt"]
+                }
+            },
+
+            "strokeAngleHT": {
+                "module": "js/components/hottextunit.reel",
+                "name": "HotTextUnit",
+                "properties": {
+                    "element": {"#": "strokeAngle"},
+                    "minValue": -90,
+                    "maxValue": 90,
+                    "value": 0,
+                    "decimalPlace": 10,
+                    "acceptableUnits" : ["px", "pt"]
+                }
+            },
 
             "owner": {
                 "module": "js/components/tools-properties/brush-properties.reel",
                 "name": "BrushProperties",
                 "properties": {
-                    "element": {"#": "brushProperties"}
+                    "element": {"#": "brushProperties"},
+                    "_strokeSize": {"@": "strokeSizeHT"},
+                    "_strokeHardness": {"@": "strokeHardnessHT"},
+                    "_doSmoothing": {"#": "doSmoothing"},
+                    "_useCalligraphic":{"#": "useCalligraphic"},
+                    "_strokeAngle": {"@": "strokeAngleHT"}
                 }
             }
     	}
@@ -26,6 +69,17 @@
 
     <body>
         <div id="brushProperties" class="subToolHolderPanel">
+            <div id="strokesContainer" class="leftLabel" style="margin-left:25px; padding-top: 3px;">
+                <label class="label"> Width:</label>
+                <div id="strokeSize" class="label"></div>
+                <label class="label"> Hardness:</label>
+                <div id="strokeHardness" class="label"></div>
+                <label class="label"><input id="doSmoothing" type="checkbox" name="doSmoothingControl" class="checkBoxAlign"/>Smoothing</label>
+                <label class="label"><input id="useCalligraphic" type="checkbox" name="useCalligraphicControl" class="checkBoxAlign"/>Calligraphic</label>
+                <label class="label"> Angle:</label>
+                <div id="strokeAngle" class="label"></div>
+
+            </div>
         </div>
     </body>
 
diff --git a/js/components/tools-properties/brush-properties.reel/brush-properties.js b/js/components/tools-properties/brush-properties.reel/brush-properties.js
index 92da98cc..e6faa0f0 100755
--- a/js/components/tools-properties/brush-properties.reel/brush-properties.js
+++ b/js/components/tools-properties/brush-properties.reel/brush-properties.js
@@ -9,17 +9,19 @@ var Component = require("montage/ui/component").Component;
 var ToolProperties = require("js/components/tools-properties/tool-properties").ToolProperties;
 
 exports.BrushProperties = Montage.create(ToolProperties, {
-
-    
-    _subPrepare: {
-        value: function() {
-            //this.divElement.addEventListener("click", this, false);
-        }
+    strokeSize: {
+        get: function() { return this._strokeSize; }
     },
-
-    handleClick: {
-        value: function(event) {
-           // this.selectedElement = event._event.target.id;
-        }
+    strokeHardness: {
+        get: function() { return this._strokeHardness; }
+    },
+    doSmoothing:{
+        get: function() {return this._doSmoothing.checked; }
+    },
+    useCalligraphic: {
+        get: function() {return this._useCalligraphic.checked;}
+    },
+    strokeAngle: {
+        get: function() {return this._strokeAngle;}
     }
-});
\ No newline at end of file
+});
diff --git a/js/components/treeview/ninja-leaf.reel/ninja-leaf.css b/js/components/treeview/ninja-leaf.reel/ninja-leaf.css
index fedc1d9d..cc8108f6 100644
--- a/js/components/treeview/ninja-leaf.reel/ninja-leaf.css
+++ b/js/components/treeview/ninja-leaf.reel/ninja-leaf.css
@@ -3,7 +3,12 @@
  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> */
-
+.treeRoot .branch-label, .treeRoot .leaf-label {
+    margin: 0 8px;
+}
+.treeRoot .leaf-label:hover {
+    margin: 0;
+}
 .treeRoot .leaf-label {
     background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA0AAAANCAIAAAD9iXMrAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyRpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw%2FeHBhY2tldCBiZWdpbj0i77u%2FIiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8%2BIDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMC1jMDYxIDY0LjE0MDk0OSwgMjAxMC8xMi8wNy0xMDo1NzowMSAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENTNS4xIE1hY2ludG9zaCIgeG1wTU06SW5zdGFuY2VJRD0ieG1wLmlpZDpEQzcwMEU1RjQxM0MxMUUxQUM0MERBNzM1MUVEMUQxMCIgeG1wTU06RG9jdW1lbnRJRD0ieG1wLmRpZDpEQzcwMEU2MDQxM0MxMUUxQUM0MERBNzM1MUVEMUQxMCI%2BIDx4bXBNTTpEZXJpdmVkRnJvbSBzdFJlZjppbnN0YW5jZUlEPSJ4bXAuaWlkOkRDNzAwRTVENDEzQzExRTFBQzQwREE3MzUxRUQxRDEwIiBzdFJlZjpkb2N1bWVudElEPSJ4bXAuZGlkOkRDNzAwRTVFNDEzQzExRTFBQzQwREE3MzUxRUQxRDEwIi8%2BIDwvcmRmOkRlc2NyaXB0aW9uPiA8L3JkZjpSREY%2BIDwveDp4bXBtZXRhPiA8P3hwYWNrZXQgZW5kPSJyIj8%2BUcaK3QAAANFJREFUeNqMULEOREAQdYjvuE%2FYWlSUQqKQ7A%2FsD6n0SoVCFHpRa0SllvgFlpvzZO9OcfGSnbx9M%2FNmMpp2Dw96VVX9L%2FJ93wRrmkZJIKrZcRyK%2Bs25p5%2BU8pK4KCakMAzxL4oCJIqivu8Nw0DDu25ZFtW3ritIkiS0tGVZtm1%2F6rZtu4yr67osSyJBEJx3ybKsbVukOecU4zh2XRfKMAzTNJmYpWxgPM%2BzEIIxRrzrOs%2FzdMyVvyAxTdPxAJFzv%2BeBbz8cfN93kDzPb55ZewkwAF0Ddf6ATSsHAAAAAElFTkSuQmCC);
     background-position: 3px center;
@@ -12,6 +17,11 @@
     cursor: pointer;
     padding: 3px 0 4px;
 }
+.branch .branch .leaf-label:hover {
+    background-color: #333333;
+    background-position: 33px center;
+    padding-left: 53px;
+}
 /* First level */
 .branch .leaf-label {
     padding-left: 25px;
@@ -26,4 +36,4 @@
 .branch .branch .branch .leaf-label {
     background-position: 45px center;
     padding-left: 65px;
-}
\ No newline at end of file
+}
diff --git a/js/components/ui/icon-list-basic/icon.reel/icon.js b/js/components/ui/icon-list-basic/icon.reel/icon.js
index 72adbfa1..1ef6e277 100755
--- a/js/components/ui/icon-list-basic/icon.reel/icon.js
+++ b/js/components/ui/icon-list-basic/icon.reel/icon.js
@@ -174,21 +174,17 @@ var Icon = exports.Icon = Montage.create(Component, {
         enumerable: true,
         value:{
             "img_root":"images/picker/",
-            ".png":"png_file.png",
-            ".jpg":"jpeg_file.png",
             ".js":"js_file.png",
+            ".json":"json_file.png",
             ".css":"css_file.png",
             ".html":"html_file.png",
             ".xml":"xml_file.png",
             ".php":"php_file.png",
+            ".pl":"pl_file.png",
+            ".py":"py_file.png",
+            ".rb":"rb_file.png",
             ".doc":"doc_file.png",
-            ".docx":"doc_file.png",
-            ".rtf":"rtf_file.png",
-            ".pdf":"pdf_file.png",
-            ".zip":"zip_file.png",
-            ".rar":"zip_file.png",
-            ".app":"executable.png",
-            ".exe":"executable.png",
+            ".txt":"txt_file.png",
             "file_default":"file.png",
             "directory":"folder.png"
         }
diff --git a/js/components/ui/tree-basic/treeItem.reel/treeItem.js b/js/components/ui/tree-basic/treeItem.reel/treeItem.js
index 4c71cb6b..a67dad43 100755
--- a/js/components/ui/tree-basic/treeItem.reel/treeItem.js
+++ b/js/components/ui/tree-basic/treeItem.reel/treeItem.js
@@ -242,21 +242,17 @@ exports.TreeItem = Montage.create(Component, {
         enumerable: true,
         value:{
             "img_root":"images/picker/",
-            ".png":"png_file.png",
-            ".jpg":"jpeg_file.png",
             ".js":"js_file.png",
+            ".json":"json_file.png",
             ".css":"css_file.png",
             ".html":"html_file.png",
             ".xml":"xml_file.png",
             ".php":"php_file.png",
+            ".pl":"pl_file.png",
+            ".py":"py_file.png",
+            ".rb":"rb_file.png",
             ".doc":"doc_file.png",
-            ".docx":"doc_file.png",
-            ".rtf":"rtf_file.png",
-            ".pdf":"pdf_file.png",
-            ".zip":"zip_file.png",
-            ".rar":"zip_file.png",
-            ".app":"executable.png",
-            ".exe":"executable.png",
+            ".txt":"txt_file.png",
             "file_default":"file.png",
             "directory":"folder.png"
         }
diff --git a/js/controllers/document-controller.js b/js/controllers/document-controller.js
index a8056519..87e93465 100755
--- a/js/controllers/document-controller.js
+++ b/js/controllers/document-controller.js
@@ -60,8 +60,9 @@ var DocumentController = exports.DocumentController = Montage.create(Component,
             this.eventManager.addEventListener("executeSave", this, false);
             this.eventManager.addEventListener("executeSaveAs", this, false);
             this.eventManager.addEventListener("executeSaveAll", this, false);
+            this.eventManager.addEventListener("executeFileClose", this, false);
 
-            this.eventManager.addEventListener("recordStyleChanged", this, false);
+            this.eventManager.addEventListener("styleSheetDirty", this, false);
             
         }
     },
@@ -157,17 +158,29 @@ var DocumentController = exports.DocumentController = Montage.create(Component,
             if((typeof this.activeDocument !== "undefined") && this.application.ninja.coreIoApi.cloudAvailable()){
                 saveAsSettings.fileName = this.activeDocument.name;
                 saveAsSettings.folderUri = this.activeDocument.uri.substring(0, this.activeDocument.uri.lastIndexOf("/"));
-                //add callback
+                saveAsSettings.callback = this.saveAsCallback.bind(this);
                 this.application.ninja.newFileController.showSaveAsDialog(saveAsSettings);
             }
         }
     },
-
+    ////////////////////////////////////////////////////////////////////
+    handleExecuteFileClose:{
+        value: function(event) {
+            if(this.activeDocument && this.application.ninja.coreIoApi.cloudAvailable()){
+                this.closeDocument(this.activeDocument.uuid);
+            }
+        }
+    },
+    ////////////////////////////////////////////////////////////////////
     //
     fileSaveResult: {
     	value: function (result) {
-    		if(result.status === 204){
+            if((result.status === 204) || (result.status === 404)){//204=>existing file || 404=>new file... saved
                 this.activeDocument.needsSave = false;
+                if(this.application.ninja.currentDocument !== null){
+                    //clear Dirty StyleSheets for the saved document
+                    this.application.ninja.stylesController.clearDirtyStyleSheets(this.application.ninja.currentDocument);
+                }
             }
     	}
     },
@@ -249,6 +262,29 @@ var DocumentController = exports.DocumentController = Montage.create(Component,
     },
 	////////////////////////////////////////////////////////////////////
 	//
+    saveAsCallback:{
+        value:function(saveAsDetails){
+            var fileUri = null, filename = saveAsDetails.filename, destination = saveAsDetails.destination;
+            //update document metadata
+            this.activeDocument.name = ""+filename;
+            //prepare new file uri
+            if(destination && (destination.charAt(destination.length -1) !== "/")){
+                destination = destination + "/";
+            }
+            fileUri = destination+filename;
+
+            this.activeDocument.uri = fileUri;
+            //save a new file
+            //use the ioMediator.fileSaveAll when implemented
+            this.activeDocument._userDocument.name=filename;
+            this.activeDocument._userDocument.root=destination;
+            this.activeDocument._userDocument.uri=fileUri;
+            this.application.ninja.ioMediator.fileSave(this.activeDocument.save(), this.fileSaveResult.bind(this));
+            //
+        }
+    },
+
+    ////////////////////////////////////////////////////////////////////
 	openDocument: {
 		value: function(doc) {
 			
@@ -515,5 +551,11 @@ var DocumentController = exports.DocumentController = Montage.create(Component,
         value: function() {
             return "userDocument_" + (this._iframeCounter++);
         }
+    },
+
+    handleStyleSheetDirty:{
+        value:function(){
+            this.activeDocument.needsSave = true;
         }
+    }
 });
diff --git a/js/controllers/elements/element-controller.js b/js/controllers/elements/element-controller.js
index ec0335b4..9f00604f 100755
--- a/js/controllers/elements/element-controller.js
+++ b/js/controllers/elements/element-controller.js
@@ -74,8 +74,9 @@ var ElementController = exports.ElementController = Montage.create(NJComponent,
 
     //--------------------------------------------------------------------------------------------------------
     // Routines to get/set color properties
+    // borderSide : "top", "right", "bottom", or "left"
     getColor: {
-        value: function(el, isFill) {
+        value: function(el, isFill, borderSide) {
             var colorObj,
                 color,
                 image;
@@ -87,22 +88,29 @@ var ElementController = exports.ElementController = Montage.create(NJComponent,
                 {
                     return el.elementModel.fill;
                 }
-//                return this.application.ninja.stylesController.getElementStyle(el, "background-color");
                 //TODO: Once logic for color and gradient is established, this needs to be revised
                 color = this.getProperty(el, "background-color");
                 image = this.getProperty(el, "background-image");
             }
             else
             {
-                // TODO - Need to figure out which border side user wants
-                if(el.elementModel.stroke)
+                // Try getting border color from specific side first
+                if(borderSide)
                 {
-                    return el.elementModel.stroke;
+                    color = this.getProperty(el, "border-" + borderSide + "-color");
+                    image = this.getProperty(el, "border-" + borderSide + "-image");
+                }
+
+                // If no color was found, look up the shared border color
+                if(!color && !image)
+                {
+                    if(el.elementModel.stroke)
+                    {
+                        return el.elementModel.stroke;
+                    }
+                    color = this.getProperty(el, "border-color");
+                    image = this.getProperty(el, "border-image");
                 }
-                // TODO - Need to figure out which border side user wants
-//                return this.application.ninja.stylesController.getElementStyle(el, "border-color");
-                color = this.getProperty(el, "border-color");
-                image = this.getProperty(el, "border-image");
             }
 
             if(color || image) {
@@ -120,11 +128,15 @@ var ElementController = exports.ElementController = Montage.create(NJComponent,
             {
                 el.elementModel.fill = colorObj;
             }
-            else
+            else if(!borderSide)
             {
                 // TODO - Need to update border style and width also
                 el.elementModel.stroke = colorObj;
             }
+            else
+            {
+                // TODO - Should update specific border sides too
+            }
 
             return colorObj;
         }
diff --git a/js/controllers/elements/shapes-controller.js b/js/controllers/elements/shapes-controller.js
index 3423a5a7..d72d9c14 100755
--- a/js/controllers/elements/shapes-controller.js
+++ b/js/controllers/elements/shapes-controller.js
@@ -259,24 +259,82 @@ exports.ShapesController = Montage.create(CanvasController, {
         }
     },
 
-    setColor: {
-        value: function(el, color, isFill) {
-            var webGl = color.webGlColor || color.color.webGlColor;
-            if(!webGl)
+    _setGradientMaterial: {
+        value: function(el, gradientMode, isFill) {
+            var m = "LinearGradientMaterial",
+                fm;
+            if(gradientMode === "radial")
             {
-                webGl = this.application.ninja.colorController.colorModel.colorToWebGl(color.color);
+                m = "RadialGradientMaterial";
             }
+
             if(isFill)
             {
-                el.elementModel.shapeModel.GLGeomObj.setFillColor(webGl);
-                this.setShapeProperty(el, "fill", webGl);
-                this.setShapeProperty(el, "background", color);
+                if(el.elementModel.shapeModel.fillMaterial.getName() !== m)
+                {
+                    fm = Object.create(MaterialsModel.getMaterial(m));
+                    if(fm)
+                    {
+                        el.elementModel.shapeModel.GLGeomObj.setFillMaterial(fm);
+                        el.elementModel.shapeModel.fillMaterial = fm;
+                        el.elementModel.shapeModel.GLGeomObj.buildBuffers();
+                    }
+                }
             }
             else
             {
-                el.elementModel.shapeModel.GLGeomObj.setStrokeColor(webGl);
-                this.setShapeProperty(el, "stroke", webGl);
-                this.setShapeProperty(el, "border", color);
+                if(el.elementModel.shapeModel.strokeMaterial.getName() !== m)
+                {
+                    fm = Object.create(MaterialsModel.getMaterial(m));
+                    if(fm)
+                    {
+                        el.elementModel.shapeModel.GLGeomObj.setStrokeMaterial(fm);
+                        el.elementModel.shapeModel.strokeMaterial = fm;
+                        el.elementModel.shapeModel.GLGeomObj.buildBuffers();
+                    }
+                }
+            }
+        }
+    },
+
+    setColor: {
+        value: function(el, color, isFill) {
+            var mode = color.mode,
+                webGl;
+            if(isFill)
+            {
+                if(mode)
+                {
+                    switch (mode) {
+                        case 'nocolor':
+                            el.elementModel.shapeModel.GLGeomObj.setFillColor(null);
+                            this.setShapeProperty(el, "fill", null);
+                            this.setShapeProperty(el, "background", color);
+                            el.elementModel.fill = null;
+                            return;
+                        case 'gradient':
+                            if(el.elementModel.shapeModel.useWebGl)
+                            {
+                                this._setGradientMaterial(el, color.color.gradientMode, isFill);
+                            }
+                            el.elementModel.shapeModel.GLGeomObj.setFillColor({gradientMode:color.color.gradientMode, color:color.color.stops});
+                            el.elementModel.shapeModel.GLWorld.render();
+                            this.setShapeProperty(el, "fill", color.color.css);
+                            this.setShapeProperty(el, "background", color);
+                            el.elementModel.fill = color;
+                            break;
+                        default:
+                            webGl = this.application.ninja.colorController.colorModel.colorToWebGl(color.color);
+                            el.elementModel.shapeModel.GLGeomObj.setFillColor(webGl);
+                            this.setShapeProperty(el, "fill", webGl);
+                            this.setShapeProperty(el, "background", color);
+                            el.elementModel.fill = color;
+                    }
+                }
+            }
+            else
+            {
+                // Support for ink-bottle tool
                 if(color.strokeInfo)
                 {
                     var strokeWidth = this.GetValueInPixels(color.strokeInfo.strokeSize,
@@ -285,7 +343,67 @@ exports.ShapesController = Montage.create(CanvasController, {
                     this.setShapeProperty(el, "strokeSize", color.strokeInfo.strokeSize + " "
                                                                 + color.strokeInfo.strokeUnits);
                 }
+
+                if(mode)
+                {
+                    switch (mode) {
+                        case 'nocolor':
+                            el.elementModel.shapeModel.GLGeomObj.setStrokeColor(null);
+                            this.setShapeProperty(el, "stroke", null);
+                            this.setShapeProperty(el, "border", color);
+                            el.elementModel.fill = null;
+                            return;
+                        case 'gradient':
+                            if(el.elementModel.shapeModel.useWebGl)
+                            {
+                                this._setGradientMaterial(el, color.color.gradientMode, isFill);
+                            }
+                            el.elementModel.shapeModel.GLGeomObj.setStrokeColor({gradientMode:color.color.gradientMode, color:color.color.stops});
+                            el.elementModel.shapeModel.GLWorld.render();
+                            this.setShapeProperty(el, "stroke", color.color.css);
+                            this.setShapeProperty(el, "border", color);
+                            el.elementModel.fill = color;
+                            break;
+                        default:
+                            webGl = this.application.ninja.colorController.colorModel.colorToWebGl(color.color);
+                            el.elementModel.shapeModel.GLGeomObj.setStrokeColor(webGl);
+                            this.setShapeProperty(el, "stroke", webGl);
+                            this.setShapeProperty(el, "border", color);
+                            el.elementModel.fill = color;
+                    }
+                }
             }
+
+
+
+
+
+
+//            var webGl = color.webGlColor || color.color.webGlColor;
+//            if(!webGl)
+//            {
+//                webGl = this.application.ninja.colorController.colorModel.colorToWebGl(color.color);
+//            }
+//            if(isFill)
+//            {
+//                el.elementModel.shapeModel.GLGeomObj.setFillColor(webGl);
+//                this.setShapeProperty(el, "fill", webGl);
+//                this.setShapeProperty(el, "background", color);
+//            }
+//            else
+//            {
+//                el.elementModel.shapeModel.GLGeomObj.setStrokeColor(webGl);
+//                this.setShapeProperty(el, "stroke", webGl);
+//                this.setShapeProperty(el, "border", color);
+//                if(color.strokeInfo)
+//                {
+//                    var strokeWidth = this.GetValueInPixels(color.strokeInfo.strokeSize,
+//                                                            color.strokeInfo.strokeUnits);
+//                    el.elementModel.shapeModel.GLGeomObj.setStrokeWidth(strokeWidth);
+//                    this.setShapeProperty(el, "strokeSize", color.strokeInfo.strokeSize + " "
+//                                                                + color.strokeInfo.strokeUnits);
+//                }
+//            }
             el.elementModel.shapeModel.GLWorld.render();
         }
     },
diff --git a/js/controllers/selection-controller.js b/js/controllers/selection-controller.js
index 75968d4a..c713b6e5 100755
--- a/js/controllers/selection-controller.js
+++ b/js/controllers/selection-controller.js
@@ -48,6 +48,7 @@ exports.SelectionController = Montage.create(Component, {
             this.eventManager.addEventListener("selectAll", this, false);
             this.eventManager.addEventListener("deleteSelection", this, false);
             this.eventManager.addEventListener("switchDocument", this, false);
+            this.eventManager.addEventListener("closeDocument", this, false);
 //            defaultEventManager.addEventListener( "undo", this, false);
 //            defaultEventManager.addEventListener( "redo", this, false);
         }
@@ -89,17 +90,17 @@ exports.SelectionController = Montage.create(Component, {
         }
     },
 
-    handleSwitchDocument: {
+     handleSwitchDocument: {
         value: function() {
-            this._selectedItems = this.application.ninja.selectedElements.slice(0);
-            if(this._selectedItems.length === 0) {
-                this._isDocument = true;
-            } else {
-                this._isDocument = false;
+            if(this.application.ninja.documentController.activeDocument.currentView === "design"){
+                this._selectedItems = this.application.ninja.selectedElements.slice(0);
+                if(this._selectedItems.length === 0 ){
+                    this._isDocument = true;
+                }else{
+                    this._isDocument = false;
+                }
+                NJevent("selectionChange", {"elements": this.application.ninja.selectedElements, "isDocument": this._isDocument} );
             }
-            NJevent("selectionChange", {"elements": this.application.ninja.selectedElements, "isDocument": this._isDocument});
-
-			this._selectionContainer = this.application.ninja.currentSelectedContainer;
         }
     },
 
diff --git a/js/controllers/styles-controller.js b/js/controllers/styles-controller.js
index 662816f5..addfc24e 100755
--- a/js/controllers/styles-controller.js
+++ b/js/controllers/styles-controller.js
@@ -1236,11 +1236,17 @@ var stylesController = exports.StylesController = Montage.create(Component, {
 
     clearDirtyStyleSheets : {
         value: function(doc) {
-            if(!doc) {
+            this.dirtyStyleSheets.length = 0;
+
+            if(doc) {
+                var stillDirty = this.dirtyStyleSheets.filter(function(sheet) {
+                    return sheet.document !== doc;
+                });
                 this.dirtyStyleSheets = null;
-                this.dirtyStyleSheets = [];
+                this.dirtyStyleSheets = stillDirty;
             }
 
+
         }
     },
 
diff --git a/js/data/menu-data.js b/js/data/menu-data.js
index 52710b3a..40512f5d 100755
--- a/js/data/menu-data.js
+++ b/js/data/menu-data.js
@@ -30,6 +30,12 @@ exports.MenuData = Montage.create( Montage, {
                         "enabled": true,
                         "action": "executeFileOpen"
                     },
+                    {
+                        "displayText" : "Close File",
+                        "hasSubMenu" : false,
+                        "enabled": true,
+                        "action": "executeFileClose"
+                    },
                     {
                         "displayText" : "",
                         "separator":    true
diff --git a/js/document/html-document.js b/js/document/html-document.js
index 23b55e92..051490f5 100755
--- a/js/document/html-document.js
+++ b/js/document/html-document.js
@@ -8,7 +8,8 @@ No rights, expressed or implied, whatsoever to this software are provided by Mot
 //
 var Montage = 		require("montage/core/core").Montage,
     TextDocument =	require("js/document/text-document").TextDocument,
-    NJUtils = 		require("js/lib/NJUtils").NJUtils;
+    NJUtils = 		require("js/lib/NJUtils").NJUtils,
+	GLWorld =			require("js/lib/drawing/world").World;
 ////////////////////////////////////////////////////////////////////////
 //
 exports.HTMLDocument = Montage.create(TextDocument, {
@@ -187,31 +188,112 @@ exports.HTMLDocument = Montage.create(TextDocument, {
 //    },
     
     glData: {
-        get: function()
-		{
+    	get: function() {
+			//
 			var elt = this.iframe.contentWindow.document.getElementById("UserContent");
-			this._glData = null;
-			if (elt)
-			{
-				var cdm = new CanvasDataManager();
+			//
+			if (elt) {
 				this._glData = [];
-				cdm.collectGLData( elt,  this._glData );
+				//if (path) {
+					//this.collectGLData(elt, this._glData, path);
+				//} else {
+					this.collectGLData(elt, this._glData );
+				//}
+			} else {
+				this._glData = null
 			}
-				
+			//	
 			return this._glData;
 		},
+        set: function(value) {
+			var elt = this.documentRoot;
+			if (elt) {
+				var nWorlds= value.length;
+				for (var i=0;  i<nWorlds;  i++) {
+					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 );
+							if (id) {
+								var canvas = this.findCanvasWithID( id, elt );
+								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 index = importStr.indexOf( "webGL: " );
+										var useWebGL = (index >= 0)
+										var world = new GLWorld( canvas, useWebGL );
+										world.import( importStr );
+										this.buildShapeModel( canvas.elementModel, world );
+									}
+								}
+							}
+						}
+					}
+				}
+			}
+		}
+    },
 
-        set: function(value)
+	buildShapeModel:
+	{
+		value: function( elementModel, world )
 		{
-			var elt = this.documentRoot;
-			if (elt)
+            var shapeModel = elementModel.shapeModel;
+			shapeModel.shapeCount	= 1;	// for now...
+			shapeModel.useWebGl		= world._useWebGL;
+			shapeModel.GLWorld		= world;
+			var root = world.getGeomRoot();
+			if (root)
 			{
-				console.log( "load canvas data: " , value );
-				var cdm = new CanvasDataManager();
-				cdm.loadGLData(elt,  value);
+				shapeModel.GLGeomObj			= root;
+				shapeModel.strokeSize			= root._strokeWidth;
+				shapeModel.stroke				= root._strokeColor.slice();
+				shapeModel.strokeMaterial		= root._strokeMaterial.dup();
+				shapeModel.strokeStyle			= "solid";
+				//shapeModel.strokeStyleIndex
+				//shapeModel.border
+				//shapeModel.background
+				switch (root.geomType())
+				{
+					case root.GEOM_TYPE_RECTANGLE:
+                        elementModel.selection = "Rectangle";
+                        elementModel.pi = "RectanglePi";
+                        shapeModel.fill					= root._fillColor.slice();
+                        shapeModel.fillMaterial			= root._fillMaterial.dup();
+						shapeModel.tlRadius = root._tlRadius;
+						shapeModel.trRadius = root._trRadius;
+						shapeModel.blRadius = root._blRadius;
+						shapeModel.brRadius = root._brRadius;
+						break;
+
+					case root.GEOM_TYPE_CIRCLE:
+                        elementModel.selection = "Oval";
+                        elementModel.pi = "OvalPi";
+                        shapeModel.fill					= root._fillColor.slice();
+                        shapeModel.fillMaterial			= root._fillMaterial.dup();
+						shapeModel.innerRadius = root._innerRadius;
+						break;
+
+					case root.GEOM_TYPE_LINE:
+                        elementModel.selection = "Line";
+