mirrors/misskey
1
0
Fork 1
mirror of https://github.com/misskey-dev/misskey.git synced 2026-05-14 18:05:43 +02:00
Code Releases Activity

wip

Browse Source
This commit is contained in:
syuilo
2026-04-29 19:38:21 +09:00
parent 5db8ccec74
commit a4c9aff8a9
5 changed files with 180 additions and 24 deletions
Download Patch File Download Diff File Expand all files Collapse all files

0
packages/frontend/src/pages/room.default-heya-options.vue Normal file
View File

89
packages/frontend/src/pages/room.vue
View File

@@ -98,6 +98,26 @@ SPDX-License-Identifier: AGPL-3.0-only
<MkInput :modelValue="getHex(controller.roomState.value.heya.options.wallN.color)" type="color" @update:modelValue="v => { const c = getRgb(v); if (c != null) controller.updateHeyaOptions({ ...controller.roomState.value.heya.options, wallN: { ...controller.roomState.value.heya.options.wallN, color: c } }); }">
<template #label>color</template>
</MkInput>
<hr>
<MkSwitch :modelValue="controller.roomState.value.heya.options.wallN.withHari" @update:modelValue="v => { controller.updateHeyaOptions({ ...controller.roomState.value.heya.options, wallN: { ...controller.roomState.value.heya.options.wallN, withHari: v } }); }">
<template #label>with Hari</template>
</MkSwitch>
<MkSelect
:items="[
{ label: 'None', value: null },
{ label: 'Wood', value: 'wood' },
{ label: 'Concrete', value: 'concrete' },
]" :modelValue="controller.roomState.value.heya.options.wallN.hariMaterial" @update:modelValue="v => { controller.updateHeyaOptions({ ...controller.roomState.value.heya.options, wallN: { ...controller.roomState.value.heya.options.wallN, hariMaterial: v } }); }"
>
<template #label>hari material</template>
</MkSelect>
<MkInput :modelValue="getHex(controller.roomState.value.heya.options.wallN.hariColor)" type="color" @update:modelValue="v => { const c = getRgb(v); if (c != null) controller.updateHeyaOptions({ ...controller.roomState.value.heya.options, wallN: { ...controller.roomState.value.heya.options.wallN, hariColor: c } }); }">
<template #label>hari color</template>
</MkInput>
<hr>
<MkSwitch :modelValue="controller.roomState.value.heya.options.wallN.withHabaki" @update:modelValue="v => { controller.updateHeyaOptions({ ...controller.roomState.value.heya.options, wallN: { ...controller.roomState.value.heya.options.wallN, withHabaki: v } }); }">
<template #label>with Habaki</template>
</MkSwitch>
</div>
<div>
<div>Wall E</div>
@@ -113,6 +133,26 @@ SPDX-License-Identifier: AGPL-3.0-only
<MkInput :modelValue="getHex(controller.roomState.value.heya.options.wallE.color)" type="color" @update:modelValue="v => { const c = getRgb(v); if (c != null) controller.updateHeyaOptions({ ...controller.roomState.value.heya.options, wallE: { ...controller.roomState.value.heya.options.wallE, color: c } }); }">
<template #label>color</template>
</MkInput>
<hr>
<MkSwitch :modelValue="controller.roomState.value.heya.options.wallE.withHari" @update:modelValue="v => { controller.updateHeyaOptions({ ...controller.roomState.value.heya.options, wallE: { ...controller.roomState.value.heya.options.wallE, withHari: v } }); }">
<template #label>with Hari</template>
</MkSwitch>
<MkSelect
:items="[
{ label: 'None', value: null },
{ label: 'Wood', value: 'wood' },
{ label: 'Concrete', value: 'concrete' },
]" :modelValue="controller.roomState.value.heya.options.wallE.hariMaterial" @update:modelValue="v => { controller.updateHeyaOptions({ ...controller.roomState.value.heya.options, wallE: { ...controller.roomState.value.heya.options.wallE, hariMaterial: v } }); }"
>
<template #label>hari material</template>
</MkSelect>
<MkInput :modelValue="getHex(controller.roomState.value.heya.options.wallE.hariColor)" type="color" @update:modelValue="v => { const c = getRgb(v); if (c != null) controller.updateHeyaOptions({ ...controller.roomState.value.heya.options, wallE: { ...controller.roomState.value.heya.options.wallE, hariColor: c } }); }">
<template #label>hari color</template>
</MkInput>
<hr>
<MkSwitch :modelValue="controller.roomState.value.heya.options.wallE.withHabaki" @update:modelValue="v => { controller.updateHeyaOptions({ ...controller.roomState.value.heya.options, wallE: { ...controller.roomState.value.heya.options.wallE, withHabaki: v } }); }">
<template #label>with Habaki</template>
</MkSwitch>
</div>
<div>
<div>Wall S</div>
@@ -128,6 +168,26 @@ SPDX-License-Identifier: AGPL-3.0-only
<MkInput :modelValue="getHex(controller.roomState.value.heya.options.wallS.color)" type="color" @update:modelValue="v => { const c = getRgb(v); if (c != null) controller.updateHeyaOptions({ ...controller.roomState.value.heya.options, wallS: { ...controller.roomState.value.heya.options.wallS, color: c } }); }">
<template #label>color</template>
</MkInput>
<hr>
<MkSwitch :modelValue="controller.roomState.value.heya.options.wallS.withHari" @update:modelValue="v => { controller.updateHeyaOptions({ ...controller.roomState.value.heya.options, wallS: { ...controller.roomState.value.heya.options.wallS, withHari: v } }); }">
<template #label>with Hari</template>
</MkSwitch>
<MkSelect
:items="[
{ label: 'None', value: null },
{ label: 'Wood', value: 'wood' },
{ label: 'Concrete', value: 'concrete' },
]" :modelValue="controller.roomState.value.heya.options.wallS.hariMaterial" @update:modelValue="v => { controller.updateHeyaOptions({ ...controller.roomState.value.heya.options, wallS: { ...controller.roomState.value.heya.options.wallS, hariMaterial: v } }); }"
>
<template #label>hari material</template>
</MkSelect>
<MkInput :modelValue="getHex(controller.roomState.value.heya.options.wallS.hariColor)" type="color" @update:modelValue="v => { const c = getRgb(v); if (c != null) controller.updateHeyaOptions({ ...controller.roomState.value.heya.options, wallS: { ...controller.roomState.value.heya.options.wallS, hariColor: c } }); }">
<template #label>hari color</template>
</MkInput>
<hr>
<MkSwitch :modelValue="controller.roomState.value.heya.options.wallS.withHabaki" @update:modelValue="v => { controller.updateHeyaOptions({ ...controller.roomState.value.heya.options, wallS: { ...controller.roomState.value.heya.options.wallS, withHabaki: v } }); }">
<template #label>with Habaki</template>
</MkSwitch>
</div>
<div>
<div>Wall W</div>
@@ -143,6 +203,26 @@ SPDX-License-Identifier: AGPL-3.0-only
<MkInput :modelValue="getHex(controller.roomState.value.heya.options.wallW.color)" type="color" @update:modelValue="v => { const c = getRgb(v); if (c != null) controller.updateHeyaOptions({ ...controller.roomState.value.heya.options, wallW: { ...controller.roomState.value.heya.options.wallW, color: c } }); }">
<template #label>color</template>
</MkInput>
<hr>
<MkSwitch :modelValue="controller.roomState.value.heya.options.wallW.withHari" @update:modelValue="v => { controller.updateHeyaOptions({ ...controller.roomState.value.heya.options, wallW: { ...controller.roomState.value.heya.options.wallW, withHari: v } }); }">
<template #label>with Hari</template>
</MkSwitch>
<MkSelect
:items="[
{ label: 'None', value: null },
{ label: 'Wood', value: 'wood' },
{ label: 'Concrete', value: 'concrete' },
]" :modelValue="controller.roomState.value.heya.options.wallW.hariMaterial" @update:modelValue="v => { controller.updateHeyaOptions({ ...controller.roomState.value.heya.options, wallW: { ...controller.roomState.value.heya.options.wallW, hariMaterial: v } }); }"
>
<template #label>hari material</template>
</MkSelect>
<MkInput :modelValue="getHex(controller.roomState.value.heya.options.wallW.hariColor)" type="color" @update:modelValue="v => { const c = getRgb(v); if (c != null) controller.updateHeyaOptions({ ...controller.roomState.value.heya.options, wallW: { ...controller.roomState.value.heya.options.wallW, hariColor: c } }); }">
<template #label>hari color</template>
</MkInput>
<hr>
<MkSwitch :modelValue="controller.roomState.value.heya.options.wallW.withHabaki" @update:modelValue="v => { controller.updateHeyaOptions({ ...controller.roomState.value.heya.options, wallW: { ...controller.roomState.value.heya.options.wallW, withHabaki: v } }); }">
<template #label>with Habaki</template>
</MkSwitch>
</div>
</template>
</div>
@@ -260,6 +340,12 @@ const data = localStorage.getItem('roomData') != null ? JSON.parse(localStorage.
installedObjects: [],
};
// 後方互換性のため
if (data.heya.options.wallE.hariColor == null) data.heya.options.wallE.hariColor = [0.8, 0.8, 0.8];
if (data.heya.options.wallN.hariColor == null) data.heya.options.wallN.hariColor = [0.8, 0.8, 0.8];
if (data.heya.options.wallS.hariColor == null) data.heya.options.wallS.hariColor = [0.8, 0.8, 0.8];
if (data.heya.options.wallW.hariColor == null) data.heya.options.wallW.hariColor = [0.8, 0.8, 0.8];
let latestData = deepClone(data);
const roomControllerOptions = computed<RoomControllerOptions>(() => ({
@@ -754,6 +840,9 @@ definePage(() => ({
padding: 16px;
box-sizing: border-box;
width: 300px;
max-height: 100%;
box-sizing: border-box;
overflow: auto;
}
.loading {

115
packages/frontend/src/world/room/heya.ts
View File

@@ -29,6 +29,10 @@ export abstract class HeyaManager<T = any> {
type SimpleHeyaWallBase = {
material: null | 'wood' | 'concrete';
color: [number, number, number];
withHari: boolean;
hariMaterial: null | 'wood' | 'concrete';
hariColor: [number, number, number];
withHabaki: boolean;
};
export type SimpleHeyaOptions = {
@@ -63,6 +67,10 @@ export class SimpleHeyaManager extends HeyaManager<SimpleHeyaOptions> {
private wallSMaterial: BABYLON.PBRMaterial | null = null;
private wallWMaterial: BABYLON.PBRMaterial | null = null;
private wallEMaterial: BABYLON.PBRMaterial | null = null;
private wallNHariMaterial: BABYLON.PBRMaterial | null = null;
private wallSHariMaterial: BABYLON.PBRMaterial | null = null;
private wallWHariMaterial: BABYLON.PBRMaterial | null = null;
private wallEHariMaterial: BABYLON.PBRMaterial | null = null;
constructor(onMeshUpdatedCallback?: ((meshes: BABYLON.AbstractMesh[]) => void) | null) {
super(onMeshUpdatedCallback);
@@ -120,46 +128,105 @@ export class SimpleHeyaManager extends HeyaManager<SimpleHeyaOptions> {
m.material = this.wallEMaterial;
}
const hariMaterial = findMaterial(this.meshes[0], '__X_HARI__');
this.wallNHariMaterial = hariMaterial.clone('wallNHariMaterial');
this.wallSHariMaterial = hariMaterial.clone('wallSHariMaterial');
this.wallWHariMaterial = hariMaterial.clone('wallWHariMaterial');
this.wallEHariMaterial = hariMaterial.clone('wallEHariMaterial');
for (const m of this.wallNRoot.getChildMeshes().filter(m => m.material === hariMaterial)) {
m.material = this.wallNHariMaterial;
}
for (const m of this.wallSRoot.getChildMeshes().filter(m => m.material === hariMaterial)) {
m.material = this.wallSHariMaterial;
}
for (const m of this.wallWRoot.getChildMeshes().filter(m => m.material === hariMaterial)) {
m.material = this.wallWHariMaterial;
}
for (const m of this.wallERoot.getChildMeshes().filter(m => m.material === hariMaterial)) {
m.material = this.wallEHariMaterial;
}
await this.applyOptions(options);
}
public applyOptions(options: SimpleHeyaOptions) {
// TODO: 返り値をpromiseにしてちゃんとテクスチャが読み終わってからresolveする
const apply = (wall: 'N' | 'S' | 'W' | 'E') => {
const applyWall = (wall: 'N' | 'S' | 'W' | 'E') => {
const wallRoot =
wall === 'N' ? this.wallNRoot :
wall === 'S' ? this.wallSRoot :
wall === 'W' ? this.wallWRoot :
this.wallERoot;
const wallOptions =
wall === 'N' ? options.wallN :
wall === 'S' ? options.wallS :
wall === 'W' ? options.wallW :
options.wallE;
const targetMaterial =
wall === 'N' ? this.wallNMaterial :
wall === 'S' ? this.wallSMaterial :
wall === 'W' ? this.wallWMaterial :
this.wallEMaterial;
targetMaterial.unfreeze();
targetMaterial.albedoColor = new BABYLON.Color3(...wallOptions.color);
const texPath = wallOptions.material === 'wood' ? '/client-assets/room/wall-textures/wood.png'
: wallOptions.material === 'concrete' ? '/client-assets/room/wall-textures/concrete.png'
: null;
if (texPath != null) {
const tex = new BABYLON.Texture(texPath, this.meshes[0].getScene(), false, false);
targetMaterial.albedoTexture = tex;
} else {
targetMaterial.albedoTexture = null;
for (const mesh of wallRoot.getChildMeshes()) {
if (mesh.name.includes('__X_HARI__')) {
mesh.isVisible = wallOptions.withHari;
} else if (mesh.name.includes('__X_HABAKI__')) {
mesh.isVisible = wallOptions.withHabaki;
}
}
targetMaterial.freeze();
{
const targetMaterial =
wall === 'N' ? this.wallNMaterial :
wall === 'S' ? this.wallSMaterial :
wall === 'W' ? this.wallWMaterial :
this.wallEMaterial;
targetMaterial.unfreeze();
targetMaterial.albedoColor = new BABYLON.Color3(...wallOptions.color);
const texPath = wallOptions.material === 'wood' ? '/client-assets/room/wall-textures/wood.png'
: wallOptions.material === 'concrete' ? '/client-assets/room/wall-textures/concrete.png'
: null;
if (texPath != null) {
const tex = new BABYLON.Texture(texPath, this.meshes[0].getScene(), false, false);
targetMaterial.albedoTexture = tex;
} else {
targetMaterial.albedoTexture = null;
}
targetMaterial.freeze();
}
{
const targetMaterial =
wall === 'N' ? this.wallNHariMaterial :
wall === 'S' ? this.wallSHariMaterial :
wall === 'W' ? this.wallWHariMaterial :
this.wallEHariMaterial;
targetMaterial.unfreeze();
targetMaterial.albedoColor = new BABYLON.Color3(...wallOptions.hariColor);
const texPath = wallOptions.hariMaterial === 'wood' ? '/client-assets/room/wall-textures/wood.png'
: wallOptions.hariMaterial === 'concrete' ? '/client-assets/room/wall-textures/concrete.png'
: null;
if (texPath != null) {
const tex = new BABYLON.Texture(texPath, this.meshes[0].getScene(), false, false);
targetMaterial.albedoTexture = tex;
} else {
targetMaterial.albedoTexture = null;
}
targetMaterial.freeze();
}
};
apply('N');
apply('S');
apply('W');
apply('E');
applyWall('N');
applyWall('S');
applyWall('W');
applyWall('E');
this.onMeshUpdatedCallback?.(this.meshes);
}