Improved how importing from spotify works

This commit is contained in:
Kasper Rynning-Tønnesen
2016-08-27 15:34:58 +02:00
parent 13bb52cded
commit a0fd178eca
7 changed files with 107 additions and 30 deletions

View File

@@ -133,7 +133,7 @@
</ul>
</li>
<li class="no-padding remote-panel">
<li class="no-padding">
<ul class="collapsible collapsible-accordion">
<li>
<a class="collapsible-header bold waves-effect import-a">Import Playlist
@@ -201,14 +201,14 @@
</li>
<li class="white-bg">
<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 (BETA)">
<a class="modal-trigger waves-effect green lighten btn import-spotify-auth" title="Import spotify playlist">
Spotify
</a>
</div>
<div class="input-field field-settings spotify_authenticated">
<form action="#" id="listImportSpotify">
<i class="mdi-av-playlist-add import-icon"></i>
<input title="Input Spotify-playlist url here! (BETA)" placeholder="(BETA) Enter Spotify-list url" id="import_spotify" type="text" class="validate" autocomplete="off" />
<input title="Input Spotify-playlist url here!" placeholder="Enter Spotify-list url" id="import_spotify" type="text" class="validate" autocomplete="off" />
<li id="playlist_loader_spotify" class="valign-wrapper hide">
<div class="valign">
<div class="preloader-wrapper small active">
@@ -257,6 +257,20 @@
</form>
</div>
</li>
<li class="not-imported white-bg hide">
<div class="center-align">Not imported</div>
<ul class="input-field field-settings not-imported-container">
<li class="white-bg not-imported-element">
<div class="extra-add-text truncate"></div>
<a href="#" class="waves-effect red lighten btn right extra-button extra-button-delete">X</a>
<a href="#" class="waves-effect green lighten btn right extra-button extra-button-search">
<i class="mdi-action-search search-extra"></i></a>
</li>
</ul>
</div>
</li>
</ul>
</li>
</ul>
</div>
</li>

View File

