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

wip

Browse Source
This commit is contained in:
syuilo
2026-04-30 20:52:53 +09:00
parent 6d6ae6728c
commit 722d09b1ae
7 changed files with 75 additions and 28 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
packages/frontend/src/pages/room.default-heya-options.vue
View File

@@ -69,7 +69,8 @@ SPDX-License-Identifier: AGPL-3.0-only
>
<template #label>wallpaper</template>
</MkSelect>
<MkInput :modelValue="getHex(options.ceiling.color)" type="color" @update:modelValue="v => { const c = getRgb(v); if (c != null) update({ ceiling: { ...options.ceiling, color: c } }); }">
<!-- debounceしないとカラーピッカー上で高速でなぞったときになぜか無限ループになる -->
<MkInput :modelValue="getHex(options.ceiling.color)" type="color" debounce @update:modelValue="v => { const c = getRgb(v); if (c != null) update({ ceiling: { ...options.ceiling, color: c } }); }">
<template #label>color</template>
</MkInput>
</MkFolder>
@@ -85,7 +86,8 @@ SPDX-License-Identifier: AGPL-3.0-only
>
<template #label>material</template>
</MkSelect>
<MkInput :modelValue="getHex(options.flooring.color)" type="color" @update:modelValue="v => { const c = getRgb(v); if (c != null) update({ flooring: { ...options.flooring, color: c } }); }">
<!-- debounceしないとカラーピッカー上で高速でなぞったときになぜか無限ループになる -->
<MkInput :modelValue="getHex(options.flooring.color)" type="color" debounce @update:modelValue="v => { const c = getRgb(v); if (c != null) update({ flooring: { ...options.flooring, color: c } }); }">
<template #label>color</template>
</MkInput>
</MkFolder>

3
packages/frontend/src/pages/room.default-heya-pillar-options.vue
View File

@@ -15,7 +15,8 @@ SPDX-License-Identifier: AGPL-3.0-only
>
<template #label>wallpaper</template>
</MkSelect>
<MkInput :modelValue="getHex(options.color)" type="color" @update:modelValue="v => { const c = getRgb(v); if (c != null) update({ color: c }); }">
<!-- debounceしないとカラーピッカー上で高速でなぞったときになぜか無限ループになる -->
<MkInput :modelValue="getHex(options.color)" type="color" debounce @update:modelValue="v => { const c = getRgb(v); if (c != null) update({ color: c }); }">
<template #label>color</template>
</MkInput>
<MkSwitch :modelValue="options.show" @update:modelValue="v => { update({ show: v }); }">

6
packages/frontend/src/pages/room.default-heya-wall-options.vue
View File

@@ -15,7 +15,8 @@ SPDX-License-Identifier: AGPL-3.0-only
>
<template #label>wallpaper</template>
</MkSelect>
<MkInput :modelValue="getHex(options.color)" type="color" @update:modelValue="v => { const c = getRgb(v); if (c != null) update({ color: c }); }">
<!-- debounceしないとカラーピッカー上で高速でなぞったときになぜか無限ループになる -->
<MkInput :modelValue="getHex(options.color)" type="color" debounce @update:modelValue="v => { const c = getRgb(v); if (c != null) update({ color: c }); }">
<template #label>color</template>
</MkInput>
<hr>
@@ -31,7 +32,8 @@ SPDX-License-Identifier: AGPL-3.0-only
>
<template #label>beam material</template>
</MkSelect>
<MkInput :modelValue="getHex(options.beamColor)" type="color" @update:modelValue="v => { const c = getRgb(v); if (c != null) update({ beamColor: c }); }">
<!-- debounceしないとカラーピッカー上で高速でなぞったときになぜか無限ループになる -->
<MkInput :modelValue="getHex(options.beamColor)" type="color" debounce @update:modelValue="v => { const c = getRgb(v); if (c != null) update({ beamColor: c }); }">
<template #label>beam color</template>
</MkInput>
<hr>

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

@@ -0,0 +1,57 @@
<!--
SPDX-FileCopyrightText: syuilo and misskey-project
SPDX-License-Identifier: AGPL-3.0-only
-->
<template>
<div :class="$style.root">
<div class="_gaps">
<MkSelect
:items="[
{ label: 'Simple', value: 'simple' },
]" :modelValue="controller.roomState.value.heya.type" @update:modelValue="v => controller.changeHeyaType(v)"
>
<template #label>Heya type</template>
</MkSelect>
<!-- debounceしないとカラーピッカー上で高速でなぞったときになぜか無限ループになる -->
<MkInput :modelValue="getHex(controller.roomState.value.roomLightColor)" type="color" debounce @update:modelValue="v => { const c = getRgb(v); if (c != null) controller.updateRoomLightColor(c); }">
<template #label>light color</template>
</MkInput>
<template v-if="controller.roomState.value.heya.type === 'simple'">
<XDefaultHeyaOptions :options="controller.roomState.value.heya.options" @update="v => controller.updateHeyaOptions(v)"></XDefaultHeyaOptions>
</template>
</div>
</div>
</template>
<script lang="ts" setup>
import { computed, defineAsyncComponent, nextTick, onMounted, onUnmounted, ref, shallowRef, useTemplateRef, watch } from 'vue';
import XWallOption from './room.default-heya-wall-options.vue';
import XPillarOption from './room.default-heya-pillar-options.vue';
import XDefaultHeyaOptions from './room.default-heya-options.vue';
import type { ObjectDef } from '@/world/room/object.js';
import type { SimpleHeyaOptions } from '@/world/room/heya.js';
import type { RoomState } from '@/world/room/engine.js';
import type { RoomController } from '@/world/room/controller.js';
import { i18n } from '@/i18n.js';
import MkButton from '@/components/MkButton.vue';
import MkSelect from '@/components/MkSelect.vue';
import * as os from '@/os.js';
import MkInput from '@/components/MkInput.vue';
import MkSwitch from '@/components/MkSwitch.vue';
import MkRange from '@/components/MkRange.vue';
import { getHex, getRgb } from '@/world/utility.js';
import MkFolder from '@/components/MkFolder.vue';
const props = defineProps<{
controller: RoomController;
}>();
</script>
<style lang="scss" module>
.root {
}
</style>

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

