@mml-io/3d-web-client-core 0.0.0-experimental-26809cc-20240518 → 0.0.0-experimental-2404df1-20240520

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1,22 +1,26 @@
1
1
  import { PerspectiveCamera, Vector3 } from "three";
2
2
  import { CollisionsManager } from "../collisions/CollisionsManager";
3
+ import { TweakPane } from "../tweakpane/TweakPane";
3
4
  export declare class CameraManager {
4
5
  private collisionsManager;
5
6
  readonly camera: PerspectiveCamera;
6
7
  initialDistance: number;
7
- private minDistance;
8
- private maxDistance;
9
- private initialFOV;
10
- private fov;
11
- private minFOV;
12
- private maxFOV;
8
+ minDistance: number;
9
+ maxDistance: number;
10
+ initialFOV: number;
11
+ maxFOV: number;
12
+ minFOV: number;
13
+ damping: number;
14
+ dampingScale: number;
15
+ zoomScale: number;
16
+ invertFOVMapping: boolean;
17
+ fov: number;
13
18
  private targetFOV;
14
19
  minPolarAngle: number;
15
20
  private maxPolarAngle;
16
- private dampingFactor;
17
21
  targetDistance: number;
18
- private distance;
19
- private desiredDistance;
22
+ distance: number;
23
+ desiredDistance: number;
20
24
  private targetPhi;
21
25
  private phi;
22
26
  private targetTheta;
@@ -35,6 +39,7 @@ export declare class CameraManager {
35
39
  private lastTouchX;
36
40
  private lastTouchY;
37
41
  constructor(targetElement: HTMLElement, collisionsManager: CollisionsManager, initialPhi?: number, initialTheta?: number);
42
+ setupTweakPane(tweakPane: TweakPane): void;
38
43
  private onTouchStart;
39
44
  private onTouchMove;
40
45
  private onTouchEnd;
@@ -49,5 +54,6 @@ export declare class CameraManager {
49
54
  dispose(): void;
50
55
  private easeOutExpo;
51
56
  updateAspect(aspect: number): void;
57
+ recomputeFoV(immediately?: boolean): void;
52
58
  update(): void;
53
59
  }
package/build/index.js CHANGED
@@ -235,6 +235,124 @@ var VirtualJoystick = class _VirtualJoystick {
235
235
  }
236
236
  };
237
237
 
238
+ // src/tweakpane/blades/cameraFolder.ts
239
+ var camValues = {
240
+ initialDistance: 3.3,
241
+ minDistance: 0.1,
242
+ maxDistance: 8,
243
+ initialFOV: 60,
244
+ maxFOV: 85,
245
+ minFOV: 60,
246
+ invertFOVMapping: false,
247
+ damping: 0.091,
248
+ dampingScale: 0.01,
249
+ zoomScale: 0.01
250
+ };
251
+ var camOptions = {
252
+ initialDistance: { min: 1, max: 5, step: 0.1 },
253
+ minDistance: { min: 0.1, max: 2, step: 0.1 },
254
+ maxDistance: { min: 5, max: 20, step: 0.5 },
255
+ initialFOV: { min: 60, max: 85, step: 1 },
256
+ maxFOV: { min: 50, max: 100, step: 1 },
257
+ minFOV: { min: 50, max: 100, step: 1 },
258
+ damping: { min: 0.01, max: 0.15, step: 0.01 },
259
+ dampingScale: { min: 1e-3, max: 0.02, step: 1e-3 },
260
+ zoomScale: { min: 5e-3, max: 0.025, step: 1e-3 }
261
+ };
262
+ var CameraFolder = class {
263
+ constructor(parentFolder, expand = false) {
264
+ this.camData = {
265
+ distance: "0",
266
+ FoV: "0"
267
+ };
268
+ this.folder = parentFolder.addFolder({ title: "camera", expanded: expand });
269
+ this.folder.addBinding(this.camData, "distance", { readonly: true });
270
+ this.folder.addBinding(this.camData, "FoV", { readonly: true });
271
+ this.folder.addBinding(camValues, "initialDistance", camOptions.initialDistance);
272
+ this.folder.addBinding(camValues, "minDistance", camOptions.minDistance);
273
+ this.folder.addBinding(camValues, "maxDistance", camOptions.maxDistance);
274
+ this.folder.addBinding(camValues, "minFOV", camOptions.minFOV);
275
+ this.folder.addBinding(camValues, "maxFOV", camOptions.maxFOV);
276
+ this.folder.addBinding({ invertFOVMapping: camValues.invertFOVMapping }, "invertFOVMapping");
277
+ this.folder.addBinding(camValues, "damping", camOptions.damping);
278
+ this.folder.addBinding(camValues, "dampingScale", camOptions.dampingScale);
279
+ this.folder.addBinding(camValues, "zoomScale", camOptions.zoomScale);
280
+ }
281
+ setupChangeEvent(cameraManager) {
282
+ this.folder.on("change", (e) => {
283
+ const target = e.target.key;
284
+ if (!target)
285
+ return;
286
+ switch (target) {
287
+ case "initialDistance": {
288
+ const value = e.value;
289
+ cameraManager.initialDistance = value;
290
+ cameraManager.distance = value;
291
+ cameraManager.targetDistance = value;
292
+ cameraManager.desiredDistance = value;
293
+ cameraManager.recomputeFoV();
294
+ break;
295
+ }
296
+ case "minDistance": {
297
+ const value = e.value;
298
+ cameraManager.minDistance = value;
299
+ cameraManager.distance = value;
300
+ cameraManager.targetDistance = value;
301
+ cameraManager.desiredDistance = value;
302
+ cameraManager.recomputeFoV();
303
+ break;
304
+ }
305
+ case "maxDistance": {
306
+ const value = e.value;
307
+ cameraManager.maxDistance = value;
308
+ cameraManager.distance = value;
309
+ cameraManager.targetDistance = value;
310
+ cameraManager.desiredDistance = value;
311
+ cameraManager.recomputeFoV();
312
+ break;
313
+ }
314
+ case "minFOV": {
315
+ const value = e.value;
316
+ cameraManager.minFOV = value;
317
+ cameraManager.recomputeFoV();
318
+ break;
319
+ }
320
+ case "maxFOV": {
321
+ const value = e.value;
322
+ cameraManager.maxFOV = value;
323
+ cameraManager.recomputeFoV();
324
+ break;
325
+ }
326
+ case "invertFOVMapping":
327
+ const boolValue = e.value;
328
+ cameraManager.invertFOVMapping = boolValue;
329
+ break;
330
+ case "damping": {
331
+ const value = e.value;
332
+ cameraManager.damping = value;
333
+ break;
334
+ }
335
+ case "dampingScale": {
336
+ const value = e.value;
337
+ cameraManager.dampingScale = value;
338
+ break;
339
+ }
340
+ case "zoomScale": {
341
+ const value = e.value;
342
+ cameraManager.zoomScale = value;
343
+ break;
344
+ }
345
+ default:
346
+ break;
347
+ }
348
+ });
349
+ }
350
+ update(cameraManager) {
351
+ this.camData.distance = cameraManager.distance.toFixed(2);
352
+ this.camData.FoV = cameraManager.fov.toFixed(2);
353
+ }
354
+ };
355
+
238
356
  // src/tweakpane/tweakPaneActivity.ts
239
357
  var isTweakpaneActive = false;
240
358
  function setTweakpaneActive(status) {
@@ -248,17 +366,20 @@ function getTweakpaneActive() {
248
366
  var CameraManager = class {
249
367
  constructor(targetElement, collisionsManager, initialPhi = Math.PI / 2, initialTheta = -Math.PI / 2) {
250
368
  this.collisionsManager = collisionsManager;
251
- this.initialDistance = 3.3;
252
- this.minDistance = 0.1;
253
- this.maxDistance = 8;
254
- this.initialFOV = 60;
369
+ this.initialDistance = camValues.initialDistance;
370
+ this.minDistance = camValues.minDistance;
371
+ this.maxDistance = camValues.maxDistance;
372
+ this.initialFOV = camValues.initialFOV;
373
+ this.maxFOV = camValues.maxFOV;
374
+ this.minFOV = camValues.minFOV;
375
+ this.damping = camValues.damping;
376
+ this.dampingScale = 0.01;
377
+ this.zoomScale = camValues.zoomScale;
378
+ this.invertFOVMapping = camValues.invertFOVMapping;
255
379
  this.fov = this.initialFOV;
256
- this.minFOV = 85;
257
- this.maxFOV = 60;
258
380
  this.targetFOV = this.initialFOV;
259
381
  this.minPolarAngle = Math.PI * 0.25;
260
382
  this.maxPolarAngle = Math.PI * 0.95;
261
- this.dampingFactor = 0.091;
262
383
  this.targetDistance = this.initialDistance;
263
384
  this.distance = this.initialDistance;
264
385
  this.desiredDistance = this.initialDistance;
@@ -301,6 +422,9 @@ var CameraManager = class {
301
422
  });
302
423
  }
303
424
  }
425
+ setupTweakPane(tweakPane) {
426
+ tweakPane.setupCamPane(this);
427
+ }
304
428
  onTouchStart(evt) {
305
429
  Array.from(evt.touches).forEach((touch) => {
306
430
  this.dragging = true;
@@ -320,8 +444,8 @@ var CameraManager = class {
320
444
  this.lastTouchX = touch.clientX;
321
445
  this.lastTouchY = touch.clientY;
322
446
  if (this.targetTheta !== null && this.targetPhi !== null) {
323
- this.targetTheta += dx * 0.01;
324
- this.targetPhi -= dy * 0.01;
447
+ this.targetTheta += dx * this.dampingScale;
448
+ this.targetPhi -= dy * this.dampingScale;
325
449
  this.targetPhi = Math.max(this.minPolarAngle, Math.min(this.maxPolarAngle, this.targetPhi));
326
450
  }
327
451
  }
@@ -345,13 +469,13 @@ var CameraManager = class {
345
469
  return;
346
470
  if (this.targetTheta === null || this.targetPhi === null)
347
471
  return;
348
- this.targetTheta += event.movementX * 0.01;
349
- this.targetPhi -= event.movementY * 0.01;
472
+ this.targetTheta += event.movementX * this.dampingScale;
473
+ this.targetPhi -= event.movementY * this.dampingScale;
350
474
  this.targetPhi = Math.max(this.minPolarAngle, Math.min(this.maxPolarAngle, this.targetPhi));
351
475
  event.preventDefault();
352
476
  }
353
477
  onMouseWheel(event) {
354
- const scrollAmount = event.deltaY * 1e-3;
478
+ const scrollAmount = event.deltaY * this.zoomScale * 0.1;
355
479
  this.targetDistance += scrollAmount;
356
480
  this.targetDistance = Math.max(
357
481
  this.minDistance,
@@ -390,14 +514,7 @@ var CameraManager = class {
390
514
  this.theta = this.targetTheta;
391
515
  this.distance = this.targetDistance;
392
516
  this.desiredDistance = this.targetDistance;
393
- this.targetFOV = remap(
394
- this.targetDistance,
395
- this.minDistance,
396
- this.maxDistance,
397
- this.minFOV,
398
- this.maxFOV
399
- );
400
- this.fov = this.targetFOV;
517
+ this.recomputeFoV(true);
401
518
  }
402
519
  adjustCameraPosition() {
403
520
  const offsetDistance = 0.5;
@@ -412,7 +529,7 @@ var CameraManager = class {
412
529
  this.targetDistance = cameraToPlayerDistance - firstRaycastHit[0];
413
530
  this.distance = this.targetDistance;
414
531
  } else {
415
- this.targetDistance += (this.desiredDistance - this.targetDistance) * this.dampingFactor * 4;
532
+ this.targetDistance += (this.desiredDistance - this.targetDistance) * this.damping * 4;
416
533
  }
417
534
  }
418
535
  dispose() {
@@ -424,6 +541,18 @@ var CameraManager = class {
424
541
  updateAspect(aspect) {
425
542
  this.camera.aspect = aspect;
426
543
  }
544
+ recomputeFoV(immediately = false) {
545
+ this.targetFOV = remap(
546
+ this.targetDistance,
547
+ this.minDistance,
548
+ this.maxDistance,
549
+ this.invertFOVMapping ? this.minFOV : this.maxFOV,
550
+ this.invertFOVMapping ? this.maxFOV : this.minFOV
551
+ );
552
+ if (immediately) {
553
+ this.fov = this.targetFOV;
554
+ }
555
+ }
427
556
  update() {
428
557
  if (this.isLerping && this.lerpFactor < 1) {
429
558
  this.lerpFactor += 0.01 / this.lerpDuration;
@@ -433,20 +562,14 @@ var CameraManager = class {
433
562
  this.adjustCameraPosition();
434
563
  }
435
564
  if (this.phi !== null && this.targetPhi !== null && this.theta !== null && this.targetTheta !== null) {
436
- this.distance += (this.targetDistance - this.distance) * this.dampingFactor * 0.21;
437
- this.phi += (this.targetPhi - this.phi) * this.dampingFactor;
438
- this.theta += (this.targetTheta - this.theta) * this.dampingFactor;
565
+ this.distance += (this.targetDistance - this.distance) * this.damping * 0.21;
566
+ this.phi += (this.targetPhi - this.phi) * this.damping;
567
+ this.theta += (this.targetTheta - this.theta) * this.damping;
439
568
  const x = this.target.x + this.distance * Math.sin(this.phi) * Math.cos(this.theta);
440
569
  const y = this.target.y + this.distance * Math.cos(this.phi);
441
570
  const z = this.target.z + this.distance * Math.sin(this.phi) * Math.sin(this.theta);
442
- this.targetFOV = remap(
443
- this.targetDistance,
444
- this.minDistance,
445
- this.maxDistance,
446
- this.minFOV,
447
- this.maxFOV
448
- );
449
- this.fov += (this.targetFOV - this.fov) * this.dampingFactor;
571
+ this.recomputeFoV();
572
+ this.fov += (this.targetFOV - this.fov) * this.damping;
450
573
  this.camera.fov = this.fov;
451
574
  this.camera.updateProjectionMatrix();
452
575
  this.camera.position.set(x, y, z);
@@ -713,7 +836,7 @@ var CharacterMaterial = class extends MeshStandardMaterial {
713
836
  }
714
837
  update() {
715
838
  if (this.config.isLocal) {
716
- this.targetAlpha = this.config.cameraManager.targetDistance < 0.4 ? 0 : 1;
839
+ this.targetAlpha = this.config.cameraManager.distance < 0.4 ? 0 : 1;
717
840
  this.currentAlpha += ease(this.targetAlpha, this.currentAlpha, 0.07);
718
841
  if (this.currentAlpha > 0.999) {
719
842
  this.currentAlpha = 1;
@@ -2200,6 +2323,10 @@ var sunOptions = {
2200
2323
  sunIntensity: { min: 0, max: 10, step: 0.1 }
2201
2324
  };
2202
2325
  var envValues = {
2326
+ hdrAzimuthalAngle: 0,
2327
+ hdrPolarAngle: 0,
2328
+ hdrIntensity: 0.8,
2329
+ hdrBlurriness: 0,
2203
2330
  ambientLight: {
2204
2331
  ambientLightIntensity: 0.27,
2205
2332
  ambientLightColor: { r: 1, g: 1, b: 1 }
@@ -2211,6 +2338,10 @@ var envValues = {
2211
2338
  }
2212
2339
  };
2213
2340
  var envOptions = {
2341
+ hdrAzimuthalAngle: { min: 0, max: 360, step: 1 },
2342
+ hdrPolarAngle: { min: 0, max: 360, step: 1 },
2343
+ hdrIntensity: { min: 0, max: 1.3, step: 0.01 },
2344
+ hdrBlurriness: { min: 0, max: 0.1, step: 1e-3 },
2214
2345
  ambientLight: {
2215
2346
  ambientLightIntensity: { min: 0, max: 1, step: 0.01 }
2216
2347
  },
@@ -2238,7 +2369,11 @@ var EnvironmentFolder = class {
2238
2369
  this.sun.addBinding(sunValues, "sunColor", {
2239
2370
  color: { type: "float" }
2240
2371
  });
2241
- this.sunButton = this.sun.addButton({ title: "Set HDRI" });
2372
+ this.hdrButton = this.ambient.addButton({ title: "Set HDRI" });
2373
+ this.ambient.addBinding(envValues, "hdrIntensity", envOptions.hdrIntensity);
2374
+ this.ambient.addBinding(envValues, "hdrBlurriness", envOptions.hdrBlurriness);
2375
+ this.ambient.addBinding(envValues, "hdrAzimuthalAngle", envOptions.hdrAzimuthalAngle);
2376
+ this.ambient.addBinding(envValues, "hdrPolarAngle", envOptions.hdrPolarAngle);
2242
2377
  this.ambient.addBinding(
2243
2378
  envValues.ambientLight,
2244
2379
  "ambientLightIntensity",
@@ -2253,7 +2388,7 @@ var EnvironmentFolder = class {
2253
2388
  color: { type: "float" }
2254
2389
  });
2255
2390
  }
2256
- setupChangeEvent(setHDR, setAmbientLight, setFog, sun) {
2391
+ setupChangeEvent(scene, setHDR, setHDRAzimuthalAngle, setHDRPolarAngle, setAmbientLight, setFog, sun) {
2257
2392
  this.sun.on("change", (e) => {
2258
2393
  const target = e.target.key;
2259
2394
  if (!target)
@@ -2288,7 +2423,7 @@ var EnvironmentFolder = class {
2288
2423
  break;
2289
2424
  }
2290
2425
  });
2291
- this.sunButton.on("click", () => {
2426
+ this.hdrButton.on("click", () => {
2292
2427
  setHDR();
2293
2428
  });
2294
2429
  this.ambient.on("change", (e) => {
@@ -2296,6 +2431,22 @@ var EnvironmentFolder = class {
2296
2431
  if (!target)
2297
2432
  return;
2298
2433
  switch (target) {
2434
+ case "hdrAzimuthalAngle": {
2435
+ const value = e.value;
2436
+ setHDRAzimuthalAngle(value);
2437
+ break;
2438
+ }
2439
+ case "hdrPolarAngle": {
2440
+ const value = e.value;
2441
+ setHDRPolarAngle(value);
2442
+ break;
2443
+ }
2444
+ case "hdrIntensity":
2445
+ scene.backgroundIntensity = e.value;
2446
+ break;
2447
+ case "hdrBlurriness":
2448
+ scene.backgroundBlurriness = e.value;
2449
+ break;
2299
2450
  case "ambientLightIntensity": {
2300
2451
  envValues.ambientLight.ambientLightIntensity = e.value;
2301
2452
  setAmbientLight();
@@ -2341,7 +2492,7 @@ var EnvironmentFolder = class {
2341
2492
  // src/tweakpane/blades/postExtrasFolder.ts
2342
2493
  var extrasValues = {
2343
2494
  grain: 0.045,
2344
- bloom: 0.75
2495
+ bloom: 0.15
2345
2496
  };
2346
2497
  var extrasOptions = {
2347
2498
  grain: {
@@ -2380,16 +2531,12 @@ var PostExtrasFolder = class {
2380
2531
  var rendererValues = {
2381
2532
  shadowMap: 2,
2382
2533
  toneMapping: 5,
2383
- exposure: 1.7,
2384
- bgIntensity: 0.8,
2385
- bgBlurriness: 0
2534
+ exposure: 1.7
2386
2535
  };
2387
2536
  var rendererOptions = {
2388
2537
  shadowMap: { min: 0, max: 2, step: 1 },
2389
2538
  toneMapping: { min: 0, max: 5, step: 1 },
2390
- exposure: { min: 0, max: 3, step: 0.01 },
2391
- bgIntensity: { min: 0, max: 1.3, step: 0.01 },
2392
- bgBlurriness: { min: 0, max: 0.1, step: 1e-3 }
2539
+ exposure: { min: 0, max: 3, step: 0.01 }
2393
2540
  };
2394
2541
  var shadowMapTypes = {
2395
2542
  0: "BasicShadowMap",
@@ -2427,10 +2574,8 @@ var RendererFolder = class {
2427
2574
  this.folder.addBinding(rendererValues, "toneMapping", rendererOptions.toneMapping);
2428
2575
  this.folder.addBinding(monitoredValues, "toneMappingType", { readonly: true });
2429
2576
  this.folder.addBinding(rendererValues, "exposure", rendererOptions.exposure);
2430
- this.folder.addBinding(rendererValues, "bgIntensity", rendererOptions.bgIntensity);
2431
- this.folder.addBinding(rendererValues, "bgBlurriness", rendererOptions.bgBlurriness);
2432
2577
  }
2433
- setupChangeEvent(scene, renderer, toneMappingFolder, toneMappingPass) {
2578
+ setupChangeEvent(renderer, toneMappingFolder, toneMappingPass) {
2434
2579
  this.folder.on("change", (e) => {
2435
2580
  const target = e.target.key;
2436
2581
  if (!target)
@@ -2451,12 +2596,6 @@ var RendererFolder = class {
2451
2596
  case "exposure":
2452
2597
  renderer.toneMappingExposure = e.value;
2453
2598
  break;
2454
- case "bgIntensity":
2455
- scene.backgroundIntensity = e.value;
2456
- break;
2457
- case "bgBlurriness":
2458
- scene.backgroundBlurriness = e.value;
2459
- break;
2460
2599
  default:
2461
2600
  break;
2462
2601
  }
@@ -2545,7 +2684,7 @@ var n8ssaoValues = {
2545
2684
  halfRes: true,
2546
2685
  aoRadius: 5,
2547
2686
  distanceFalloff: 3,
2548
- intensity: 1,
2687
+ intensity: 1.5,
2549
2688
  color: { r: 0, g: 0, b: 0 },
2550
2689
  aoSamples: 16,
2551
2690
  denoiseSamples: 4,
@@ -2969,6 +3108,7 @@ var TweakPane = class {
2969
3108
  this.postExtrasFolder = new PostExtrasFolder(this.gui, false);
2970
3109
  this.character = new CharacterFolder(this.gui, false);
2971
3110
  this.environment = new EnvironmentFolder(this.gui, false);
3111
+ this.camera = new CameraFolder(this.gui, false);
2972
3112
  this.toneMappingFolder.folder.hidden = rendererValues.toneMapping === 5 ? false : true;
2973
3113
  this.export = this.gui.addFolder({ title: "import / export", expanded: false });
2974
3114
  window.addEventListener("keydown", this.processKey.bind(this));
@@ -2988,9 +3128,8 @@ var TweakPane = class {
2988
3128
  if (e.key === "p")
2989
3129
  this.toggleGUI();
2990
3130
  }
2991
- setupRenderPane(composer, normalPass, ppssaoEffect, ppssaoPass, n8aopass, toneMappingEffect, toneMappingPass, brightnessContrastSaturation, bloomEffect, gaussGrainEffect, hasLighting, sun, setHDR, setAmbientLight, setFog) {
3131
+ setupRenderPane(composer, normalPass, ppssaoEffect, ppssaoPass, n8aopass, toneMappingEffect, toneMappingPass, brightnessContrastSaturation, bloomEffect, gaussGrainEffect, hasLighting, sun, setHDR, setHDRAzimuthalAngle, setHDRPolarAngle, setAmbientLight, setFog) {
2992
3132
  this.rendererFolder.setupChangeEvent(
2993
- this.scene,
2994
3133
  this.renderer,
2995
3134
  this.toneMappingFolder.folder,
2996
3135
  toneMappingPass
@@ -2999,7 +3138,15 @@ var TweakPane = class {
2999
3138
  this.ssaoFolder.setupChangeEvent(composer, normalPass, ppssaoEffect, ppssaoPass, n8aopass);
3000
3139
  this.bcsFolder.setupChangeEvent(brightnessContrastSaturation);
3001
3140
  this.postExtrasFolder.setupChangeEvent(bloomEffect, gaussGrainEffect);
3002
- this.environment.setupChangeEvent(setHDR, setAmbientLight, setFog, sun);
3141
+ this.environment.setupChangeEvent(
3142
+ this.scene,
3143
+ setHDR,
3144
+ setHDRAzimuthalAngle,
3145
+ setHDRPolarAngle,
3146
+ setAmbientLight,
3147
+ setFog,
3148
+ sun
3149
+ );
3003
3150
  this.environment.folder.hidden = hasLighting === false || sun === null;
3004
3151
  const exportButton = this.export.addButton({ title: "export" });
3005
3152
  exportButton.on("click", () => {
@@ -3012,9 +3159,15 @@ var TweakPane = class {
3012
3159
  });
3013
3160
  });
3014
3161
  }
3162
+ setupCamPane(cameraManager) {
3163
+ this.camera.setupChangeEvent(cameraManager);
3164
+ }
3015
3165
  updateStats(timeManager) {
3016
3166
  this.renderStatsFolder.update(this.renderer, this.composer, timeManager);
3017
3167
  }
3168
+ updateCameraData(cameraManager) {
3169
+ this.camera.update(cameraManager);
3170
+ }
3018
3171
  formatDateForFilename() {
3019
3172
  const date = /* @__PURE__ */ new Date();
3020
3173
  const year = date.getFullYear();
@@ -3100,7 +3253,9 @@ import {
3100
3253
  Scene as Scene4,
3101
3254
  Vector2 as Vector27,
3102
3255
  WebGLRenderer as WebGLRenderer4,
3103
- EquirectangularReflectionMapping
3256
+ EquirectangularReflectionMapping,
3257
+ MathUtils,
3258
+ Euler as Euler3
3104
3259
  } from "three";
3105
3260
  import { RGBELoader } from "three/examples/jsm/loaders/RGBELoader.js";
3106
3261
 
@@ -4667,6 +4822,8 @@ var Composer = class {
4667
4822
  this.renderer.shadowMap.type = rendererValues.shadowMap;
4668
4823
  this.renderer.toneMapping = rendererValues.toneMapping;
4669
4824
  this.renderer.toneMappingExposure = rendererValues.exposure;
4825
+ this.scene.backgroundIntensity = envValues.hdrIntensity;
4826
+ this.scene.backgroundBlurriness = envValues.hdrBlurriness;
4670
4827
  this.setAmbientLight();
4671
4828
  this.setFog();
4672
4829
  this.effectComposer = new EffectComposer2(this.renderer, {
@@ -4780,6 +4937,8 @@ var Composer = class {
4780
4937
  this.spawnSun,
4781
4938
  this.sun,
4782
4939
  this.setHDRIFromFile.bind(this),
4940
+ this.setHDRAzimuthalAngle.bind(this),
4941
+ this.setHDRPolarAngle.bind(this),
4783
4942
  this.setAmbientLight.bind(this),
4784
4943
  this.setFog.bind(this)
4785
4944
  );
@@ -4834,6 +4993,20 @@ var Composer = class {
4834
4993
  this.renderer.clearDepth();
4835
4994
  this.renderer.render(this.postPostScene, this.camera);
4836
4995
  }
4996
+ setHDRAzimuthalAngle(azimuthalAngle) {
4997
+ this.scene.backgroundRotation = new Euler3(
4998
+ MathUtils.degToRad(envValues.hdrPolarAngle),
4999
+ MathUtils.degToRad(azimuthalAngle),
5000
+ 0
5001
+ );
5002
+ }
5003
+ setHDRPolarAngle(polarAngle) {
5004
+ this.scene.backgroundRotation = new Euler3(
5005
+ MathUtils.degToRad(polarAngle),
5006
+ MathUtils.degToRad(envValues.hdrAzimuthalAngle),
5007
+ 0
5008
+ );
5009
+ }
4837
5010
  useHDRJPG(url, fromFile = false) {
4838
5011
  const pmremGenerator = new PMREMGenerator(this.renderer);
4839
5012
  const hdrJpg = new HDRJPGLoader(this.renderer).load(url, () => {
@@ -4845,7 +5018,13 @@ var Composer = class {
4845
5018
  envMap.colorSpace = LinearSRGBColorSpace;
4846
5019
  envMap.needsUpdate = true;
4847
5020
  this.scene.background = envMap;
4848
- this.scene.backgroundIntensity = rendererValues.bgIntensity;
5021
+ this.scene.backgroundIntensity = envValues.hdrIntensity;
5022
+ this.scene.backgroundBlurriness = envValues.hdrBlurriness;
5023
+ this.scene.backgroundRotation = new Euler3(
5024
+ MathUtils.degToRad(envValues.hdrPolarAngle),
5025
+ MathUtils.degToRad(envValues.hdrAzimuthalAngle),
5026
+ 0
5027
+ );
4849
5028
  this.isEnvHDRI = true;
4850
5029
  hdrJpgEquirectangularMap.dispose();
4851
5030
  pmremGenerator.dispose();
@@ -4865,7 +5044,8 @@ var Composer = class {
4865
5044
  envMap.colorSpace = LinearSRGBColorSpace;
4866
5045
  envMap.needsUpdate = true;
4867
5046
  this.scene.background = envMap;
4868
- this.scene.backgroundIntensity = rendererValues.bgIntensity;
5047
+ this.scene.backgroundIntensity = envValues.hdrIntensity;
5048
+ this.scene.backgroundBlurriness = envValues.hdrBlurriness;
4869
5049
  this.isEnvHDRI = true;
4870
5050
  texture.dispose();
4871
5051
  pmremGenerator.dispose();
@@ -4989,7 +5169,7 @@ import {
4989
5169
  Box3,
4990
5170
  Color as Color8,
4991
5171
  DoubleSide,
4992
- Euler as Euler3,
5172
+ Euler as Euler4,
4993
5173
  Group as Group5,
4994
5174
  Line3 as Line32,
4995
5175
  Matrix4 as Matrix46,
@@ -4997,7 +5177,7 @@ import {
4997
5177
  MeshBasicMaterial as MeshBasicMaterial3,
4998
5178
  Quaternion as Quaternion6,
4999
5179
  Ray as Ray2,
5000
- Vector3 as Vector315
5180
+ Vector3 as Vector314
5001
5181
  } from "three";
5002
5182
  import { VertexNormalsHelper } from "three/examples/jsm/helpers/VertexNormalsHelper.js";
5003
5183
  import * as BufferGeometryUtils from "three/examples/jsm/utils/BufferGeometryUtils.js";
@@ -5005,15 +5185,15 @@ import { MeshBVH, MeshBVHHelper } from "three-mesh-bvh";
5005
5185
  var CollisionsManager = class {
5006
5186
  constructor(scene) {
5007
5187
  this.debug = false;
5008
- this.tempVector = new Vector315();
5009
- this.tempVector2 = new Vector315();
5010
- this.tempVector3 = new Vector315();
5188
+ this.tempVector = new Vector314();
5189
+ this.tempVector2 = new Vector314();
5190
+ this.tempVector3 = new Vector314();
5011
5191
  this.tempQuaternion = new Quaternion6();
5012
5192
  this.tempRay = new Ray2();
5013
5193
  this.tempMatrix = new Matrix46();
5014
5194
  this.tempMatrix2 = new Matrix46();
5015
5195
  this.tempBox = new Box3();
5016
- this.tempEuler = new Euler3();
5196
+ this.tempEuler = new Euler4();
5017
5197
  this.tempSegment = new Line32();
5018
5198
  this.tempSegment2 = new Line32();
5019
5199
  this.collisionMeshState = /* @__PURE__ */ new Map();
@@ -5023,7 +5203,7 @@ var CollisionsManager = class {
5023
5203
  raycastFirst(ray) {
5024
5204
  let minimumDistance = null;
5025
5205
  let minimumHit = null;
5026
- let minimumNormal = new Vector315();
5206
+ let minimumNormal = new Vector314();
5027
5207
  for (const [, collisionMeshState] of this.collisionMeshState) {
5028
5208
  this.tempRay.copy(ray).applyMatrix4(this.tempMatrix.copy(collisionMeshState.matrix).invert());
5029
5209
  const hit = collisionMeshState.meshBVH.raycastFirst(this.tempRay, DoubleSide);
@@ -5164,7 +5344,7 @@ var CollisionsManager = class {
5164
5344
  const realDistance = intersectionSegment.distance();
5165
5345
  if (realDistance < capsuleRadius) {
5166
5346
  if (!collisionPosition) {
5167
- collisionPosition = new Vector315().copy(closestPointOnSegment).applyMatrix4(meshState.matrix);
5347
+ collisionPosition = new Vector314().copy(closestPointOnSegment).applyMatrix4(meshState.matrix);
5168
5348
  }
5169
5349
  const ratio = realDistance / modelReferenceDistance;
5170
5350
  const realDepth = capsuleRadius - realDistance;