add to playlist now has folders

This commit is contained in:
booploops 2022-01-28 02:56:15 -08:00
parent 3a2b57f3b3
commit 4852f94329
2 changed files with 28 additions and 11 deletions

View file

@ -1,18 +1,15 @@
<script type="text/x-template" id="add-to-playlist">
<template>
<div class="modal-fullscreen addtoplaylist-panel" @click.self="app.resetState()" @contextmenu.self="app.resetState()">
<div class="modal-fullscreen addtoplaylist-panel" @click.self="app.resetState()"
@contextmenu.self="app.resetState()">
<div class="modal-window">
<div class="modal-header">
<div class="modal-title">{{app.getLz('action.addToLibrary')}}</div>
<div class="modal-title">{{app.getLz('action.addToPlaylist')}}</div>
<button class="close-btn" @click="app.resetState()"></button>
</div>
<div class="modal-content">
<button class="playlist-item"
:class="{ focused: playlist.id == focused }"
@click="addToPlaylist(playlist.id)" style="width:100%;" v-for="playlist in playlistSorted" v-if="playlist.attributes.canEdit && playlist.type != 'library-playlist-folders'">
<div class="icon"><%- include("../svg/playlist.svg") %></div>
<div class="name">{{ playlist.attributes.name }}</div>
</button>
<sidebar-playlist :playlist-select="playlistSelect" v-for="item in $root.getPlaylistFolderChildren('p.playlistsroot')" :item="item">
</sidebar-playlist>
</div>
<div class="modal-search">
<div class="search-input-container" style="width:100%;margin: 16px 0;">
@ -61,6 +58,11 @@
})
},
methods: {
playlistSelect(playlist) {
if(playlist.type != "library-playlist-folders") {
this.addToPlaylist(playlist.id)
}
},
addToPlaylist(id) {
app.addSelectedToPlaylist(id)
},

View file

@ -7,7 +7,7 @@
@dragover="dragOver"
@drop="onDrop"
:href="item.href"
@click='item.type != "library-playlist-folders" ? openPlaylist(item) : getPlaylistChildren(item)'>
@click='clickEvent()'>
<template v-if="!renaming">
<div class="sidebar-icon" v-html="icon"></div> {{ item.attributes.name }}
</template>
@ -15,7 +15,7 @@
</button>
<div class="folder-body" v-if="item.type === 'library-playlist-folders' && folderOpened">
<template v-if="children.length != 0">
<sidebar-playlist v-for="item in children" :item="item" :key="item.id"></sidebar-playlist>
<sidebar-playlist v-for="item in children" :playlist-select="playlistSelect" :item="item" :key="item.id"></sidebar-playlist>
</template>
<template v-else>
<div class="spinner"></div>
@ -31,6 +31,10 @@
item: {
type: Object,
required: true
},
playlistSelect: {
type: Function,
required: false
}
},
data: function () {
@ -50,6 +54,17 @@
}
},
methods: {
clickEvent() {
if(this.item.type != "library-playlist-folders") {
if(this.playlistSelect) {
this.playlistSelect(this.item)
}else{
this.openPlaylist(this.item)
}
}else{
this.getPlaylistChildren(this.item)
}
},
rename() {
this.renaming = false