From cad4d6cb3f667f6174ec05cecead675b244285b9 Mon Sep 17 00:00:00 2001
From: hwc487
Date: Mon, 5 Mar 2012 04:51:31 -0800
Subject: Added more materials/canvas2D drawing to runtime.

---
 js/helper-classes/RDGE/GLWorld.js                 |  5 +-
 js/helper-classes/RDGE/Materials/PulseMaterial.js |  3 +
 js/helper-classes/RDGE/Materials/WaterMaterial.js |  2 +-
 js/helper-classes/RDGE/runtime/GLRuntime.js       | 54 +++++++++++++++--
 js/helper-classes/RDGE/runtime/RuntimeGeomObj.js  | 27 +++++++--
 js/helper-classes/RDGE/runtime/RuntimeMaterial.js | 74 +++++++++++++++++++++++
 6 files changed, 153 insertions(+), 12 deletions(-)

(limited to 'js')

diff --git a/js/helper-classes/RDGE/GLWorld.js b/js/helper-classes/RDGE/GLWorld.js
index d9e91404..3a779b92 100755
--- a/js/helper-classes/RDGE/GLWorld.js
+++ b/js/helper-classes/RDGE/GLWorld.js
@@ -840,7 +840,7 @@ GLWorld.prototype.export = function( exportForPublish )
 	if (!exportForPublish)  exportForPublish = false;
 	exportStr += "publish: " + exportForPublish + "\n";
 
-	if (exportForPublish)
+	if (exportForPublish && this._useWebGL)
 	{
 		exportStr += "scenedata: " + this.myScene.exportJSON() + "endscene\n";
 
@@ -930,6 +930,9 @@ GLWorld.prototype.import = function( importStr )
 
 		// import the objects
 		this.importObjects( importStr, this._rootNode );
+
+		// render using canvas 2D
+		this.render();
 	}
 }
 
diff --git a/js/helper-classes/RDGE/Materials/PulseMaterial.js b/js/helper-classes/RDGE/Materials/PulseMaterial.js
index 28f2a430..b0fbd998 100644
--- a/js/helper-classes/RDGE/Materials/PulseMaterial.js
+++ b/js/helper-classes/RDGE/Materials/PulseMaterial.js
@@ -185,6 +185,9 @@ function PulseMaterial()
 		// every material needs the base type and instance name
 		var exportStr = "material: " + this.getShaderName() + "\n";
 		exportStr += "name: " + this.getName() + "\n";
+
+		var texMapName = this._propValues[this._propNames[0]];
+		exportStr += "texture: " + texMapName;
 		
 		// every material needs to terminate like this
 		exportStr += "endMaterial\n";
diff --git a/js/helper-classes/RDGE/Materials/WaterMaterial.js b/js/helper-classes/RDGE/Materials/WaterMaterial.js
index 9ece3b45..49761c58 100644
--- a/js/helper-classes/RDGE/Materials/WaterMaterial.js
+++ b/js/helper-classes/RDGE/Materials/WaterMaterial.js
@@ -22,7 +22,7 @@ function WaterMaterial()
 	this._name = "WaterMaterial";
 	this._shaderName = "water";
 
-	this._texMap = 'assets/images/rocky-normal.jpg';
+	this._texMap = 'assets/images/rocky-normal.jpg\n';
 
 	this._time = 0.0;
 	this._dTime = 0.01;
diff --git a/js/helper-classes/RDGE/runtime/GLRuntime.js b/js/helper-classes/RDGE/runtime/GLRuntime.js
index d86506ad..e0fff4a8 100644
--- a/js/helper-classes/RDGE/runtime/GLRuntime.js
+++ b/js/helper-classes/RDGE/runtime/GLRuntime.js
@@ -16,6 +16,7 @@ function GLRuntime( canvas, importStr )
     // Instance variables
     ///////////////////////////////////////////////////////////////////////
 	this._canvas		= canvas;
+	this._context		= null;
 	this._importStr		= importStr;
 
 	this.renderer		= null;
@@ -27,6 +28,8 @@ function GLRuntime( canvas, importStr )
 	this._firstRender	= true;
 	this._initialized	= false;
 
+	this._useWebGL		= false;
+
 	// view parameters
 	this._fov = 45.0;
 	this._zNear = 0.1;
