Added wrap around lighting to normal map shader.

Also refactored a bit regular Phong shader and refreshed Lee-Perry normal map example to be less zombie-like.

examples/webgl_materials_normalmap2.html

@@ -88,7 +88,7 @@
 
 				// CAMERA
 
-				camera = new THREE.PerspectiveCamera( 50, window.innerWidth / window.innerHeight, 1, 10000 );
+				camera = new THREE.PerspectiveCamera( 45, window.innerWidth / window.innerHeight, 1, 10000 );
 				camera.position.z = 900;
 				scene.add( camera );
 
@@ -97,7 +97,7 @@
 				ambientLight = new THREE.AmbientLight( 0x444444 );
 				scene.add( ambientLight );
 
-				pointLight = new THREE.PointLight( 0xffffff );
+				pointLight = new THREE.PointLight( 0xffffff, 1.25, 1000 );
 				pointLight.position.set( 0, 0, 600 );
 
 				scene.add( pointLight );
@@ -108,13 +108,13 @@
 
 				// material parameters
 
-				var ambient = 0x331111, diffuse = 0xbbbbbb, specular = 0x080808, shininess = 30;
+				var ambient = 0x111111, diffuse = 0xbbbbbb, specular = 0x090909, shininess = 30;
 
 				var shader = THREE.ShaderUtils.lib[ "normal" ];
 				var uniforms = THREE.UniformsUtils.clone( shader.uniforms );
 
 				uniforms[ "tNormal" ].texture = THREE.ImageUtils.loadTexture( "obj/leeperrysmith/Infinite-Level_02_Tangent_SmoothUV.jpg" );
-				uniforms[ "uNormalScale" ].value = - 0.75;
+				uniforms[ "uNormalScale" ].value = - 0.85;
 
 				uniforms[ "tDiffuse" ].texture = THREE.ImageUtils.loadTexture( "obj/leeperrysmith/Map-COL.jpg" );
 
@@ -128,9 +128,13 @@
 
 				uniforms[ "uShininess" ].value = shininess;
 
+				uniforms[ "wrapRGB" ].value.set( 0.575, 0.5, 0.5 );
+
 				var parameters = { fragmentShader: shader.fragmentShader, vertexShader: shader.vertexShader, uniforms: uniforms, lights: true };
 				var material = new THREE.ShaderMaterial( parameters );
 
+				material.wrapAround = true;
+
 				loader = new THREE.JSONLoader( true );
 				document.body.appendChild( loader.statusDomElement );
 

src/extras/ShaderUtils.js

@@ -134,7 +134,9 @@ THREE.ShaderUtils = {
 				"uReflectivity": { type: "f", value: 0.5 },
 
 				"uOffset" : { type: "v2", value: new THREE.Vector2( 0, 0 ) },
-				"uRepeat" : { type: "v2", value: new THREE.Vector2( 1, 1 ) }
+				"uRepeat" : { type: "v2", value: new THREE.Vector2( 1, 1 ) },
+
+				"wrapRGB"  : { type: "v3", value: new THREE.Vector3( 1, 1, 1 ) }
 
 				}
 