@@ -72,21 +72,7 @@ SPDX-License-Identifier: AGPL-3.0-only
</div>
<div v-if="isRoomSettingsOpen && controller.isEditMode.value" class="_panel" :class="$style.overlayObjectInfoPanel">
<div class="_gaps">
Room options
<MkSelect
:items="[
{ label: 'Simple', value: 'simple' },
]" :modelValue="controller.roomState.value.heya.type" @update:modelValue="v => controller.changeHeyaType(v)"
>
<template #label>Heya type</template>
</MkSelect>
<template v-if="controller.roomState.value.heya.type === 'simple'">
<XDefaultHeyaOptions :options="controller.roomState.value.heya.options" @update="v => controller.updateHeyaOptions(v)"></XDefaultHeyaOptions>
</template>
</div>
<XHeyaOptions :controller="controller"/>
</div>
</div>
@@ -97,20 +83,16 @@ SPDX-License-Identifier: AGPL-3.0-only
</template>
<script lang="ts" setup>
import { computed, defineAsyncComponent, nextTick, onMounted, onUnmounted, ref, shallowRef, useTemplateRef, watch } from 'vue';
import { computed, defineAsyncComponent, markRaw, nextTick, onMounted, onUnmounted, ref, shallowRef, useTemplateRef, watch } from 'vue';
import * as BABYLON from '@babylonjs/core';
import XObjectCustomizeForm from './room.object-customize-form.vue';
import XDefaultHeyaOptions from './room.default-heya-options.vue';
import XHeyaOptions from './room.heya-options.vue';
import type { RoomControllerOptions } from '@/world/room/controller.js';
import { definePage } from '@/page.js';
import { i18n } from '@/i18n.js';
import { ensureSignin } from '@/i';
import MkButton from '@/components/MkButton.vue';
import MkSelect from '@/components/MkSelect.vue';
import * as os from '@/os.js';
import MkInput from '@/components/MkInput.vue';
import MkSwitch from '@/components/MkSwitch.vue';
import MkRange from '@/components/MkRange.vue';
import { RoomController } from '@/world/room/controller.js';
import { cm, getHex, getRgb } from '@/world/utility.js';
import { deepClone } from '@/utility/clone.js';
@@ -256,7 +238,7 @@ const roomControllerOptions = computed<RoomControllerOptions>(() => ({
workerMode: true,
}));
const controller = new RoomController(data, roomControllerOptions.value);
const controller = markRaw(new RoomController(data, roomControllerOptions.value));
const selectedObjectDef = computed(() => controller.selected.value == null ? null : getObjectDef(controller.selected.value.objectState.type));

2
packages/frontend/src/world/room/controller.ts
View File

@@ -15,6 +15,7 @@ import type { ObjectDef, RoomStateObject } from './object.js';
import * as sound from '@/utility/sound.js';
import * as os from '@/os.js';
import { i18n } from '@/i18n.js';
import { deepEqual } from '@/utility/deep-equal.js';
export type RoomControllerOptions = {
workerMode?: boolean;
@@ -142,6 +143,7 @@ export class RoomController {
});
engineEvents.on('changeRoomState', ({ roomState }) => {
if (deepEqual(this.roomState.value, roomState)) return; // vueのリアクティビティが反応して無限ループになることがあるため
this.roomState.value = roomState;
triggerRef(this.selected);
});

3
packages/frontend/src/world/room/engine.ts
View File

@@ -313,7 +313,7 @@ export class RoomEngine extends EventEmitter {
//this.scene.activeCamera = this.camera;
this.roomLight = new BABYLON.SpotLight('roomLight', new BABYLON.Vector3(0, cm(249), 0), new BABYLON.Vector3(0, -1, 0), 16, 8, this.scene);
this.roomLight.diffuse = roomState.roomLightColor != null ? new BABYLON.Color3(...roomState.roomLightColor) : new BABYLON.Color3(1.0, 0.9, 0.8);
this.roomLight.diffuse = new BABYLON.Color3(...roomState.roomLightColor);
this.roomLight.shadowMinZ = cm(10);
this.roomLight.shadowMaxZ = cm(300);
this.roomLight.radius = cm(30);
@@ -1414,6 +1414,7 @@ export class RoomEngine extends EventEmitter {
}
public updateRoomLightColor(color: [number, number, number]) {
if (this.roomLight.diffuse.equalsFloats(...color)) return;
this.roomLight.diffuse = new BABYLON.Color3(...color);
this.roomState.roomLightColor = color;
this.ev('changeRoomState', { roomState: this.roomState });