From 2b8801d49af71c734aa0a1ab99a6dd92e27e4723 Mon Sep 17 00:00:00 2001
From: RemixDev <RemixDev64@gmail.com>
Date: Sun, 10 May 2020 13:19:12 +0200
Subject: [PATCH] Added check for missing preview tracks

---
 public/css/modules/globals.css |  4 ++++
 public/index.html              | 19 ++++++++++++-------
 2 files changed, 16 insertions(+), 7 deletions(-)

diff --git a/public/css/modules/globals.css b/public/css/modules/globals.css
index a7c3dc4..448b594 100644
--- a/public/css/modules/globals.css
+++ b/public/css/modules/globals.css
@@ -79,6 +79,10 @@ img.circle {
 	opacity: 1;
 }
 
+i.disabled {
+	opacity: 0.5;
+}
+
 span.tag {
 	background-color: var(--tag-background);
 	border-radius: 2px;
diff --git a/public/index.html b/public/index.html
index 5336ed7..2bd43eb 100644
--- a/public/index.html
+++ b/public/index.html
@@ -1000,9 +1000,12 @@ <h2 class="inline-flex"><span v-if="metadata">{{ metadata }}</span><span class="
 									<template v-if="type!='Spotify Playlist'">
 										<template v-for="track in body">
 											<tr v-if="track.type == 'track'">
-												<td><i @click=playPausePreview
-														:class="'material-icons' + (track.preview ? ' preview_playlist_controls' : '')"
-														:data-preview="track.preview">play_arrow</i></td>
+												<td>
+													<i v-if="track.preview" @click=playPausePreview
+													:class="'material-icons' + (track.preview ? ' preview_playlist_controls' : '')"
+													:data-preview="track.preview">play_arrow</i>
+													<i v-else class="material-icons disabled">play_arrow</i>
+												</td>
 												<td>{{ track.track_position }}</td>
 												<td class="inline-flex"><i v-if="track.explicit_lyrics"
 														class="material-icons">explicit</i>{{ track.title + (track.title_version && track.title.indexOf(track.title_version) == -1 ? ' '+ track.title_version : '') }}
@@ -1022,9 +1025,11 @@ <h2 class="inline-flex"><span v-if="metadata">{{ metadata }}</span><span class="
 									</template>
 									<template v-else>
 										<tr v-for="(track, i) in body">
-											<td><i @click=playPausePreview
-													:class="'material-icons' + (track.preview_url ? ' preview_playlist_controls' : '')"
-													:data-preview="track.preview_url">play_arrow</i></td>
+											<td>
+												<i v-if="track.preview_url" @click=playPausePreview
+												:class="'material-icons' + (track.preview_url ? ' preview_playlist_controls' : '')"
+												:data-preview="track.preview_url">play_arrow</i></td>
+												<i v-else class="material-icons disabled">play_arrow</i>
 											<td>{{ i+1 }}</td>
 											<td class="inline-flex"><i v-if="track.explicit"
 													class="material-icons">explicit</i>{{ track.name }}
@@ -1083,4 +1088,4 @@ <h2 class="inline-flex"><span v-if="metadata">{{ metadata }}</span><span class="
 
 	<script src="/public/js/bundle.js"></script>
 
-</html>
\ No newline at end of file
+</html>