1
0
mirror of https://github.com/misskey-dev/misskey.git synced 2026-05-13 15:15:45 +02:00
This commit is contained in:
syuilo
2026-03-27 15:12:30 +09:00
parent c677dd6566
commit 4dd3bfc208
3 changed files with 29 additions and 284 deletions

View File

@@ -40,7 +40,7 @@ import { i18n } from '@/i18n.js';
import MkModalWindow from '@/components/MkModalWindow.vue';
import * as os from '@/os.js';
import { OBJECT_DEFS } from '@/utility/room/object-defs.js';
import { RoomObjectPreviewEngine } from '@/utility/room/engine.js';
import { createRoomObjectPreviewEngine, RoomObjectPreviewEngine } from '@/utility/room/engine.js';
const emit = defineEmits<{
(ev: 'ok', id: string): void;
@@ -53,10 +53,8 @@ const canvas = useTemplateRef('canvas');
const selectedId = ref<string | null>(null);
const engine = shallowRef<RoomObjectPreviewEngine | null>(null);
onMounted(() => {
engine.value = new RoomObjectPreviewEngine({
canvas: canvas.value!,
});
onMounted(async () => {
engine.value = await createRoomObjectPreviewEngine(canvas.value!);
engine.value.init();

View File

@@ -73,7 +73,7 @@ import { definePage } from '@/page.js';
import { i18n } from '@/i18n.js';
import { ensureSignin } from '@/i';
import MkButton from '@/components/MkButton.vue';
import { RoomEngine } from '@/utility/room/engine.js';
import { createRoomEngine, RoomEngine } from '@/utility/room/engine.js';
import { getObjectDef, OBJECT_DEFS } from '@/utility/room/object-defs.js';
import MkSelect from '@/components/MkSelect.vue';
import * as os from '@/os.js';
@@ -268,282 +268,11 @@ const data = localStorage.getItem('roomData') != null ? { ...JSON.parse(localSto
},
},
},
installedObjects: [{
id: 'a',
type: 'cardboardBox',
position: [120, 0, 50],
rotation: [0, 0.2, 0],
options: {
variation: 'mikan',
},
}, {
id: 'a2',
type: 'openedCardboardBox',
position: [115, 0, -20],
rotation: [0, -0.1, 0],
options: {},
}, {
id: 'b',
type: 'cardboardBox',
position: [120, 31, 50],
rotation: [0, 0.1, 0],
sticky: 'a',
options: {
variation: 'aizon',
},
}, {
id: '1',
type: 'cardboardBox',
position: [80, 0, 110],
rotation: [0, 2, 0],
options: {
variation: null,
},
}, {
id: 'c',
type: 'desk',
position: [-115, 0, 85],
rotation: [0, -Math.PI / 2, 0],
options: {},
}, {
id: 'd',
type: 'monitor',
position: [-130, 70, 85],
rotation: [0, -Math.PI / 2, 0],
sticky: 'c',
options: {},
}, {
id: 'd2',
type: 'keyboard',
position: [-110, 70, 85],
rotation: [0, Math.PI, 0],
sticky: 'c',
options: {},
}, {
id: 'e',
type: 'chair',
position: [-75, 0, 85],
rotation: [0, Math.PI / 2, 0],
options: {},
}, {
id: 'f',
type: 'plant',
position: [-60, 90, 165],
rotation: [0, 0, 0],
options: {},
}, {
id: 'f2',
type: 'monstera',
position: [-55, 90, 175],
rotation: [0, 0, 0],
options: {},
}, {
id: 'f22',
type: 'tabletopDigitalClock',
position: [-35, 90, 175],
rotation: [0, Math.PI, 0],
options: {
bodyStyle: 'color',
bodyColor: [0.45, 0.8, 1],
},
}, {
id: 'f3',
type: 'snakeplant',
position: [40, 90, 170],
rotation: [0, 0, 0],
options: {},
}, {
id: 'f4',
type: 'cactusS',
position: [50, 90, 155],
rotation: [0, 0, 0],
options: {},
}, {
id: 'g',
type: 'mug',
position: [-45, 90, 160],
rotation: [0, Math.PI / 2, 0],
options: {},
}, {
id: 'h',
type: 'aircon',
position: [80, 215, 150],
rotation: [0, Math.PI, 0],
options: {},
}, {
id: 'i',
type: 'lavaLamp',
position: [60, 90, 170],
rotation: [0, 0, 0],
options: {},
}, {
id: 'j',
type: 'steelRack',
position: [130, 0, 115],
rotation: [0, Math.PI / 2, 0],
options: {},
}, {
id: 'j2',
type: 'aquarium',
position: [130, 100, 115],
rotation: [0, Math.PI / 2, 0],
sticky: 'j',
options: {},
}, {
id: '8ce7a065-120d-479f-9153-aa3b6a1fd4a7',
type: 'router',
position: [130, 142, 135],
rotation: [0, Math.PI / 2, 0],
sticky: 'j',
options: {},
}, {
id: 'j4',
type: 'letterCase',
position: [130, 59, 125],
rotation: [0, Math.PI / 2, 0],
sticky: 'j',
options: {},
}, {
id: 'a37cb419-d028-47a7-b317-7553bc2553e0',
type: 'ductTape',
position: [133, 85, 130],
rotation: [0, 0, 0],
sticky: 'j4',
options: {},
}, {
id: 'j3',
type: 'powerStrip',
position: [130, 13, 115],
rotation: [0, Math.PI / 2, 0],
sticky: 'j',
options: {},
}, {
id: 'k',
type: 'cupNoodle',
position: [-100, 70, 40],
rotation: [0, -2, 0],
sticky: 'c',
options: {},
}, {
id: 'k2',
type: 'tabletopCalendar',
position: [-130, 70, 40],
rotation: [0, -Math.PI / 2, 0],
sticky: 'c',
options: {},
}, {
id: 'l',
type: 'banknote',
position: [-100, 70, 55],
rotation: [0, 2, 0],
sticky: 'c',
options: {},
}, {
id: 'm',
type: 'energyDrink',
position: [-100, 70, 120],
rotation: [0, -1, 0],
sticky: 'c',
options: {},
}, {
id: 'n',
type: 'milk',
position: [-120, 70, 130],
rotation: [0, 1.5, 0],
sticky: 'c',
options: {},
}, {
id: 'o',
type: 'facialTissue',
position: [-100, 70, 138],
rotation: [0, -1.5, 0],
sticky: 'c',
options: {},
}, {
id: 'p',
type: 'tv',
position: [-135, 88, -5],
rotation: [0, -Math.PI / 2, 0],
sticky: 'q',
options: {},
}, {
id: 'q',
type: 'colorBox',
position: [-135, 0, -5],
rotation: [0, -Math.PI / 2, 0],
options: {},
}, {
id: 'r',
type: 'pachira',
position: [135, 0, -135],
rotation: [0, 0, 0],
options: {},
}, {
id: 's',
type: 'wallClock',
position: [-150, 200, 100],
rotation: [0, -Math.PI / 2, 0],
options: {},
}, {
id: 's2',
type: 'woodSoundAbsorbingPanel',
position: [-150, 140, 80],
rotation: [0, -Math.PI / 2, 0],
options: {},
}, {
id: 't',
type: 'book',
position: [10, 100, 10],
rotation: [0, 0, 0],
options: {
variation: 1,
},
}, {
id: 'u',
type: 'bed',
position: [-30, 0, -100],
rotation: [0, Math.PI, 0],
options: {},
}, {
id: 'v',
type: 'ceilingFanLight',
position: [0, 250, 0],
rotation: [0, 0, 0],
isMainLight: true,
options: {},
}, {
id: 'w',
type: 'roundRug',
position: [0, 0, 0],
rotation: [0, 0, 0],
options: {},
}, {
id: 'x',
type: 'blind',
position: [-35, 194, 185],
rotation: [0, Math.PI, 0],
options: {
blades: 24,
angle: 0.5,
open: 0.8,
},
}, {
id: 'x2',
type: 'blind',
position: [35, 194, 185],
rotation: [0, Math.PI, 0],
options: {
blades: 24,
angle: -0.4,
open: 0.5,
},
}],
installedObjects: [],
};
onMounted(() => {
engine.value = new RoomEngine(data, {
canvas: canvas.value!,
});
onMounted(async () => {
engine.value = await createRoomEngine(data, canvas.value!);
engine.value.init();

View File

@@ -216,9 +216,17 @@ const TIME_MAP = {
23: 2,
} as const;
export async function createRoomEngine(roomState: RoomState, canvas: HTMLCanvasElement) {
// なぜか逆に重くなる
//const babylonEngine = new BABYLON.WebGPUEngine(canvas);
//await babylonEngine.initAsync();
const babylonEngine = new BABYLON.Engine(canvas, false, { alpha: false, antialias: false });
return new RoomEngine(roomState, { canvas, engine: babylonEngine });
}
export class RoomEngine {
private canvas: HTMLCanvasElement;
private engine: BABYLON.Engine;
private engine: BABYLON.WebGPUEngine;
public scene: BABYLON.Scene;
private shadowGenerator1: BABYLON.ShadowGenerator;
private shadowGenerator2: BABYLON.ShadowGenerator;
@@ -275,6 +283,7 @@ export class RoomEngine {
constructor(roomState: RoomState, options: {
canvas: HTMLCanvasElement;
engine: BABYLON.WebGPUEngine;
}) {
this.roomState = {
...roomState,
@@ -287,7 +296,7 @@ export class RoomEngine {
registerBuiltInLoaders();
this.engine = new BABYLON.Engine(options.canvas, false, { alpha: false, antialias: false });
this.engine = options.engine;
this.scene = new BABYLON.Scene(this.engine);
//this.scene.useRightHandedSystem = true;
@@ -1337,9 +1346,17 @@ export class RoomEngine {
}
}
export async function createRoomObjectPreviewEngine(canvas: HTMLCanvasElement) {
// なぜか逆に重くなる
//const babylonEngine = new BABYLON.WebGPUEngine(canvas);
//await babylonEngine.initAsync();
const babylonEngine = new BABYLON.Engine(canvas, false, { alpha: false, antialias: false });
return new RoomObjectPreviewEngine({ canvas, engine: babylonEngine });
}
export class RoomObjectPreviewEngine {
private canvas: HTMLCanvasElement;
private engine: BABYLON.Engine;
private engine: BABYLON.WebGPUEngine;
private scene: BABYLON.Scene;
private shadowGenerator1: BABYLON.ShadowGenerator;
private camera: BABYLON.ArcRotateCamera;
@@ -1351,12 +1368,13 @@ export class RoomObjectPreviewEngine {
constructor(options: {
canvas: HTMLCanvasElement;
engine: BABYLON.WebGPUEngine;
}) {
this.canvas = options.canvas;
registerBuiltInLoaders();
this.engine = new BABYLON.Engine(options.canvas, false, { alpha: false, antialias: false });
this.engine = options.engine;
this.scene = new BABYLON.Scene(this.engine);
this.scene.ambientColor = new BABYLON.Color3(1.0, 0.9, 0.8);