mirror of
https://github.com/misskey-dev/misskey.git
synced 2026-03-21 03:30:42 +00:00
wip
This commit is contained in:
@@ -7,6 +7,7 @@ SPDX-License-Identifier: AGPL-3.0-only
|
||||
<div :class="$style.root" class="_pageScrollable">
|
||||
<div :class="$style.screen">
|
||||
<canvas ref="canvas" :class="$style.canvas" @keydown="onKeydown" @wheel="onWheel"></canvas>
|
||||
|
||||
<div v-if="engine != null" class="_buttonsCenter" :class="$style.overlayControls">
|
||||
<template v-if="engine.isEditMode.value">
|
||||
<MkButton v-if="engine.ui.isGrabbing" @click="endGrabbing">Put (E)</MkButton>
|
||||
@@ -22,7 +23,12 @@ SPDX-License-Identifier: AGPL-3.0-only
|
||||
<MkButton inline @click="interaction.fn()">{{ interaction.label }}{{ interaction.isPrimary ? ' (E)' : '' }}</MkButton>
|
||||
</template>
|
||||
</div>
|
||||
|
||||
<div v-if="engine != null && engine.isEditMode.value && engine.selected.value != null" class="_panel" :class="$style.overlayObjectInfoPanel">
|
||||
{{ engine.selected.value.objectId }}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div v-if="engine != null" class="_buttons" :class="$style.controls">
|
||||
<!--<MkButton v-for="action in actions" :key="action.key" @click="action.fn">{{ action.label }}{{ hotkeyToLabel(action.hotkey) }}</MkButton>-->
|
||||
<MkButton @click="toggleLight">Toggle Light</MkButton>
|
||||
@@ -116,8 +122,8 @@ function onKeydown(ev: KeyboardEvent) {
|
||||
} else {
|
||||
beginSelectedInstalledObjectGrabbing();
|
||||
}
|
||||
} else if (engine.value.selectedObjectId.value != null) {
|
||||
engine.value.interact(engine.value.selectedObjectId.value);
|
||||
} else if (engine.value.selected.value != null) {
|
||||
engine.value.interact(engine.value.selected.value.objectId);
|
||||
}
|
||||
} else if (ev.code === 'KeyR') {
|
||||
ev.preventDefault();
|
||||
@@ -425,15 +431,14 @@ onMounted(() => {
|
||||
|
||||
window.addEventListener('resize', resize);
|
||||
|
||||
watch(engine.value.selectedObjectId, (v) => {
|
||||
watch(engine.value.selected, (v) => {
|
||||
if (v == null) {
|
||||
interacions.value = [];
|
||||
} else {
|
||||
const obji = engine.value.objectInstances.get(v)!;
|
||||
interacions.value = Object.entries(obji.interactions).map(([interactionId, interactionInfo]) => ({
|
||||
interacions.value = Object.entries(v.objectInstance.interactions).map(([interactionId, interactionInfo]) => ({
|
||||
id: interactionId,
|
||||
label: interactionInfo.label,
|
||||
isPrimary: obji.primaryInteraction === interactionId,
|
||||
isPrimary: v.objectInstance.primaryInteraction === interactionId,
|
||||
fn: interactionInfo.fn,
|
||||
}));
|
||||
}
|
||||
@@ -546,4 +551,12 @@ definePage(() => ({
|
||||
z-index: 1;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.overlayObjectInfoPanel {
|
||||
position: absolute;
|
||||
top: 8px;
|
||||
right: 8px;
|
||||
z-index: 1;
|
||||
padding: 16px;
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -25,7 +25,7 @@ import { registerBuiltInLoaders } from '@babylonjs/loaders/dynamic';
|
||||
import { BoundingBoxRenderer } from '@babylonjs/core/Rendering/boundingBoxRenderer';
|
||||
import { GridMaterial } from '@babylonjs/materials';
|
||||
import { ShowInspector } from '@babylonjs/inspector';
|
||||
import { reactive, ref, watch } from 'vue';
|
||||
import { reactive, ref, shallowRef, watch } from 'vue';
|
||||
import { genId } from '../id.js';
|
||||
import { getObjectDef } from './object-defs.js';
|
||||
import { HorizontalCameraKeyboardMoveInput } from './utility.js';
|
||||
@@ -170,7 +170,11 @@ export class RoomEngine {
|
||||
onCancel?: () => void;
|
||||
onDone?: () => void;
|
||||
} | null = null;
|
||||
public selectedObjectId = ref<string | null>(null);
|
||||
public selected = shallowRef<{
|
||||
objectId: string;
|
||||
objectMesh: BABYLON.Mesh;
|
||||
objectInstance: RoomObjectInstance<any>;
|
||||
} | null>(null);
|
||||
private time: 0 | 1 | 2 = 0; // 0: 昼, 1: 夕, 2: 夜
|
||||
private roomCollisionMeshes: BABYLON.AbstractMesh[] = [];
|
||||
public roomState: RoomState;
|
||||
@@ -526,14 +530,12 @@ export class RoomEngine {
|
||||
}
|
||||
|
||||
public selectObject(objectId: string | null) {
|
||||
if (this.selectedObjectId.value != null) {
|
||||
const prevMesh = this.objectMeshs.get(this.selectedObjectId.value);
|
||||
if (prevMesh != null) {
|
||||
for (const om of prevMesh.getChildMeshes()) {
|
||||
om.renderOutline = false;
|
||||
}
|
||||
if (this.selected.value != null) {
|
||||
const prevMesh = this.selected.value.objectMesh;
|
||||
for (const om of prevMesh.getChildMeshes()) {
|
||||
om.renderOutline = false;
|
||||
}
|
||||
this.selectedObjectId.value = null;
|
||||
this.selected.value = null;
|
||||
}
|
||||
|
||||
if (objectId != null) {
|
||||
@@ -542,7 +544,11 @@ export class RoomEngine {
|
||||
for (const om of mesh.getChildMeshes()) {
|
||||
om.renderOutline = true;
|
||||
}
|
||||
this.selectedObjectId.value = objectId;
|
||||
this.selected.value = {
|
||||
objectId,
|
||||
objectMesh: mesh,
|
||||
objectInstance: this.objectInstances.get(objectId)!,
|
||||
};
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -856,7 +862,7 @@ export class RoomEngine {
|
||||
this.shadowGenerator2.addShadowCaster(mesh);
|
||||
}
|
||||
|
||||
mesh.renderOutline = this.selectedObjectId.value === args.id;
|
||||
mesh.renderOutline = this.selected.value?.objectId === args.id;
|
||||
mesh.outlineWidth = 0.003;
|
||||
mesh.outlineColor = new BABYLON.Color3(1, 0, 0);
|
||||
//if (mesh.material) (mesh.material as BABYLON.PBRMaterial).ambientColor = new BABYLON.Color3(0.2, 0.2, 0.2);
|
||||
@@ -895,9 +901,9 @@ export class RoomEngine {
|
||||
}
|
||||
|
||||
public beginSelectedInstalledObjectGrabbing() {
|
||||
if (this.selectedObjectId.value == null) return;
|
||||
if (this.selected.value == null) return;
|
||||
|
||||
const selectedObject = this.objectMeshs.get(this.selectedObjectId.value)!;
|
||||
const selectedObject = this.selected.value.objectMesh;
|
||||
for (const om of selectedObject.getChildMeshes()) {
|
||||
om.renderOutline = false;
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user