mirror of
https://github.com/misskey-dev/misskey.git
synced 2026-03-21 03:30:42 +00:00
wip
This commit is contained in:
Binary file not shown.
Binary file not shown.
Binary file not shown.
|
Before Width: | Height: | Size: 4.7 KiB After Width: | Height: | Size: 2.9 KiB |
@@ -33,6 +33,9 @@ SPDX-License-Identifier: AGPL-3.0-only
|
||||
<div v-if="s.type === 'color'">
|
||||
<MkInput :modelValue="getHex(engine.selected.value.objectState.options[k])" type="color" @update:modelValue="v => { const c = getRgb(v); if (c != null) engine.updateObjectOption(engine.selected.value.objectId, k, c); }"></MkInput>
|
||||
</div>
|
||||
<div v-else-if="s.type === 'boolean'">
|
||||
<MkSwitch :modelValue="engine.selected.value.objectState.options[k]" @update:modelValue="v => engine.updateObjectOption(engine.selected.value.objectId, k, v)"></MkSwitch>
|
||||
</div>
|
||||
<div v-else-if="s.type === 'enum'">
|
||||
<MkSelect :items="s.enum.map(e => ({ label: e, value: e }))" :modelValue="engine.selected.value.objectState.options[k]" @update:modelValue="v => engine.updateObjectOption(engine.selected.value.objectId, k, v)"></MkSelect>
|
||||
</div>
|
||||
@@ -63,6 +66,7 @@ import { getObjectDef, OBJECT_DEFS } from '@/utility/room/object-defs.js';
|
||||
import MkSelect from '@/components/MkSelect.vue';
|
||||
import * as os from '@/os.js';
|
||||
import MkInput from '@/components/MkInput.vue';
|
||||
import MkSwitch from '@/components/MkSwitch.vue';
|
||||
|
||||
const canvas = useTemplateRef('canvas');
|
||||
|
||||
|
||||
@@ -73,6 +73,11 @@ type NumberOptionSchema = {
|
||||
step?: number;
|
||||
};
|
||||
|
||||
type BooleanOptionSchema = {
|
||||
type: 'boolean';
|
||||
label: string;
|
||||
};
|
||||
|
||||
type ColorOptionSchema = {
|
||||
type: 'color';
|
||||
label: string;
|
||||
@@ -84,10 +89,10 @@ type EnumOptionSchema = {
|
||||
enum: string[];
|
||||
};
|
||||
|
||||
type OptionsSchema = Record<string, NumberOptionSchema | ColorOptionSchema | EnumOptionSchema>;
|
||||
type OptionsSchema = Record<string, NumberOptionSchema | BooleanOptionSchema | ColorOptionSchema | EnumOptionSchema>;
|
||||
|
||||
type GetOptionsSchemaValues<T extends OptionsSchema> = {
|
||||
[K in keyof T]: T[K] extends NumberOptionSchema ? number : T[K] extends ColorOptionSchema ? [number, number, number] : T[K] extends EnumOptionSchema ? T[K]['enum'][number] : never;
|
||||
[K in keyof T]: T[K] extends NumberOptionSchema ? number : T[K] extends BooleanOptionSchema ? boolean : T[K] extends ColorOptionSchema ? [number, number, number] : T[K] extends EnumOptionSchema ? T[K]['enum'][number] : never;
|
||||
};
|
||||
|
||||
type ObjectDef<OpSc extends OptionsSchema = OptionsSchema> = {
|
||||
@@ -496,62 +501,6 @@ export class RoomEngine {
|
||||
|
||||
//const sphere = BABYLON.MeshBuilder.CreateSphere('sphere', { diameter: 1/*cm*/ }, this.scene);
|
||||
|
||||
// update tv texure
|
||||
const tvProgramId = 'shopping';
|
||||
const tvProgram = TV_PROGRAMS[tvProgramId];
|
||||
const tvScreenMaterial = new BABYLON.StandardMaterial('tvScreenMaterial', this.scene);
|
||||
tvScreenMaterial.diffuseColor = new BABYLON.Color3(0, 0, 0);
|
||||
tvScreenMaterial.ambientColor = new BABYLON.Color3(0, 0, 0);
|
||||
tvScreenMaterial.specularColor = new BABYLON.Color3(0, 0, 0);
|
||||
tvScreenMaterial.emissiveTexture = new BABYLON.Texture(`/client-assets/room/tv/${tvProgramId}/${tvProgramId}.png`, this.scene, false, false);
|
||||
tvScreenMaterial.emissiveTexture.level = 0.5;
|
||||
tvScreenMaterial.emissiveColor = new BABYLON.Color3(0.4, 0.4, 0.4);
|
||||
tvScreenMaterial.freeze();
|
||||
|
||||
const applyTvTexture = (tlIndex: number) => {
|
||||
const [index, duration] = tvProgram.timeline[tlIndex];
|
||||
const tvIds = this.roomState.installedObjects.entries().filter(([id, o]) => o.type === 'tv').map(([id, o]) => o.id);
|
||||
|
||||
for (const tvId of tvIds) {
|
||||
const tvMesh = this.objectMeshs.get(tvId);
|
||||
const screenMesh = tvMesh?.getChildMeshes().find(m => m.name.includes('__TV_SCREEN__'))! as BABYLON.Mesh;
|
||||
screenMesh.material = tvScreenMaterial;
|
||||
|
||||
const aspect = 16 / 9;
|
||||
|
||||
const x = index % tvProgram.textureColumns;
|
||||
const y = Math.floor(index / tvProgram.textureColumns);
|
||||
|
||||
const ax = x / tvProgram.textureColumns;
|
||||
const ay = y / tvProgram.textureRows / aspect;
|
||||
const bx = (x + 1) / tvProgram.textureColumns;
|
||||
const by = ay;
|
||||
const cx = ax;
|
||||
const cy = (y + 1) / tvProgram.textureRows / aspect;
|
||||
const dx = bx;
|
||||
const dy = cy;
|
||||
|
||||
const uvs = screenMesh.getVerticesData(BABYLON.VertexBuffer.UVKind);
|
||||
uvs[0] = dx;
|
||||
uvs[1] = dy;
|
||||
uvs[2] = bx;
|
||||
uvs[3] = by;
|
||||
uvs[4] = cx;
|
||||
uvs[5] = cy;
|
||||
uvs[6] = ax;
|
||||
uvs[7] = ay;
|
||||
screenMesh.updateVerticesData(BABYLON.VertexBuffer.UVKind, uvs);
|
||||
}
|
||||
|
||||
const timeoutId = window.setTimeout(() => {
|
||||
this.timeoutIds = this.timeoutIds.filter(id => id !== timeoutId);
|
||||
applyTvTexture((tlIndex + 1) % tvProgram.timeline.length);
|
||||
}, duration);
|
||||
this.timeoutIds.push(timeoutId);
|
||||
};
|
||||
|
||||
applyTvTexture(0);
|
||||
|
||||
this.engine.runRenderLoop(() => {
|
||||
this.scene.render();
|
||||
});
|
||||
@@ -874,10 +823,6 @@ export class RoomEngine {
|
||||
mesh.metadata = metadata;
|
||||
mesh.checkCollisions = !hasCollisionMesh;
|
||||
|
||||
if (mesh.name.includes('__TV_SCREEN__')) {
|
||||
mesh.markVerticesDataAsUpdatable(BABYLON.VertexBuffer.UVKind, true);
|
||||
}
|
||||
|
||||
if (mesh.name.includes('__COLLISION__')) {
|
||||
mesh.receiveShadows = false;
|
||||
mesh.isVisible = false;
|
||||
@@ -1252,40 +1197,3 @@ export class RoomEngine {
|
||||
this.engine.dispose();
|
||||
}
|
||||
}
|
||||
|
||||
const TV_PROGRAMS = {
|
||||
shopping: {
|
||||
textureColumns: 8,
|
||||
textureRows: 8,
|
||||
timeline: [
|
||||
[0, 500],
|
||||
[1, 500],
|
||||
[0, 500],
|
||||
[1, 500],
|
||||
[0, 500],
|
||||
[1, 500],
|
||||
[2, 500],
|
||||
[3, 500],
|
||||
[2, 500],
|
||||
[3, 500],
|
||||
[4, 500],
|
||||
[5, 500],
|
||||
[4, 500],
|
||||
[5, 500],
|
||||
[6, 500],
|
||||
[7, 500],
|
||||
[8, 500],
|
||||
[9, 500],
|
||||
[8, 500],
|
||||
[9, 500],
|
||||
[2, 500],
|
||||
[3, 500],
|
||||
[2, 500],
|
||||
[3, 500],
|
||||
],
|
||||
},
|
||||
} satisfies Record<string, {
|
||||
textureColumns: number;
|
||||
textureRows: number;
|
||||
timeline: [index: number, duration: number][];
|
||||
}>;
|
||||
|
||||
@@ -3,18 +3,37 @@
|
||||
* SPDX-License-Identifier: AGPL-3.0-only
|
||||
*/
|
||||
|
||||
import * as BABYLON from '@babylonjs/core';
|
||||
import { defineObject } from '../engine.js';
|
||||
|
||||
export const petBottle = defineObject({
|
||||
id: 'petBottle',
|
||||
name: 'PET Bottle',
|
||||
options: {
|
||||
schema: {},
|
||||
default: {},
|
||||
schema: {
|
||||
withCap: {
|
||||
type: 'boolean',
|
||||
label: 'With Cap',
|
||||
},
|
||||
},
|
||||
default: {
|
||||
withCap: true,
|
||||
},
|
||||
},
|
||||
placement: 'top',
|
||||
createInstance: () => {
|
||||
createInstance: ({ root, options }) => {
|
||||
const capMesh = root.getChildMeshes().find(m => m.name.includes('__X_CAP__')) as BABYLON.Mesh;
|
||||
|
||||
const applyWithCap = () => {
|
||||
capMesh.setEnabled(options.withCap);
|
||||
};
|
||||
|
||||
applyWithCap();
|
||||
|
||||
return {
|
||||
onOptionsUpdated: ([k, v]) => {
|
||||
applyWithCap();
|
||||
},
|
||||
interactions: {},
|
||||
};
|
||||
},
|
||||
|
||||
@@ -3,7 +3,9 @@
|
||||
* SPDX-License-Identifier: AGPL-3.0-only
|
||||
*/
|
||||
|
||||
import * as BABYLON from '@babylonjs/core';
|
||||
import { defineObject } from '../engine.js';
|
||||
import { initTv } from '../utility.js';
|
||||
|
||||
export const tv = defineObject({
|
||||
id: 'tv',
|
||||
@@ -13,7 +15,12 @@ export const tv = defineObject({
|
||||
default: {},
|
||||
},
|
||||
placement: 'top',
|
||||
createInstance: () => {
|
||||
createInstance: ({ room, root }) => {
|
||||
const screenMesh = root.getChildMeshes().find(m => m.name.includes('__TV_SCREEN__')) as BABYLON.Mesh;
|
||||
screenMesh.markVerticesDataAsUpdatable(BABYLON.VertexBuffer.UVKind, true);
|
||||
|
||||
initTv(room, screenMesh);
|
||||
|
||||
return {
|
||||
interactions: {},
|
||||
};
|
||||
|
||||
@@ -238,3 +238,96 @@ export function createOverridedStates<T extends Record<string, (() => any)>>(sta
|
||||
|
||||
return result;
|
||||
}
|
||||
|
||||
const TV_PROGRAMS = {
|
||||
shopping: {
|
||||
textureColumns: 8,
|
||||
textureRows: 8,
|
||||
timeline: [
|
||||
[0, 500],
|
||||
[1, 500],
|
||||
[0, 500],
|
||||
[1, 500],
|
||||
[0, 500],
|
||||
[1, 500],
|
||||
[2, 500],
|
||||
[3, 500],
|
||||
[2, 500],
|
||||
[3, 500],
|
||||
[4, 500],
|
||||
[5, 500],
|
||||
[4, 500],
|
||||
[5, 500],
|
||||
[6, 500],
|
||||
[7, 500],
|
||||
[8, 500],
|
||||
[9, 500],
|
||||
[8, 500],
|
||||
[9, 500],
|
||||
[2, 500],
|
||||
[3, 500],
|
||||
[2, 500],
|
||||
[3, 500],
|
||||
],
|
||||
},
|
||||
} satisfies Record<string, {
|
||||
textureColumns: number;
|
||||
textureRows: number;
|
||||
timeline: [index: number, duration: number][];
|
||||
}>;
|
||||
|
||||
let tvScreenMaterial: BABYLON.StandardMaterial | null = null;
|
||||
|
||||
export function initTv(room: RoomEngine, screenMesh: BABYLON.Mesh) {
|
||||
const tvProgramId = 'shopping';
|
||||
const tvProgram = TV_PROGRAMS[tvProgramId];
|
||||
if (tvScreenMaterial == null) {
|
||||
tvScreenMaterial = new BABYLON.StandardMaterial('tvScreenMaterial', room.scene);
|
||||
tvScreenMaterial.diffuseColor = new BABYLON.Color3(0, 0, 0);
|
||||
tvScreenMaterial.ambientColor = new BABYLON.Color3(0, 0, 0);
|
||||
tvScreenMaterial.specularColor = new BABYLON.Color3(0, 0, 0);
|
||||
tvScreenMaterial.emissiveTexture = new BABYLON.Texture(`/client-assets/room/tv/${tvProgramId}/${tvProgramId}.png`, room.scene, false, false);
|
||||
tvScreenMaterial.emissiveTexture.level = 0.5;
|
||||
tvScreenMaterial.emissiveColor = new BABYLON.Color3(0.4, 0.4, 0.4);
|
||||
tvScreenMaterial.freeze();
|
||||
}
|
||||
|
||||
const applyTvTexture = (tlIndex: number) => {
|
||||
const [index, duration] = tvProgram.timeline[tlIndex];
|
||||
|
||||
screenMesh.material = tvScreenMaterial;
|
||||
|
||||
const aspect = 16 / 9;
|
||||
|
||||
const x = index % tvProgram.textureColumns;
|
||||
const y = Math.floor(index / tvProgram.textureColumns);
|
||||
|
||||
const ax = x / tvProgram.textureColumns;
|
||||
const ay = y / tvProgram.textureRows / aspect;
|
||||
const bx = (x + 1) / tvProgram.textureColumns;
|
||||
const by = ay;
|
||||
const cx = ax;
|
||||
const cy = (y + 1) / tvProgram.textureRows / aspect;
|
||||
const dx = bx;
|
||||
const dy = cy;
|
||||
|
||||
const uvs = screenMesh.getVerticesData(BABYLON.VertexBuffer.UVKind);
|
||||
uvs[0] = dx;
|
||||
uvs[1] = dy;
|
||||
uvs[2] = bx;
|
||||
uvs[3] = by;
|
||||
uvs[4] = cx;
|
||||
uvs[5] = cy;
|
||||
uvs[6] = ax;
|
||||
uvs[7] = ay;
|
||||
screenMesh.updateVerticesData(BABYLON.VertexBuffer.UVKind, uvs);
|
||||
|
||||
const timeoutId = window.setTimeout(() => {
|
||||
room.timeoutIds = room.timeoutIds.filter(id => id !== timeoutId);
|
||||
applyTvTexture((tlIndex + 1) % tvProgram.timeline.length);
|
||||
}, duration);
|
||||
room.timeoutIds.push(timeoutId);
|
||||
};
|
||||
|
||||
applyTvTexture(0);
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user