diff --git a/docs/scenes/bones-browser.html b/docs/scenes/bones-browser.html index cac044ee1e3147..56ebddc7e984c3 100644 --- a/docs/scenes/bones-browser.html +++ b/docs/scenes/bones-browser.html @@ -42,6 +42,7 @@ import { Bone, Color, + ColorManagement, CylinderGeometry, DoubleSide, Float32BufferAttribute, @@ -60,6 +61,8 @@ import { GUI } from 'three/addons/libs/lil-gui.module.min.js'; import { OrbitControls } from 'three/addons/controls/OrbitControls.js'; + ColorManagement.enabled = true; + let gui, scene, camera, renderer, orbit, lights, mesh, bones, skeletonHelper; const state = { diff --git a/docs/scenes/ccdiksolver-browser.html b/docs/scenes/ccdiksolver-browser.html index b79e930a1e5718..616c295da0e399 100644 --- a/docs/scenes/ccdiksolver-browser.html +++ b/docs/scenes/ccdiksolver-browser.html @@ -46,6 +46,7 @@ import { Bone, Color, + ColorManagement, CylinderGeometry, DoubleSide, Float32BufferAttribute, @@ -64,6 +65,8 @@ import { GUI } from 'three/addons/libs/lil-gui.module.min.js'; import { OrbitControls } from 'three/addons/controls/OrbitControls.js'; + ColorManagement.enabled = true; + let gui, scene, camera, renderer, orbit, mesh, bones, skeletonHelper, ikSolver; const state = { diff --git a/docs/scenes/geometry-browser.html b/docs/scenes/geometry-browser.html index 76386088a8831c..a8229b664fba74 100644 --- a/docs/scenes/geometry-browser.html +++ b/docs/scenes/geometry-browser.html @@ -45,6 +45,7 @@ CapsuleGeometry, CircleGeometry, Color, + ColorManagement, ConeGeometry, Curve, CylinderGeometry, @@ -81,6 +82,8 @@ import { GUI } from 'three/addons/libs/lil-gui.module.min.js'; import { OrbitControls } from 'three/addons/controls/OrbitControls.js'; + ColorManagement.enabled = true; + const twoPi = Math.PI * 2; class CustomSinCurve extends Curve { diff --git a/docs/scenes/material-browser.html b/docs/scenes/material-browser.html index 981bb275db2081..577c72ce9435b5 100644 --- a/docs/scenes/material-browser.html +++ b/docs/scenes/material-browser.html @@ -44,6 +44,8 @@ import { GUI } from 'three/addons/libs/lil-gui.module.min.js'; import { RoomEnvironment } from 'three/addons/environments/RoomEnvironment.js'; + THREE.ColorManagement.enabled = true; + const constants = { combine: { @@ -243,7 +245,7 @@ } - function handleColorChange( color, converSRGBToLinear = false ) { + function handleColorChange( color ) { return function ( value ) { @@ -255,8 +257,6 @@ color.setHex( value ); - if ( converSRGBToLinear === true ) color.convertSRGBToLinear(); - }; } @@ -306,7 +306,7 @@ 'ambient light': ambientLight.color.getHex() }; - folder.addColor( data, 'ambient light' ).onChange( handleColorChange( ambientLight.color, true ) ); + folder.addColor( data, 'ambient light' ).onChange( handleColorChange( ambientLight.color ) ); guiSceneFog( folder, scene ); @@ -375,7 +375,7 @@ const folder = gui.addFolder( 'THREE.MeshBasicMaterial' ); - folder.addColor( data, 'color' ).onChange( handleColorChange( material.color, true ) ); + folder.addColor( data, 'color' ).onChange( handleColorChange( material.color ) ); folder.add( material, 'wireframe' ); folder.add( material, 'vertexColors' ).onChange( needsUpdate( material, geometry ) ); folder.add( material, 'fog' ).onChange( needsUpdate( material, geometry ) ); @@ -420,7 +420,7 @@ const folder = gui.addFolder( 'THREE.LineBasicMaterial' ); - folder.addColor( data, 'color' ).onChange( handleColorChange( material.color, true ) ); + folder.addColor( data, 'color' ).onChange( handleColorChange( material.color ) ); folder.add( material, 'linewidth', 0, 10 ); folder.add( material, 'linecap', [ 'butt', 'round', 'square' ] ); folder.add( material, 'linejoin', [ 'round', 'bevel', 'miter' ] ); @@ -441,8 +441,8 @@ const folder = gui.addFolder( 'THREE.MeshLambertMaterial' ); - folder.addColor( data, 'color' ).onChange( handleColorChange( material.color, true ) ); - folder.addColor( data, 'emissive' ).onChange( handleColorChange( material.emissive, true ) ); + folder.addColor( data, 'color' ).onChange( handleColorChange( material.color ) ); + folder.addColor( data, 'emissive' ).onChange( handleColorChange( material.emissive ) ); folder.add( material, 'wireframe' ); folder.add( material, 'vertexColors' ).onChange( needsUpdate( material, geometry ) ); @@ -467,7 +467,7 @@ const folder = gui.addFolder( 'THREE.MeshMatcapMaterial' ); - folder.addColor( data, 'color' ).onChange( handleColorChange( material.color, true ) ); + folder.addColor( data, 'color' ).onChange( handleColorChange( material.color ) ); folder.add( material, 'flatShading' ).onChange( needsUpdate( material, geometry ) ); folder.add( data, 'matcap', matcapKeys ).onChange( updateTexture( material, 'matcap', matcaps ) ); @@ -488,8 +488,8 @@ const folder = gui.addFolder( 'THREE.MeshPhongMaterial' ); - folder.addColor( data, 'color' ).onChange( handleColorChange( material.color, true ) ); - folder.addColor( data, 'emissive' ).onChange( handleColorChange( material.emissive, true ) ); + folder.addColor( data, 'color' ).onChange( handleColorChange( material.color ) ); + folder.addColor( data, 'emissive' ).onChange( handleColorChange( material.emissive ) ); folder.addColor( data, 'specular' ).onChange( handleColorChange( material.specular ) ); folder.add( material, 'shininess', 0, 100 ); @@ -517,7 +517,7 @@ const folder = gui.addFolder( 'THREE.MeshToonMaterial' ); - folder.addColor( data, 'color' ).onChange( handleColorChange( material.color, true ) ); + folder.addColor( data, 'color' ).onChange( handleColorChange( material.color ) ); folder.add( data, 'map', diffuseMapKeys ).onChange( updateTexture( material, 'map', diffuseMaps ) ); folder.add( data, 'gradientMap', gradientMapKeys ).onChange( updateTexture( material, 'gradientMap', gradientMaps ) ); folder.add( data, 'alphaMap', alphaMapKeys ).onChange( updateTexture( material, 'alphaMap', alphaMaps ) ); @@ -537,8 +537,8 @@ const folder = gui.addFolder( 'THREE.MeshStandardMaterial' ); - folder.addColor( data, 'color' ).onChange( handleColorChange( material.color, true ) ); - folder.addColor( data, 'emissive' ).onChange( handleColorChange( material.emissive, true ) ); + folder.addColor( data, 'color' ).onChange( handleColorChange( material.color ) ); + folder.addColor( data, 'emissive' ).onChange( handleColorChange( material.emissive ) ); folder.add( material, 'roughness', 0, 1 ); folder.add( material, 'metalness', 0, 1 ); @@ -568,8 +568,8 @@ const folder = gui.addFolder( 'THREE.MeshPhysicalMaterial' ); - folder.addColor( data, 'color' ).onChange( handleColorChange( material.color, true ) ); - folder.addColor( data, 'emissive' ).onChange( handleColorChange( material.emissive, true ) ); + folder.addColor( data, 'color' ).onChange( handleColorChange( material.color ) ); + folder.addColor( data, 'emissive' ).onChange( handleColorChange( material.emissive ) ); folder.add( material, 'roughness', 0, 1 ); folder.add( material, 'metalness', 0, 1 );