@@ -49,6 +52,14 @@ function GLRuntime( canvas, importStr )
 	this.getAspect			= function()		{  return this._aspect;			}
 	this.getViewDistance	= function()		{  return this._viewDist;		}
 
+	this.get2DContext		= function()		{  return this._context;		}
+
+	this.getViewportWidth	= function()		{  return this._canvas.width;	}
+	this.getViewportHeight	= function()		{  return this._canvas.height;	}
+
+    ///////////////////////////////////////////////////////////////////////
+	// accessors
+    ///////////////////////////////////////////////////////////////////////
 	this.loadScene = function()
 	{
 		// parse the data
@@ -56,6 +67,8 @@ function GLRuntime( canvas, importStr )
 		var index = importStr.indexOf( "scenedata: " );
 		if (index >= 0)
 		{
+			this._useWebGL = true;
+
 			var rdgeStr = importStr.substr( index+11 );
 			var endIndex = rdgeStr.indexOf( "endscene\n" );
 			if (endIndex < 0)  throw new Error( "ill-formed WebGL data" );
@@ -67,6 +80,12 @@ function GLRuntime( canvas, importStr )
 			this.linkMaterials( this._geomRoot );
 			this.initMaterials();
 		}
+		else
+		{
+			this._context = this._canvas.getContext( "2d" );
+			this.importObjects( importStr );
+			this.render();
+		}
 	}
 
 	this.init = function()
@@ -230,6 +249,7 @@ function GLRuntime( canvas, importStr )
 	this.addObject = function( obj, parent )
 	{
 		if (!obj)  return;
+		obj.setWorld( this );
 
 		if (parent == null)
 			this._geomRoot = obj;
@@ -290,11 +310,35 @@ function GLRuntime( canvas, importStr )
 		}
 	}
 
-	// start RDGE
-	var id = canvas.getAttribute( "data-RDGE-id" ); 
-	canvas.rdgeid = id;
-	g_Engine.registerCanvas(canvas, this);
-	RDGEStart( canvas );
+	this.render = function( obj )
+	{
+		if (!obj)  obj = this._geomRoot;
+		obj.render();
+
+		if (obj.children)
+		{
+			var nKids = obj.children.length;
+			for (var i=0;  i<nKids;  i++)
+			{
+				var child = obj.children[i];
+				if (child)
+					this.render( child );
+			}
+		}
+	}
+
+	// start RDGE or load Canvas 2D objects
+	if (this._useWebGL)
+	{
+		var id = canvas.getAttribute( "data-RDGE-id" ); 
+		canvas.rdgeid = id;
+		g_Engine.registerCanvas(canvas, this);
+		RDGEStart( canvas );
+	}
+	else
+	{
+		this.loadScene();
+	}
 }
 
 
diff --git a/js/helper-classes/RDGE/runtime/RuntimeGeomObj.js b/js/helper-classes/RDGE/runtime/RuntimeGeomObj.js
index da941b56..2539abc1 100644
--- a/js/helper-classes/RDGE/runtime/RuntimeGeomObj.js
+++ b/js/helper-classes/RDGE/runtime/RuntimeGeomObj.js
@@ -37,7 +37,10 @@ function RuntimeGeomObj()
     // Property accessors
     ///////////////////////////////////////////////////////////////////////
 
-	this.geomType	= function()				 {  return this.GEOM_TYPE_UNDEFINED;	}
+	this.geomType	= function()		{  return this.GEOM_TYPE_UNDEFINED;	}
+
+	this.setWorld	= function(w)		{  this._world = w;					}
+	this.getWorld	= function()		{  return this._world;				}
 
     ///////////////////////////////////////////////////////////////////////
     // Methods
