variable iron-frame-shelf

packages/frontend/src/utility/room/engine.ts

@@ -331,6 +331,14 @@ export function defineObject<const OpSc extends OptionsSchema>(def: ObjectDef<Op
 	return def;
 }
 
+export function defineObjectClass<const OpSc extends OptionsSchema>(baseDef: Partial<ObjectDef<OpSc>>): {
+	extend: (childDef: Partial<ObjectDef<OpSc>>) => ObjectDef<OpSc>;
+} {
+	return {
+		extend: (childDef) => ({ ...baseDef, ...childDef }) as ObjectDef<OpSc>,
+	};
+}
+
 // この実装方法だとマイナスの座標をうまく処理できず結果がおかしくなるので応急処置で全体を+10000cmオフセットしてから計算している
 function getMeshesBoundingBox(meshes: BABYLON.Mesh[]): BABYLON.BoundingBox {
 	let min = new BABYLON.Vector3(Number.MAX_VALUE, Number.MAX_VALUE, Number.MAX_VALUE);

packages/frontend/src/utility/room/object-defs.ts

@@ -35,7 +35,7 @@ import { envelope } from './objects/envelope.js';
 import { facialTissue } from './objects/facialTissue.js';
 import { hangingTShirt } from './objects/hangingTShirt.js';
 import { icosahedron } from './objects/icosahedron.js';
-import { ironFrameShelfH, ironFrameShelfV } from './objects/ironFrameShelf.js';
+import { ironFrameShelf5, ironFrameShelf4, ironFrameShelf3 } from './objects/ironFrameShelf.js';
 import { keyboard } from './objects/keyboard.js';
 import { laptopPc } from './objects/laptopPc.js';
 import { lavaLamp } from './objects/lavaLamp.js';
@@ -117,8 +117,9 @@ export const OBJECT_DEFS = [
 	facialTissue,
 	hangingTShirt,
 	icosahedron,
-	ironFrameShelfH,
+	ironFrameShelf5,
-	ironFrameShelfV,
+	ironFrameShelf4,
+	ironFrameShelf3,
 	keyboard,
 	laptopPc,
 	lavaLamp,

packages/frontend/src/utility/room/objects/ironFrameShelf.ts

@@ -4,12 +4,9 @@
  */
 
 import * as BABYLON from '@babylonjs/core';
-import { defineObject } from '../engine.js';
+import { defineObject, defineObjectClass } from '../engine.js';
 
-export const ironFrameShelfH = defineObject({
+const base = defineObjectClass({
-	id: 'ironFrameShelfH',
-	name: 'ironFrameShelf H',
-	path: 'iron-frame-shelf/iron-frame-shelf-h',
 	options: {
 		schema: {
 			frameColor: {
@@ -20,10 +17,18 @@ export const ironFrameShelfH = defineObject({
 				type: 'color',
 				label: 'Board color',
 			},
+			width: {
+				type: 'range',
+				label: 'Width',
+				min: 0,
+				max: 1,
+				step: 0.01,
+			},
 		},
 		default: {
 			frameColor: [0.2, 0.2, 0.2],
 			boardColor: [0.8, 0.4, 0.1],
+			width: 0.2,
 		},
 	},
 	placement: 'floor',
@@ -45,61 +50,44 @@ export const ironFrameShelfH = defineObject({
 
 		applyBoardColor();
 
+		const applySize = () => {
+			for (const mesh of model.root.getChildMeshes()) {
+				if (mesh.morphTargetManager != null && mesh.morphTargetManager.getTargetByName('Width') != null) {
+					mesh.morphTargetManager.getTargetByName('Width').influence = options.width;
+				}
+			}
+			model.updated();
+		};
+
+		applySize();
+
 		return {
 			onOptionsUpdated: ([k, v]) => {
-				applyFrameColor();
+				switch (k) {
-				applyBoardColor();
+					case 'frameColor': applyFrameColor(); break;
+					case 'boardColor': applyBoardColor(); break;
+					case 'width': applySize(); break;
+				}
 			},
 			interactions: {},
 		};
 	},
 });
 
-export const ironFrameShelfV = defineObject({
+export const ironFrameShelf5 = base.extend({
-	id: 'ironFrameShelfV',
+	id: 'ironFrameShelf5',
-	name: 'ironFrameShelf V',
+	name: 'ironFrameShelf 5',
-	path: 'iron-frame-shelf/iron-frame-shelf-v',
+	path: 'iron-frame-shelf/iron-frame-shelf-5',
-	options: {
+});
-		schema: {
+
-			frameColor: {
+export const ironFrameShelf4 = base.extend({
-				type: 'color',
+	id: 'ironFrameShelf4',
-				label: 'Frame color',
+	name: 'ironFrameShelf 4',
-			},
+	path: 'iron-frame-shelf/iron-frame-shelf-4',
-			boardColor: {
+});
-				type: 'color',
+
-				label: 'Board color',
+export const ironFrameShelf3 = base.extend({
-			},
+	id: 'ironFrameShelf3',
-		},
+	name: 'ironFrameShelf 3',
-		default: {
+	path: 'iron-frame-shelf/iron-frame-shelf-3',
-			frameColor: [0.2, 0.2, 0.2],
-			boardColor: [0.8, 0.4, 0.1],
-		},
-	},
-	placement: 'floor',
-	createInstance: ({ options, model }) => {
-		const frameMaterial = model.findMaterial('__X_FRAME__');
-		const boardMaterial = model.findMaterial('__X_BOARD__');
-
-		const applyFrameColor = () => {
-			const [r, g, b] = options.frameColor;
-			frameMaterial.albedoColor = new BABYLON.Color3(r, g, b);
-		};
-
-		applyFrameColor();
-
-		const applyBoardColor = () => {
-			const [r, g, b] = options.boardColor;
-			boardMaterial.albedoColor = new BABYLON.Color3(r, g, b);
-		};
-
-		applyBoardColor();
-
-		return {
-			onOptionsUpdated: ([k, v]) => {
-				applyFrameColor();
-				applyBoardColor();
-			},
-			interactions: {},
-		};
-	},
 });