From 015e6d1c81be3988df70b238843ef17fac121359 Mon Sep 17 00:00:00 2001 From: syuilo <4439005+syuilo@users.noreply.github.com> Date: Mon, 4 May 2026 09:14:58 +0900 Subject: [PATCH] wip --- packages/frontend/src/world/room/engine.ts | 3 ++- packages/frontend/src/world/room/object.ts | 1 + packages/frontend/src/world/room/objects/allInOnePc.ts | 5 +++-- packages/frontend/src/world/room/objects/beamLamp.ts | 5 +++-- packages/frontend/src/world/room/objects/desktopPc.ts | 7 ++++--- .../src/world/room/objects/ductRailSpotLights.ts | 5 +++-- packages/frontend/src/world/room/objects/laptopPc.ts | 5 +++-- packages/frontend/src/world/room/objects/lavaLamp.ts | 6 ++++-- packages/frontend/src/world/room/objects/monitor.ts | 5 +++-- packages/frontend/src/world/room/objects/tv.ts | 6 +++--- .../src/world/room/objects/wallMountSpotLight.ts | 5 +++-- .../src/world/room/objects/woodRingFloorLamp.ts | 5 +++-- .../src/world/room/objects/woodRingsPendantLight.ts | 5 +++-- packages/frontend/src/world/room/previewEngine.ts | 3 ++- packages/frontend/src/world/room/utility.ts | 10 ++++++++++ 15 files changed, 50 insertions(+), 26 deletions(-) diff --git a/packages/frontend/src/world/room/engine.ts b/packages/frontend/src/world/room/engine.ts index be4d3a9b4c..a4a6235d6f 100644 --- a/packages/frontend/src/world/room/engine.ts +++ b/packages/frontend/src/world/room/engine.ts @@ -274,7 +274,7 @@ export class RoomEngine extends EventEmitter { //this.scene.activeCamera = this.camera; this.lightContainer = new BABYLON.ClusteredLightContainer('clustered', [], this.scene); - this.lightContainer.maxRange = this.graphicsQuality >= GRAPHICS_QUALITY.HIGH ? cm(200) : this.graphicsQuality >= GRAPHICS_QUALITY.MEDIUM ? cm(90) : cm(30); + this.lightContainer.maxRange = cm(1000); this.lightContainer.verticalTiles = 32; this.lightContainer.horizontalTiles = 32; this.lightContainer.depthSlices = 32; @@ -890,6 +890,7 @@ export class RoomEngine extends EventEmitter { model, id: args.id, timer: this.timer, // TODO: 家具が撤去された後も動作し続けるのをどうにかする + graphicsQuality: this.graphicsQuality, stickyMarkerMeshUpdated: (mesh) => { // TODO //// stickyな子の位置を更新 diff --git a/packages/frontend/src/world/room/object.ts b/packages/frontend/src/world/room/object.ts index 41b2ac1919..596b7d4867 100644 --- a/packages/frontend/src/world/room/object.ts +++ b/packages/frontend/src/world/room/object.ts @@ -119,6 +119,7 @@ export type ObjectDef = { model: ModelManager; id: string; timer: Timer; + graphicsQuality: number; stickyMarkerMeshUpdated?: (mesh: BABYLON.Mesh) => void; }) => RoomObjectInstance> | Promise>>; // TODO: createInstanceをasyncにするのではなく、別にreadyみたいなものを返させる }; diff --git a/packages/frontend/src/world/room/objects/allInOnePc.ts b/packages/frontend/src/world/room/objects/allInOnePc.ts index d3e8286e58..26b5d5e049 100644 --- a/packages/frontend/src/world/room/objects/allInOnePc.ts +++ b/packages/frontend/src/world/room/objects/allInOnePc.ts @@ -6,6 +6,7 @@ import * as BABYLON from '@babylonjs/core'; import { defineObject } from '../object.js'; import { cm, WORLD_SCALE, createPlaneUvMapper } from '../../utility.js'; +import { getLightRangeFactorByGraphicsQuality } from '../utility.js'; export const allInOnePc = defineObject({ id: 'allInOnePc', @@ -47,7 +48,7 @@ export const allInOnePc = defineObject({ }, placement: 'top', hasTexture: true, - createInstance: async ({ room, scene, options, model }) => { + createInstance: async ({ room, scene, options, model, graphicsQuality }) => { const matrix = model.root.getWorldMatrix(true); const scale = new BABYLON.Vector3(); matrix.decompose(scale); @@ -55,7 +56,7 @@ export const allInOnePc = defineObject({ const light = new BABYLON.SpotLight('', new BABYLON.Vector3(cm(0), cm(30) / Math.abs(scale.y), 0), new BABYLON.Vector3(0, 0, 1), Math.PI / 1, 2, scene, room?.lightContainer != null); light.parent = model.root; light.diffuse = new BABYLON.Color3(1.0, 1.0, 1.0); - light.range = cm(100); + light.range = cm(100) * getLightRangeFactorByGraphicsQuality(graphicsQuality); light.radius = cm(20); if (room?.lightContainer != null) room.lightContainer.addLight(light); diff --git a/packages/frontend/src/world/room/objects/beamLamp.ts b/packages/frontend/src/world/room/objects/beamLamp.ts index a42a09445c..47195b8e3a 100644 --- a/packages/frontend/src/world/room/objects/beamLamp.ts +++ b/packages/frontend/src/world/room/objects/beamLamp.ts @@ -6,6 +6,7 @@ import * as BABYLON from '@babylonjs/core'; import { defineObject } from '../object.js'; import { cm, WORLD_SCALE } from '../../utility.js'; +import { getLightRangeFactorByGraphicsQuality } from '../utility.js'; export const beamLamp = defineObject({ id: 'beamLamp', @@ -17,14 +18,14 @@ export const beamLamp = defineObject({ placement: 'top', hasCollisions: false, canPreMeshesMerging: true, - createInstance: ({ room, root, scene }) => { + createInstance: ({ room, root, scene, graphicsQuality }) => { return { onInited: () => { const light = new BABYLON.PointLight('beamLampLight', new BABYLON.Vector3(0, cm(10), 0), scene, room?.lightContainer != null); light.parent = root; light.diffuse = new BABYLON.Color3(1.0, 0.5, 0.2); light.intensity = 0.03 * WORLD_SCALE * WORLD_SCALE; - light.range = cm(100); + light.range = cm(100) * getLightRangeFactorByGraphicsQuality(graphicsQuality); if (room?.lightContainer != null) room.lightContainer.addLight(light); }, interactions: {}, diff --git a/packages/frontend/src/world/room/objects/desktopPc.ts b/packages/frontend/src/world/room/objects/desktopPc.ts index 6b27008636..ada39c4d79 100644 --- a/packages/frontend/src/world/room/objects/desktopPc.ts +++ b/packages/frontend/src/world/room/objects/desktopPc.ts @@ -6,6 +6,7 @@ import * as BABYLON from '@babylonjs/core'; import { defineObject } from '../object.js'; import { cm, WORLD_SCALE } from '../../utility.js'; +import { getLightRangeFactorByGraphicsQuality } from '../utility.js'; export const desktopPc = defineObject({ id: 'desktopPc', @@ -49,17 +50,17 @@ export const desktopPc = defineObject({ placement: 'top', hasCollisions: true, canPreMeshesMerging: true, - createInstance: ({ options, model, root, scene, room }) => { + createInstance: ({ options, model, root, scene, room, graphicsQuality }) => { const light1 = new BABYLON.SpotLight('', new BABYLON.Vector3(0, cm(10), cm(22)), new BABYLON.Vector3(0, 0, 1), Math.PI / 1, 2, scene, room?.lightContainer != null); light1.parent = root; light1.intensity = 0.05 * WORLD_SCALE * WORLD_SCALE; - light1.range = cm(30); + light1.range = cm(30) * getLightRangeFactorByGraphicsQuality(graphicsQuality); if (room?.lightContainer != null) room.lightContainer.addLight(light1); const light2 = new BABYLON.SpotLight('', new BABYLON.Vector3(cm(-5), cm(33), cm(-9)), new BABYLON.Vector3(1, 0, 0), Math.PI / 1, 2, scene, room?.lightContainer != null); light2.parent = root; light2.intensity = 0.05 * WORLD_SCALE * WORLD_SCALE; - light2.range = cm(30); + light2.range = cm(30) * getLightRangeFactorByGraphicsQuality(graphicsQuality); if (room?.lightContainer != null) room.lightContainer.addLight(light2); const bodyMaterial = model.findMaterial('__X_BODY__'); diff --git a/packages/frontend/src/world/room/objects/ductRailSpotLights.ts b/packages/frontend/src/world/room/objects/ductRailSpotLights.ts index 77270e644e..32b776ed11 100644 --- a/packages/frontend/src/world/room/objects/ductRailSpotLights.ts +++ b/packages/frontend/src/world/room/objects/ductRailSpotLights.ts @@ -5,6 +5,7 @@ import * as BABYLON from '@babylonjs/core'; import { defineObject } from '../object.js'; +import { getLightRangeFactorByGraphicsQuality } from '../utility.js'; import { cm, remap, WORLD_SCALE } from '@/world/utility.js'; export const ductRailSpotLights = defineObject({ @@ -52,7 +53,7 @@ export const ductRailSpotLights = defineObject({ }, placement: 'ceiling', hasCollisions: false, - createInstance: ({ room, scene, options, model }) => { + createInstance: ({ room, scene, options, model, graphicsQuality }) => { const bodyMaterial = model.findMaterial('__X_BODY__'); const applyBodyColor = () => { @@ -88,7 +89,7 @@ export const ductRailSpotLights = defineObject({ const applyLightBrightness = () => { for (const light of lights) { light.intensity = 2 * options.lightBrightness * WORLD_SCALE * WORLD_SCALE; - light.range = cm(300); + light.range = cm(300) * getLightRangeFactorByGraphicsQuality(graphicsQuality); } for (const lamp of lamps) { const emissive = lamp.material as BABYLON.PBRMaterial; diff --git a/packages/frontend/src/world/room/objects/laptopPc.ts b/packages/frontend/src/world/room/objects/laptopPc.ts index ce05e50a00..7d4d49a3a4 100644 --- a/packages/frontend/src/world/room/objects/laptopPc.ts +++ b/packages/frontend/src/world/room/objects/laptopPc.ts @@ -6,6 +6,7 @@ import * as BABYLON from '@babylonjs/core'; import { defineObject } from '../object.js'; import { cm, WORLD_SCALE, createPlaneUvMapper } from '../../utility.js'; +import { getLightRangeFactorByGraphicsQuality } from '../utility.js'; export const laptopPc = defineObject({ id: 'laptopPc', @@ -56,7 +57,7 @@ export const laptopPc = defineObject({ placement: 'top', hasCollisions: false, hasTexture: true, - createInstance: async ({ room, scene, options, model }) => { + createInstance: async ({ room, scene, options, model, graphicsQuality }) => { const matrix = model.root.getWorldMatrix(true); const scale = new BABYLON.Vector3(); matrix.decompose(scale); @@ -67,7 +68,7 @@ export const laptopPc = defineObject({ const light = new BABYLON.SpotLight('', new BABYLON.Vector3(cm(0), cm(10) / Math.abs(scale.y), 0), new BABYLON.Vector3(0, 0, 1), Math.PI / 1, 2, scene, room?.lightContainer != null); light.parent = hutaNode; light.diffuse = new BABYLON.Color3(1.0, 1.0, 1.0); - light.range = cm(100); + light.range = cm(100) * getLightRangeFactorByGraphicsQuality(graphicsQuality); light.radius = cm(15); if (room?.lightContainer != null) room.lightContainer.addLight(light); diff --git a/packages/frontend/src/world/room/objects/lavaLamp.ts b/packages/frontend/src/world/room/objects/lavaLamp.ts index 2dfd1a43e1..820e8352a8 100644 --- a/packages/frontend/src/world/room/objects/lavaLamp.ts +++ b/packages/frontend/src/world/room/objects/lavaLamp.ts @@ -5,6 +5,7 @@ import * as BABYLON from '@babylonjs/core'; import { defineObject } from '../object.js'; import { cm, WORLD_SCALE } from '../../utility.js'; +import { getLightRangeFactorByGraphicsQuality } from '../utility.js'; export const lavaLamp = defineObject({ id: 'lavaLamp', @@ -38,7 +39,7 @@ export const lavaLamp = defineObject({ placement: 'top', hasCollisions: false, canPreMeshesMerging: true, - createInstance: ({ options, room, scene, root, model }) => { + createInstance: ({ options, room, scene, root, model, graphicsQuality }) => { const bodyMaterial = model.findMaterial('__X_BODY__'); const glassMaterial = model.findMaterial('__X_GLASS__'); const lightMaterial = model.findMaterial('__X_LIGHT__'); @@ -60,7 +61,8 @@ export const lavaLamp = defineObject({ const light = new BABYLON.PointLight('lavaLampLight', new BABYLON.Vector3(0, cm(11), 0), scene, room?.lightContainer != null); light.parent = root; light.intensity = 0.03 * WORLD_SCALE * WORLD_SCALE; - light.range = cm(50); + light.range = cm(50) * getLightRangeFactorByGraphicsQuality(graphicsQuality); + light.radius = cm(5); if (room?.lightContainer != null) room.lightContainer.addLight(light); const applyLightColor = () => { diff --git a/packages/frontend/src/world/room/objects/monitor.ts b/packages/frontend/src/world/room/objects/monitor.ts index f46778ccb5..82567be1ca 100644 --- a/packages/frontend/src/world/room/objects/monitor.ts +++ b/packages/frontend/src/world/room/objects/monitor.ts @@ -6,6 +6,7 @@ import * as BABYLON from '@babylonjs/core'; import { defineObject } from '../object.js'; import { cm, WORLD_SCALE, createPlaneUvMapper, normalizeUvToSquare } from '../../utility.js'; +import { getLightRangeFactorByGraphicsQuality } from '../utility.js'; export const monitor = defineObject({ id: 'monitor', @@ -42,7 +43,7 @@ export const monitor = defineObject({ }, placement: 'top', hasTexture: true, - createInstance: async ({ room, scene, options, model }) => { + createInstance: async ({ room, scene, options, model, graphicsQuality }) => { const matrix = model.root.getWorldMatrix(true); const scale = new BABYLON.Vector3(); matrix.decompose(scale); @@ -50,7 +51,7 @@ export const monitor = defineObject({ const light = new BABYLON.SpotLight('', new BABYLON.Vector3(cm(0), cm(20) / Math.abs(scale.y), 0), new BABYLON.Vector3(0, 0, 1), Math.PI / 1, 2, scene, room?.lightContainer != null); light.parent = model.root; light.diffuse = new BABYLON.Color3(1.0, 1.0, 1.0); - light.range = cm(100); + light.range = cm(100) * getLightRangeFactorByGraphicsQuality(graphicsQuality); light.radius = cm(20); if (room?.lightContainer != null) room.lightContainer.addLight(light); diff --git a/packages/frontend/src/world/room/objects/tv.ts b/packages/frontend/src/world/room/objects/tv.ts index ad2a535aab..8b5c1eb801 100644 --- a/packages/frontend/src/world/room/objects/tv.ts +++ b/packages/frontend/src/world/room/objects/tv.ts @@ -5,7 +5,7 @@ import * as BABYLON from '@babylonjs/core'; import { defineObject } from '../object.js'; -import { initTv } from '../utility.js'; +import { getLightRangeFactorByGraphicsQuality, initTv } from '../utility.js'; import { cm, WORLD_SCALE } from '@/world/utility.js'; export const tv = defineObject({ @@ -33,7 +33,7 @@ export const tv = defineObject({ placement: 'top', hasCollisions: true, hasTexture: true, - createInstance: ({ options, room, model, scene, timer }) => { + createInstance: ({ options, room, model, scene, timer, graphicsQuality }) => { const matrix = model.root.getWorldMatrix(true); const scale = new BABYLON.Vector3(); matrix.decompose(scale); @@ -41,7 +41,7 @@ export const tv = defineObject({ const light = new BABYLON.SpotLight('', new BABYLON.Vector3(cm(0), cm(30) / Math.abs(scale.y), 0), new BABYLON.Vector3(0, 0, 1), Math.PI / 1, 2, scene, room?.lightContainer != null); light.parent = model.root; light.diffuse = new BABYLON.Color3(1.0, 1.0, 1.0); - light.range = cm(200); + light.range = cm(200) * getLightRangeFactorByGraphicsQuality(graphicsQuality); light.radius = cm(40); if (room?.lightContainer != null) room.lightContainer.addLight(light); diff --git a/packages/frontend/src/world/room/objects/wallMountSpotLight.ts b/packages/frontend/src/world/room/objects/wallMountSpotLight.ts index 36f20f862c..64277767d6 100644 --- a/packages/frontend/src/world/room/objects/wallMountSpotLight.ts +++ b/packages/frontend/src/world/room/objects/wallMountSpotLight.ts @@ -5,6 +5,7 @@ import * as BABYLON from '@babylonjs/core'; import { defineObject } from '../object.js'; +import { getLightRangeFactorByGraphicsQuality } from '../utility.js'; import { cm, WORLD_SCALE } from '@/world/utility.js'; export const wallMountSpotLight = defineObject({ @@ -54,7 +55,7 @@ export const wallMountSpotLight = defineObject({ hasCollisions: false, canPreMeshesMerging: false, hasTexture: false, - createInstance: ({ room, scene, options, model }) => { + createInstance: ({ room, scene, options, model, graphicsQuality }) => { const bodyMesh = model.findMesh('__X_BODY__'); const bodyMaterial = model.findMaterial('__X_BODY__'); @@ -82,7 +83,7 @@ export const wallMountSpotLight = defineObject({ const applyLightBrightness = () => { light.intensity = 1 * options.lightBrightness * WORLD_SCALE * WORLD_SCALE; - light.range = cm(200); + light.range = cm(200) * getLightRangeFactorByGraphicsQuality(graphicsQuality); const emissive = lamp.material as BABYLON.PBRMaterial; emissive.emissiveIntensity = options.lightBrightness * 20; }; diff --git a/packages/frontend/src/world/room/objects/woodRingFloorLamp.ts b/packages/frontend/src/world/room/objects/woodRingFloorLamp.ts index 807a972b4e..baca0198d7 100644 --- a/packages/frontend/src/world/room/objects/woodRingFloorLamp.ts +++ b/packages/frontend/src/world/room/objects/woodRingFloorLamp.ts @@ -5,6 +5,7 @@ import * as BABYLON from '@babylonjs/core'; import { defineObject } from '../object.js'; +import { getLightRangeFactorByGraphicsQuality } from '../utility.js'; import { cm, WORLD_SCALE } from '@/world/utility.js'; export const woodRingFloorLamp = defineObject({ @@ -41,7 +42,7 @@ export const woodRingFloorLamp = defineObject({ }, placement: 'floor', hasCollisions: true, - createInstance: ({ room, scene, options, model }) => { + createInstance: ({ room, scene, options, model, graphicsQuality }) => { const shadeMaterial = model.findMaterial('__X_SHADE__'); const applyShadeColor = () => { @@ -86,7 +87,7 @@ export const woodRingFloorLamp = defineObject({ const applyLightBrightness = () => { for (const light of lights) { light.intensity = 1 * options.lightBrightness * WORLD_SCALE * WORLD_SCALE; - light.range = cm(200); + light.range = cm(200) * getLightRangeFactorByGraphicsQuality(graphicsQuality); } for (const lamp of lamps) { const emissive = lamp.material as BABYLON.PBRMaterial; diff --git a/packages/frontend/src/world/room/objects/woodRingsPendantLight.ts b/packages/frontend/src/world/room/objects/woodRingsPendantLight.ts index 5016526c3e..6b3d32e5c5 100644 --- a/packages/frontend/src/world/room/objects/woodRingsPendantLight.ts +++ b/packages/frontend/src/world/room/objects/woodRingsPendantLight.ts @@ -5,6 +5,7 @@ import * as BABYLON from '@babylonjs/core'; import { defineObject } from '../object.js'; +import { getLightRangeFactorByGraphicsQuality } from '../utility.js'; import { cm, WORLD_SCALE } from '@/world/utility.js'; const remap = (value: number, fromMin: number, fromMax: number, toMin: number, toMax: number) => { @@ -53,7 +54,7 @@ export const woodRingsPendantLight = defineObject({ }, placement: 'ceiling', hasCollisions: false, - createInstance: ({ room, scene, options, model }) => { + createInstance: ({ room, scene, options, model, graphicsQuality }) => { const shadeMaterial = model.findMaterial('__X_SHADE__'); const applyShadeColor = () => { @@ -96,7 +97,7 @@ export const woodRingsPendantLight = defineObject({ const applyLightBrightness = () => { light.intensity = 1 * options.lightBrightness * WORLD_SCALE * WORLD_SCALE; - light.range = cm(200) * options.lightBrightness; + light.range = cm(200) * getLightRangeFactorByGraphicsQuality(graphicsQuality); const emissive = lamp.material as BABYLON.PBRMaterial; emissive.emissiveIntensity = options.lightBrightness * 10; }; diff --git a/packages/frontend/src/world/room/previewEngine.ts b/packages/frontend/src/world/room/previewEngine.ts index 97913a2351..fdb48be007 100644 --- a/packages/frontend/src/world/room/previewEngine.ts +++ b/packages/frontend/src/world/room/previewEngine.ts @@ -8,7 +8,7 @@ import { registerBuiltInLoaders } from '@babylonjs/loaders/dynamic.js'; import { GridMaterial } from '@babylonjs/materials'; import { camelToKebab, WORLD_SCALE, cm, getMeshesBoundingBox, Timer } from '../utility.js'; import { getObjectDef } from './object-defs.js'; -import { SYSTEM_MESH_NAMES, ModelManager } from './utility.js'; +import { SYSTEM_MESH_NAMES, ModelManager, GRAPHICS_QUALITY } from './utility.js'; import type { RoomObjectInstance } from './object.js'; import { genId } from '@/utility/id.js'; import { deepClone } from '@/utility/clone.js'; @@ -298,6 +298,7 @@ export class RoomObjectPreviewEngine { model, id: args.id, timer: this.timerForEachObject, + graphicsQuality: GRAPHICS_QUALITY.MEDIUM, }); objectInstance.onInited?.(); diff --git a/packages/frontend/src/world/room/utility.ts b/packages/frontend/src/world/room/utility.ts index 2f1e41be09..a5dcec5e56 100644 --- a/packages/frontend/src/world/room/utility.ts +++ b/packages/frontend/src/world/room/utility.ts @@ -12,6 +12,16 @@ export const GRAPHICS_QUALITY = { LOW: -1, } as const; +export function getLightRangeFactorByGraphicsQuality(quality: number) { + if (quality >= GRAPHICS_QUALITY.HIGH) { + return 1; + } else if (quality >= GRAPHICS_QUALITY.MEDIUM) { + return 0.5; + } else { + return 0.25; + } +} + export const SYSTEM_MESH_NAMES = ['__TOP__', '__SIDE__', '__PICK__', '__COLLISION__']; export const SYSTEM_HEYA_MESH_NAMES = ['__ROOM_WALL__', '__ROOM_SIDE__', '__ROOM_FLOOR__', '__ROOM_CEILING__', '__ROOM_TOP__', '__ROOM_BOTTOM__', '__COLLISION__'];