@@ -76,8 +79,22 @@ function RuntimeGeomObj()
 			var materialType = getPropertyFromString( "material: ",	importStr );
 			switch (materialType)
 			{
-				case "flat":	mat = new RuntimeFlatMaterial();		break;
-				case "pulse":	mat = new RuntimePulseMaterial();		break;
+				case "flat":			mat = new RuntimeFlatMaterial();				break;
+
+				case "radialGradient":
+				case "linearGradient":  mat = new RuntimeLinearGradientMaterial();		break;
+
+				case "water":
+				case "tunnel":
+				case "reliefTunnel":
+				case "squareTunnel":
+				case "twist":
+				case "fly":
+				case "julia":
+				case "mandel":
+				case "star":
+				case "zinvert":
+				case "pulse":			mat = new RuntimePulseMaterial();				break;
 
 				default:
 					console.log( "material type: " + materialType + " is not supported" );
@@ -146,8 +163,8 @@ function RuntimeRectangle()
 	{
 		// various declarations
 		var pt,  rad,  ctr,  startPt, bPts;
-		var width  = Math.round(this.getWidth()),
-			height = Math.round(this.getHeight());
+		var width  = Math.round(this._width),
+			height = Math.round(this._height);
 
 		pt = [inset, inset];	// top left corner
 
diff --git a/js/helper-classes/RDGE/runtime/RuntimeMaterial.js b/js/helper-classes/RDGE/runtime/RuntimeMaterial.js
index 2ba3006e..5fe29f93 100644
--- a/js/helper-classes/RDGE/runtime/RuntimeMaterial.js
+++ b/js/helper-classes/RDGE/runtime/RuntimeMaterial.js
@@ -90,6 +90,7 @@ function RuntimePulseMaterial()
 
 	this.import = function( importStr )
 	{
+		this._texMap = getPropertyFromString( "texture: ",	importStr );
 	}
 
 	this.init = function()
@@ -137,4 +138,77 @@ function RuntimePulseMaterial()
 	}
 }
 
+function RuntimeRadialGradientMaterial()
+{
+	// inherit the members of RuntimeMaterial
+	this.inheritedFrom = RuntimeMaterial;
+	this.inheritedFrom();
+
+	// setup default values
+	this._color1 = [0.25,0,0,1];  this._colorStop1 = 0.0;
+	this._color2 = [0,0.25,0,1];  this._colorStop2 = 0.3;
+	this._color3 = [0,0.25,0,1];  this._colorStop3 = 0.6;
+	this._color4 = [0,0.25,0,1];  this._colorStop4 = 1.0;
+
+	this.init = function()
+	{
+		var material = this._materialNode;
+		if (material)
+		{
+			var technique = material.shaderProgram.default;
+			var renderer = g_Engine.getContext().renderer;
+			if (renderer && technique)
+			{
+				if (this._shader && this._shader.default)
+				{
+					this._shader.default.u_color1.set( this._color1 );
+					this._shader.default.u_color2.set( this._color2 );
+					this._shader.default.u_color3.set( this._color3 );
+					this._shader.default.u_color4.set( this._color4 );
+
+					this._shader.default.u_colorStop1.set( [this._colorStop1] );
+					this._shader.default.u_colorStop2.set( [this._colorStop2] );
+					this._shader.default.u_colorStop3.set( [this._colorStop3] );
+					this._shader.default.u_colorStop4.set( [this._colorStop4] );
+
+					if (this._angle)
+						this._shader.default.u_cos_sin_angle.set([Math.cos(this._angle), Math.sin(this._angle)]);
+				}
+			}
+		}
+	}
+
+	this.import = function( importStr )
+	{
+		var colorStr;
+		colorStr = getPropertyFromString( "color1: ",	importStr );
+		this._color1  = eval( "[" + colorStr + "]" );
+		colorStr = getPropertyFromString( "color2: ",	importStr );
+		this._color2  = eval( "[" + colorStr + "]" );
+		colorStr = getPropertyFromString( "color3: ",	importStr );
+		this._color3  = eval( "[" + colorStr + "]" );
+		colorStr = getPropertyFromString( "color4: ",	importStr );
+		this._color4  = eval( "[" + colorStr + "]" );
+
+		this._colorStop1 = Number( getPropertyFromString( "colorStop1: ",	importStr ) );
+		this._colorStop1 = Number( getPropertyFromString( "colorStop2: ",	importStr ) );
+		this._colorStop1 = Number( getPropertyFromString( "colorStop3: ",	importStr ) );
+		this._colorStop1 = Number( getPropertyFromString( "colorStop4: ",	importStr ) );
+
+		if (this._angle)
+			this._angle = getPropertyFromString( "angle: ",	importStr );
+	}
+
+}
+
+function RuntimeLinearGradientMaterial()
+{
+	// inherit the members of RuntimeMaterial
+	this.inheritedFrom = RuntimeRadialGradientMaterial;
+	this.inheritedFrom();
+
+	// the only difference between linear & radial gradient is the existance of an angle for linear.
+	this._angle = 0.0;
+}
+
 
-- 
cgit v1.2.3