@@ -14,6 +14,38 @@
display:none;
}
.not-imported{
border-top: 1px solid lightgrey;
margin-top: 15px;
color:black;
}
.not-imported-element{
height:60px;
}
.extra-add-text{
width: 165px;
display: inline-block;
height: 30px;
line-height: 30px;
}
.extra-button{
margin: 0 4px !important;
padding: 0px !important;
display: inline-block;
width: 37px;
height: 40px !important;
line-height: 40px !important;
color: white !important;
}
.search-extra{
height: 40px !important;
line-height: 40px !important;
}
.import-spotify-auth, .import-youtube{
color:white !important;
height:40px !important;
@@ -1149,7 +1181,7 @@ nav ul li:hover, nav ul li.active {
#add-many i{ line-height: 36px !important;}
#results{
background-color: rgba(0,0,0,0.8);
margin-top: -27px;
margin-top: 0px;
max-height: calc(100vh - 64px);
overflow: overlay;
overflow-x: hidden;

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

View File

@@ -9,7 +9,7 @@ var Admin = {
msg=Helper.rnd(["I added your song", "Your song has been added", "Yay, more songs!", "Thats a cool song!", "I added that song for you", "I see you like adding songs..."]);
break;
case "addedplaylist":
msg=Helper.rnd(["I added the playlist", "Your playlist has been added", "Yay, many more songes!", "Thats a cool playlist!", "I added all the songs for you", "I see you like adding songs.."]);
msg=Helper.rnd(["I added the playlist", "Your playlist has been added", "Yay, many more songs!", "Thats a cool playlist!", "I added all the songs for you", "I see you like adding songs.."]);
document.getElementById("import").disabled = false;
$("#playlist_loader").addClass("hide");
$("#import").removeClass("hide");

View File

@@ -30,6 +30,7 @@ var chat_unseen = false;
var blinking = false;
var access_token_data = {};
var spotify_authenticated = false;
var not_import_html = "";
if(localStorage.debug === undefined){
var debug = false;
@@ -132,8 +133,9 @@ function init(){
result_html = $("#temp-results-container");
empty_results_html = $("#empty-results-container").html();
not_import_html = $(".not-imported-container").html();
$(".not-imported-container").empty();
//awdwad
$(".video-container").resizable({
start: function(event, ui) {
$('iframe').css('pointer-events','none');
@@ -331,6 +333,20 @@ $(document).on('click', '#cookieok', function() {
});
});
$(document).on("click", ".extra-button-search", function(e){
e.preventDefault();
$("#search").val($(this).attr("data-text"));
Search.search($(this).attr("data-text"));
});
$(document).on("click", ".extra-button-delete", function(e){
e.preventDefault();
$(this).parent().remove();
if($(".not-imported-container").children().length == 0){
$(".not-imported").toggleClass("hide");
}
})
$(document).on("click", "#closePlayer", function(e){
e.preventDefault();
socket.emit("change_channel");

View File

@@ -21,9 +21,9 @@ var Search = {
empty_results_html = $("#empty-results-container").html();
}
$(".search_results").html('');
if(window.search_input !== ""){
if(search_input !== ""){
searching = true;
var keyword= encodeURIComponent(window.search_input);
var keyword= encodeURIComponent(search_input);
//response= x
var yt_url = "https://www.googleapis.com/youtube/v3/search?key="+api_key+"&videoEmbeddable=true&part=id&fields=items(id)&type=video&order=viewCount&safeSearch=none&maxResults=25";
yt_url+="&q="+keyword;
@@ -129,8 +129,8 @@ var Search = {
yt_url+="&q="+keyword;
var vid_url = "https://www.googleapis.com/youtube/v3/videos?part=contentDetails,snippet,id&key="+api_key+"&id=";
artist = artist.split(" ");
var temptitle = title.toLowerCase().replace(" the ", "").replace(" a ", "").replace("the ", "");
temptitle = temptitle.split(" ");
var temptitle = title.split("-");
temptitle = temptitle.join(" ").split(" ");
$.ajax({
type: "GET",
url: yt_url,
@@ -142,13 +142,15 @@ var Search = {
{
var acceptable_track = true;
//console.log(data.snippet.title.toLowerCase().indexOf("cover"));
$.each(artist, function(i, data_artist){
if(data.snippet.title.toLowerCase().indexOf(data_artist.toLowerCase()) == -1){
//$.each(artist, function(i, data_artist){
if(data.snippet.title.toLowerCase().indexOf(artist[0].toLowerCase()) == -1 &&
(data.snippet.channelTitle.toLowerCase().indexOf(artist[0].toLowerCase()) == -1 &&
data.snippet.channelTitle.toLowerCase().indexOf("vevo") == -1)){
acceptable_track = false;
return false;
}
});
if(data.snippet.title.toLowerCase().indexOf("cover") == -1 && acceptable_track) {
//});
if(data.snippet.title.toLowerCase().indexOf("cover") == -1 && acceptable_track && title.toLowerCase().indexOf("cover") == -1) {
vid_url += data.id.videoId+",";
}
});
@@ -164,21 +166,28 @@ var Search = {
//console.log(data);
//var title = data.snippet.title;
var duration = Search.durationToSeconds(data.contentDetails.duration);
var not_matched = 0;
var not_matched = false;
$.each(temptitle, function(i, data_title){
if(data.snippet.title.toLowerCase().indexOf(data_title.toLowerCase()) == -1)
not_matched += 1;
});
if(((data.snippet.title.toLowerCase() == artist.join(" ").toLowerCase() + " - " + title.toLowerCase()) ||
(data.snippet.title.toLowerCase() == artist.join(" ").toLowerCase() + "-" + title.toLowerCase()) ||
(data.snippet.title.toLowerCase() == title.toLowerCase() + " - " + artist.join(" ").toLowerCase()) ||
(data.snippet.title.toLowerCase() == title.toLowerCase() + "-" + artist.join(" ").toLowerCase())) ||
(duration == length) ||
((data.snippet.title.toLowerCase().indexOf("lyric") > -1) ||
(data.snippet.title.toLowerCase().indexOf("music video") > -1) ||
(data.snippet.title.toLowerCase().indexOf("official video"))) && not_matched != temptitle.length - 1) {
matched = true;
not_matched = true;
return false;
});
if(
(!not_matched //&&
//(duration + 1 > length && duration - 1 < length)
)
){
matched = true;
/*console.log("------------------------------");
console.log("MATCH FOR:");
console.log("YouTube title: " + data.snippet.title);
console.log("YouTube Channel: " + data.snippet.channelTitle);
console.log("YouTube duration: " + duration);
console.log("Spotify title: " + title + " " + artist.join(" "));
console.log("Spotify length: " + length);
console.log("------------------------------");*/
Search.submit(data.id,data.snippet.title, duration, true, current, totalNumber);
return false;
}
@@ -191,6 +200,12 @@ var Search = {
console.log("Spotify length: " + length);
console.log("------------------------------");
}
var not_added_song = $("<div>" + not_import_html + "</div>");
not_added_song.find(".extra-add-text").text(title + " - " + artist.join(" "));
not_added_song.find(".extra-add-text").attr("title", title + " - " + artist.join(" "));
not_added_song.find(".extra-button-search").attr("data-text", title + " - " + artist.join(" "));
$(".not-imported-container").append(not_added_song.html());
$(".not-imported").removeClass("hide");
}
}
}