This commit is contained in:
kakkokari-gtyih 2024-07-06 11:56:35 +09:00
parent 22fdc8c837
commit 15443e4418
2 changed files with 10 additions and 3 deletions

View file

@ -76,7 +76,7 @@ SPDX-License-Identifier: AGPL-3.0-only
</template>
<script lang="ts" setup>
import { shallowRef, watch, computed, ref, onDeactivated, onActivated, onMounted } from 'vue';
import { shallowRef, watch, computed, ref, inject, onDeactivated, onActivated, onMounted } from 'vue';
import * as Misskey from 'misskey-js';
import type { MenuItem } from '@/types/menu.js';
import { defaultStore } from '@/store.js';
@ -91,28 +91,35 @@ const props = defineProps<{
audio: Misskey.entities.DriveFile;
}>();
const inEmbedPage = inject<boolean>('EMBED_PAGE', false);
const keymap = {
'up': () => {
if (inEmbedPage) return;
if (hasFocus() && audioEl.value) {
volume.value = Math.min(volume.value + 0.1, 1);
}
},
'down': () => {
if (inEmbedPage) return;
if (hasFocus() && audioEl.value) {
volume.value = Math.max(volume.value - 0.1, 0);
}
},
'left': () => {
if (inEmbedPage) return;
if (hasFocus() && audioEl.value) {
audioEl.value.currentTime = Math.max(audioEl.value.currentTime - 5, 0);
}
},
'right': () => {
if (inEmbedPage) return;
if (hasFocus() && audioEl.value) {
audioEl.value.currentTime = Math.min(audioEl.value.currentTime + 5, audioEl.value.duration);
}
},
'space': () => {
if (inEmbedPage) return;
if (hasFocus()) {
togglePlayPause();
}

View file

@ -37,7 +37,7 @@ SPDX-License-Identifier: AGPL-3.0-only
controls
@keydown.prevent
>
<source :src="video.url" :type="audio.type">
<source :src="video.url" :type="video.type">
</video>
<i class="ti ti-eye-off" :class="$style.hide" @click="hide = true"></i>
<div :class="$style.indicators">
@ -59,7 +59,7 @@ SPDX-License-Identifier: AGPL-3.0-only
@keydown.prevent
@click.self="togglePlayPause"
>
<source :src="video.url" :type="audio.type">
<source :src="video.url" :type="video.type">
</video>
<button v-if="isReady && !isPlaying" class="_button" :class="$style.videoOverlayPlayButton" @click="togglePlayPause"><i class="ti ti-player-play-filled"></i></button>
<div v-else-if="!isActuallyPlaying" :class="$style.videoLoading">