diff options
-rw-r--r-- | assets/shaders/Flag.vert.glsl | 12 | ||||
-rw-r--r-- | js/lib/rdge/materials/flag-material.js | 81 | ||||
-rw-r--r-- | js/lib/rdge/materials/pulse-material.js | 2 | ||||
-rwxr-xr-x | js/lib/rdge/materials/radial-gradient-material.js | 7 | ||||
-rwxr-xr-x | js/lib/rdge/materials/uber-material.js | 12 |
5 files changed, 91 insertions, 23 deletions
diff --git a/assets/shaders/Flag.vert.glsl b/assets/shaders/Flag.vert.glsl index a5e8b2f7..1c842cb0 100644 --- a/assets/shaders/Flag.vert.glsl +++ b/assets/shaders/Flag.vert.glsl | |||
@@ -16,6 +16,7 @@ attribute vec2 texcoord; | |||
16 | 16 | ||
17 | // scalar uniforms | 17 | // scalar uniforms |
18 | uniform float u_time; | 18 | uniform float u_time; |
19 | uniform float u_speed; | ||
19 | uniform float u_waveWidth; | 20 | uniform float u_waveWidth; |
20 | uniform float u_waveHeight; | 21 | uniform float u_waveHeight; |
21 | 22 | ||
@@ -30,8 +31,9 @@ varying vec2 v_uv; | |||
30 | 31 | ||
31 | void main() | 32 | void main() |
32 | { | 33 | { |
33 | float pi = 3.14159; | 34 | float time = u_time * u_speed; |
34 | float angle = u_time; | 35 | const float pi = 3.14159; |
36 | float angle = time; | ||
35 | 37 | ||
36 | v_uv = texcoord; | 38 | v_uv = texcoord; |
37 | 39 | ||
@@ -39,9 +41,11 @@ void main() | |||
39 | float y = 2.0*pi*texcoord.y; | 41 | float y = 2.0*pi*texcoord.y; |
40 | 42 | ||
41 | vec3 v = a_pos; | 43 | vec3 v = a_pos; |
42 | v.z = sin( x + angle ) - 2.0*u_waveHeight; | 44 | v.z = sin( x + angle ); |
43 | v.z += sin( 0.2*y + angle); | 45 | v.z += sin( 0.2*y + angle); |
44 | v.z *= x * 0.09 * u_waveHeight; | 46 | v.z *= u_waveHeight; |
47 | v.z -= 2.0*u_waveHeight; | ||
48 | v.z *= x * 0.09; | ||
45 | 49 | ||
46 | gl_Position = u_projMatrix * u_mvMatrix * vec4(v,1.0) ; | 50 | gl_Position = u_projMatrix * u_mvMatrix * vec4(v,1.0) ; |
47 | } | 51 | } |
diff --git a/js/lib/rdge/materials/flag-material.js b/js/lib/rdge/materials/flag-material.js index 312ca1c1..fa844cc3 100644 --- a/js/lib/rdge/materials/flag-material.js +++ b/js/lib/rdge/materials/flag-material.js | |||
@@ -21,8 +21,9 @@ var FlagMaterial = function FlagMaterial() { | |||
21 | this._time = 0.0; | 21 | this._time = 0.0; |
22 | this._dTime = 0.1; | 22 | this._dTime = 0.1; |
23 | 23 | ||
24 | this._defaultWaveWidth = 1.0; | 24 | this._speed = 1.0; |
25 | this._defaultWaveHeight = 1.0; | 25 | this._waveWidth = 1.0; |
26 | this._waveHeight = 1.0; | ||
26 | 27 | ||
27 | this._hasVertexDeformation = true; | 28 | this._hasVertexDeformation = true; |
28 | 29 | ||
@@ -31,14 +32,16 @@ var FlagMaterial = function FlagMaterial() { | |||
31 | /////////////////////////////////////////////////////////////////////// | 32 | /////////////////////////////////////////////////////////////////////// |
32 | // all defined in parent PulseMaterial.js | 33 | // all defined in parent PulseMaterial.js |
33 | // load the local default value | 34 | // load the local default value |
34 | this._propNames = ["texmap", "wavewidth", "waveheight" ]; | 35 | this._propNames = ["texmap", "wavewidth", "waveheight", "speed" ]; |
35 | this._propLabels = ["Texture map", "Wave Width", "Wave Height" ]; | 36 | this._propLabels = ["Texture map", "Wave Width", "Wave Height", "Speed" ]; |
36 | this._propTypes = ["file", "float", "float" ]; | 37 | this._propTypes = ["file", "float", "float", "float" ]; |
37 | this._propValues = []; | 38 | this._propValues = []; |
38 | 39 | ||
39 | this._propValues[ this._propNames[0] ] = this._texMap.slice(0); | 40 | this._propValues[ this._propNames[0] ] = this._texMap.slice(0); |
40 | this._propValues[ this._propNames[1] ] = this._defaultWaveWidth; | 41 | this._propValues[ this._propNames[1] ] = this._waveWidth; |
41 | this._propValues[ this._propNames[2] ] = this._defaultWaveHeight; | 42 | this._propValues[ this._propNames[2] ] = this._waveHeight; |
43 | this._propValues[ this._propNames[3] ] = this._speed; | ||
44 | |||
42 | 45 | ||
43 | // a material can be animated or not. default is not. | 46 | // a material can be animated or not. default is not. |
44 | // Any material needing continuous rendering should override this method | 47 | // Any material needing continuous rendering should override this method |
@@ -65,6 +68,68 @@ var FlagMaterial = function FlagMaterial() { | |||
65 | return newMat; | 68 | return newMat; |
66 | }; | 69 | }; |
67 | 70 | ||
71 | this.setProperty = function( prop, value ) | ||
72 | { | ||
73 | // make sure we have legitimate imput | ||
74 | var ok = this.validateProperty( prop, value ); | ||
75 | if (!ok) { | ||
76 | console.log( "invalid property in Radial Gradient Material:" + prop + " : " + value ); | ||
77 | } | ||
78 | |||
79 | switch (prop) | ||
80 | { | ||
81 | case "texmap": | ||
82 | this.setTextureMap(value); | ||
83 | break; | ||
84 | |||
85 | case "wavewidth": | ||
86 | this._waveWidth = value; | ||
87 | this._propValues[ this._propNames[1] ] = this._waveWidth; | ||
88 | this.updateParameters(); | ||
89 | break; | ||
90 | |||
91 | case "waveheight": | ||
92 | this._waveHeight = value; | ||
93 | this._propValues[ this._propNames[2] ] = this._waveHeight; | ||
94 | this.updateParameters(); | ||
95 | break; | ||
96 | |||
97 | case "speed": | ||
98 | this._speed = value; | ||
99 | this._propValues[ this._propNames[3] ] = this._speed; | ||
100 | this.updateParameters(); | ||
101 | break; | ||
102 | |||
103 | case "color": | ||
104 | break; | ||
105 | } | ||
106 | }; | ||
107 | |||
108 | |||
109 | this.updateParameters = function() | ||
110 | { | ||
111 | this._propValues[ this._propNames[1] ] = this._waveWidth; | ||
112 | this._propValues[ this._propNames[2] ] = this._waveHeight; | ||
113 | this._propValues[ this._propNames[3] ] = this._speed; | ||
114 | |||
115 | var material = this._materialNode; | ||
116 | if (material) | ||
117 | { | ||
118 | var technique = material.shaderProgram['default']; | ||
119 | var renderer = RDGE.globals.engine.getContext().renderer; | ||
120 | if (renderer && technique) | ||
121 | { | ||
122 | |||
123 | if (this._shader && this._shader['default']) { | ||
124 | this._shader['default'].u_speed.set( [this._speed] ); | ||
125 | this._shader['default'].u_waveWidth.set( [this._waveWidth] ); | ||
126 | this._shader['default'].u_waveHeight.set( [this._waveHeight] ); | ||
127 | } | ||
128 | } | ||
129 | } | ||
130 | }; | ||
131 | |||
132 | |||
68 | this.init = function( world ) | 133 | this.init = function( world ) |
69 | { | 134 | { |
70 | // save the world | 135 | // save the world |
@@ -91,6 +156,7 @@ var FlagMaterial = function FlagMaterial() { | |||
91 | this._glTex = new Texture( world, texMapName ); | 156 | this._glTex = new Texture( world, texMapName ); |
92 | 157 | ||
93 | // set the shader values in the shader | 158 | // set the shader values in the shader |
159 | this.updateParameters(); | ||
94 | this.updateTexture(); | 160 | this.updateTexture(); |
95 | this.update( 0 ); | 161 | this.update( 0 ); |
96 | } | 162 | } |
@@ -125,6 +191,7 @@ var flagMaterialDef = | |||
125 | { | 191 | { |
126 | 'u_tex0': { 'type' : 'tex2d' }, | 192 | 'u_tex0': { 'type' : 'tex2d' }, |
127 | 'u_time' : { 'type' : 'float' }, | 193 | 'u_time' : { 'type' : 'float' }, |
194 | 'u_speed' : { 'type' : 'float' }, | ||
128 | 'u_waveWidth' : { 'type' : 'float' }, | 195 | 'u_waveWidth' : { 'type' : 'float' }, |
129 | 'u_waveHeight' : { 'type' : 'float' } | 196 | 'u_waveHeight' : { 'type' : 'float' } |
130 | }, | 197 | }, |
diff --git a/js/lib/rdge/materials/pulse-material.js b/js/lib/rdge/materials/pulse-material.js index 56c10f21..28f3ee5e 100644 --- a/js/lib/rdge/materials/pulse-material.js +++ b/js/lib/rdge/materials/pulse-material.js | |||
@@ -224,8 +224,6 @@ var PulseMaterial = function PulseMaterial() | |||
224 | this._shader['default'].u_time.set( [this._time] ); | 224 | this._shader['default'].u_time.set( [this._time] ); |
225 | } | 225 | } |
226 | this._time += this._dTime; | 226 | this._time += this._dTime; |
227 | |||
228 | if (this._time > 200.0) this._time = 0.0; | ||
229 | } | 227 | } |
230 | } | 228 | } |
231 | }; | 229 | }; |
diff --git a/js/lib/rdge/materials/radial-gradient-material.js b/js/lib/rdge/materials/radial-gradient-material.js index 65679429..083b7371 100755 --- a/js/lib/rdge/materials/radial-gradient-material.js +++ b/js/lib/rdge/materials/radial-gradient-material.js | |||
@@ -147,9 +147,9 @@ var RadialGradientMaterial = function RadialGradientMaterial() { | |||
147 | /////////////////////////////////////////////////////////////////////// | 147 | /////////////////////////////////////////////////////////////////////// |
148 | // Material Property Accessors | 148 | // Material Property Accessors |
149 | /////////////////////////////////////////////////////////////////////// | 149 | /////////////////////////////////////////////////////////////////////// |
150 | this._propNames = ["color1", "color2", "color3", "color4", "colorStop1", "colorStop2", "colorStop3", "colorStop4", "angle"]; | 150 | this._propNames = ["color1", "color2", "color3", "color4", "colorStop1", "colorStop2", "colorStop3", "colorStop4" ]; |
151 | this._propLabels = ["Color 1", "Color 2", "Color 3", "Color 4", "Color Stop 1", "Color Stop 2", "Color Stop 3", "Color Stop 4", "Angle"]; | 151 | this._propLabels = ["Color 1", "Color 2", "Color 3", "Color 4", "Color Stop 1", "Color Stop 2", "Color Stop 3", "Color Stop 4" ]; |
152 | this._propTypes = ["color", "color", "color", "color", "float", "float", "float", "float", "float"]; | 152 | this._propTypes = ["color", "color", "color", "color", "float", "float", "float", "float" ]; |
153 | this._propValues = []; | 153 | this._propValues = []; |
154 | 154 | ||
155 | this._propValues[this._propNames[0]] = this._color1.slice(0); | 155 | this._propValues[this._propNames[0]] = this._color1.slice(0); |
@@ -180,7 +180,6 @@ var RadialGradientMaterial = function RadialGradientMaterial() { | |||
180 | case "colorStop2": this.setColorStop2(value); break; | 180 | case "colorStop2": this.setColorStop2(value); break; |
181 | case "colorStop3": this.setColorStop3(value); break; | 181 | case "colorStop3": this.setColorStop3(value); break; |
182 | case "colorStop4": this.setColorStop4(value); break; | 182 | case "colorStop4": this.setColorStop4(value); break; |
183 | case "angle": this.setAngle(value); break; | ||
184 | } | 183 | } |
185 | 184 | ||
186 | //this.updateValuesInShader(); | 185 | //this.updateValuesInShader(); |
diff --git a/js/lib/rdge/materials/uber-material.js b/js/lib/rdge/materials/uber-material.js index 6de74495..0fef78f6 100755 --- a/js/lib/rdge/materials/uber-material.js +++ b/js/lib/rdge/materials/uber-material.js | |||
@@ -247,9 +247,9 @@ var UberMaterial = function UberMaterial() { | |||
247 | var technique = material.shaderProgram.defaultTechnique; | 247 | var technique = material.shaderProgram.defaultTechnique; |
248 | var renderer = RDGE.globals.engine.getContext().renderer; | 248 | var renderer = RDGE.globals.engine.getContext().renderer; |