s3rius/anime
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Added play-pause icons swap.

Browse Source 
Signed-off-by: Pavel Kirilin <win10@list.ru>
This commit is contained in:
Pavel Kirilin
2024-05-02 04:38:29 +02:00
parent 4d0b1e1c86
commit 24937da840
6 changed files with 186 additions and 21 deletions
Download Patch File Download Diff File Expand all files Collapse all files

20
frontend/src/components/PlayerComponent.vue
View File

@ -1,7 +1,9 @@
<script setup>
import { ActionBar, ActionBarButton } from 'vant';
import { postRequest } from '@/utils'
import { ref } from 'vue'
const is_playing = ref(false);
async function offsetRequest(offset, forward) {
await postRequest(`/api/player/offset`, {
@ -12,16 +14,28 @@ async function offsetRequest(offset, forward) {
async function playPauseRequest() {
await postRequest(`/api/player/play-pause`)
update_state()
}
function update_state() {
fetch('/api/player/playing').then((response) => {
if (response.ok) {
response.json().then((resp_json) => {
is_playing.value = resp_json.playing
})
}
})
}
update_state()
</script>
<template>
<ActionBar>
<ActionBarButton icon="arrow-double-left" @click="offsetRequest(90, false)"></ActionBarButton>
<ActionBarButton icon="arrow-double-left" @click="offsetRequest(85, false)"></ActionBarButton>
<ActionBarButton icon="arrow-left" @click="offsetRequest(10, false)"></ActionBarButton>
<ActionBarButton icon="play" @click="playPauseRequest()"></ActionBarButton>
<ActionBarButton :icon="is_playing ? 'pause' : 'play'" @click="playPauseRequest()"></ActionBarButton>
<ActionBarButton icon="arrow" @click="offsetRequest(10, true)"></ActionBarButton>
<ActionBarButton icon="arrow-double-right" @click="offsetRequest(90, true)"></ActionBarButton>
<ActionBarButton icon="arrow-double-right" @click="offsetRequest(85, true)"></ActionBarButton>
</ActionBar>
</template>

4
frontend/src/views/HomeView.vue
View File

@ -17,14 +17,14 @@ async function kill(...names) {
async function startWatching() {
await postRequest("/api/start-watching")
}
</script>
<template>
<Space fill direction="vertical" :size="20">
<Button type="warning" round size="large" @click="kill('mpv')">Убить MPV</Button>
<Button type="danger" round size="large" @click="kill('awatch', 'mpv')">Убить awatch</Button>
<Button type="primary" round size="large" :disabled="!can_watch" @click="startWatching">Начать потребление анимы</Button>
<Button type="primary" round size="large" :disabled="!can_watch" @click="startWatching">Начать потребление
анимы</Button>
</Space>
<PlayerComponent />
</template>