Renamed tonemapping example.

examples/index.html

@@ -102,7 +102,6 @@
 
 		var files = {
 			"webgl": [
-				"webgl_adaptive_tonemapping",
 				"webgl_animation_cloth",
 				"webgl_animation_skinning_blending",
 				"webgl_animation_skinning_morph",
@@ -268,6 +267,7 @@
 				"webgl_shaders_ocean",
 				"webgl_shading_physical",
 				"webgl_shaders_sky",
+				"webgl_shaders_tonemapping",
 				"webgl_shaders_vector",
 				"webgl_shadowmap",
 				"webgl_shadowmap_performance",

examples/webgl_adaptive_tonemapping.html → examples/webgl_shaders_tonemapping.html

@@ -40,7 +40,6 @@
 		<script src="../build/three.js"></script>
 
 		<script src="js/Detector.js"></script>
-		<script src="js/libs/stats.min.js"></script>
 		<script src="js/libs/dat.gui.min.js"></script>
 
 		<script src="js/shaders/CopyShader.js"></script>
@@ -60,9 +59,7 @@
 
 			if ( ! Detector.webgl ) Detector.addGetWebGLMessage();
 
-			var STATS_ENABLED = false;
-
-			var container, stats;
+			var container;
 
 			var bloomPass, adaptToneMappingPass;
 			var params;
@@ -74,7 +71,6 @@
 
 			var directionalLight;
 
-
 			var orbitControls;
 
 			var windowHalfX = window.innerWidth / 2;
@@ -145,24 +141,24 @@
 						"varying vec3 vNormal;",
 						THREE.ShaderChunk[ "lights_phong_pars_vertex" ],
 						"void main() {",
-				   		THREE.ShaderChunk[ "defaultnormal_vertex" ],
+					 		THREE.ShaderChunk[ "defaultnormal_vertex" ],
 
 							"	vNormal = normalize( transformedNormal );",
 							"vec4 mvPosition = modelViewMatrix * vec4( position, 1.0 );",
 							"vViewPosition = -mvPosition.xyz;",
-			      	"gl_Position = projectionMatrix * mvPosition;",
-			    	"}"
+							"gl_Position = projectionMatrix * mvPosition;",
+						"}"
 
-				  ].join("\n"),
+					].join("\n"),
 
-				  fragmentShader: [
+					fragmentShader: [
 
-				    THREE.ShaderChunk[ "lights_phong_pars_fragment" ],
-				    
-				    "void main() {",
-				      "vec3 normal = normalize( -vNormal );",
-			        "vec3 viewPosition = normalize( vViewPosition );",
-			        "#if MAX_DIR_LIGHTS > 0",
+						THREE.ShaderChunk[ "lights_phong_pars_fragment" ],
+						
+						"void main() {",
+							"vec3 normal = normalize( -vNormal );",
+							"vec3 viewPosition = normalize( vViewPosition );",
+							"#if MAX_DIR_LIGHTS > 0",
 
 								"vec3 dirDiffuse = vec3( 0.0 );",
 
@@ -182,16 +178,19 @@
 							"viewDot = clamp( pow( viewDot + 0.6, 10.0 ), 0.0, 1.0);",
 							
 							"vec3 colour = vec3( 0.05, 0.09, 0.13 ) * dirDiffuse;",
-				      "gl_FragColor = vec4( colour, viewDot );",
+							"gl_FragColor = vec4( colour, viewDot );",
 
-				    "}"
+						"}"
 
-				  ].join("\n"),
+					].join("\n"),
 				};
 
 				var earthAtmoMat = new THREE.ShaderMaterial( atmoShader );
 
-				var earthMat = new THREE.MeshPhongMaterial( { color: 0xffffff, shininess: 200 } );
+				var earthMat = new THREE.MeshPhongMaterial( {
+					color: 0xffffff,
+					shininess: 200
+				} );
 				
 				var earthDiffuse = THREE.ImageUtils.loadTexture( 'textures/planets/earth_atmos_4096.jpg', undefined, function( tex ) {
 					earthMat.map = tex;
@@ -201,18 +200,31 @@
 					earthMat.specularMap = tex;
 					earthMat.needsUpdate = true;
 				} );
