From 3fb0f87a66bc42c81058098feb3d62cd6f0500b2 Mon Sep 17 00:00:00 2001 From: alteredq Date: Wed, 5 Sep 2012 18:34:46 +0200 Subject: [PATCH] Fleshed out more handling of normal mapped material in SceneLoader. Also extended example to show this. --- build/three.min.js | 5 +++-- examples/scenes/test_scene.js | 34 ++++++++++++++++++++++++++++++++ examples/webgl_loader_scene.html | 2 +- src/loaders/SceneLoader.js | 22 +++++++++++++++++++-- 4 files changed, 58 insertions(+), 5 deletions(-) diff --git a/build/three.min.js b/build/three.min.js index 06c17bdd88..ff0812f8ec 100644 --- a/build/three.min.js +++ b/build/three.min.js @@ -197,8 +197,9 @@ n.metadata=C.metadata;n&&E.createModel(n,g(j),"")}}for(s in C.textures){j=C.text C.urlBaseType),j.mapping,a(1));if(THREE[j.minFilter]!==void 0)n.minFilter=THREE[j.minFilter];if(THREE[j.magFilter]!==void 0)n.magFilter=THREE[j.magFilter];if(j.anisotropy)n.anisotropy=j.anisotropy;if(j.repeat){n.repeat.set(j.repeat[0],j.repeat[1]);if(j.repeat[0]!==1)n.wrapS=THREE.RepeatWrapping;if(j.repeat[1]!==1)n.wrapT=THREE.RepeatWrapping}j.offset&&n.offset.set(j.offset[0],j.offset[1]);if(j.wrap){M={repeat:THREE.RepeatWrapping,mirror:THREE.MirroredRepeatWrapping};if(M[j.wrap[0]]!==void 0)n.wrapS= M[j.wrap[0]];if(M[j.wrap[1]]!==void 0)n.wrapT=M[j.wrap[1]]}}J.textures[s]=n}for(o in C.materials){u=C.materials[o];for(I in u.parameters)if(I==="envMap"||I==="map"||I==="lightMap"||I==="bumpMap")u.parameters[I]=J.textures[u.parameters[I]];else if(I==="shading")u.parameters[I]=u.parameters[I]=="flat"?THREE.FlatShading:THREE.SmoothShading;else if(I==="blending")u.parameters[I]=u.parameters[I]in THREE?THREE[u.parameters[I]]:THREE.NormalBlending;else if(I==="combine")u.parameters[I]=u.parameters[I]== "MixOperation"?THREE.MixOperation:THREE.MultiplyOperation;else if(I==="vertexColors")if(u.parameters[I]=="face")u.parameters[I]=THREE.FaceColors;else if(u.parameters[I])u.parameters[I]=THREE.VertexColors;if(u.parameters.opacity!==void 0&&u.parameters.opacity<1)u.parameters.transparent=true;if(u.parameters.normalMap){s=THREE.ShaderUtils.lib.normal;a=THREE.UniformsUtils.clone(s.uniforms);j=u.parameters.color;n=u.parameters.specular;M=u.parameters.ambient;c=u.parameters.shininess;a.tNormal.value=J.textures[u.parameters.normalMap]; -u.parameters.normalMapFactor&&a.uNormalScale.value.set(u.parameters.normalMapFactor,u.parameters.normalMapFactor);if(u.parameters.map){a.tDiffuse.value=u.parameters.map;a.enableDiffuse.value=true}if(u.parameters.lightMap){a.tAO.value=u.parameters.lightMap;a.enableAO.value=true}if(u.parameters.specularMap){a.tSpecular.value=J.textures[u.parameters.specularMap];a.enableSpecular.value=true}a.uDiffuseColor.value.setHex(j);a.uSpecularColor.value.setHex(n);a.uAmbientColor.value.setHex(M);a.uShininess.value= -c;if(u.parameters.opacity)a.uOpacity.value=u.parameters.opacity;L=new THREE.ShaderMaterial({fragmentShader:s.fragmentShader,vertexShader:s.vertexShader,uniforms:a,lights:true,fog:true})}else L=new THREE[u.type](u.parameters);J.materials[o]=L}f(J.scene,C.objects);i.callbackSync(J);h()};THREE.TextureLoader=function(){THREE.EventTarget.call(this);this.crossOrigin=null}; +u.parameters.normalScale&&a.uNormalScale.value.set(u.parameters.normalScale[0],u.parameters.normalScale[1]);if(u.parameters.map){a.tDiffuse.value=u.parameters.map;a.enableDiffuse.value=true}if(u.parameters.envMap){a.tCube.value=u.parameters.envMap;a.enableReflection.value=true;a.uReflectivity.value=u.parameters.reflectivity}if(u.parameters.lightMap){a.tAO.value=u.parameters.lightMap;a.enableAO.value=true}if(u.parameters.specularMap){a.tSpecular.value=J.textures[u.parameters.specularMap];a.enableSpecular.value= +true}if(u.parameters.displacementMap){a.tDisplacement.value=J.textures[u.parameters.displacementMap];a.enableDisplacement.value=true;a.uDisplacementBias.value=u.parameters.displacementBias;a.uDisplacementScale.value=u.parameters.displacementScale}a.uDiffuseColor.value.setHex(j);a.uSpecularColor.value.setHex(n);a.uAmbientColor.value.setHex(M);a.uShininess.value=c;if(u.parameters.opacity)a.uOpacity.value=u.parameters.opacity;L=new THREE.ShaderMaterial({fragmentShader:s.fragmentShader,vertexShader:s.vertexShader, +uniforms:a,lights:true,fog:true})}else L=new THREE[u.type](u.parameters);J.materials[o]=L}f(J.scene,C.objects);i.callbackSync(J);h()};THREE.TextureLoader=function(){THREE.EventTarget.call(this);this.crossOrigin=null}; THREE.TextureLoader.prototype={constructor:THREE.TextureLoader,load:function(a){var b=this,c=new Image;c.addEventListener("load",function(){var a=new THREE.Texture(c);a.needsUpdate=true;b.dispatchEvent({type:"load",content:a})},false);c.addEventListener("error",function(){b.dispatchEvent({type:"error",message:"Couldn't load URL ["+a+"]"})},false);if(b.crossOrigin)c.crossOrigin=b.crossOrigin;c.src=a}}; THREE.Material=function(){this.id=THREE.MaterialCount++;this.name="";this.side=THREE.FrontSide;this.opacity=1;this.transparent=false;this.blending=THREE.NormalBlending;this.blendSrc=THREE.SrcAlphaFactor;this.blendDst=THREE.OneMinusSrcAlphaFactor;this.blendEquation=THREE.AddEquation;this.depthWrite=this.depthTest=true;this.polygonOffset=false;this.alphaTest=this.polygonOffsetUnits=this.polygonOffsetFactor=0;this.overdraw=false;this.needsUpdate=this.visible=true}; THREE.Material.prototype.setValues=function(a){if(a!==void 0)for(var b in a){var c=a[b];if(c===void 0)console.warn("THREE.Material: '"+b+"' parameter is undefined.");else if(b in this){var d=this[b];d instanceof THREE.Color&&c instanceof THREE.Color?d.copy(c):d instanceof THREE.Color&&typeof c==="number"?d.setHex(c):d instanceof THREE.Vector3&&c instanceof THREE.Vector3?d.copy(c):this[b]=c}}}; diff --git a/examples/scenes/test_scene.js b/examples/scenes/test_scene.js index 00dd7fc126..1b2e4d687c 100644 --- a/examples/scenes/test_scene.js +++ b/examples/scenes/test_scene.js @@ -151,6 +151,15 @@ "visible" : true }, + "ninja" : { + "geometry" : "NinjaLo", + "materials": [ "phong_normal" ], + "position" : [ 75, 10, -30 ], + "rotation" : [ 0, -0.5, 0 ], + "scale" : [ 1.25, 1.25, 1.25 ], + "visible" : true + }, + "quad_bg" : { "geometry" : "quad", "materials": [ "textured_bg" ], @@ -269,6 +278,11 @@ "url" : "obj/walt/WaltHead_bin.js" }, + "NinjaLo": { + "type": "bin_mesh", + "url" : "obj/ninja/NinjaLo_bin.js" + }, + "veyron": { "type": "bin_mesh", "url" : "obj/veyron/VeyronNoUv_bin.js" @@ -341,6 +355,11 @@ "parameters": { "color": 16711680, "specular": 16711680, "shininess": 25, "bumpMap": "texture_bump", "bumpScale": -0.75 } }, + "phong_normal": { + "type": "MeshPhongMaterial", + "parameters": { "color": 1118481, "specular": 16777215, "shininess": 25, "envMap": "cube_reflection", "reflectivity": 0.1, "lightMap": "texture_ao", "normalMap": "texture_normal", "normalScale": [ 1, -1 ], "displacementMap": "texture_displacement", "displacementScale": 2.436143, "displacementBias": -0.428408 } + }, + "lambert_green": { "type": "MeshLambertMaterial", "parameters": { "color": 30481, "blending": "AdditiveBlending", "transparent": true } @@ -446,6 +465,21 @@ "anisotropy": 4 }, + "texture_normal": { + "url": "textures/normal/ninja/normal.jpg", + "anisotropy": 4 + }, + + "texture_ao": { + "url": "textures/normal/ninja/ao.jpg", + "anisotropy": 4 + }, + + "texture_displacement": { + "url": "textures/normal/ninja/displacement.jpg", + "anisotropy": 4 + }, + "texture_minecraft": { "url": "textures/minecraft/grass.png", "magFilter": "NearestFilter", diff --git a/examples/webgl_loader_scene.html b/examples/webgl_loader_scene.html index c348c091f9..5dfdbb5286 100644 --- a/examples/webgl_loader_scene.html +++ b/examples/webgl_loader_scene.html @@ -192,7 +192,7 @@ for ( m in result.materials ) { material = result.materials[ m ]; - if ( ! ( material instanceof THREE.MeshFaceMaterial ) ) { + if ( ! ( material instanceof THREE.MeshFaceMaterial || material instanceof THREE.ShaderMaterial ) ) { if( !material.program ) { diff --git a/src/loaders/SceneLoader.js b/src/loaders/SceneLoader.js index df226248ae..34d6daab59 100644 --- a/src/loaders/SceneLoader.js +++ b/src/loaders/SceneLoader.js @@ -728,9 +728,9 @@ THREE.SceneLoader.prototype.parse = function ( json, callbackFinished, url ) { uniforms[ "tNormal" ].value = result.textures[ m.parameters.normalMap ]; - if ( m.parameters.normalMapFactor ) { + if ( m.parameters.normalScale ) { - uniforms[ "uNormalScale" ].value.set( m.parameters.normalMapFactor, m.parameters.normalMapFactor ); + uniforms[ "uNormalScale" ].value.set( m.parameters.normalScale[ 0 ], m.parameters.normalScale[ 1 ] ); } @@ -741,6 +741,14 @@ THREE.SceneLoader.prototype.parse = function ( json, callbackFinished, url ) { } + if ( m.parameters.envMap ) { + + uniforms[ "tCube" ].value = m.parameters.envMap; + uniforms[ "enableReflection" ].value = true; + uniforms[ "uReflectivity" ].value = m.parameters.reflectivity; + + } + if ( m.parameters.lightMap ) { uniforms[ "tAO" ].value = m.parameters.lightMap; @@ -755,6 +763,16 @@ THREE.SceneLoader.prototype.parse = function ( json, callbackFinished, url ) { } + if ( m.parameters.displacementMap ) { + + uniforms[ "tDisplacement" ].value = result.textures[ m.parameters.displacementMap ]; + uniforms[ "enableDisplacement" ].value = true; + + uniforms[ "uDisplacementBias" ].value = m.parameters.displacementBias; + uniforms[ "uDisplacementScale" ].value = m.parameters.displacementScale; + + } + uniforms[ "uDiffuseColor" ].value.setHex( diffuse ); uniforms[ "uSpecularColor" ].value.setHex( specular ); uniforms[ "uAmbientColor" ].value.setHex( ambient ); -- GitLab