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

mhq

Browse Source
This commit is contained in:
syuilo
2026-04-29 11:01:42 +09:00
parent c8441da835
commit 80c2b1fa65
4 changed files with 147 additions and 26 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
packages/frontend/package.json
View File

@@ -18,9 +18,9 @@
"dependencies": {
"@analytics/google-analytics": "1.1.0",
"@babylonjs/core": "9.3.4",
"@babylonjs/inspector": "9.3.4",
"@babylonjs/loaders": "9.3.4",
"@babylonjs/materials": "9.3.4",
"@babylonjs/inspector": "9.3.4",
"@discordapp/twemoji": "16.0.1",
"@github/webauthn-json": "2.1.1",
"@mcaptcha/core-glue": "0.1.0-alpha-5",
@@ -48,6 +48,7 @@
"execa": "9.6.1",
"exifreader": "4.38.1",
"frontend-shared": "workspace:*",
"hls.js": "1.6.16",
"i18n": "workspace:*",
"icons-subsetter": "workspace:*",
"idb-keyval": "6.2.2",

137
packages/frontend/src/pages/world.vue
View File

@@ -4,7 +4,7 @@ SPDX-License-Identifier: AGPL-3.0-only
-->
<template>
<div :class="$style.root" class="_pageScrollable">
<div :class="$style.root">
<div :class="[$style.screen, { [$style.zen]: isZenMode }]">
<canvas ref="canvas" :class="$style.canvas" tabindex="-1" :style="{ visibility: controller.isReady.value ? 'visible' : 'hidden' }"></canvas>
@@ -15,9 +15,7 @@ SPDX-License-Identifier: AGPL-3.0-only
:leaveToClass="$style.transition_fade_leaveTo"
>
<div v-if="!controller.isReady.value" :class="$style.loading">
<div :class="$style.progressBar">
<div :class="$style.progressBarValue" :style="{ width: `${controller.initializeProgress.value * 100}%` }"></div>
</div>
<MkProgressBar :class="$style.progressBar" :progress="controller.initializeProgress.value" :waiting="controller.initializeProgress.value === 1"/>
</div>
</Transition>
@@ -88,15 +86,15 @@ definePage(() => ({
<style lang="scss" module>
.root {
height: 100%;
overflow: clip;
background: var(--MI_THEME-bg);
}
.screen {
position: relative;
width: 100%;
height: 90cqh;
}
.screen.zen {
height: 100%;
height: 100cqh;
overflow: clip;
}
.canvas {
@@ -110,7 +108,118 @@ definePage(() => ({
}
}
.controls {
.joyStick {
position: relative;
width: 50%;
height: 100px;
box-sizing: border-box;
padding: 8px;
}
.joyStick::before {
content: '';
display: block;
width: 100%;
height: 100%;
border: solid 2px #fff;
border-radius: 16px;
pointer-events: none;
}
.joyStickRangeCircle {
position: absolute;
top: var(--startYPx);
left: var(--startXPx);
width: calc(var(--rPx) * 2);
height: calc(var(--rPx) * 2);
border: solid 2px rgba(255, 255, 255, 0.5);
border-radius: 100%;
transform: translate(-50%, -50%);
pointer-events: none;
}
.joyStickPuck {
position: absolute;
top: calc(var(--startYPx) + (var(--y) * var(--rPx)));
left: calc(var(--startXPx) + (var(--x) * var(--rPx)));
width: 30px;
height: 30px;
background: #fff;
border-radius: 100%;
transform: translate(-50%, -50%);
pointer-events: none;
}
.overlayTop {
position: absolute;
top: 0;
left: 0;
z-index: 1;
width: 100%;
}
.overlayBottom {
position: absolute;
bottom: 0;
left: 0;
z-index: 1;
width: 100%;
}
.topMain {
display: flex;
align-items: center;
gap: 16px;
}
.topMenu {
margin: 16px;
display: flex;
box-sizing: border-box;
width: max-content;
}
.topMenuButton {
padding: 8px;
}
.topMenuButton:first-child {
padding-left: 16px;
}
.topMenuButton:last-child {
padding-right: 16px;
}
.modified {
display: flex;
align-items: center;
font-size: 90%;
gap: 1em;
padding: 8px 16px;
}
.modifiedText {
color: var(--MI_THEME-warn);
animation: modified-blink 2s infinite;
}
@keyframes modified-blink {
0% { opacity: 1; }
50% { opacity: 0.5; }
100% { opacity: 1; }
}
.overlayControls {
}
.overlayObjectInfoPanel {
position: absolute;
top: 16px;
right: 16px;
z-index: 1;
padding: 16px;
box-sizing: border-box;
width: 300px;
}
.loading {
@@ -126,16 +235,6 @@ definePage(() => ({
.progressBar {
width: 75%;
height: 4px;
border-radius: 999px;
overflow: clip;
background-color: var(--MI_THEME-accentedBg);
}
.progressBarValue {
height: 100%;
background: linear-gradient(90deg, var(--MI_THEME-buttonGradateA), var(--MI_THEME-buttonGradateB));
transition: all 0.5s cubic-bezier(0,.5,.5,1);
}
.transition_fade_enterActive,

18
packages/frontend/src/world/engine.ts
View File

@@ -8,6 +8,7 @@ import { AxesViewer } from '@babylonjs/core/Debug/axesViewer';
import { registerBuiltInLoaders } from '@babylonjs/loaders/dynamic';
import { EventEmitter } from 'eventemitter3';
import tinycolor from 'tinycolor2';
import Hls from 'hls.js';
import { RecyvlingTextGrid, Timer, WORLD_SCALE, camelToKebab, cm, createPlaneUvMapper, normalizeUvToSquare, randomRange } from './utility.js';
import { TIME_MAP } from './utility.js';
import { genId } from '@/utility/id.js';
@@ -181,10 +182,10 @@ export class WorldEngine extends EventEmitter<WorldEngineEvents> {
if (_DEV_) {
// snapshot renderingかつglow layerが有効だとなんかクラッシュする
if (!(SNAPSHOT_RENDERING && USE_GLOW)) {
const axes = new AxesViewer(this.scene, 30);
axes.xAxis.position = new BABYLON.Vector3(0, 30, 0);
axes.yAxis.position = new BABYLON.Vector3(0, 30, 0);
axes.zAxis.position = new BABYLON.Vector3(0, 30, 0);
//const axes = new AxesViewer(this.scene, 30);
//axes.xAxis.position = new BABYLON.Vector3(0, 30, 0);
//axes.yAxis.position = new BABYLON.Vector3(0, 30, 0);
//axes.zAxis.position = new BABYLON.Vector3(0, 30, 0);
}
if (!IN_WEB_WORKER) {
@@ -538,8 +539,15 @@ export class WorldEngine extends EventEmitter<WorldEngineEvents> {
const screenMeshes = envObj.meshes.filter(m => m.name.includes('__SCREEN__'));
const screenMaterial = screenMeshes[0].material as BABYLON.PBRMaterial;
const videoEl = document.createElement('video');
videoEl.crossOrigin = 'anonymous';
const hls = new Hls();
hls.loadSource('https://tvs.misskey.io/official/hq-beta/ts:abr.m3u8');
hls.attachMedia(videoEl);
this.timer.setTimeout(() => {
const tex = new BABYLON.VideoTexture('', 'http://syu-win.local:3000/files/931c02c3-6238-4c29-9371-06bab78950bb', this.scene, true, true);
const tex = new BABYLON.VideoTexture('', videoEl, this.scene, true, true);
tex.level = 0.5;
tex.video.loop = true;
tex.video.volume = 0.25;

15
pnpm-lock.yaml generated
View File

@@ -704,6 +704,9 @@ importers:
frontend-shared:
specifier: workspace:*
version: link:../frontend-shared
hls.js:
specifier: 1.6.16
version: 1.6.16
i18n:
specifier: workspace:*
version: link:../i18n
@@ -7277,6 +7280,9 @@ packages:
resolution: {integrity: sha512-Xwwo44whKBVCYoliBQwaPvtd/2tYFkRQtXDWj1nackaV2JPXx3L0+Jvd8/qCJ2p+ML0/XVkJ2q+Mr+UVdpJK5w==}
engines: {node: '>=12.0.0'}
hls.js@1.6.16:
resolution: {integrity: sha512-VSIRpLfRwlAAdGL4wiTucx2ScRipo0ed1FBatWkyt832jC4CReKstga6yIhYVwGu9LOBjuX9wzmRMeQdBJtzEA==}
hosted-git-info@2.8.9:
resolution: {integrity: sha512-mxIDAb9Lsm6DoOJ7xH+5+X4y1LU/4Hi50L9C5sIswK3JzULS4bwk1FvjdBgvYR4bzT4tuUQiC15FE2f5HbLvYw==}
@@ -10944,6 +10950,9 @@ packages:
vue-component-type-helpers@3.2.6:
resolution: {integrity: sha512-O02tnvIfOQVmnvoWwuSydwRoHjZVt8UEBR+2p4rT35p8GAy5VTlWP8o5qXfJR/GWCN0nVZoYWsVUvx2jwgdBmQ==}
vue-component-type-helpers@3.2.7:
resolution: {integrity: sha512-+gPp5YGmhfsj1IN+xUo7y0fb4clfnOiiUA39y07yW1VzCRjzVgwLbtmdWlghh7mXrPsEaYc7rrIir/HT6C8vYQ==}
vue-demi@0.14.10:
resolution: {integrity: sha512-nMZBOwuzabUO0nLgIcc6rycZEebF6eeUfaiQx9+WSk8e29IbLvPU9feI6tqW4kTo3hvoYAJkMh8n8D0fuISphg==}
engines: {node: '>=12'}
@@ -15583,7 +15592,7 @@ snapshots:
storybook: 10.3.5(@testing-library/dom@10.4.0)(bufferutil@4.1.0)(prettier@3.8.3)(react-dom@19.2.5(react@19.2.5))(react@19.2.5)(utf-8-validate@6.0.6)
type-fest: 2.19.0
vue: 3.5.32(typescript@5.9.3)
vue-component-type-helpers: 3.2.6
vue-component-type-helpers: 3.2.7
'@stylistic/eslint-plugin@5.5.0(eslint@9.39.4)':
dependencies:
@@ -18694,6 +18703,8 @@ snapshots:
highlight.js@11.11.1: {}
hls.js@1.6.16: {}
hosted-git-info@2.8.9: {}
hosted-git-info@4.1.0:
@@ -22576,6 +22587,8 @@ snapshots:
vue-component-type-helpers@3.2.6: {}
vue-component-type-helpers@3.2.7: {}
vue-demi@0.14.10(vue@3.5.32(typescript@5.9.3)):
dependencies:
vue: 3.5.32(typescript@5.9.3)