@@ -180,6 +182,10 @@ THREE.ShaderUtils = {
 					"varying vec4 vPointLight[ MAX_POINT_LIGHTS ];",
 				"#endif",
 
+				"#ifdef WRAP_AROUND",
+					"uniform vec3 wrapRGB;",
+				"#endif",
+
 				"varying vec3 vViewPosition;",
 
 				THREE.ShaderChunk[ "shadowmap_pars_fragment" ],
@@ -248,15 +254,31 @@ THREE.ShaderUtils = {
 						"for ( int i = 0; i < MAX_POINT_LIGHTS; i ++ ) {",
 
 							"vec3 pointVector = normalize( vPointLight[ i ].xyz );",
-							"vec3 pointHalfVector = normalize( vPointLight[ i ].xyz + viewPosition );",
 							"float pointDistance = vPointLight[ i ].w;",
 
-							"float pointDotNormalHalf = max( dot( normal, pointHalfVector ), 0.0 );",
-							"float pointDiffuseWeight = max( dot( normal, pointVector ), 0.0 );",
+							// diffuse
 
-							"float pointSpecularWeight = specularTex.r * pow( pointDotNormalHalf, uShininess );",
+							"#ifdef WRAP_AROUND",
+
+								"float pointDiffuseWeightFull = max( dot( normal, pointVector ), 0.0 );",
+								"float pointDiffuseWeightHalf = max( 0.5 * dot( normal, pointVector ) + 0.5, 0.0 );",
+
+								"vec3 pointDiffuseWeight = mix( vec3 ( pointDiffuseWeightFull ), vec3( pointDiffuseWeightHalf ), wrapRGB );",
+
+							"#else",
+
+								"float pointDiffuseWeight = max( dot( normal, pointVector ), 0.0 );",
+
+							"#endif",
 
 							"pointDiffuse += pointDistance * pointLightColor[ i ] * uDiffuseColor * pointDiffuseWeight;",
+
+							// specular
+
+							"vec3 pointHalfVector = normalize( vPointLight[ i ].xyz + viewPosition );",
+							"float pointDotNormalHalf = max( dot( normal, pointHalfVector ), 0.0 );",
+							"float pointSpecularWeight = specularTex.r * pow( pointDotNormalHalf, uShininess );",
+
 							"pointSpecular += pointDistance * pointLightColor[ i ] * uSpecularColor * pointSpecularWeight * pointDiffuseWeight;",
 
 						"}",
@@ -273,16 +295,31 @@ THREE.ShaderUtils = {
 						"for( int i = 0; i < MAX_DIR_LIGHTS; i++ ) {",
 
 							"vec4 lDirection = viewMatrix * vec4( directionalLightDirection[ i ], 0.0 );",
-
 							"vec3 dirVector = normalize( lDirection.xyz );",
-							"vec3 dirHalfVector = normalize( lDirection.xyz + viewPosition );",
 
-							"float dirDotNormalHalf = max( dot( normal, dirHalfVector ), 0.0 );",
-							"float dirDiffuseWeight = max( dot( normal, dirVector ), 0.0 );",
+							// diffuse
 
-							"float dirSpecularWeight = specularTex.r * pow( dirDotNormalHalf, uShininess );",
+							"#ifdef WRAP_AROUND",
+
+								"float directionalLightWeightingFull = max( dot( normal, dirVector ), 0.0 );",
+								"float directionalLightWeightingHalf = max( 0.5 * dot( normal, dirVector ) + 0.5, 0.0 );",
+
+								"vec3 dirDiffuseWeight = mix( vec3( directionalLightWeightingFull ), vec3( directionalLightWeightingHalf ), wrapRGB );",
+
+							"#else",
+
+								"float dirDiffuseWeight = max( dot( normal, dirVector ), 0.0 );",
+
+							"#endif",
 
 							"dirDiffuse += directionalLightColor[ i ] * uDiffuseColor * dirDiffuseWeight;",
+
+							// specular
+
+							"vec3 dirHalfVector = normalize( lDirection.xyz + viewPosition );",
+							"float dirDotNormalHalf = max( dot( normal, dirHalfVector ), 0.0 );",
+							"float dirSpecularWeight = specularTex.r * pow( dirDotNormalHalf, uShininess );",
+
 							"dirSpecular += directionalLightColor[ i ] * uSpecularColor * dirSpecularWeight * dirDiffuseWeight;",
 
 						"}",

src/renderers/WebGLShaders.js

@@ -450,9 +450,7 @@ THREE.ShaderChunk = {
 				"#ifdef PHONG_PER_PIXEL",
 
 					"vec4 lPosition = viewMatrix * vec4( pointLightPosition[ i ], 1.0 );",
-
 					"vec3 lVector = lPosition.xyz + vViewPosition.xyz;",
-
 					"float lDistance = 1.0;",
 
 					"if ( pointLightDistance[ i ] > 0.0 )",
@@ -467,10 +465,7 @@ THREE.ShaderChunk = {
 
 				"#endif",
 
-				"vec3 pointHalfVector = normalize( lVector + viewPosition );",
-				"float pointDistance = lDistance;",
-
-				"float pointDotNormalHalf = max( dot( normal, pointHalfVector ), 0.0 );",
+				// diffuse
 
 				"#ifdef WRAP_AROUND",
 
@@ -485,21 +480,25 @@ THREE.ShaderChunk = {
 
 				"#endif",
 
+				"pointDiffuse  += diffuse * pointLightColor[ i ] * pointDiffuseWeight * lDistance;",
+
+				// specular
+
+				"vec3 pointHalfVector = normalize( lVector + viewPosition );",
+				"float pointDotNormalHalf = max( dot( normal, pointHalfVector ), 0.0 );",
 				"float pointSpecularWeight = pow( pointDotNormalHalf, shininess );",
 
 				"#ifdef PHYSICALLY_BASED_SHADING",
 
 					"vec3 schlick = specular + vec3( 1.0 - specular ) * pow( dot( lVector, pointHalfVector ), 5.0 );",
-					"pointSpecular += schlick * pointLightColor[ i ] * pointSpecularWeight * pointDiffuseWeight * pointDistance;",
+					"pointSpecular += schlick * pointLightColor[ i ] * pointSpecularWeight * pointDiffuseWeight * lDistance;",
 
 				"#else",
 
-					"pointSpecular += specular * pointLightColor[ i ] * pointSpecularWeight * pointDiffuseWeight * pointDistance;",
+					"pointSpecular += specular * pointLightColor[ i ] * pointSpecularWeight * pointDiffuseWeight * lDistance;",
 
 				"#endif",
 
-				"pointDiffuse  += diffuse * pointLightColor[ i ] * pointDiffuseWeight * pointDistance;",
-
 			"}",
 
 		"#endif",
@@ -512,11 +511,9 @@ THREE.ShaderChunk = {
 			"for( int i = 0; i < MAX_DIR_LIGHTS; i ++ ) {",
 
 				"vec4 lDirection = viewMatrix * vec4( directionalLightDirection[ i ], 0.0 );",
-
 				"vec3 dirVector = normalize( lDirection.xyz );",
-				"vec3 dirHalfVector = normalize( lDirection.xyz + viewPosition );",
 
-				"float dirDotNormalHalf = max( dot( normal, dirHalfVector ), 0.0 );",
+				// diffuse
 
 				"#ifdef WRAP_AROUND",
 
@@ -531,6 +528,12 @@ THREE.ShaderChunk = {
 
 				"#endif",
 
+				"dirDiffuse  += diffuse * directionalLightColor[ i ] * dirDiffuseWeight;",
+
+				// specular
+
+				"vec3 dirHalfVector = normalize( lDirection.xyz + viewPosition );",
+				"float dirDotNormalHalf = max( dot( normal, dirHalfVector ), 0.0 );",
 				"float dirSpecularWeight = pow( dirDotNormalHalf, shininess );",
 
 				"#ifdef PHYSICALLY_BASED_SHADING",
@@ -568,8 +571,6 @@ THREE.ShaderChunk = {
 
 				"#endif",
 
-				"dirDiffuse  += diffuse * directionalLightColor[ i ] * dirDiffuseWeight;",
-
 			"}",
 
 		"#endif",