From 4b199cf04af83f59895d4d1e9a2d8443c1ec8e06 Mon Sep 17 00:00:00 2001
From: hwc487
Date: Tue, 3 Apr 2012 09:36:14 -0700
Subject: started the flag material

---
 assets/images/us_flag.png              | Bin 0 -> 9946 bytes
 assets/shaders/Flag.frag.glsl          |  13 +++
 assets/shaders/Flag.vert.glsl          |  29 +++++--
 js/lib/geom/geom-obj.js                |   2 +
 js/lib/rdge/materials/flag-material.js | 142 +++++++++++++++++++++++++++++++++
 js/models/materials-model.js           |   3 +
 6 files changed, 181 insertions(+), 8 deletions(-)
 create mode 100644 assets/images/us_flag.png
 create mode 100644 assets/shaders/Flag.frag.glsl
 create mode 100644 js/lib/rdge/materials/flag-material.js

diff --git a/assets/images/us_flag.png b/assets/images/us_flag.png
new file mode 100644
index 00000000..1545edc2
Binary files /dev/null and b/assets/images/us_flag.png differ
diff --git a/assets/shaders/Flag.frag.glsl b/assets/shaders/Flag.frag.glsl
new file mode 100644
index 00000000..79d4bec3
--- /dev/null
+++ b/assets/shaders/Flag.frag.glsl
@@ -0,0 +1,13 @@
+#ifdef GL_ES
+precision highp float;
+#endif
+
+uniform sampler2D u_tex0;
+
+varying vec2 v_uv;
+
+void main(void)
+{
+    vec3 col = texture2D(u_tex0, v_uv).xyz;
+    gl_FragColor = vec4(col,1.0);
+}
\ No newline at end of file
diff --git a/assets/shaders/Flag.vert.glsl b/assets/shaders/Flag.vert.glsl
index 7dc932a7..9da0ee1c 100644
--- a/assets/shaders/Flag.vert.glsl
+++ b/assets/shaders/Flag.vert.glsl
@@ -16,20 +16,33 @@ attribute vec2 texcoord;
 
 // scalar uniforms
 uniform float u_time;
+uniform float u_waveWidth;
+uniform float u_waveHeight;
 
 // matrix uniforms
 uniform mat4 u_mvMatrix;
 uniform mat4 u_projMatrix;
 uniform mat4 u_worldMatrix;
 
+// varying variables
+varying vec2 v_uv;
+
 void main()
 {
-	float angle = (u_time%360)*2;
-
-	a_pos.z  = sin( a_pos.x + angle);
-	a_pos.z += sin( a_pos.y/2 + angle);
-	a_pos.z *= a_pos.x * 0.09;
-	gl_Position = u_projMatrix * u_mvMatrix * vec4(a_pos,1.0) ;
-
-	gl_FragColor = v_color;
+    float pi = 3.14159;
+	float angle = mod(u_time, pi)*2.0;
+
+    vec3 v = a_pos;
+    v_uv = texcoord;
+
+    vec2 pos = texcoord;
+    float tmp = pos.x;  pos.x = pos.y;  pos.y = tmp;
+    pos.x = pos.x * 1.0*pi * u_waveWidth;
+    pos.y = pos.y * 1.0*pi * u_waveWidth;
+
+	v.z  = sin( pos.x + angle);
+	v.z += sin( pos.y/2.0 + angle);
+	v.z *= v.y * 0.09 * u_waveHeight;
+	
+    gl_Position = u_projMatrix * u_mvMatrix * vec4(v,1.0) ;
 }
