diff --git a/packages/frontend/src/world/room/engine.ts b/packages/frontend/src/world/room/engine.ts index 638a40c25c..4d3d876873 100644 --- a/packages/frontend/src/world/room/engine.ts +++ b/packages/frontend/src/world/room/engine.ts @@ -7,6 +7,7 @@ // TODO: 近くのオブジェクトの端にスナップオプション // TODO: 近くのオブジェクトの原点に軸を揃えるオプション // TODO: glbを事前に最適化(なるべくメッシュをマージするなど)するツールもしくはMisskeyビルド時処理。ついでにカタログ用スクショも自動生成したい +// TODO: テクスチャ置き換え時、元のテクスチャをちゃんとdispose import * as BABYLON from '@babylonjs/core'; import { AxesViewer } from '@babylonjs/core/Debug/axesViewer'; @@ -453,6 +454,7 @@ export class RoomEngine extends EventEmitter { }).then(() => { loadedCount++; this.emit('loadingProgress', { progress: loadedCount / objects.length }); + console.log(`Loaded object ${o.id} (${o.type})`); }))); // 不具合のもと diff --git a/packages/frontend/src/world/room/objects/allInOnePc.ts b/packages/frontend/src/world/room/objects/allInOnePc.ts index a6f61983f1..dddb7d3559 100644 --- a/packages/frontend/src/world/room/objects/allInOnePc.ts +++ b/packages/frontend/src/world/room/objects/allInOnePc.ts @@ -85,25 +85,20 @@ export const allInOnePc = defineObject({ applyFit(); const applyCustomPicture = () => new Promise((resolve) => { - // テクスチャの読み込みに失敗したときの救済 - // TODO: 丁寧な実装に直す - setTimeout(() => { - resolve(); - }, 10000); - if (options.customPicture != null) { - const tex = new BABYLON.Texture(options.customPicture, scene, false, false); - tex.wrapU = BABYLON.Texture.MIRROR_ADDRESSMODE; - tex.wrapV = BABYLON.Texture.MIRROR_ADDRESSMODE; - tex.level = 0.5; - screenMaterial.unfreeze(); - screenMaterial.emissiveTexture = tex; - - tex.onLoadObservable.addOnce(() => { + const tex = new BABYLON.Texture(options.customPicture, scene, false, false, undefined, () => { + screenMaterial.emissiveColor = new BABYLON.Color3(1, 1, 1); + screenMaterial.emissiveTexture = tex; applyFit(); resolve(); + }, (message, exception) => { + console.warn('Failed to load texture:', message, exception); + screenMaterial.emissiveColor = new BABYLON.Color3(0, 1, 0); + screenMaterial.emissiveTexture = null; + resolve(); }); + tex.level = 0.5; } else { screenMaterial.emissiveTexture = null; resolve(); diff --git a/packages/frontend/src/world/room/objects/djPlayer.ts b/packages/frontend/src/world/room/objects/djPlayer.ts index 6f2b43063f..f168e5f6cb 100644 --- a/packages/frontend/src/world/room/objects/djPlayer.ts +++ b/packages/frontend/src/world/room/objects/djPlayer.ts @@ -61,25 +61,20 @@ export const djPlayer = defineObject({ applyFit(); const applyCustomPicture = () => new Promise((resolve) => { - // テクスチャの読み込みに失敗したときの救済 - // TODO: 丁寧な実装に直す - setTimeout(() => { - resolve(); - }, 10000); - if (options.customPicture != null && options.customPicture !== '') { - const tex = new BABYLON.Texture(options.customPicture, scene, false, false); - tex.wrapU = BABYLON.Texture.MIRROR_ADDRESSMODE; - tex.wrapV = BABYLON.Texture.MIRROR_ADDRESSMODE; - tex.level = 0.5; - screenMaterial.unfreeze(); - screenMaterial.emissiveTexture = tex; - - tex.onLoadObservable.addOnce(() => { + const tex = new BABYLON.Texture(options.customPicture, scene, false, false, undefined, () => { + screenMaterial.emissiveColor = new BABYLON.Color3(1, 1, 1); + screenMaterial.emissiveTexture = tex; applyFit(); resolve(); + }, (message, exception) => { + console.warn('Failed to load texture:', message, exception); + screenMaterial.emissiveColor = new BABYLON.Color3(0, 1, 0); + screenMaterial.emissiveTexture = null; + resolve(); }); + tex.level = 0.5; } else { screenMaterial.emissiveTexture = defaultScreenTexture; applyFit(); diff --git a/packages/frontend/src/world/room/objects/laptopPc.ts b/packages/frontend/src/world/room/objects/laptopPc.ts index 8950ec015c..ed0291e6ed 100644 --- a/packages/frontend/src/world/room/objects/laptopPc.ts +++ b/packages/frontend/src/world/room/objects/laptopPc.ts @@ -95,25 +95,20 @@ export const laptopPc = defineObject({ applyFit(); const applyCustomPicture = () => new Promise((resolve) => { - // テクスチャの読み込みに失敗したときの救済 - // TODO: 丁寧な実装に直す - setTimeout(() => { - resolve(); - }, 10000); - if (options.customPicture != null) { - const tex = new BABYLON.Texture(options.customPicture, scene, false, false); - tex.wrapU = BABYLON.Texture.MIRROR_ADDRESSMODE; - tex.wrapV = BABYLON.Texture.MIRROR_ADDRESSMODE; - tex.level = 0.5; - screenMaterial.unfreeze(); - screenMaterial.emissiveTexture = tex; - - tex.onLoadObservable.addOnce(() => { + const tex = new BABYLON.Texture(options.customPicture, scene, false, false, undefined, () => { + screenMaterial.emissiveColor = new BABYLON.Color3(1, 1, 1); + screenMaterial.emissiveTexture = tex; applyFit(); resolve(); + }, (message, exception) => { + console.warn('Failed to load texture:', message, exception); + screenMaterial.emissiveColor = new BABYLON.Color3(0, 1, 0); + screenMaterial.emissiveTexture = null; + resolve(); }); + tex.level = 0.5; } else { screenMaterial.emissiveTexture = null; resolve(); diff --git a/packages/frontend/src/world/room/objects/pictureFrame.ts b/packages/frontend/src/world/room/objects/pictureFrame.ts index b350e74944..f7415c86f8 100644 --- a/packages/frontend/src/world/room/objects/pictureFrame.ts +++ b/packages/frontend/src/world/room/objects/pictureFrame.ts @@ -161,25 +161,21 @@ export const pictureFrame = defineObject({ applyDepth(); const applyCustomPicture = () => new Promise((resolve) => { - // テクスチャの読み込みに失敗したときの救済 - // TODO: 丁寧な実装に直す - setTimeout(() => { - resolve(); - }, 10000); - if (options.customPicture != null) { - const tex = new BABYLON.Texture(options.customPicture, scene, false, false); - tex.wrapU = BABYLON.Texture.MIRROR_ADDRESSMODE; - tex.wrapV = BABYLON.Texture.MIRROR_ADDRESSMODE; - pictureMaterial.unfreeze(); - pictureMaterial.albedoColor = new BABYLON.Color3(1, 1, 1); - pictureMaterial.albedoTexture = tex; - - tex.onLoadObservable.addOnce(() => { + const tex = new BABYLON.Texture(options.customPicture, scene, false, false, undefined, () => { + pictureMaterial.albedoColor = new BABYLON.Color3(1, 1, 1); + pictureMaterial.albedoTexture = tex; applyFit(); resolve(); + }, (message, exception) => { + console.warn('Failed to load texture:', message, exception); + pictureMaterial.albedoColor = new BABYLON.Color3(0, 1, 0); + pictureMaterial.albedoTexture = null; + resolve(); }); + tex.wrapU = BABYLON.Texture.MIRROR_ADDRESSMODE; + tex.wrapV = BABYLON.Texture.MIRROR_ADDRESSMODE; } else { pictureMaterial.albedoColor = new BABYLON.Color3(0.5, 0.5, 0.5); pictureMaterial.albedoTexture = null; diff --git a/packages/frontend/src/world/room/objects/poster.ts b/packages/frontend/src/world/room/objects/poster.ts index 229ab678de..2af31148b9 100644 --- a/packages/frontend/src/world/room/objects/poster.ts +++ b/packages/frontend/src/world/room/objects/poster.ts @@ -93,25 +93,21 @@ export const poster = defineObject({ applySize(); const applyCustomPicture = () => new Promise((resolve) => { - // テクスチャの読み込みに失敗したときの救済 - // TODO: 丁寧な実装に直す - setTimeout(() => { - resolve(); - }, 10000); - if (options.customPicture != null) { - const tex = new BABYLON.Texture(options.customPicture, scene, false, false); - tex.wrapU = BABYLON.Texture.MIRROR_ADDRESSMODE; - tex.wrapV = BABYLON.Texture.MIRROR_ADDRESSMODE; - pictureMaterial.unfreeze(); - pictureMaterial.albedoColor = new BABYLON.Color3(1, 1, 1); - pictureMaterial.albedoTexture = tex; - - tex.onLoadObservable.addOnce(() => { + const tex = new BABYLON.Texture(options.customPicture, scene, false, false, undefined, () => { + pictureMaterial.albedoColor = new BABYLON.Color3(1, 1, 1); + pictureMaterial.albedoTexture = tex; applyFit(); resolve(); + }, (message, exception) => { + console.warn('Failed to load texture:', message, exception); + pictureMaterial.albedoColor = new BABYLON.Color3(0, 1, 0); + pictureMaterial.albedoTexture = null; + resolve(); }); + tex.wrapU = BABYLON.Texture.MIRROR_ADDRESSMODE; + tex.wrapV = BABYLON.Texture.MIRROR_ADDRESSMODE; } else { pictureMaterial.albedoColor = new BABYLON.Color3(0.5, 0.5, 0.5); pictureMaterial.albedoTexture = null; diff --git a/packages/frontend/src/world/room/objects/tabletopFlag.ts b/packages/frontend/src/world/room/objects/tabletopFlag.ts index 623aab6cb6..cf68a89f42 100644 --- a/packages/frontend/src/world/room/objects/tabletopFlag.ts +++ b/packages/frontend/src/world/room/objects/tabletopFlag.ts @@ -52,25 +52,21 @@ export const tabletopFlag = defineObject({ applyFit(); const applyCustomPicture = () => new Promise((resolve) => { - // テクスチャの読み込みに失敗したときの救済 - // TODO: 丁寧な実装に直す - setTimeout(() => { - resolve(); - }, 10000); - if (options.customPicture != null) { - const tex = new BABYLON.Texture(options.customPicture, scene, false, false); - tex.wrapU = BABYLON.Texture.MIRROR_ADDRESSMODE; - tex.wrapV = BABYLON.Texture.MIRROR_ADDRESSMODE; - flagMaterial.unfreeze(); - flagMaterial.albedoColor = new BABYLON.Color3(1, 1, 1); - flagMaterial.albedoTexture = tex; - - tex.onLoadObservable.addOnce(() => { + const tex = new BABYLON.Texture(options.customPicture, scene, false, false, undefined, () => { + flagMaterial.albedoColor = new BABYLON.Color3(1, 1, 1); + flagMaterial.albedoTexture = tex; applyFit(); resolve(); + }, (message, exception) => { + console.warn('Failed to load texture:', message, exception); + flagMaterial.albedoColor = new BABYLON.Color3(0, 1, 0); + flagMaterial.albedoTexture = null; + resolve(); }); + tex.wrapU = BABYLON.Texture.MIRROR_ADDRESSMODE; + tex.wrapV = BABYLON.Texture.MIRROR_ADDRESSMODE; } else { flagMaterial.albedoColor = new BABYLON.Color3(0.5, 0.5, 0.5); flagMaterial.albedoTexture = null; diff --git a/packages/frontend/src/world/room/objects/tabletopGlassPictureFrame.ts b/packages/frontend/src/world/room/objects/tabletopGlassPictureFrame.ts index 057652e0c6..6add5e83fc 100644 --- a/packages/frontend/src/world/room/objects/tabletopGlassPictureFrame.ts +++ b/packages/frontend/src/world/room/objects/tabletopGlassPictureFrame.ts @@ -93,25 +93,21 @@ export const tabletopGlassPictureFrame = defineObject({ applySize(); const applyCustomPicture = () => new Promise((resolve) => { - // テクスチャの読み込みに失敗したときの救済 - // TODO: 丁寧な実装に直す - setTimeout(() => { - resolve(); - }, 10000); - if (options.customPicture != null) { - const tex = new BABYLON.Texture(options.customPicture, scene, false, false); - tex.wrapU = BABYLON.Texture.MIRROR_ADDRESSMODE; - tex.wrapV = BABYLON.Texture.MIRROR_ADDRESSMODE; - pictureMaterial.unfreeze(); - pictureMaterial.albedoColor = new BABYLON.Color3(1, 1, 1); - pictureMaterial.albedoTexture = tex; - - tex.onLoadObservable.addOnce(() => { + const tex = new BABYLON.Texture(options.customPicture, scene, false, false, undefined, () => { + pictureMaterial.albedoColor = new BABYLON.Color3(1, 1, 1); + pictureMaterial.albedoTexture = tex; applyFit(); resolve(); + }, (message, exception) => { + console.warn('Failed to load texture:', message, exception); + pictureMaterial.albedoColor = new BABYLON.Color3(0, 1, 0); + pictureMaterial.albedoTexture = null; + resolve(); }); + tex.wrapU = BABYLON.Texture.MIRROR_ADDRESSMODE; + tex.wrapV = BABYLON.Texture.MIRROR_ADDRESSMODE; } else { pictureMaterial.albedoColor = new BABYLON.Color3(0.5, 0.5, 0.5); pictureMaterial.albedoTexture = null; diff --git a/packages/frontend/src/world/room/objects/tabletopLcdButtonsController.ts b/packages/frontend/src/world/room/objects/tabletopLcdButtonsController.ts index 93ca613a2e..c3cb0e257c 100644 --- a/packages/frontend/src/world/room/objects/tabletopLcdButtonsController.ts +++ b/packages/frontend/src/world/room/objects/tabletopLcdButtonsController.ts @@ -74,26 +74,20 @@ export const tabletopLcdButtonsController = defineObject({ applyFit(); const applyCustomPicture = () => new Promise((resolve) => { - // テクスチャの読み込みに失敗したときの救済 - // TODO: 丁寧な実装に直す - setTimeout(() => { - resolve(); - }, 10000); - if (options.customPicture != null && options.customPicture !== '') { - const tex = new BABYLON.Texture(options.customPicture, scene, false, false); - tex.wrapU = BABYLON.Texture.MIRROR_ADDRESSMODE; - tex.wrapV = BABYLON.Texture.MIRROR_ADDRESSMODE; - tex.level = 0.5; - screenMaterial.unfreeze(); - screenMaterial.emissiveTexture = tex; - screenMaterial.emissiveTexture.level = 2; - - tex.onLoadObservable.addOnce(() => { + const tex = new BABYLON.Texture(options.customPicture, scene, false, false, undefined, () => { + screenMaterial.emissiveTexture = tex; + screenMaterial.emissiveTexture.level = 2; applyFit(); resolve(); + }, (message, exception) => { + console.warn('Failed to load texture:', message, exception); + screenMaterial.emissiveColor = new BABYLON.Color3(0, 1, 0); + screenMaterial.emissiveTexture = null; + resolve(); }); + tex.level = 0.5; } else { screenMaterial.emissiveTexture = defaultScreenTexture; screenMaterial.emissiveTexture.level = 2; diff --git a/packages/frontend/src/world/room/objects/tabletopPictureFrame.ts b/packages/frontend/src/world/room/objects/tabletopPictureFrame.ts index cb11688388..dd2e2ef669 100644 --- a/packages/frontend/src/world/room/objects/tabletopPictureFrame.ts +++ b/packages/frontend/src/world/room/objects/tabletopPictureFrame.ts @@ -166,25 +166,21 @@ export const tabletopPictureFrame = defineObject({ applyDepth(); const applyCustomPicture = () => new Promise((resolve) => { - // テクスチャの読み込みに失敗したときの救済 - // TODO: 丁寧な実装に直す - setTimeout(() => { - resolve(); - }, 10000); - if (options.customPicture != null) { - const tex = new BABYLON.Texture(options.customPicture, scene, false, false); - tex.wrapU = BABYLON.Texture.MIRROR_ADDRESSMODE; - tex.wrapV = BABYLON.Texture.MIRROR_ADDRESSMODE; - pictureMaterial.unfreeze(); - pictureMaterial.albedoColor = new BABYLON.Color3(1, 1, 1); - pictureMaterial.albedoTexture = tex; - - tex.onLoadObservable.addOnce(() => { + const tex = new BABYLON.Texture(options.customPicture, scene, false, false, undefined, () => { + pictureMaterial.albedoColor = new BABYLON.Color3(1, 1, 1); + pictureMaterial.albedoTexture = tex; applyFit(); resolve(); + }, (message, exception) => { + console.warn('Failed to load texture:', message, exception); + pictureMaterial.albedoColor = new BABYLON.Color3(0, 1, 0); + pictureMaterial.albedoTexture = null; + resolve(); }); + tex.wrapU = BABYLON.Texture.MIRROR_ADDRESSMODE; + tex.wrapV = BABYLON.Texture.MIRROR_ADDRESSMODE; } else { pictureMaterial.albedoColor = new BABYLON.Color3(0.5, 0.5, 0.5); pictureMaterial.albedoTexture = null; diff --git a/packages/frontend/src/world/room/objects/tapestry.ts b/packages/frontend/src/world/room/objects/tapestry.ts index ffe35ee11a..1059b907aa 100644 --- a/packages/frontend/src/world/room/objects/tapestry.ts +++ b/packages/frontend/src/world/room/objects/tapestry.ts @@ -97,25 +97,21 @@ export const tapestry = defineObject({ applySize(); const applyCustomPicture = () => new Promise((resolve) => { - // テクスチャの読み込みに失敗したときの救済 - // TODO: 丁寧な実装に直す - setTimeout(() => { - resolve(); - }, 10000); - if (options.customPicture != null) { - const tex = new BABYLON.Texture(options.customPicture, scene, false, false); - tex.wrapU = BABYLON.Texture.MIRROR_ADDRESSMODE; - tex.wrapV = BABYLON.Texture.MIRROR_ADDRESSMODE; - pictureMaterial.unfreeze(); - pictureMaterial.albedoColor = new BABYLON.Color3(1, 1, 1); - pictureMaterial.albedoTexture = tex; - - tex.onLoadObservable.addOnce(() => { + const tex = new BABYLON.Texture(options.customPicture, scene, false, false, undefined, () => { + pictureMaterial.albedoColor = new BABYLON.Color3(1, 1, 1); + pictureMaterial.albedoTexture = tex; applyFit(); resolve(); + }, (message, exception) => { + console.warn('Failed to load texture:', message, exception); + pictureMaterial.albedoColor = new BABYLON.Color3(0, 1, 0); + pictureMaterial.albedoTexture = null; + resolve(); }); + tex.wrapU = BABYLON.Texture.MIRROR_ADDRESSMODE; + tex.wrapV = BABYLON.Texture.MIRROR_ADDRESSMODE; } else { pictureMaterial.albedoColor = new BABYLON.Color3(0.5, 0.5, 0.5); pictureMaterial.albedoTexture = null; diff --git a/packages/frontend/src/world/room/objects/wallCanvas.ts b/packages/frontend/src/world/room/objects/wallCanvas.ts index 3190f62f18..f6450e6f99 100644 --- a/packages/frontend/src/world/room/objects/wallCanvas.ts +++ b/packages/frontend/src/world/room/objects/wallCanvas.ts @@ -83,25 +83,21 @@ export const wallCanvas = defineObject({ applySize(); const applyCustomPicture = () => new Promise((resolve) => { - // テクスチャの読み込みに失敗したときの救済 - // TODO: 丁寧な実装に直す - setTimeout(() => { - resolve(); - }, 10000); - if (options.customPicture != null) { - const tex = new BABYLON.Texture(options.customPicture, scene, false, false); - tex.wrapU = BABYLON.Texture.MIRROR_ADDRESSMODE; - tex.wrapV = BABYLON.Texture.MIRROR_ADDRESSMODE; - canvasMaterial.unfreeze(); - canvasMaterial.albedoColor = new BABYLON.Color3(1, 1, 1); - canvasMaterial.albedoTexture = tex; - - tex.onLoadObservable.addOnce(() => { + const tex = new BABYLON.Texture(options.customPicture, scene, false, false, undefined, () => { + canvasMaterial.albedoColor = new BABYLON.Color3(1, 1, 1); + canvasMaterial.albedoTexture = tex; applyFit(); resolve(); + }, (message, exception) => { + console.warn('Failed to load texture:', message, exception); + canvasMaterial.albedoColor = new BABYLON.Color3(0, 1, 0); + canvasMaterial.albedoTexture = null; + resolve(); }); + tex.wrapU = BABYLON.Texture.MIRROR_ADDRESSMODE; + tex.wrapV = BABYLON.Texture.MIRROR_ADDRESSMODE; } else { canvasMaterial.albedoColor = new BABYLON.Color3(0.5, 0.5, 0.5); canvasMaterial.albedoTexture = null; diff --git a/packages/frontend/src/world/room/objects/wallGlassPictureFrame.ts b/packages/frontend/src/world/room/objects/wallGlassPictureFrame.ts index 693a0f01a2..0813516f76 100644 --- a/packages/frontend/src/world/room/objects/wallGlassPictureFrame.ts +++ b/packages/frontend/src/world/room/objects/wallGlassPictureFrame.ts @@ -93,25 +93,21 @@ export const wallGlassPictureFrame = defineObject({ applySize(); const applyCustomPicture = () => new Promise((resolve) => { - // テクスチャの読み込みに失敗したときの救済 - // TODO: 丁寧な実装に直す - setTimeout(() => { - resolve(); - }, 10000); - if (options.customPicture != null) { - const tex = new BABYLON.Texture(options.customPicture, scene, false, false); - tex.wrapU = BABYLON.Texture.MIRROR_ADDRESSMODE; - tex.wrapV = BABYLON.Texture.MIRROR_ADDRESSMODE; - pictureMaterial.unfreeze(); - pictureMaterial.albedoColor = new BABYLON.Color3(1, 1, 1); - pictureMaterial.albedoTexture = tex; - - tex.onLoadObservable.addOnce(() => { + const tex = new BABYLON.Texture(options.customPicture, scene, false, false, undefined, () => { + pictureMaterial.albedoColor = new BABYLON.Color3(1, 1, 1); + pictureMaterial.albedoTexture = tex; applyFit(); resolve(); + }, (message, exception) => { + console.warn('Failed to load texture:', message, exception); + pictureMaterial.albedoColor = new BABYLON.Color3(0, 1, 0); + pictureMaterial.albedoTexture = null; + resolve(); }); + tex.wrapU = BABYLON.Texture.MIRROR_ADDRESSMODE; + tex.wrapV = BABYLON.Texture.MIRROR_ADDRESSMODE; } else { pictureMaterial.albedoColor = new BABYLON.Color3(0.5, 0.5, 0.5); pictureMaterial.albedoTexture = null;