|
@@ -195,6 +195,12 @@
|
|
|
</div>
|
|
|
</template>
|
|
|
</draggable>
|
|
|
+ <p
|
|
|
+ v-else-if="gettingSongs"
|
|
|
+ class="nothing-here-text"
|
|
|
+ >
|
|
|
+ Loading songs...
|
|
|
+ </p>
|
|
|
<p v-else class="nothing-here-text">
|
|
|
This playlist doesn't have any songs.
|
|
|
</p>
|
|
@@ -283,7 +289,8 @@ export default {
|
|
|
return {
|
|
|
utils,
|
|
|
drag: false,
|
|
|
- apiDomain: ""
|
|
|
+ apiDomain: "",
|
|
|
+ gettingSongs: false
|
|
|
};
|
|
|
},
|
|
|
computed: {
|
|
@@ -325,12 +332,14 @@ export default {
|
|
|
})
|
|
|
},
|
|
|
mounted() {
|
|
|
+ this.gettingSongs = true;
|
|
|
this.socket.dispatch("playlists.getPlaylist", this.editing, res => {
|
|
|
if (res.status === "success") {
|
|
|
// this.playlist = res.data.playlist;
|
|
|
// this.playlist.songs.sort((a, b) => a.position - b.position);
|
|
|
this.setPlaylist(res.data.playlist);
|
|
|
} else new Toast(res.message);
|
|
|
+ this.gettingSongs = false;
|
|
|
});
|
|
|
|
|
|
this.socket.on(
|
|
@@ -390,6 +399,9 @@ export default {
|
|
|
{ modal: "editPlaylist" }
|
|
|
);
|
|
|
},
|
|
|
+ beforeUnmount() {
|
|
|
+ this.clearPlaylist();
|
|
|
+ },
|
|
|
methods: {
|
|
|
isEditable() {
|
|
|
return (
|
|
@@ -575,6 +587,7 @@ export default {
|
|
|
}),
|
|
|
...mapActions("modals/editPlaylist", [
|
|
|
"setPlaylist",
|
|
|
+ "clearPlaylist",
|
|
|
"addSong",
|
|
|
"removeSong",
|
|
|
"repositionedSong"
|