Examples: More usage of useLegacyLights=false.

examples/webgl_postprocessing.html

@@ -44,6 +44,7 @@
 				renderer = new THREE.WebGLRenderer();
 				renderer.setPixelRatio( window.devicePixelRatio );
 				renderer.setSize( window.innerWidth, window.innerHeight );
+				renderer.useLegacyLights = false;
 				document.body.appendChild( renderer.domElement );
 
 				//
@@ -71,9 +72,9 @@
 
 				}
 
-				scene.add( new THREE.AmbientLight( 0x666666 ) );
+				scene.add( new THREE.AmbientLight( 0xcccccc ) );
 
-				const light = new THREE.DirectionalLight( 0xffffff );
+				const light = new THREE.DirectionalLight( 0xffffff, 3 );
 				light.position.set( 1, 1, 1 );
 				scene.add( light );
 

examples/webgl_postprocessing_3dlut.html

@@ -124,6 +124,7 @@
 				renderer = new THREE.WebGLRenderer();
 				renderer.setPixelRatio( window.devicePixelRatio );
 				renderer.setSize( window.innerWidth, window.innerHeight );
+				renderer.useLegacyLights = false;
 				renderer.toneMapping = THREE.ACESFilmicToneMapping;
 				renderer.toneMappingExposure = 1;
 				container.appendChild( renderer.domElement );

examples/webgl_postprocessing_advanced.html

@@ -91,7 +91,7 @@
 
 				//
 
-				directionalLight = new THREE.DirectionalLight( 0xffffff );
+				directionalLight = new THREE.DirectionalLight( 0xffffff, 3 );
 				directionalLight.position.set( 0, - 0.1, 1 ).normalize();
 				sceneModel.add( directionalLight );
 
@@ -131,6 +131,7 @@
 				renderer = new THREE.WebGLRenderer();
 				renderer.setPixelRatio( window.devicePixelRatio );
 				renderer.setSize( width, height );
+				renderer.useLegacyLights = false;
 				renderer.autoClear = false;
 
 				//

examples/webgl_postprocessing_afterimage.html

@@ -52,6 +52,7 @@
 				renderer = new THREE.WebGLRenderer();
 				renderer.setPixelRatio( window.devicePixelRatio );
 				renderer.setSize( window.innerWidth, window.innerHeight );
+				renderer.useLegacyLights = false;
 				document.body.appendChild( renderer.domElement );
 
 				camera = new THREE.PerspectiveCamera( 70, window.innerWidth / window.innerHeight, 1, 1000 );

examples/webgl_postprocessing_backgrounds.html

@@ -101,6 +101,7 @@
 				renderer = new THREE.WebGLRenderer();
 				renderer.setPixelRatio( devicePixelRatio );
 				renderer.setSize( width, height );
+				renderer.useLegacyLights = false;
 				document.body.appendChild( renderer.domElement );
 
 				stats = new Stats();
@@ -116,22 +117,22 @@
 				const group = new THREE.Group();
 				scene.add( group );
 
-				const light = new THREE.PointLight( 0xddffdd, 1.0 );
-				light.position.z = 70;
-				light.position.y = - 70;
-				light.position.x = - 70;
+				const light = new THREE.PointLight( 0xefffef, 500 );
+				light.position.z = 10;
+				light.position.y = - 10;
+				light.position.x = - 10;
 				scene.add( light );
 
-				const light2 = new THREE.PointLight( 0xffdddd, 1.0 );
-				light2.position.z = 70;
-				light2.position.x = - 70;
-				light2.position.y = 70;
+				const light2 = new THREE.PointLight( 0xffefef, 500 );
+				light2.position.z = 10;
+				light2.position.x = - 10;
+				light2.position.y = 10;
 				scene.add( light2 );
 
-				const light3 = new THREE.PointLight( 0xddddff, 1.0 );
-				light3.position.z = 70;
-				light3.position.x = 70;
-				light3.position.y = - 70;
+				const light3 = new THREE.PointLight( 0xefefff, 500 );
+				light3.position.z = 10;
+				light3.position.x = 10;
+				light3.position.y = - 10;
 				scene.add( light3 );
 
 				const geometry = new THREE.SphereGeometry( 1, 48, 24 );

