diff options
author | hwc487 | 2012-05-22 08:38:38 -0700 |
---|---|---|
committer | hwc487 | 2012-05-22 08:38:38 -0700 |
commit | cc3b66f817c9d72ca247d5ff789a08ec5b57a2b5 (patch) | |
tree | 229a3d92b2fa86c32b6d47134b843880e909bead | |
parent | dc92188fef67d7a2032173d7746fbc16a951a366 (diff) | |
download | ninja-cc3b66f817c9d72ca247d5ff789a08ec5b57a2b5.tar.gz |
Editable material properties
-rwxr-xr-x | assets/shaders/test_fshader.glsl | 2 | ||||
-rwxr-xr-x | js/lib/drawing/world.js | 20 | ||||
-rwxr-xr-x | js/lib/rdge/materials/bump-metal-material.js | 58 | ||||
-rwxr-xr-x | js/lib/rdge/materials/uber-material.js | 1 | ||||
-rwxr-xr-x | js/panels/Materials/materials-popup.reel/materials-popup.js | 12 |
5 files changed, 55 insertions, 38 deletions
diff --git a/assets/shaders/test_fshader.glsl b/assets/shaders/test_fshader.glsl index 629d1878..229b8989 100755 --- a/assets/shaders/test_fshader.glsl +++ b/assets/shaders/test_fshader.glsl | |||
@@ -32,7 +32,7 @@ uniform sampler2D depthMap; | |||
32 | uniform vec4 u_matAmbient; | 32 | uniform vec4 u_matAmbient; |
33 | uniform vec4 u_matDiffuse; | 33 | uniform vec4 u_matDiffuse; |
34 | uniform vec4 u_matSpecular; | 34 | uniform vec4 u_matSpecular; |
35 | uniform float u_matShininess; | 35 | //uniform float u_matShininess; |
36 | uniform vec4 u_matEmission; | 36 | uniform vec4 u_matEmission; |
37 | uniform float u_renderGlow; | 37 | uniform float u_renderGlow; |
38 | 38 | ||
diff --git a/js/lib/drawing/world.js b/js/lib/drawing/world.js index 14e63f4a..3c93b2b7 100755 --- a/js/lib/drawing/world.js +++ b/js/lib/drawing/world.js | |||
@@ -180,14 +180,14 @@ var World = function GLWorld( canvas, use3D, preserveDrawingBuffer ) { | |||
180 | 180 | ||
181 | // create some lights | 181 | // create some lights |
182 | // light 1 | 182 | // light 1 |
183 | this.light = RDGE.createLightNode("myLight"); | 183 | // this.light = RDGE.createLightNode("myLight"); |
184 | this.light.setPosition([0,0,1.2]); | 184 | // this.light.setPosition([0,0,1.2]); |
185 | this.light.setDiffuseColor([0.75,0.9,1.0,1.0]); | 185 | // this.light.setDiffuseColor([0.75,0.9,1.0,1.0]); |
186 | 186 | ||
187 | // light 2 | 187 | // light 2 |
188 | this.light2 = RDGE.createLightNode("myLight2"); | 188 | // this.light2 = RDGE.createLightNode("myLight2"); |
189 | this.light2.setPosition([-0.5,0,1.2]); | 189 | // this.light2.setPosition([-0.5,0,1.2]); |
190 | this.light2.setDiffuseColor([1.0,0.9,0.75,1.0]); | 190 | // this.light2.setDiffuseColor([1.0,0.9,0.75,1.0]); |
191 | 191 | ||
192 | // create a light transform | 192 | // create a light transform |
193 | var lightTr = RDGE.createTransformNode("lightTr"); | 193 | var lightTr = RDGE.createTransformNode("lightTr"); |
@@ -196,8 +196,8 @@ var World = function GLWorld( canvas, use3D, preserveDrawingBuffer ) { | |||
196 | lightTr.attachMaterial(RDGE.createMaterialNode("lights")); | 196 | lightTr.attachMaterial(RDGE.createMaterialNode("lights")); |
197 | 197 | ||
198 | // enable light channels 1, 2 - channel 0 is used by the default shader | 198 | // enable light channels 1, 2 - channel 0 is used by the default shader |
199 | lightTr.materialNode.enableLightChannel(1, this.light); | 199 | // lightTr.materialNode.enableLightChannel(1, this.light); |
200 | lightTr.materialNode.enableLightChannel(2, this.light2); | 200 | // lightTr.materialNode.enableLightChannel(2, this.light2); |
201 | 201 | ||
202 | // all added objects are parented to the light node | 202 | // all added objects are parented to the light node |
203 | this._rootNode = lightTr; | 203 | this._rootNode = lightTr; |
@@ -225,8 +225,8 @@ var World = function GLWorld( canvas, use3D, preserveDrawingBuffer ) { | |||
225 | RDGE.rdgeGlobalParameters.u_light0Pos.set([5 * Math.cos(this.elapsed), 5 * Math.sin(this.elapsed), 20]); | 225 | RDGE.rdgeGlobalParameters.u_light0Pos.set([5 * Math.cos(this.elapsed), 5 * Math.sin(this.elapsed), 20]); |
226 | 226 | ||
227 | // orbit the light nodes around the boxes | 227 | // orbit the light nodes around the boxes |
228 | this.light.setPosition([1.2*Math.cos(this.elapsed*2.0), 1.2*Math.sin(this.elapsed*2.0), 1.2*Math.cos(this.elapsed*2.0)]); | 228 | // this.light.setPosition([1.2*Math.cos(this.elapsed*2.0), 1.2*Math.sin(this.elapsed*2.0), 1.2*Math.cos(this.elapsed*2.0)]); |
229 | this.light2.setPosition([-1.2*Math.cos(this.elapsed*2.0), 1.2*Math.sin(this.elapsed*2.0), -1.2*Math.cos(this.elapsed)]); | 229 | // this.light2.setPosition([-1.2*Math.cos(this.elapsed*2.0), 1.2*Math.sin(this.elapsed*2.0), -1.2*Math.cos(this.elapsed)]); |
230 | } | 230 | } |
231 | 231 | ||
232 | this.updateMaterials( this.getGeomRoot(), this.elapsed ); | 232 | this.updateMaterials( this.getGeomRoot(), this.elapsed ); |
diff --git a/js/lib/rdge/materials/bump-metal-material.js b/js/lib/rdge/materials/bump-metal-material.js index 4bc5dfe8..4d19c9c1 100755 --- a/js/lib/rdge/materials/bump-metal-material.js +++ b/js/lib/rdge/materials/bump-metal-material.js | |||
@@ -28,6 +28,8 @@ var BumpMetalMaterial = function BumpMetalMaterial() { | |||
28 | // keep the array of initialized textures | 28 | // keep the array of initialized textures |
29 | this._textures = []; | 29 | this._textures = []; |
30 | 30 | ||
31 | this._speed = 1.0; | ||
32 | |||
31 | /////////////////////////////////////////////////////////////////////// | 33 | /////////////////////////////////////////////////////////////////////// |
32 | // Property Accessors | 34 | // Property Accessors |
33 | /////////////////////////////////////////////////////////////////////// | 35 | /////////////////////////////////////////////////////////////////////// |
@@ -67,15 +69,14 @@ var BumpMetalMaterial = function BumpMetalMaterial() { | |||
67 | /////////////////////////////////////////////////////////////////////// | 69 | /////////////////////////////////////////////////////////////////////// |
68 | // Material Property Accessors | 70 | // Material Property Accessors |
69 | /////////////////////////////////////////////////////////////////////// | 71 | /////////////////////////////////////////////////////////////////////// |
70 | this._propNames = ["lightDiff", "diffuseTexture", "normalMap", "specularTexture"]; | 72 | this._propNames = ["lightDiff", "diffuseTexture", "normalMap" ]; |
71 | this._propLabels = ["Diffuse Color", "Diffuse Map", "Bump Map", "Specular Map"]; | 73 | this._propLabels = ["Diffuse Color", "Diffuse Map", "Bump Map" ]; |
72 | this._propTypes = ["color", "file", "file", "file"]; | 74 | this._propTypes = ["color", "file", "file" ]; |
73 | this._propValues = []; | 75 | this._propValues = []; |
74 | 76 | ||
75 | this._propValues[ this._propNames[0] ] = this._lightDiff.slice(0); | 77 | this._propValues[ this._propNames[0] ] = this._lightDiff.slice(0); |
76 | this._propValues[ this._propNames[1] ] = this._diffuseTexture.slice(0); | 78 | this._propValues[ this._propNames[1] ] = this._diffuseTexture.slice(0); |
77 | this._propValues[ this._propNames[2] ] = this._normalTexture.slice(0); | 79 | this._propValues[ this._propNames[2] ] = this._normalTexture.slice(0); |
78 | this._propValues[ this._propNames[3] ] = this._specularTexture.slice(0); | ||
79 | 80 | ||
80 | // TODO - shader techniques are not all named the same, i.e., FlatMaterial uses "colorMe" and BrickMaterial uses "default" | 81 | // TODO - shader techniques are not all named the same, i.e., FlatMaterial uses "colorMe" and BrickMaterial uses "default" |
81 | this.setProperty = function( prop, value ) | 82 | this.setProperty = function( prop, value ) |
@@ -127,7 +128,6 @@ var BumpMetalMaterial = function BumpMetalMaterial() { | |||
127 | this._materialNode = RDGE.createMaterialNode( this.getShaderName() + "_" + world.generateUniqueNodeID() ); | 128 | this._materialNode = RDGE.createMaterialNode( this.getShaderName() + "_" + world.generateUniqueNodeID() ); |
128 | this._materialNode.setShader(this._shader); | 129 | this._materialNode.setShader(this._shader); |
129 | 130 | ||
130 | // DEBUG CODE | ||
131 | this.initTextures(); | 131 | this.initTextures(); |
132 | }; | 132 | }; |
133 | 133 | ||
@@ -137,8 +137,14 @@ var BumpMetalMaterial = function BumpMetalMaterial() { | |||
137 | if (dstWorld) | 137 | if (dstWorld) |
138 | { | 138 | { |
139 | var texMapName = this._propValues[this._propNames[index]]; | 139 | var texMapName = this._propValues[this._propNames[index]]; |
140 | var texture = new Texture( dstWorld, texMapName ); | 140 | if (texMapName) |
141 | this._textures[index] = texture; | 141 | { |
142 | var texture = new Texture( dstWorld, texMapName ); | ||
143 | this._textures[index] = texture; | ||
144 | } | ||
145 | else | ||
146 | this._textures[index] = null; | ||
147 | |||
142 | this.updateTexture( index ); | 148 | this.updateTexture( index ); |
143 | } | 149 | } |
144 | } | 150 | } |
@@ -165,24 +171,25 @@ var BumpMetalMaterial = function BumpMetalMaterial() { | |||
165 | var renderer = RDGE.globals.engine.getContext().renderer; | 171 | var renderer = RDGE.globals.engine.getContext().renderer; |
166 | if (renderer && technique) | 172 | if (renderer && technique) |
167 | { | 173 | { |
168 | var glTex = this._textures[ index ]; | 174 | var glTex = this._textures[ index ]; |
169 | if (glTex) | 175 | var tex; |
170 | { | 176 | if (glTex) |
171 | if (glTex.isAnimated()) | 177 | { |
172 | glTex.render(); | 178 | if (glTex.isAnimated()) |
173 | 179 | glTex.render(); | |
174 | var tex = glTex.getTexture(); | 180 | |
175 | if (tex) | 181 | tex = glTex.getTexture(); |
176 | { | 182 | } |
177 | switch (index) | 183 | |
178 | { | 184 | { |
179 | case 1: technique.u_colMap.set( tex ); break; | 185 | switch (index) |
180 | case 2: technique.u_normalMap.set( tex ); break; | 186 | { |
181 | case 3: technique.u_glowMap.set( tex ); break; | 187 | case 1: technique.u_colMap.set( tex ); break; |
182 | default: console.log( "invalid map index in BumpMetalMaterial, " + index ); | 188 | case 2: technique.u_normalMap.set( tex ); break; |
183 | } | 189 | case 3: technique.u_glowMap.set( tex ); break; |
184 | } | 190 | default: console.log( "invalid map index in BumpMetalMaterial, " + index ); |
185 | } | 191 | } |
192 | } | ||
186 | } | 193 | } |
187 | } | 194 | } |
188 | }; | 195 | }; |
@@ -291,7 +298,6 @@ var bumpMetalMaterialDef = bumpMetalShaderDef = | |||
291 | 'params' : | 298 | 'params' : |
292 | { | 299 | { |
293 | 'u_light0Diff' : { 'type' : 'vec4' }, | 300 | 'u_light0Diff' : { 'type' : 'vec4' }, |
294 | //'u_matDiffuse' : { 'type' : 'vec4' } | ||
295 | 'u_colMap': { 'type' : 'tex2d' }, | 301 | 'u_colMap': { 'type' : 'tex2d' }, |
296 | 'u_normalMap': { 'type' : 'tex2d' }, | 302 | 'u_normalMap': { 'type' : 'tex2d' }, |
297 | 'u_glowMap': { 'type' : 'tex2d' } | 303 | 'u_glowMap': { 'type' : 'tex2d' } |
diff --git a/js/lib/rdge/materials/uber-material.js b/js/lib/rdge/materials/uber-material.js index 9d0cc564..6de74495 100755 --- a/js/lib/rdge/materials/uber-material.js +++ b/js/lib/rdge/materials/uber-material.js | |||
@@ -180,6 +180,7 @@ var UberMaterial = function UberMaterial() { | |||
180 | this.updateAmbientColor = function () { | 180 | this.updateAmbientColor = function () { |
181 | this._ambientColor = this._propValues['ambientColor'].slice(0); | 181 | this._ambientColor = this._propValues['ambientColor'].slice(0); |
182 | var material = this._materialNode; | 182 | var material = this._materialNode; |
183 | console.log( "ambient color: " + this._ambientColor ); | ||
183 | if (material) { | 184 | if (material) { |
184 | var technique = material.shaderProgram.defaultTechnique; | 185 | var technique = material.shaderProgram.defaultTechnique; |
185 | technique.u_ambientColor.set(this._ambientColor); | 186 | technique.u_ambientColor.set(this._ambientColor); |
diff --git a/js/panels/Materials/materials-popup.reel/materials-popup.js b/js/panels/Materials/materials-popup.reel/materials-popup.js index c54b311e..1e92e144 100755 --- a/js/panels/Materials/materials-popup.reel/materials-popup.js +++ b/js/panels/Materials/materials-popup.reel/materials-popup.js | |||
@@ -18,6 +18,8 @@ exports.MaterialsPopup = Montage.create(Component, { | |||
18 | value: "" | 18 | value: "" |
19 | }, | 19 | }, |
20 | 20 | ||
21 | _useSelection: { value: false, enumerable: true }, | ||
22 | |||
21 | captureAction: { | 23 | captureAction: { |
22 | value:function(event) { | 24 | value:function(event) { |