animation of remote display

This commit is contained in:
2023-11-03 18:56:16 +01:00
parent 5d13e6a9e2
commit 5266a6e996
8 changed files with 246 additions and 108 deletions

View File

@@ -14,12 +14,14 @@
<body>
<div class="content" id="app">
<div v-if="hasLoaded" style="width: 100%">
<div class="current-song">
<div class="current-song-wrapper">
<span class="material-symbols-outlined fancy-view-song-art" v-if="!playingSong.hasCoverArt">music_note</span>
<img v-else :src="'/getSongCover?filename=' + playingSong.filename" class="fancy-view-song-art">
<progress max="1000" id="progress" :value="progressBar"></progress>
<h1>{{ playingSong.title }}</h1>
<p>{{ playingSong.artist }}</p>
<div class="current-song">
<progress max="1000" id="progress" :value="progressBar"></progress>
<h1>{{ playingSong.title }}</h1>
<p>{{ playingSong.artist }}</p>
</div>
</div>
<div class="song-list-wrapper">
<div v-for="song in songQueue" class="song-list">
@@ -37,6 +39,9 @@
<h3>{{ song.title }}</h3>
<p>{{ song.artist }}</p>
</div>
<div class="time-until">
{{ getTimeUntil( song ) }}
</div>
</div>
<!-- <img :src="" alt=""> -->
</div>