diff --git a/js/lib/geom/geom-obj.js b/js/lib/geom/geom-obj.js
index 11b9303a..0c0d7c01 100755
--- a/js/lib/geom/geom-obj.js
+++ b/js/lib/geom/geom-obj.js
@@ -309,6 +309,7 @@ var GeomObj = function GLGeomObj() {
 				case "tunnel":
 				case "reliefTunnel":
 				case "squareTunnel":
+                case "flag":
 				case "twist":
 				case "fly":
 				case "julia":
@@ -382,6 +383,7 @@ var GeomObj = function GLGeomObj() {
 				case "tunnel":
 				case "reliefTunnel":
 				case "squareTunnel":
+                case "flag":
 				case "twist":
 				case "fly":
 				case "julia":
diff --git a/js/lib/rdge/materials/flag-material.js b/js/lib/rdge/materials/flag-material.js
new file mode 100644
index 00000000..77991a8c
--- /dev/null
+++ b/js/lib/rdge/materials/flag-material.js
@@ -0,0 +1,142 @@
+/* <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 PulseMaterial = require("js/lib/rdge/materials/pulse-material").PulseMaterial;
+var Texture = require("js/lib/rdge/texture").Texture;
+
+var FlagMaterial = function FlagMaterial() {
+    ///////////////////////////////////////////////////////////////////////
+    // Instance variables
+    ///////////////////////////////////////////////////////////////////////
+	this._name = "FlagMaterial";
+	this._shaderName = "flag";
+
+	this._texMap = 'assets/images/us_flag.png';
+
+	this._time = 0.0;
+	this._dTime = 0.1;
+
+    this._defaultWaveWidth = 1.0;
+    this._defaultWaveHeight = 1.0;
+
+    ///////////////////////////////////////////////////////////////////////
+    // Properties
+    ///////////////////////////////////////////////////////////////////////
+	// all defined in parent PulseMaterial.js
+	// load the local default value
+	this._propNames			= ["texmap",        "wavewidth",        "waveheight" ];
+	this._propLabels		= ["Texture map",   "Wave Width",       "Wave Height" ];
+	this._propTypes			= ["file",          "float",            "float" ];
+	this._propValues		= [];
+
+	this._propValues[ this._propNames[0] ] = this._texMap.slice(0);
+    this._propValues[ this._propNames[1] ] = this._defaultWaveWidth;
+    this._propValues[ this._propNames[2] ] = this._defaultWaveHeight;
+
+    ///////////////////////////////////////////////////////////////////////
+    // Methods
+    ///////////////////////////////////////////////////////////////////////
+	// duplcate method requirde
+	this.dup = function( world ) {
+		// allocate a new uber material
+		var newMat = new FlagMaterial();
+
+		// copy over the current values;
+		var propNames = [],  propValues = [],  propTypes = [],  propLabels = [];
+		this.getAllProperties( propNames,  propValues,  propTypes,  propLabels);
+		var n = propNames.length;
+		for (var i=0;  i<n;  i++) {
+			newMat.setProperty( propNames[i], propValues[i] );
+        }
+
+		return newMat;
+	};
+
+	this.init = function( world )
+	{
+		// save the world
+		if (world)  this.setWorld( world );
+
+		// set up the shader
+		this._shader = new jshader();
+		this._shader.def = flagMaterialDef;
+		this._shader.init();
+
+		// set up the material node
+		this._materialNode = createMaterialNode("flagMaterial" + "_" + world.generateUniqueNodeID());
+		this._materialNode.setShader(this._shader);
+
+		this._time = 0;
+		if (this._shader && this._shader['default']) {
+			this._shader['default'].u_time.set( [this._time] );
+            this._shader['default'].u_waveWidth.set(  [this._propValues[ this._propNames[1] ]] );
+            this._shader['default'].u_waveHeight.set( [this._propValues[ this._propNames[2] ]] );
+        }
+
+        // set up the texture
+        var texMapName = this._propValues[this._propNames[0]];
+        this._glTex = new Texture( world, texMapName );
+
+		// set the shader values in the shader
+		this.updateTexture();
+		this.update( 0 );
+	}
+};
+
+///////////////////////////////////////////////////////////////////////////////////////
+// RDGE shader
+ 
+// shader spec (can also be loaded from a .JSON file, or constructed at runtime)
+var flagMaterialDef =
+{'shaders': 
+	{
+		'defaultVShader':"assets/shaders/Flag.vert.glsl",
+		'defaultFShader':"assets/shaders/Flag.frag.glsl"
+	},
+	'techniques':
+	{ 
+		'default':
+		[
+			{
+				'vshader' : 'defaultVShader',
+				'fshader' : 'defaultFShader',
+				// attributes
+				'attributes' :
+				{
+					'vert'  :   { 'type' : 'vec3' },
+					'normal' :  { 'type' : 'vec3' },
+					'texcoord'  :   { 'type' : 'vec2' }
+				},
+				// parameters
+				'params' : 
+				{
+					'u_tex0': { 'type' : 'tex2d' },
+					'u_time' : { 'type' : 'float' },
+					'u_waveWidth'  :   { 'type' : 'float' },
+					'u_waveHeight'  :   { 'type' : 'float' }
+				},
+
+				// render states
+				'states' : 
+				{
+					'depthEnable' : true,
+					'offset':[1.0, 0.1]
+				}
+			}
+		]
+	}
+};
+
+FlagMaterial.prototype = new PulseMaterial();
+
+if (typeof exports === "object") {
+    exports.FlagMaterial = FlagMaterial;
+}
+
+
+
+
diff --git a/js/models/materials-model.js b/js/models/materials-model.js
index 692ac09a..97a48f5a 100755
--- a/js/models/materials-model.js
+++ b/js/models/materials-model.js
@@ -22,6 +22,7 @@ var PlasmaMaterial = require("js/lib/rdge/materials/plasma-material").PlasmaMate
 var PulseMaterial = require("js/lib/rdge/materials/pulse-material").PulseMaterial;
 var TunnelMaterial = require("js/lib/rdge/materials/tunnel-material").TunnelMaterial;
 var ReliefTunnelMaterial = require("js/lib/rdge/materials/relief-tunnel-material").ReliefTunnelMaterial;
+var FlagMaterial = require("js/lib/rdge/materials/flag-material").FlagMaterial;
 var SquareTunnelMaterial = require("js/lib/rdge/materials/square-tunnel-material").SquareTunnelMaterial;
 var FlyMaterial = require("js/lib/rdge/materials/fly-material").FlyMaterial;
 var WaterMaterial = require("js/lib/rdge/materials/water-material").WaterMaterial;
@@ -55,6 +56,7 @@ exports.MaterialsModel = Montage.create(Component, {
             this.addMaterial(new PulseMaterial());
             this.addMaterial(new TunnelMaterial());
             this.addMaterial(new ReliefTunnelMaterial());
+            this.addMaterial(new FlagMaterial());
             this.addMaterial(new SquareTunnelMaterial());
             this.addMaterial(new FlyMaterial());
             this.addMaterial(new WaterMaterial());
@@ -235,6 +237,7 @@ exports.MaterialsModel = Montage.create(Component, {
 					case "tunnel":				mat = new TunnelMaterial();				break;
 					case "reliefTunnel":		mat = new ReliefTunnelMaterial();		break;
 					case "squareTunnel":		mat = new SquareTunnelMaterial();		break;
+					case "flag":		        mat = new FlagMaterial();		        break;
 					case "fly":					mat = new FlyMaterial();				break;
 					case "water":				mat = new WaterMaterial();				break;
 					case "paris":				mat = new ParisMaterial();				break;
-- 
cgit v1.2.3