Added spotify and YouTube logo for import-buttons, and fixed so the spinning thingy moves when exporting playlist

This commit is contained in:
Kasper Rynning-Tønnesen
2016-12-09 14:40:58 +01:00
parent 3e68196cf1
commit 5fc125b117
7 changed files with 71 additions and 61 deletions

View File

@@ -142,7 +142,7 @@
<li class="white-bg"> <li class="white-bg">
<div class="input-field field-settings youtube_unclicked import-buttons"> <div class="input-field field-settings youtube_unclicked import-buttons">
<a class="modal-trigger waves-effect red btn import-youtube" title="Import from YouTube playlist"> <a class="modal-trigger waves-effect red btn import-youtube" title="Import from YouTube playlist">
YouTube <img src="/static/images/youtube.png" class="youtube_logo" alt="Youtube Logo" />
</a> </a>
</div> </div>
<div class="input-field field-settings youtube_clicked"> <div class="input-field field-settings youtube_clicked">
@@ -206,7 +206,7 @@
<li class="white-bg"> <li class="white-bg">
<div class="input-field field-settings spotify_unauthenticated import-buttons"> <div class="input-field field-settings spotify_unauthenticated import-buttons">
<a class="modal-trigger waves-effect green lighten btn import-spotify-auth" title="Import Spotify playlist"> <a class="modal-trigger waves-effect green lighten btn import-spotify-auth" title="Import Spotify playlist">
Spotify <img src="/static/images/spotify.png" class="left spotify_logo" alt="Spotify Logo" />Spotify
</a> </a>
</div> </div>
<div class="input-field field-settings spotify_authenticated"> <div class="input-field field-settings spotify_authenticated">
@@ -295,8 +295,20 @@
<li class="white-bg"> <li class="white-bg">
<div class="input-field field-settings youtube_export_button export-buttons"> <div class="input-field field-settings youtube_export_button export-buttons">
<a class="modal-trigger waves-effect red btn export-youtube" id="listExport" title="Export to YouTube"> <a class="modal-trigger waves-effect red btn export-youtube" id="listExport" title="Export to YouTube">
YouTube <img src="/static/images/youtube.png" class="youtube_logo" alt="Youtube Logo" />
</a> </a>
</div>
<div class="input-field field-settings">
</div>
</li>
<!--<li class="white-bg">
<div class="input-field field-settings spotify_unauthenticated export-buttons">
<a class="modal-trigger waves-effect green lighten btn export-spotify-auth" id="listExportSpotify" title="Export to Spotify">
Spotify
</a>
</div>
</li>-->
<li class="exported-list-container white-bg hide">
<div class="valign playlist_loader_padding"> <div class="valign playlist_loader_padding">
<div id="playlist_loader_export" class="preloader-wrapper small active hide"> <div id="playlist_loader_export" class="preloader-wrapper small active hide">
<div class="spinner-layer spinner-blue"> <div class="spinner-layer spinner-blue">
@@ -348,18 +360,6 @@
</div> </div>
</div> </div>
</div> </div>
</div>
<div class="input-field field-settings">
</div>
</li>
<!--<li class="white-bg">
<div class="input-field field-settings spotify_unauthenticated export-buttons">
<a class="modal-trigger waves-effect green lighten btn export-spotify-auth" id="listExportSpotify" title="Export to Spotify">
Spotify
</a>
</div>
</li>-->
<li class="exported-list-container white-bg hide">
<ul class="input-field field-settings white-bg"> <ul class="input-field field-settings white-bg">
<li class="white-bg exported-list white-bg"> <li class="white-bg exported-list white-bg">

View File

@@ -134,6 +134,15 @@
margin: 0 4rem 0 0 !important; margin: 0 4rem 0 0 !important;
} }
.import-spotify-auth{
padding-left:5px;
}
.spotify_logo, .youtube_logo{
height: 90%;
margin-top: 2px;
}
.import-buttons, .export-buttons{ .import-buttons, .export-buttons{
padding:10px; padding:10px;
} }

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

BIN
static/images/spotify.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 4.5 KiB

BIN
static/images/youtube.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 6.0 KiB

View File

@@ -376,6 +376,8 @@ var List = {
exportToYoutube: function(){ exportToYoutube: function(){
var request_url = "https://www.googleapis.com/youtube/v3/playlists?part=snippet"; var request_url = "https://www.googleapis.com/youtube/v3/playlists?part=snippet";
$(".exported-list-container").removeClass("hide");
$("#playlist_loader_export").removeClass("hide");
$.ajax({ $.ajax({
type: "POST", type: "POST",
url: request_url, url: request_url,
@@ -415,11 +417,10 @@ var List = {
if(number_added == full_playlist.length - 1){ if(number_added == full_playlist.length - 1){
Helper.log("All videoes added!"); Helper.log("All videoes added!");
Helper.log("url: https://www.youtube.com/playlist?list=" + playlist_id); Helper.log("url: https://www.youtube.com/playlist?list=" + playlist_id);
$(".exported-list").append("<h5>Exported URL:</h5>"); $(".exported-list").append("<h5>Exported list</h5>");
$(".exported-list").append("<a target='_blank' class='btn light exported-playlist' href='https://www.youtube.com/playlist?list=" + playlist_id + "'>" + chan + "</a>"); $(".exported-list").append("<a target='_blank' class='btn light exported-playlist' href='https://www.youtube.com/playlist?list=" + playlist_id + "'>" + chan + "</a>");
$("#playlist_loader_export").addClass("hide"); $("#playlist_loader_export").addClass("hide");
//$(".youtube_export_button").removeClass("hide"); //$(".youtube_export_button").removeClass("hide");
$(".exported-list-container").removeClass("hide");
} }
number_added += 1; number_added += 1;
} }