diff options
-rw-r--r-- | assets/images/us_flag.png | bin | 0 -> 9946 bytes | |||
-rw-r--r-- | assets/shaders/Flag.frag.glsl | 13 | ||||
-rw-r--r-- | assets/shaders/Flag.vert.glsl | 29 | ||||
-rwxr-xr-x | js/lib/geom/geom-obj.js | 2 | ||||
-rw-r--r-- | js/lib/rdge/materials/flag-material.js | 142 | ||||
-rwxr-xr-x | js/models/materials-model.js | 3 |
6 files changed, 181 insertions, 8 deletions
diff --git a/assets/images/us_flag.png b/assets/images/us_flag.png new file mode 100644 index 00000000..1545edc2 --- /dev/null +++ b/assets/images/us_flag.png | |||
Binary files 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 @@ | |||
1 | #ifdef GL_ES | ||
2 | precision highp float; | ||
3 | #endif | ||
4 | |||
5 | uniform sampler2D u_tex0; | ||
6 | |||
7 | varying vec2 v_uv; | ||
8 | |||
9 | void main(void) | ||
10 | { | ||
11 | vec3 col = texture2D(u_tex0, v_uv).xyz; | ||
12 | gl_FragColor = vec4(col,1.0); | ||
13 | } \ 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; | |||
16 | 16 | ||
17 | // scalar uniforms | 17 | // scalar uniforms |
18 | uniform float u_time; | 18 | uniform float u_time; |
19 | uniform float u_waveWidth; | ||
20 | uniform float u_waveHeight; | ||
19 | 21 | ||
20 | // matrix uniforms | 22 | // matrix uniforms |
21 | uniform mat4 u_mvMatrix; | 23 | uniform mat4 u_mvMatrix; |
22 | uniform mat4 u_projMatrix; | 24 | uniform mat4 u_projMatrix; |
23 | uniform mat4 u_worldMatrix; | 25 | uniform mat4 u_worldMatrix; |
24 | 26 | ||
27 | // varying variables | ||
28 | varying vec2 v_uv; | ||
29 | |||
25 | void main() | 30 | void main() |
26 | { | 31 | { |
27 | float angle = (u_time%360)*2; | 32 | float pi = 3.14159; |
28 | 33 | float angle = mod(u_time, pi)*2.0; | |
29 | a_pos.z = sin( a_pos.x + angle); | 34 | |
30 | a_pos.z += sin( a_pos.y/2 + angle); | 35 | vec3 v = a_pos; |
31 | a_pos.z *= a_pos.x * 0.09; | 36 | v_uv = texcoord; |
32 | gl_Position = u_projMatrix * u_mvMatrix * vec4(a_pos,1.0) ; | 37 | |
33 | 38 | vec2 pos = texcoord; | |
34 | gl_FragColor = v_color; | 39 | float tmp = pos.x; pos.x = pos.y; pos.y = tmp; |
40 | pos.x = pos.x * 1.0*pi * u_waveWidth; | ||
41 | pos.y = pos.y * 1.0*pi * u_waveWidth; | ||
42 | |||
43 | v.z = sin( pos.x + angle); | ||
44 | v.z += sin( pos.y/2.0 + angle); | ||
45 | v.z *= v.y * 0.09 * u_waveHeight; | ||
46 | |||
47 | gl_Position = u_projMatrix * u_mvMatrix * vec4(v,1.0) ; | ||
35 | } | 48 | } |
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() { | |||
309 | case "tunnel": | 309 | case "tunnel": |
310 | case "reliefTunnel": | 310 | case "reliefTunnel": |
311 | case "squareTunnel": | 311 | case "squareTunnel": |
312 | case "flag": | ||
312 | case "twist": | 313 | case "twist": |
313 | case "fly": | 314 | case "fly": |
314 | case "julia": | 315 | case "julia": |
@@ -382,6 +383,7 @@ var GeomObj = function GLGeomObj() { | |||
382 | case "tunnel": | 383 | case "tunnel": |
383 | case "reliefTunnel": | 384 | case "reliefTunnel": |
384 | case "squareTunnel": | 385 | case "squareTunnel": |
386 | case "flag": | ||
385 | case "twist": | 387 | case "twist": |
386 | case "fly": | 388 | case "fly": |
387 | case "julia": | 389 | 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 @@ | |||
1 | /* <copyright> | ||
2 | This file contains proprietary software owned by Motorola Mobility, Inc.<br/> | ||
3 | No rights, expressed or implied, whatsoever to this software are provided by Motorola Mobility, Inc. hereunder.<br/> | ||
4 | (c) Copyright 2011 Motorola Mobility, Inc. All Rights Reserved. | ||
5 | </copyright> */ | ||
6 | |||
7 | |||
8 | var PulseMaterial = require("js/lib/rdge/materials/pulse-material").PulseMaterial; | ||
9 | var Texture = require("js/lib/rdge/texture").Texture; | ||
10 | |||
11 | var FlagMaterial = function FlagMaterial() { | ||
12 | /////////////////////////////////////////////////////////////////////// | ||
13 | // Instance variables | ||
14 | /////////////////////////////////////////////////////////////////////// | ||
15 | this._name = "FlagMaterial"; | ||
16 | this._shaderName = "flag"; | ||
17 | |||
18 | this._texMap = 'assets/images/us_flag.png'; | ||
19 | |||
20 | this._time = 0.0; | ||
21 | this._dTime = 0.1; | ||
22 | |||
23 | this._defaultWaveWidth = 1.0; | ||
24 | this._defaultWaveHeight = 1.0; | ||
25 | |||
26 | /////////////////////////////////////////////////////////////////////// | ||
27 | // Properties | ||
28 | /////////////////////////////////////////////////////////////////////// | ||
29 | // all defined in parent PulseMaterial.js | ||
30 | // load the local default value | ||
31 | this._propNames = ["texmap", "wavewidth", "waveheight" ]; | ||
32 | this._propLabels = ["Texture map", "Wave Width", "Wave Height" ]; | ||
33 | this._propTypes = ["file", "float", "float" ]; | ||
34 | this._propValues = []; | ||
35 | |||
36 | this._propValues[ this._propNames[0] ] = this._texMap.slice(0); | ||
37 | this._propValues[ this._propNames[1] ] = this._defaultWaveWidth; | ||
38 | this._propValues[ this._propNames[2] ] = this._defaultWaveHeight; | ||
39 | |||
40 | /////////////////////////////////////////////////////////////////////// | ||
41 | // Methods | ||
42 | /////////////////////////////////////////////////////////////////////// | ||
43 | // duplcate method requirde | ||
44 | this.dup = function( world ) { | ||
45 | // allocate a new uber material | ||
46 | var newMat = new FlagMaterial(); | ||
47 | |||
48 | // copy over the current values; | ||
49 | var propNames = [], propValues = [], propTypes = [], propLabels = []; | ||
50 | this.getAllProperties( propNames, propValues, propTypes, propLabels); | ||
51 | var n = propNames.length; | ||
52 | for (var i=0; i<n; i++) { | ||
53 | newMat.setProperty( propNames[i], propValues[i] ); | ||
54 | } | ||
55 | |||
56 | return newMat; | ||
57 | }; | ||
58 | |||
59 | this.init = function( world ) | ||
60 | { | ||
61 | // save the world | ||
62 | if (world) this.setWorld( world ); | ||
63 | |||
64 | // set up the shader | ||
65 | this._shader = new jshader(); | ||
66 | this._shader.def = flagMaterialDef; | ||
67 | this._shader.init(); | ||
68 | |||
69 | // set up the material node | ||
70 | this._materialNode = createMaterialNode("flagMaterial" + "_" + world.generateUniqueNodeID()); | ||
71 | this._materialNode.setShader(this._shader); | ||
72 | |||
73 | this._time = 0; | ||
74 | if (this._shader && this._shader['default']) { | ||
75 | this._shader['default'].u_time.set( [this._time] ); | ||
76 | this._shader['default'].u_waveWidth.set( [this._propValues[ this._propNames[1] ]] ); | ||
77 | this._shader['default'].u_waveHeight.set( [this._propValues[ this._propNames[2] ]] ); | ||
78 | } | ||
79 | |||
80 | // set up the texture | ||
81 | var texMapName = this._propValues[this._propNames[0]]; | ||
82 | this._glTex = new Texture( world, texMapName ); | ||
83 | |||
84 | // set the shader values in the shader | ||
85 | this.updateTexture(); | ||
86 | this.update( 0 ); | ||
87 | } | ||
88 | }; | ||
89 | |||
90 | /////////////////////////////////////////////////////////////////////////////////////// | ||
91 | // RDGE shader | ||
92 | |||
93 | // shader spec (can also be loaded from a .JSON file, or constructed at runtime) | ||
94 | var flagMaterialDef = | ||
95 | {'shaders': | ||
96 | { | ||
97 | 'defaultVShader':"assets/shaders/Flag.vert.glsl", | ||
98 | 'defaultFShader':"assets/shaders/Flag.frag.glsl" | ||
99 | }, | ||
100 | 'techniques': | ||
101 | { | ||
102 | 'default': | ||
103 | [ | ||
104 | { | ||
105 | 'vshader' : 'defaultVShader', | ||
106 | 'fshader' : 'defaultFShader', | ||
107 | // attributes | ||
108 | 'attributes' : | ||
109 | { | ||
110 | 'vert' : { 'type' : 'vec3' }, | ||
111 | 'normal' : { 'type' : 'vec3' }, | ||
112 | 'texcoord' : { 'type' : 'vec2' } | ||
113 | }, | ||
114 | // parameters | ||
115 | 'params' : | ||
116 | { | ||
117 | 'u_tex0': { 'type' : 'tex2d' }, | ||
118 | 'u_time' : { 'type' : 'float' }, | ||
119 | 'u_waveWidth' : { 'type' : 'float' }, | ||
120 | 'u_waveHeight' : { 'type' : 'float' } | ||
121 | }, | ||
122 | |||
123 | // render states | ||
124 | 'states' : | ||
125 | { | ||
126 | 'depthEnable' : true, | ||
127 | 'offset':[1.0, 0.1] | ||
128 | } | ||
129 | } | ||
130 | ] | ||
131 | } | ||
132 | }; | ||
133 | |||
134 | FlagMaterial.prototype = new PulseMaterial(); | ||
135 | |||
136 | if (typeof exports === "object") { | ||
137 | exports.FlagMaterial = FlagMaterial; | ||
138 | } | ||
139 | |||
140 | |||
141 | |||
142 | |||
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 |