Examples: Clean up. (#25991)

* Examples: Clean up.

* Examples: Clean up.

examples/webgl_buffergeometry.html

@@ -30,8 +30,6 @@
 
 			import Stats from 'three/addons/libs/stats.module.js';
 
-			THREE.ColorManagement.enabled = false; // TODO: Consider enabling color management.
-
 			let container, stats;
 
 			let camera, scene, renderer;
@@ -56,7 +54,7 @@
 
 				//
 
-				scene.add( new THREE.AmbientLight( 0x444444 ) );
+				scene.add( new THREE.AmbientLight( 0x8d8d8d ) );
 
 				const light1 = new THREE.DirectionalLight( 0xffffff, 0.5 );
 				light1.position.set( 1, 1, 1 );
@@ -161,7 +159,7 @@
 				geometry.computeBoundingSphere();
 
 				const material = new THREE.MeshPhongMaterial( {
-					color: 0xaaaaaa, specular: 0xffffff, shininess: 250,
+					color: 0xd5d5d5, specular: 0xffffff, shininess: 250,
 					side: THREE.DoubleSide, vertexColors: true, transparent: true
 				} );
 

examples/webgl_buffergeometry_drawrange.html

@@ -36,8 +36,6 @@
 
 			import { OrbitControls } from 'three/addons/controls/OrbitControls.js';
 
-			THREE.ColorManagement.enabled = false; // TODO: Consider enabling color management.
-
 			let group;
 			let container, stats;
 			const particlesData = [];
@@ -111,7 +109,7 @@
 				scene.add( group );
 
 				const helper = new THREE.BoxHelper( new THREE.Mesh( new THREE.BoxGeometry( r, r, r ) ) );
-				helper.material.color.setHex( 0x101010 );
+				helper.material.color.setHex( 0x474747 );
 				helper.material.blending = THREE.AdditiveBlending;
 				helper.material.transparent = true;
 				group.add( helper );

examples/webgl_buffergeometry_uint.html

@@ -30,8 +30,6 @@
 
 			import Stats from 'three/addons/libs/stats.module.js';
 
-			THREE.ColorManagement.enabled = false; // TODO: Consider enabling color management.
-
 			let container, stats;
 
 			let camera, scene, renderer;
@@ -56,7 +54,9 @@
 
 				//
 
-				scene.add( new THREE.AmbientLight( 0x444444 ) );
+				scene.add( new THREE.AmbientLight( 0x8d8d8d ) );
+
+				console.log( new THREE.Color( 0xaaaaaa ).convertLinearToSRGB().getHexString() );
 
 				const light1 = new THREE.DirectionalLight( 0xffffff, 0.5 );
 				light1.position.set( 1, 1, 1 );
@@ -160,7 +160,7 @@
 				geometry.computeBoundingSphere();
 
 				const material = new THREE.MeshPhongMaterial( {
-					color: 0xaaaaaa, specular: 0xffffff, shininess: 250,
+					color: 0xd5d5d5, specular: 0xffffff, shininess: 250,
 					side: THREE.DoubleSide, vertexColors: true
 				} );
 

examples/webgl_geometry_teapot.html

@@ -34,8 +34,6 @@
 			import { OrbitControls } from 'three/addons/controls/OrbitControls.js';
 			import { TeapotGeometry } from 'three/addons/geometries/TeapotGeometry.js';
 
-			THREE.ColorManagement.enabled = false; // TODO: Consider enabling color management.
-
 			let camera, scene, renderer;
 			let cameraControls;
 			let effectController;
@@ -69,7 +67,7 @@
 				camera.position.set( - 600, 550, 1300 );
 
 				// LIGHTS
-				ambientLight = new THREE.AmbientLight( 0x333333 );
+				ambientLight = new THREE.AmbientLight( 0x7c7c7c );
 
 				light = new THREE.DirectionalLight( 0xFFFFFF, 1.0 );
 				light.position.set( 0.32, 0.39, 0.7 );

examples/webgl_lights_rectarealight.html

@@ -36,10 +36,8 @@
 			import { RectAreaLightHelper } from 'three/addons/helpers/RectAreaLightHelper.js';
 			import { RectAreaLightUniformsLib } from 'three/addons/lights/RectAreaLightUniformsLib.js';
 
-			THREE.ColorManagement.enabled = false; // TODO: Consider enabling color management.
-
 			let renderer, scene, camera;
-			let stats;
+			let stats, meshKnot;
 
 			init();
 
@@ -75,14 +73,13 @@
 				scene.add( new RectAreaLightHelper( rectLight3 ) );
 
 				const geoFloor = new THREE.BoxGeometry( 2000, 0.1, 2000 );
-				const matStdFloor = new THREE.MeshStandardMaterial( { color: 0x808080, roughness: 0.1, metalness: 0 } );
+				const matStdFloor = new THREE.MeshStandardMaterial( { color: 0xbcbcbc, roughness: 0.1, metalness: 0 } );
 				const mshStdFloor = new THREE.Mesh( geoFloor, matStdFloor );
 				scene.add( mshStdFloor );
 
 				const geoKnot = new THREE.TorusKnotGeometry( 1.5, 0.5, 200, 16 );
 				const matKnot = new THREE.MeshStandardMaterial( { color: 0xffffff, roughness: 0, metalness: 0 } );
-				const meshKnot = new THREE.Mesh( geoKnot, matKnot );
-				meshKnot.name = 'meshKnot';
+				meshKnot = new THREE.Mesh( geoKnot, matKnot );
 				meshKnot.position.set( 0, 5, 0 );
 				scene.add( meshKnot );
 
@@ -109,8 +106,7 @@
 
 			function animation( time ) {
 
-				const mesh = scene.getObjectByName( 'meshKnot' );
-				mesh.rotation.y = time / 1000;
+				meshKnot.rotation.y = time / 1000;
 
 				renderer.render( scene, camera );
 

examples/webgl_lights_spotlight.html

@@ -34,8 +34,6 @@
 			import { PLYLoader } from 'three/addons/loaders/PLYLoader.js';
 			import { OrbitControls } from 'three/addons/controls/OrbitControls.js';
 
-			THREE.ColorManagement.enabled = false; // TODO: Consider enabling color management.
-
 			let renderer, scene, camera;
 
 			let spotLight, lightHelper;
@@ -70,7 +68,7 @@
 				controls.target.set( 0, 18, 0 );
 				controls.update();
 
-				const ambient = new THREE.HemisphereLight( 0xffffff, 0x444444, 0.05 );
+				const ambient = new THREE.HemisphereLight( 0xffffff, 0x8d8d8d, 0.05 );
 				scene.add( ambient );
 
 				const loader = new THREE.TextureLoader().setPath( 'textures/' );
@@ -113,7 +111,7 @@
 				//
 
 				const geometry = new THREE.PlaneGeometry( 1000, 1000 );
-				const material = new THREE.MeshLambertMaterial( { color: 0x808080 } );
+				const material = new THREE.MeshLambertMaterial( { color: 0xbcbcbc } );
 
 				const mesh = new THREE.Mesh( geometry, material );
 				mesh.position.set( 0, - 1, 0 );

examples/webgl_materials_cubemap.html

@@ -36,8 +36,6 @@
 			import { OrbitControls } from 'three/addons/controls/OrbitControls.js';
 			import { OBJLoader } from 'three/addons/loaders/OBJLoader.js';
 
-			THREE.ColorManagement.enabled = false; // TODO: Confirm correct color management.
-
 			let container, stats;
 
 			let camera, scene, renderer;
@@ -81,8 +79,8 @@
 				scene.add( pointLight );
 
 				//materials
-				const cubeMaterial3 = new THREE.MeshLambertMaterial( { color: 0xff6600, envMap: reflectionCube, combine: THREE.MixOperation, reflectivity: 0.3 } );
-				const cubeMaterial2 = new THREE.MeshLambertMaterial( { color: 0xffee00, envMap: refractionCube, refractionRatio: 0.95 } );
+				const cubeMaterial3 = new THREE.MeshLambertMaterial( { color: 0xffaa00, envMap: reflectionCube, combine: THREE.MixOperation, reflectivity: 0.3 } );
+				const cubeMaterial2 = new THREE.MeshLambertMaterial( { color: 0xfff700, envMap: refractionCube, refractionRatio: 0.95 } );
 				const cubeMaterial1 = new THREE.MeshLambertMaterial( { color: 0xffffff, envMap: reflectionCube } );
 
 				//models