+
 				// var earthNormal = THREE.ImageUtils.loadTexture( 'textures/planets/earth-new-normal-2048.jpg', undefined, function( tex ) {
 				// 	earthMat.normalMap = tex;
 				// 	earthMat.needsUpdate = true;
 				// } );
 
-				var earthLightsMat = new THREE.MeshBasicMaterial( { color: 0xffffff, blending: THREE.AdditiveBlending, transparent: true, depthTest: false } );
+				var earthLightsMat = new THREE.MeshBasicMaterial( {
+					color: 0xffffff,
+					blending: THREE.AdditiveBlending,
+					transparent: true,
+					depthTest: false
+				} );
+				
 				var earthLights = THREE.ImageUtils.loadTexture( 'textures/planets/earth_lights_2048.png', undefined, function( tex ) {
 					earthLightsMat.map = tex;
 					earthLightsMat.needsUpdate = true;
 				} );
 
-				var earthCloudsMat = new THREE.MeshLambertMaterial( { color: 0xffffff, blending: THREE.NormalBlending, transparent: true, depthTest: false } );
+				var earthCloudsMat = new THREE.MeshLambertMaterial( {
+					color: 0xffffff,
+					blending: THREE.NormalBlending,
+					transparent: true,
+					depthTest: false
+				} );
+
 				var earthClouds = THREE.ImageUtils.loadTexture( 'textures/planets/earth_clouds_2048.png', undefined, function( tex ) {
 					earthCloudsMat.map = tex;
 					earthCloudsMat.needsUpdate = true;
@@ -235,28 +247,28 @@
 				var vBGShader = [
 					// "attribute vec2 uv;",
 					"varying vec2 vUv;",
-			   	"void main() {",
-			   		"vUv = uv;",
-		      	"gl_Position = projectionMatrix * modelViewMatrix * vec4( position, 1.0 );",
-		    	"}"
+					"void main() {",
+						"vUv = uv;",
+						"gl_Position = projectionMatrix * modelViewMatrix * vec4( position, 1.0 );",
+					"}"
 
-			  ].join("\n");
+				].join("\n");
 
-			  var pBGShader = [
+				var pBGShader = [
 
-			    "uniform sampler2D map;",
-			    "varying vec2 vUv;",
-			    
-			    "void main() {",
-			      
-		        "vec2 sampleUV = vUv;",
-		        "vec4 colour = texture2D( map, sampleUV, 0.0 );",
-		    
-			      "gl_FragColor = vec4( colour.xyz, 1.0 );",
+					"uniform sampler2D map;",
+					"varying vec2 vUv;",
+					
+					"void main() {",
+						
+						"vec2 sampleUV = vUv;",
+						"vec4 colour = texture2D( map, sampleUV, 0.0 );",
+				
+						"gl_FragColor = vec4( colour.xyz, 1.0 );",
 
-			    "}"
+					"}"
 
-			  ].join("\n");
+				].join("\n");
 
 				// Skybox
 				adaptiveLuminanceMat = new THREE.ShaderMaterial( {
@@ -341,45 +353,45 @@
 				}
 				var hdrRenderTarget = new THREE.WebGLRenderTarget( windowThirdX, height, parameters );
 				dynamicHdrEffectComposer = new THREE.EffectComposer( renderer, hdrRenderTarget );
-  			dynamicHdrEffectComposer.setSize( window.innerWidth, window.innerHeight );
-  			hdrEffectComposer = new THREE.EffectComposer( renderer, hdrRenderTarget );
+				dynamicHdrEffectComposer.setSize( window.innerWidth, window.innerHeight );
+				hdrEffectComposer = new THREE.EffectComposer( renderer, hdrRenderTarget );
 
-  			var debugPass = new THREE.RenderPass( debugScene, cameraBG );
+				var debugPass = new THREE.RenderPass( debugScene, cameraBG );
 				debugPass.clear = false;
 				var scenePass = new THREE.RenderPass( scene, camera, undefined, undefined, undefined );
 				var skyboxPass = new THREE.RenderPass( sceneCube, cameraCube );
-  			scenePass.clear = false;
-
-  			adaptToneMappingPass = new THREE.AdaptiveToneMappingPass( true, 256 );
-  			adaptToneMappingPass.needsSwap = true;
-  			ldrToneMappingPass = new THREE.AdaptiveToneMappingPass( false, 256 );
-  			hdrToneMappingPass = new THREE.AdaptiveToneMappingPass( false, 256 );
-  			bloomPass = new THREE.BloomPass();
-  			var copyPass = new THREE.ShaderPass( THREE.CopyShader );
-  			copyPass.renderToScreen = true;
-  			
-  			dynamicHdrEffectComposer.addPass( skyboxPass );
-  			dynamicHdrEffectComposer.addPass( scenePass );
-  			dynamicHdrEffectComposer.addPass( adaptToneMappingPass );
-  			// dynamicHdrEffectComposer.addPass( debugPass );
-  			dynamicHdrEffectComposer.addPass( bloomPass );
-  			dynamicHdrEffectComposer.addPass( copyPass );
-
-  			hdrEffectComposer.addPass( skyboxPass );
-  			hdrEffectComposer.addPass( scenePass );
-  			hdrEffectComposer.addPass( hdrToneMappingPass );
-  			hdrEffectComposer.addPass( bloomPass );
-  			hdrEffectComposer.addPass( copyPass );
-
-  			ldrEffectComposer.addPass( skyboxPass );
-  			ldrEffectComposer.addPass( scenePass );
-  			ldrEffectComposer.addPass( ldrToneMappingPass );
-  			ldrEffectComposer.addPass( bloomPass );
-  			ldrEffectComposer.addPass( copyPass );
-
-  			// var gammaPass = new THREE.ShaderPass( GammaShader );
-  			// gammaPass.renderToScreen = true;
-  			// ldrEffectComposer.addPass( gammaPass );
+				scenePass.clear = false;
+
+				adaptToneMappingPass = new THREE.AdaptiveToneMappingPass( true, 256 );
+				adaptToneMappingPass.needsSwap = true;
+				ldrToneMappingPass = new THREE.AdaptiveToneMappingPass( false, 256 );
+				hdrToneMappingPass = new THREE.AdaptiveToneMappingPass( false, 256 );
+				bloomPass = new THREE.BloomPass();
+				var copyPass = new THREE.ShaderPass( THREE.CopyShader );
+				copyPass.renderToScreen = true;
+				
+				dynamicHdrEffectComposer.addPass( skyboxPass );
+				dynamicHdrEffectComposer.addPass( scenePass );
+				dynamicHdrEffectComposer.addPass( adaptToneMappingPass );
+				// dynamicHdrEffectComposer.addPass( debugPass );
+				dynamicHdrEffectComposer.addPass( bloomPass );
+				dynamicHdrEffectComposer.addPass( copyPass );
+
+				hdrEffectComposer.addPass( skyboxPass );
+				hdrEffectComposer.addPass( scenePass );
+				hdrEffectComposer.addPass( hdrToneMappingPass );
+				hdrEffectComposer.addPass( bloomPass );
+				hdrEffectComposer.addPass( copyPass );
+
+				ldrEffectComposer.addPass( skyboxPass );
+				ldrEffectComposer.addPass( scenePass );
+				ldrEffectComposer.addPass( ldrToneMappingPass );
+				ldrEffectComposer.addPass( bloomPass );
+				ldrEffectComposer.addPass( copyPass );
+
+				// var gammaPass = new THREE.ShaderPass( GammaShader );
+				// gammaPass.renderToScreen = true;
+				// ldrEffectComposer.addPass( gammaPass );
 
 
 				var dynamicHdrGui = new dat.GUI();
@@ -437,6 +449,7 @@
 					adaptToneMappingPass.setMaxLuminance( params.maxLuminance );
 					adaptToneMappingPass.setMiddleGrey( params.middleGrey );
 				}
+
 				directionalLight.intensity = params.sunLight;
 
 				orbitControls.update();
@@ -459,10 +472,6 @@
 				renderer.setViewport( windowThirdX * 2, 0, windowThirdX, window.innerHeight );
 				dynamicHdrEffectComposer.render( 0.017 );
 
-				
-				
-				// if ( STATS_ENABLED ) stats.update();
-
 			}
 
 		</script>