examples/webgl_postprocessing_crossfade.html

@@ -131,20 +131,20 @@
 
 				for ( let i = 0; i < count; i ++ ) {
 
-					dummy.position.x = Math.random() * 10000 - 5000;
-					dummy.position.y = Math.random() * 6000 - 3000;
-					dummy.position.z = Math.random() * 8000 - 4000;
+					dummy.position.x = Math.random() * 100 - 50;
+					dummy.position.y = Math.random() * 60 - 30;
+					dummy.position.z = Math.random() * 80 - 40;
 
 					dummy.rotation.x = Math.random() * 2 * Math.PI;
 					dummy.rotation.y = Math.random() * 2 * Math.PI;
 					dummy.rotation.z = Math.random() * 2 * Math.PI;
 
-					dummy.scale.x = Math.random() * 200 + 100;
+					dummy.scale.x = Math.random() * 2 + 1;
 
 					if ( geometry.type === 'BoxGeometry' ) {
 
-						dummy.scale.y = Math.random() * 200 + 100;
-						dummy.scale.z = Math.random() * 200 + 100;
+						dummy.scale.y = Math.random() * 2 + 1;
+						dummy.scale.z = Math.random() * 2 + 1;
 
 					} else {
 
@@ -168,15 +168,15 @@
 
 				this.clearColor = clearColor;
 
-				const camera = new THREE.PerspectiveCamera( 50, window.innerWidth / window.innerHeight, 1, 10000 );
-				camera.position.z = 2000;
+				const camera = new THREE.PerspectiveCamera( 50, window.innerWidth / window.innerHeight, 0.1, 100 );
+				camera.position.z = 20;
 
 				// Setup scene
 				const scene = new THREE.Scene();
-				scene.add( new THREE.AmbientLight( 0x555555 ) );
+				scene.add( new THREE.AmbientLight( 0xaaaaaa ) );
 
 				const light = new THREE.SpotLight( 0xffffff, 1.5 );
-				light.position.set( 0, 500, 2000 );
+				light.position.set( 0, 5, 20 );
 				scene.add( light );
 
 				this.rotationSpeed = rotationSpeed;

examples/webgl_postprocessing_dof.html

@@ -70,6 +70,7 @@
 				renderer = new THREE.WebGLRenderer();
 				renderer.setPixelRatio( window.devicePixelRatio );
 				renderer.setSize( width, height );
+				renderer.useLegacyLights = false;
 				container.appendChild( renderer.domElement );
 
 				const path = 'textures/cube/SwedishRoyalCastle/';

examples/webgl_postprocessing_dof2.html

@@ -75,6 +75,7 @@
 				renderer = new THREE.WebGLRenderer();
 				renderer.setPixelRatio( window.devicePixelRatio );
 				renderer.setSize( window.innerWidth, window.innerHeight );
+				renderer.useLegacyLights = false;
 				renderer.autoClear = false;
 				container.appendChild( renderer.domElement );
 
@@ -190,13 +191,13 @@
 
 				// lights
 
-				scene.add( new THREE.AmbientLight( 0x666666 ) );
+				scene.add( new THREE.AmbientLight( 0xcccccc ) );
 
-				const directionalLight1 = new THREE.DirectionalLight( 0xffffff, 2 );
+				const directionalLight1 = new THREE.DirectionalLight( 0xffffff, 6 );
 				directionalLight1.position.set( 2, 1.2, 10 ).normalize();
 				scene.add( directionalLight1 );
 
-				const directionalLight2 = new THREE.DirectionalLight( 0xffffff, 1 );
+				const directionalLight2 = new THREE.DirectionalLight( 0xffffff, 3 );
 				directionalLight2.position.set( - 2, 1.2, - 10 ).normalize();
 				scene.add( directionalLight2 );
 

examples/webgl_postprocessing_fxaa.html

@@ -76,11 +76,11 @@
 
 				//
 
-				const hemiLight = new THREE.HemisphereLight( 0xffffff, 0x8d8d8d );
+				const hemiLight = new THREE.HemisphereLight( 0xffffff, 0x8d8d8d, 3 );
 				hemiLight.position.set( 0, 1000, 0 );
 				scene.add( hemiLight );
 
-				const dirLight = new THREE.DirectionalLight( 0xffffff, 0.8 );
+				const dirLight = new THREE.DirectionalLight( 0xffffff, 2.5 );
 				dirLight.position.set( - 3000, 1000, - 1000 );
 				scene.add( dirLight );
 
@@ -114,9 +114,10 @@
 				//
 
 				renderer = new THREE.WebGLRenderer();
-				renderer.autoClear = false;
 				renderer.setPixelRatio( window.devicePixelRatio );
 				renderer.setSize( container.offsetWidth, container.offsetHeight );
+				renderer.useLegacyLights = false;
+				renderer.autoClear = false;
 				container.appendChild( renderer.domElement );
 
 				//

examples/webgl_postprocessing_glitch.html

@@ -70,6 +70,7 @@ <h2>WARNING</h2>
 				renderer = new THREE.WebGLRenderer();
 				renderer.setPixelRatio( window.devicePixelRatio );
 				renderer.setSize( window.innerWidth, window.innerHeight );
+				renderer.useLegacyLights = false;
 				document.body.appendChild( renderer.domElement );
 
 				//
@@ -98,9 +99,9 @@ <h2>WARNING</h2>
 
 				}
 
-				scene.add( new THREE.AmbientLight( 0x666666 ) );
+				scene.add( new THREE.AmbientLight( 0xcccccc ) );
 
-				light = new THREE.DirectionalLight( 0xffffff );
+				light = new THREE.DirectionalLight( 0xffffff, 3 );
 				light.position.set( 1, 1, 1 );
 				scene.add( light );
 

examples/webgl_postprocessing_godrays.html

@@ -100,6 +100,7 @@
 				renderer.setClearColor( 0xffffff );
 				renderer.setPixelRatio( window.devicePixelRatio );
 				renderer.setSize( window.innerWidth, window.innerHeight );
+				renderer.useLegacyLights = false;
 				container.appendChild( renderer.domElement );
 
 				renderer.autoClear = false;

examples/webgl_postprocessing_masking.html

@@ -57,6 +57,7 @@
 				renderer.setClearColor( 0xe0e0e0 );
 				renderer.setPixelRatio( window.devicePixelRatio );
 				renderer.setSize( window.innerWidth, window.innerHeight );
+				renderer.useLegacyLights = false;
 				renderer.autoClear = false;
 				document.body.appendChild( renderer.domElement );
 

examples/webgl_postprocessing_outline.html

@@ -130,6 +130,7 @@
 				const height = window.innerHeight;
 
 				renderer = new THREE.WebGLRenderer();
+				renderer.useLegacyLights = false;
 				renderer.shadowMap.enabled = true;
 				// todo - support pixelRatio in this demo
 				renderer.setSize( width, height );
@@ -149,9 +150,9 @@
 
 				//
 
-				scene.add( new THREE.AmbientLight( 0xaaaaaa, 0.2 ) );
+				scene.add( new THREE.AmbientLight( 0xaaaaaa, 0.6 ) );
 
-				const light = new THREE.DirectionalLight( 0xddffdd, 0.6 );
+				const light = new THREE.DirectionalLight( 0xddffdd, 2 );
 				light.position.set( 1, 1, 1 );
 				light.castShadow = true;
 				light.shadow.mapSize.width = 1024;

examples/webgl_postprocessing_pixel.html

@@ -62,6 +62,7 @@
 			renderer.shadowMap.enabled = true;
 			//renderer.setPixelRatio( window.devicePixelRatio );
 			renderer.setSize( window.innerWidth, window.innerHeight );
+			renderer.useLegacyLights = false;
 			document.body.appendChild( renderer.domElement );
 
 			composer = new EffectComposer( renderer );
@@ -144,15 +145,15 @@
 
 			// lights
 
-			scene.add( new THREE.AmbientLight( 0x757f8e ) );
+			scene.add( new THREE.AmbientLight( 0x757f8e, 3 ) );
 
-			const directionalLight = new THREE.DirectionalLight( 0xfffecd, .5 );
+			const directionalLight = new THREE.DirectionalLight( 0xfffecd, 1.5 );
 			directionalLight.position.set( 100, 100, 100 );
 			directionalLight.castShadow = true;
 			directionalLight.shadow.mapSize.set( 2048, 2048 );
 			scene.add( directionalLight );
 
-			const spotLight = new THREE.SpotLight( 0xffc100, 1, 10, Math.PI / 16, .02, 2 );
+			const spotLight = new THREE.SpotLight( 0xffc100, 10, 10, Math.PI / 16, .02, 2 );
 			spotLight.position.set( 2, 2, 0 );
 			const target = spotLight.target;
 			scene.add( target );

examples/webgl_postprocessing_procedural.html

@@ -99,6 +99,7 @@
 				renderer = new THREE.WebGLRenderer();
 				renderer.setPixelRatio( window.devicePixelRatio );
 				renderer.setSize( window.innerWidth, window.innerHeight );
+				renderer.useLegacyLights = false;
 				document.body.appendChild( renderer.domElement );
 
 				stats = new Stats();

examples/webgl_postprocessing_rgb_halftone.html

@@ -51,6 +51,7 @@
 				renderer = new THREE.WebGLRenderer();
 				renderer.setPixelRatio( window.devicePixelRatio );
 				renderer.setSize( window.innerWidth, window.innerHeight );
+				renderer.useLegacyLights = false;
 
 				clock = new THREE.Clock();
 
@@ -75,7 +76,7 @@
 				group = new THREE.Group();
 				const floor = new THREE.Mesh( new THREE.BoxGeometry( 100, 1, 100 ), new THREE.MeshPhongMaterial( {} ) );
 				floor.position.y = - 10;
-				const light = new THREE.PointLight( 0xffffff, 1.0, 50, 2 );
+				const light = new THREE.PointLight( 0xffffff, 250 );
 				light.position.y = 2;
 				group.add( floor, light );
 				scene.add( group );

examples/webgl_postprocessing_sao.html

@@ -58,6 +58,7 @@
 				renderer.setClearColor( 0x000000 );
 				renderer.setPixelRatio( devicePixelRatio );
 				renderer.setSize( width, height );
+				renderer.useLegacyLights = false;
 				document.body.appendChild( renderer.domElement );
 
 				camera = new THREE.PerspectiveCamera( 65, width / height, 3, 10 );
@@ -68,25 +69,25 @@
 				group = new THREE.Object3D();
 				scene.add( group );
 
-				const light = new THREE.PointLight( 0xefffef, 0.8 );
-				light.position.z = 70;
-				light.position.y = - 70;
-				light.position.x = - 70;
+				const light = new THREE.PointLight( 0xefffef, 500 );
+				light.position.z = 10;
+				light.position.y = - 10;
+				light.position.x = - 10;
 				scene.add( light );
 
-				const light2 = new THREE.PointLight( 0xffefef, 0.8 );
-				light2.position.z = 70;
-				light2.position.x = - 70;
-				light2.position.y = 70;
+				const light2 = new THREE.PointLight( 0xffefef, 500 );
+				light2.position.z = 10;
+				light2.position.x = - 10;
+				light2.position.y = 10;
 				scene.add( light2 );
 
-				const light3 = new THREE.PointLight( 0xefefff, 0.8 );
-				light3.position.z = 70;
-				light3.position.x = 70;
-				light3.position.y = - 70;
+				const light3 = new THREE.PointLight( 0xefefff, 500 );
+				light3.position.z = 10;
+				light3.position.x = 10;
+				light3.position.y = - 10;
 				scene.add( light3 );
 
-				const light4 = new THREE.AmbientLight( 0xffffff, 0.05 );
+				const light4 = new THREE.AmbientLight( 0xffffff, 0.2 );
 				scene.add( light4 );
 
 				const geometry = new THREE.SphereGeometry( 3, 48, 24 );

examples/webgl_postprocessing_smaa.html

@@ -50,6 +50,7 @@
 				renderer = new THREE.WebGLRenderer();
 				renderer.setPixelRatio( window.devicePixelRatio );
 				renderer.setSize( window.innerWidth, window.innerHeight );
+				renderer.useLegacyLights = false;
 				document.body.appendChild( renderer.domElement );
 
 				stats = new Stats();