Skip to content

Commit 47a056c

Browse files
vanruescvanruesc
committed
Update demos
1 parent b880b77 commit 47a056c

40 files changed

+148
-289
lines changed

‎demo/src/demos/BloomDemo.js‎

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@ import {
44
DirectionalLight,
55
PerspectiveCamera,
66
Raycaster,
7-
sRGBEncoding,
7+
SRGBColorSpace,
88
Vector2
99
} from "three";
1010

@@ -176,7 +176,7 @@ export class BloomDemo extends PostProcessingDemo {
176176

177177
cubeTextureLoader.load(urls, (t) => {
178178

179-
t.encoding = sRGBEncoding;
179+
t.colorSpace = SRGBColorSpace;
180180
assets.set("sky", t);
181181

182182
});
@@ -232,7 +232,7 @@ export class BloomDemo extends PostProcessingDemo {
232232

233233
// Lights
234234

235-
const ambientLight = new AmbientLight(0x323232);
235+
const ambientLight = new AmbientLight(0x7a7a7a);
236236
const mainLight = new DirectionalLight(0xffffff, 1.0);
237237
mainLight.position.set(-1, 1, 1);
238238

@@ -265,7 +265,7 @@ export class BloomDemo extends PostProcessingDemo {
265265
const effect = new SelectiveBloomEffect(scene, camera, {
266266
blendFunction: BlendFunction.ADD,
267267
mipmapBlur: true,
268-
luminanceThreshold: 0.7,
268+
luminanceThreshold: 0.4,
269269
luminanceSmoothing: 0.3,
270270
intensity: 3.0
271271
});

‎demo/src/demos/BlurDemo.js‎

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@ import {
33
CubeTextureLoader,
44
DirectionalLight,
55
PerspectiveCamera,
6-
sRGBEncoding
6+
SRGBColorSpace
77
} from "three";
88

99
import { ControlMode, SpatialControls } from "spatial-controls";
@@ -104,7 +104,7 @@ export class BlurDemo extends PostProcessingDemo {
104104

105105
cubeTextureLoader.load(urls, (t) => {
106106

107-
t.encoding = sRGBEncoding;
107+
t.colorSpace = SRGBColorSpace;
108108
assets.set("sky", t);
109109

110110
});
@@ -160,8 +160,8 @@ export class BlurDemo extends PostProcessingDemo {
160160

161161
// Lights
162162

163-
const ambientLight = new AmbientLight(0x323232);
164-
const mainLight = new DirectionalLight(0xff7e66, 1.0);
163+
const ambientLight = new AmbientLight(0x7a7a7a);
164+
const mainLight = new DirectionalLight(0xffbbaa, 1.0);
165165
mainLight.position.set(1.44, 0.2, 2.0);
166166

167167
scene.add(ambientLight);

‎demo/src/demos/ColorGradingDemo.js‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -295,7 +295,7 @@ export class ColorGradingDemo extends PostProcessingDemo {
295295
const lutEffect = capabilities.isWebGL2 ? new LUT3DEffect(lut) :
296296
new LUT3DEffect(lut.convertToUint8().toDataTexture());
297297

298-
// lutEffect.setInputEncoding(LinearEncoding); // Debug
298+
// lutEffect.inputColorSpace = LinearSRGBColorSpace; // Debug
299299

300300
this.brightnessContrastEffect = brightnessContrastEffect;
301301
this.colorAverageEffect = colorAverageEffect;

‎demo/src/demos/GodRaysDemo.js‎

Lines changed: 7 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@ import {
77
MeshBasicMaterial,
88
PerspectiveCamera,
99
PointLight,
10-
SphereBufferGeometry
10+
SphereGeometry
1111
} from "three";
1212

1313
import { SpatialControls } from "spatial-controls";
@@ -156,9 +156,9 @@ export class GodRaysDemo extends PostProcessingDemo {
156156

157157
// Lights
158158

159-
const ambientLight = new AmbientLight(0x101010);
159+
const ambientLight = new AmbientLight(0x474747);
160160

161-
const mainLight = new PointLight(0xffe3b1);
161+
const mainLight = new PointLight(0xffddaa);
162162
mainLight.position.set(-0.5, 3, -0.25);
163163
mainLight.castShadow = true;
164164
mainLight.shadow.bias = 0.0000125;
@@ -188,7 +188,7 @@ export class GodRaysDemo extends PostProcessingDemo {
188188
fog: false
189189
});
190190

191-
const sunGeometry = new SphereBufferGeometry(0.75, 32, 32);
191+
const sunGeometry = new SphereGeometry(0.75, 32, 32);
192192
const sun = new Mesh(sunGeometry, sunMaterial);
193193
sun.frustumCulled = false;
194194
sun.matrixAutoUpdate = false;
@@ -240,8 +240,6 @@ export class GodRaysDemo extends PostProcessingDemo {
240240

241241
registerOptions(menu) {
242242

243-
const color = new Color();
244-
245243
const sun = this.sun;
246244
const light = this.light;
247245

@@ -259,7 +257,7 @@ export class GodRaysDemo extends PostProcessingDemo {
259257
"exposure": uniforms.exposure.value,
260258
"clampMax": uniforms.clampMax.value,
261259
"samples": effect.samples,
262-
"color": color.copyLinearToSRGB(sun.material.color).getHex(),
260+
"color": sun.material.color.getHex(),
263261
"opacity": blendMode.opacity.value,
264262
"blend mode": blendMode.blendFunction
265263
};
@@ -315,8 +313,8 @@ export class GodRaysDemo extends PostProcessingDemo {
315313

316314
menu.addColor(params, "color").onChange((value) => {
317315

318-
sun.material.color.setHex(value).convertSRGBToLinear();
319-
light.color.setHex(value).convertSRGBToLinear();
316+
sun.material.color.setHex(value);
317+
light.color.setHex(value);
320318

321319
});
322320

‎demo/src/demos/OutlineDemo.js‎

Lines changed: 29 additions & 33 deletions
Original file line numberDiff line numberDiff line change
@@ -1,22 +1,21 @@
11
import {
22
AmbientLight,
33
AnimationMixer,
4-
BoxBufferGeometry,
5-
CircleBufferGeometry,
4+
CircleGeometry,
65
Color,
76
CubeTextureLoader,
8-
ConeBufferGeometry,
7+
ConeGeometry,
98
DirectionalLight,
109
DoubleSide,
1110
Mesh,
1211
MeshPhongMaterial,
13-
OctahedronBufferGeometry,
12+
OctahedronGeometry,
1413
PerspectiveCamera,
1514
Raycaster,
16-
SphereBufferGeometry,
17-
sRGBEncoding,
15+
SphereGeometry,
1816
TextureLoader,
19-
Vector2
17+
Vector2,
18+
SRGBColorSpace
2019
} from "three";
2120

2221
import { ControlMode, SpatialControls } from "spatial-controls";
@@ -85,7 +84,7 @@ export class OutlineDemo extends PostProcessingDemo {
8584
/**
8685
* An effect.
8786
*
88-
* @type {Effect}
87+
* @type {OutlineEffect}
8988
* @private
9089
*/
9190

@@ -200,14 +199,14 @@ export class OutlineDemo extends PostProcessingDemo {
200199

201200
cubeTextureLoader.load(urls, (t) => {
202201

203-
t.encoding = sRGBEncoding;
202+
t.colorSpace = SRGBColorSpace;
204203
assets.set("sky", t);
205204

206205
});
207206

208207
textureLoader.load("textures/pattern.png", (t) => {
209208

210-
t.encoding = sRGBEncoding;
209+
t.colorSpace = SRGBColorSpace;
211210
assets.set("pattern-color", t);
212211

213212
});
@@ -270,9 +269,9 @@ export class OutlineDemo extends PostProcessingDemo {
270269

271270
// Lights
272271

273-
const ambientLight = new AmbientLight(0x212121);
274-
const mainLight = new DirectionalLight(0xff7e66, 1.0);
275-
const backLight = new DirectionalLight(0xff7e66, 0.1);
272+
const ambientLight = new AmbientLight(0x656565);
273+
const mainLight = new DirectionalLight(0xffbbaa, 1.0);
274+
const backLight = new DirectionalLight(0xffbbaa, 0.1);
276275

277276
mainLight.position.set(14.4, 2, 20);
278277
backLight.position.copy(mainLight.position).negate();
@@ -285,7 +284,7 @@ export class OutlineDemo extends PostProcessingDemo {
285284
const meshes = [];
286285

287286
let mesh = new Mesh(
288-
new SphereBufferGeometry(1, 32, 32),
287+
new SphereGeometry(1, 32, 32),
289288
new MeshPhongMaterial({
290289
color: 0xffff00
291290
})
@@ -296,7 +295,7 @@ export class OutlineDemo extends PostProcessingDemo {
296295
selection.push(mesh);
297296

298297
mesh = new Mesh(
299-
new OctahedronBufferGeometry(),
298+
new OctahedronGeometry(),
300299
new MeshPhongMaterial({
301300
color: 0xff00ff
302301
})
@@ -307,7 +306,7 @@ export class OutlineDemo extends PostProcessingDemo {
307306
selection.push(mesh);
308307

309308
mesh = new Mesh(
310-
new CircleBufferGeometry(0.75, 32),
309+
new CircleGeometry(0.75, 32),
311310
new MeshPhongMaterial({
312311
side: DoubleSide,
313312
color: 0xff0000
@@ -320,7 +319,7 @@ export class OutlineDemo extends PostProcessingDemo {
320319
selection.push(mesh);
321320

322321
mesh = new Mesh(
323-
new ConeBufferGeometry(1, 1, 32),
322+
new ConeGeometry(1, 1, 32),
324323
new MeshPhongMaterial({
325324
color: 0x00ff00
326325
})
@@ -331,7 +330,7 @@ export class OutlineDemo extends PostProcessingDemo {
331330
selection.push(mesh);
332331

333332
mesh = new Mesh(
334-
new BoxBufferGeometry(1, 1, 1),
333+
new BoxGeometry(1, 1, 1),
335334
new MeshPhongMaterial({
336335
color: 0x00ffff
337336
})
@@ -428,39 +427,38 @@ export class OutlineDemo extends PostProcessingDemo {
428427
"pulse speed": effect.pulseSpeed,
429428
"edge strength": uniforms.get("edgeStrength").value,
430429
"visible edge": color.copyLinearToSRGB(
431-
uniforms.get("visibleEdgeColor").value).getHex(),
432-
"hidden edge": color.copyLinearToSRGB(
433-
uniforms.get("hiddenEdgeColor").value).getHex(),
430+
"edge strength": effect.edgeStrength,
431+
"visible edge": color.copyLinearToSRGB(effect.visibleEdgeColor).getHex(),
432+
"hidden edge": color.copyLinearToSRGB(effect.hiddenEdgeColor).getHex(),
434433
"x-ray": true,
435434
"opacity": blendMode.opacity.value,
436435
"blend mode": blendMode.blendFunction
437436
};
438437

439-
menu.add(params, "resolution", [240, 360, 480, 720, 1080])
440-
.onChange((value) => {
438+
menu.add(params, "resolution", [240, 360, 480, 720, 1080]).onChange((value) => {
441439

442-
effect.resolution.height = Number(value);
440+
effect.resolution.height = Number(value);
443441

444-
});
442+
});
445443

446444
menu.add(params, "blurriness",
447445
KernelSize.VERY_SMALL, KernelSize.HUGE + 1, 1).onChange((value) => {
448446

449-
effect.blur = (value > 0);
450-
effect.blurPass.kernelSize = value - 1;
447+
effect.blurPass.enabled = (value > 0);
448+
effect.blurPass.blurMaterial.kernelSize = value - 1;
451449

452450
});
453451

454452
menu.add(params, "use pattern").onChange((value) => {
455453

456454
if(value) {
457455

458-
effect.setPatternTexture(assets.get("pattern-color"));
456+
effect.patternTexture = assets.get("pattern-color");
459457
uniforms.get("patternScale").value = params["pattern scale"];
460458

461459
} else {
462460

463-
effect.setPatternTexture(null);
461+
effect.patternTexture = null;
464462

465463
}
466464

@@ -486,15 +484,13 @@ export class OutlineDemo extends PostProcessingDemo {
486484

487485
menu.addColor(params, "visible edge").onChange((value) => {
488486

489-
uniforms.get("visibleEdgeColor").value.setHex(value)
490-
.convertSRGBToLinear();
487+
effect.visibleEdgeColor.setHex(value).convertSRGBToLinear();
491488

492489
});
493490

494491
menu.addColor(params, "hidden edge").onChange((value) => {
495492

496-
uniforms.get("hiddenEdgeColor").value.setHex(value)
497-
.convertSRGBToLinear();
493+
effect.hiddenEdgeColor.setHex(value).convertSRGBToLinear();
498494

499495
});
500496

0 commit comments

Comments
 (0)