Adding BeatDrop playlist support

Playlists can now be exported as a lighter BeatDrop playlist JSON file as well as the ZIP containing all files.

Author: BSCustomPlaylistCompiler

beatDropThumbnail.jpg

@@ -49,9 +49,11 @@
 	</div>
 
 	<div style="padding-top:60px">
-		<button id="btnSpotifyAuth" onclick="spotifyAuth()" class="w3-button w3-round w3-border w3-green w3-hide-small" style="float: right; margin-right: 5%; margin-top: 1.6em;">Login with Spotify for full playlist</button>
+		<h1 class="w3-hide-small" style="text-align: center; padding-right: 300px">Spotify Playlist</h1>
+		<h1 class="w3-hide-medium w3-hide-large" style="text-align: center;">Spotify Playlist</h1>
+		<button id="btnSpotifyAuth" onclick="spotifyAuth()" class="w3-button w3-round w3-border w3-green w3-hide-small" style="float: right; margin-right: 5%; margin-top: 0.8em;">Login with Spotify for full playlist</button>
 		<div style="text-align: center; margin-top: 1em;" id="divBtnSpotifyAuthM"><button id="btnSpotifyAuthM" onclick="spotifyAuth()" class="w3-button w3-round w3-border w3-green w3-hide-medium w3-hide-large">Login with Spotify for full playlist</button></div>
-		<h1 style="text-align: center;">Spotify Playlist</h1>
+		<h3 id="playlistInfo" style="text-align: center;">Playlist - "" Owner - ""</h3>
 		<div id="content">
 			<div id="spotifyWarningSpace"></div>
 			<div id="alertSpace"></div>
@@ -66,6 +68,7 @@ <h1 style="text-align: center;">Spotify Playlist</h1>
 				</table>
 			</div>
 			<button id="btnDownloadAll" onclick="downloadAll()" class="w3-button w3-round w3-border w3-green" style="float: right; margin-right: 5%;" disabled><i class="fa fa-download"></i> Download All</button>
+			<button id="btnDownloadBeatDrop" onclick="downloadBeatDrop()" class="w3-button w3-round w3-border w3-green" style="float: right; margin-right: 3px;" disabled><i class="fa fa-download"></i> Download BeatDrop</button>
 		</div>
 	</div>
 	<p style="text-align: center; padding-bottom: 20px;">&nbsp;</p>

spotify.html

@@ -50,6 +50,7 @@
 
 	<div style="padding-top:60px">
 		<h1 style="text-align: center;">Youtube Playlist</h1>
+		<h3 id="playlistInfo" style="text-align: center;">Playlist - "" Owner - ""</h3>
 		<div id="content">
 			<div id="alertSpace"></div>
 			<div class="w3-responsive">
@@ -62,7 +63,8 @@ <h1 style="text-align: center;">Youtube Playlist</h1>
 					</tr>
 				</table>
 			</div>
-			<button id="btnDownloadAll" onclick="downloadAll()" class="w3-button w3-round w3-border w3-red" style="float: right; margin-right: 5%;"><i class="fa fa-download"></i> Download All</button>
+			<button id="btnDownloadAll" onclick="downloadAll()" class="w3-button w3-round w3-border w3-red" style="float: right; margin-right: 5%;" disabled><i class="fa fa-download"></i> Download All</button>
+			<button id="btnDownloadBeatDrop" onclick="downloadBeatDrop()" class="w3-button w3-round w3-border w3-red" style="float: right; margin-right: 3px;" disabled><i class="fa fa-download"></i> Download BeatDrop</button>
 		</div>
 	</div>
 	<p style="text-align: center; padding-bottom: 20px;">&nbsp;</p>