Moved library-songs to EJS, added check for empty library

This commit is contained in:
booploops 2021-12-06 18:39:31 -08:00
parent 0a6f5a78d8
commit 9fccd97d71
3 changed files with 23 additions and 17 deletions

View file

@ -82,7 +82,7 @@ const app = new Vue({
meta: {total: 0, progress: 0}, meta: {total: 0, progress: 0},
search: "", search: "",
displayListing: [], displayListing: [],
downloadState: 0 // 0 = not started, 1 = in progress, 2 = complete downloadState: 0 // 0 = not started, 1 = in progress, 2 = complete, 3 = empty library
}, },
albums: { albums: {
listing: [], listing: [],
@ -323,6 +323,10 @@ const app = new Vue({
library = library.concat(downloaded.data) library = library.concat(downloaded.data)
self.library.songs.meta.total = downloaded.meta.total self.library.songs.meta.total = downloaded.meta.total
self.library.songs.meta.progress = library.length self.library.songs.meta.progress = library.length
if(downloaded.meta.total == 0) {
self.library.songs.downloadState = 3
return
}
if(typeof downloaded.next == "undefined") { if(typeof downloaded.next == "undefined") {
console.log("downloaded.next is undefined") console.log("downloaded.next is undefined")
self.library.songs.listing = library self.library.songs.listing = library

View file

@ -284,22 +284,7 @@
</transition> </transition>
<!-- Library - Songs --> <!-- Library - Songs -->
<transition name="wpfade" v-on:enter="getLibrarySongsFull()"> <transition name="wpfade" v-on:enter="getLibrarySongsFull()">
<template v-if="page == 'library-songs'"> <%- include('pages/library-songs') %>
<div class="content-inner">
<h1 class="header-text">Songs</h1>
<div class="search-input-container" style="width:100%;margin: 16px 0px;">
<div class="search-input--icon"></div>
<input type="search"
style="width:100%;"
spellcheck="false"
placeholder="Search..."
@input="searchLibrarySongs"
v-model="library.songs.search" class="search-input">
</div>
<mediaitem-list-item :item="item"
v-for="item in library.songs.displayListing"></mediaitem-list-item>
</div>
</template>
</transition> </transition>
<!-- Library - Albums --> <!-- Library - Albums -->
<transition name="wpfade" v-on:enter="getLibraryAlbums()"> <transition name="wpfade" v-on:enter="getLibraryAlbums()">

View file

@ -0,0 +1,17 @@
<template v-if="page == 'library-songs'">
<div class="content-inner">
<h1 class="header-text">Songs</h1>
<div class="search-input-container" style="width:100%;margin: 16px 0px;">
<div class="search-input--icon"></div>
<input type="search"
style="width:100%;"
spellcheck="false"
placeholder="Search..."
@input="searchLibrarySongs"
v-model="library.songs.search" class="search-input">
</div>
<div v-if="library.songs.downloadState == 3">Library contains no songs.</div>
<mediaitem-list-item :item="item"
v-for="item in library.songs.displayListing"></mediaitem-list-item>
</div>
</template>