mirror of
https://github.com/KevinMidboe/zoff.git
synced 2025-10-29 18:00:23 +00:00
Added export to youtube and improved importing from YouTube
This commit is contained in:
Kasper Rynning-Tønnesen
@@ -18,12 +18,12 @@ RewriteCond %{REQUEST_URI} !/static
|
||||
RewriteRule ^(.*)$ php/bot.php [L,NC,QSA]
|
||||
|
||||
RewriteCond %{HTTP_HOST} ^zoff.no
|
||||
RewriteCond %{REQUEST_URI} /spotify_callback
|
||||
RewriteRule ^(.*)$ php/spotify.html [L,NC,QSA]
|
||||
RewriteCond %{REQUEST_URI} /o_callback
|
||||
RewriteRule ^(.*)$ php/callback.html [L,NC,QSA]
|
||||
|
||||
RewriteCond %{HTTP_HOST} ^localhost
|
||||
RewriteCond %{REQUEST_URI} /spotify_callback
|
||||
RewriteRule ^(.*)$ php/spotify.html [L,NC,QSA]
|
||||
RewriteCond %{REQUEST_URI} /o_callback
|
||||
RewriteRule ^(.*)$ php/callback.html [L,NC,QSA]
|
||||
|
||||
|
||||
#RewriteRule (?i)^remote/(.*) php/controller.php?id=$1 [L]
|
||||
|
||||
10
gulpfile.js
10
gulpfile.js
@@ -4,7 +4,7 @@ var gulp = require('gulp'),
|
||||
concat = require('gulp-concat');
|
||||
|
||||
gulp.task('js', function () {
|
||||
gulp.src(['static/js/*.js', '!static/js/embed*', '!static/js/remotecontroller.js', '!static/js/spotify.js'])
|
||||
gulp.src(['static/js/*.js', '!static/js/embed*', '!static/js/remotecontroller.js', '!static/js/callback.js'])
|
||||
.pipe(uglify({
|
||||
mangle: true,
|
||||
compress: true,
|
||||
@@ -25,14 +25,14 @@ gulp.task('embed', function () {
|
||||
.pipe(gulp.dest('static/dist'));
|
||||
});
|
||||
|
||||
gulp.task('spotify', function () {
|
||||
gulp.src(['static/js/spotify.js'])
|
||||
gulp.task('callback', function () {
|
||||
gulp.src(['static/js/callback.js'])
|
||||
.pipe(uglify({
|
||||
mangle: true,
|
||||
compress: true,
|
||||
enclose: true
|
||||
}))
|
||||
.pipe(concat('spotify.min.js'))
|
||||
.pipe(concat('callback.min.js'))
|
||||
.pipe(gulp.dest('static/dist'));
|
||||
});
|
||||
|
||||
@@ -62,7 +62,7 @@ gulp.task('remotecontroller', function () {
|
||||
gulp.task('default', function(){
|
||||
gulp.watch('static/js/*.js', ['js']);
|
||||
gulp.watch('static/js/*.js', ['embed']);
|
||||
gulp.watch(['static/js/spotify.js', 'static/js/helpers.js'], ['spotify']);
|
||||
gulp.watch(['static/js/callback.js', 'static/js/helpers.js'], ['callback']);
|
||||
//gulp.watch('static/js/*.js', ['nochan']);
|
||||
gulp.watch('static/js/remotecontroller.js', ['remotecontroller']);
|
||||
});
|
||||
|
||||
@@ -100,7 +100,7 @@
|
||||
</li>
|
||||
<li>
|
||||
<a class="nav-btn" href="#settings" data-activates="settings-bar" id="settings">
|
||||
<i class="mdi-action-settings"></i>
|
||||
<i class="mdi-image-dehaze"></i>
|
||||
<span class="hover-text">Conf</span>
|
||||
</a>
|
||||
</li>
|
||||
|
||||
280
php/panel.php
280
php/panel.php
@@ -91,8 +91,6 @@
|
||||
<input name="removeplay" type="checkbox" class="conf" /><span class="lever"></span>
|
||||
Remove
|
||||
</label></div></li>
|
||||
|
||||
|
||||
</ul>
|
||||
</form>
|
||||
</div>
|
||||
@@ -100,7 +98,7 @@
|
||||
</ul>
|
||||
</li>
|
||||
|
||||
<li class="no-padding remote-panel">
|
||||
<li class="no-padding remote-panel hide-on-small-only">
|
||||
<ul class="collapsible collapsible-accordion">
|
||||
<li>
|
||||
<a class="collapsible-header bold waves-effect">Remote Control
|
||||
@@ -124,7 +122,6 @@
|
||||
</a>
|
||||
<a>
|
||||
You can control this Zöff instance from another device by going to <b>https://remote.zoff.no/</b>
|
||||
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
@@ -133,75 +130,84 @@
|
||||
</ul>
|
||||
</li>
|
||||
|
||||
<li class="no-padding">
|
||||
|
||||
<li class="no-padding hide-on-small-only">
|
||||
<ul class="collapsible collapsible-accordion">
|
||||
<li>
|
||||
<a class="collapsible-header bold waves-effect import-a">Import Playlist
|
||||
<i class="mdi-communication-import-export"></i>
|
||||
<i class="mdi-hardware-keyboard-arrow-down"></i>
|
||||
</a>
|
||||
<div class="collapsible-body">
|
||||
<ul>
|
||||
<li class="white-bg">
|
||||
<div class="input-field field-settings youtube_unclicked import-buttons">
|
||||
<a class="modal-trigger waves-effect red btn import-youtube" title="Need help with the site?">
|
||||
<a class="modal-trigger waves-effect red btn import-youtube" title="Import from YouTube playlist">
|
||||
YouTube
|
||||
</a>
|
||||
</div>
|
||||
<div class="input-field field-settings youtube_clicked">
|
||||
<form action="#" id="listImport">
|
||||
<i class="mdi-av-playlist-add import-icon"></i>
|
||||
<input title="Input YouTube-playlist id here!" placeholder="Enter YouTube-list ID" id="import" type="text" class="validate" autocomplete="off" />
|
||||
<input title="Input YouTube-playlist url here!" placeholder="Enter YouTube-list URL" id="import" type="text" class="validate" autocomplete="off" />
|
||||
<li id="playlist_loader" class="valign-wrapper hide">
|
||||
<div class="valign">
|
||||
<div class="preloader-wrapper small active">
|
||||
<div class="spinner-layer spinner-blue">
|
||||
<div class="circle-clipper left">
|
||||
<div class="circle"></div>
|
||||
</div><div class="gap-patch">
|
||||
<div class="circle"></div>
|
||||
</div><div class="circle-clipper right">
|
||||
<div class="circle"></div>
|
||||
<div class="valign">
|
||||
<div class="preloader-wrapper small active">
|
||||
<div class="spinner-layer spinner-blue">
|
||||
<div class="circle-clipper left">
|
||||
<div class="circle"></div>
|
||||
</div>
|
||||
<div class="gap-patch">
|
||||
<div class="circle"></div>
|
||||
</div>
|
||||
<div class="circle-clipper right">
|
||||
<div class="circle"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="spinner-layer spinner-red">
|
||||
<div class="circle-clipper left">
|
||||
<div class="circle"></div>
|
||||
</div><div class="gap-patch">
|
||||
<div class="circle"></div>
|
||||
</div><div class="circle-clipper right">
|
||||
<div class="circle"></div>
|
||||
<div class="spinner-layer spinner-red">
|
||||
<div class="circle-clipper left">
|
||||
<div class="circle"></div>
|
||||
</div>
|
||||
<div class="gap-patch">
|
||||
<div class="circle"></div>
|
||||
</div>
|
||||
<div class="circle-clipper right">
|
||||
<div class="circle"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="spinner-layer spinner-yellow">
|
||||
<div class="circle-clipper left">
|
||||
<div class="circle"></div>
|
||||
</div><div class="gap-patch">
|
||||
<div class="circle"></div>
|
||||
</div><div class="circle-clipper right">
|
||||
<div class="circle"></div>
|
||||
<div class="spinner-layer spinner-yellow">
|
||||
<div class="circle-clipper left">
|
||||
<div class="circle"></div>
|
||||
</div>
|
||||
<div class="gap-patch">
|
||||
<div class="circle"></div>
|
||||
</div>
|
||||
<div class="circle-clipper right">
|
||||
<div class="circle"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="spinner-layer spinner-green">
|
||||
<div class="circle-clipper left">
|
||||
<div class="circle"></div>
|
||||
</div><div class="gap-patch">
|
||||
<div class="circle"></div>
|
||||
</div><div class="circle-clipper right">
|
||||
<div class="circle"></div>
|
||||
<div class="spinner-layer spinner-green">
|
||||
<div class="circle-clipper left">
|
||||
<div class="circle"></div>
|
||||
</div>
|
||||
<div class="gap-patch">
|
||||
<div class="circle"></div>
|
||||
</div>
|
||||
<div class="circle-clipper right">
|
||||
<div class="circle"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</li>
|
||||
</div>
|
||||
</li>
|
||||
</form>
|
||||
</div>
|
||||
</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">
|
||||
<a class="modal-trigger waves-effect green lighten btn import-spotify-auth" title="Import Spotify playlist">
|
||||
Spotify
|
||||
</a>
|
||||
</div>
|
||||
@@ -210,65 +216,161 @@
|
||||
<i class="mdi-av-playlist-add import-icon"></i>
|
||||
<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">
|
||||
<div class="spinner-layer spinner-blue">
|
||||
<div class="circle-clipper left">
|
||||
<div class="circle"></div>
|
||||
</div><div class="gap-patch">
|
||||
<div class="circle"></div>
|
||||
</div><div class="circle-clipper right">
|
||||
<div class="circle"></div>
|
||||
<div class="valign">
|
||||
<div class="preloader-wrapper small active">
|
||||
<div class="spinner-layer spinner-blue">
|
||||
<div class="circle-clipper left">
|
||||
<div class="circle"></div>
|
||||
</div>
|
||||
<div class="gap-patch">
|
||||
<div class="circle"></div>
|
||||
</div>
|
||||
<div class="circle-clipper right">
|
||||
<div class="circle"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="spinner-layer spinner-red">
|
||||
<div class="circle-clipper left">
|
||||
<div class="circle"></div>
|
||||
</div><div class="gap-patch">
|
||||
<div class="circle"></div>
|
||||
</div><div class="circle-clipper right">
|
||||
<div class="circle"></div>
|
||||
<div class="spinner-layer spinner-red">
|
||||
<div class="circle-clipper left">
|
||||
<div class="circle"></div>
|
||||
</div>
|
||||
<div class="gap-patch">
|
||||
<div class="circle"></div>
|
||||
</div>
|
||||
<div class="circle-clipper right">
|
||||
<div class="circle"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="spinner-layer spinner-yellow">
|
||||
<div class="circle-clipper left">
|
||||
<div class="circle"></div>
|
||||
</div><div class="gap-patch">
|
||||
<div class="circle"></div>
|
||||
</div><div class="circle-clipper right">
|
||||
<div class="circle"></div>
|
||||
<div class="spinner-layer spinner-yellow">
|
||||
<div class="circle-clipper left">
|
||||
<div class="circle"></div>
|
||||
</div>
|
||||
<div class="gap-patch">
|
||||
<div class="circle"></div>
|
||||
</div>
|
||||
<div class="circle-clipper right">
|
||||
<div class="circle"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="spinner-layer spinner-green">
|
||||
<div class="circle-clipper left">
|
||||
<div class="circle"></div>
|
||||
</div><div class="gap-patch">
|
||||
<div class="circle"></div>
|
||||
</div><div class="circle-clipper right">
|
||||
<div class="circle"></div>
|
||||
<div class="spinner-layer spinner-green">
|
||||
<div class="circle-clipper left">
|
||||
<div class="circle"></div>
|
||||
</div>
|
||||
<div class="gap-patch">
|
||||
<div class="circle"></div>
|
||||
</div>
|
||||
<div class="circle-clipper right">
|
||||
<div class="circle"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</li>
|
||||
</div>
|
||||
</li>
|
||||
</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>
|
||||
<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>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
|
||||
|
||||
<li class="no-padding hide-on-small-only">
|
||||
<ul class="collapsible collapsible-accordion white-bg">
|
||||
<li>
|
||||
<a class="collapsible-header bold waves-effect export-a">Export Playlist
|
||||
<i class="mdi-hardware-keyboard-arrow-up"></i>
|
||||
</a>
|
||||
<div class="collapsible-body">
|
||||
<ul>
|
||||
<li class="white-bg">
|
||||
<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">
|
||||
YouTube
|
||||
</a>
|
||||
<li id="playlist_loader_export" class="valign-wrapper hide">
|
||||
<div class="valign">
|
||||
<div class="preloader-wrapper small active">
|
||||
<div class="spinner-layer spinner-blue">
|
||||
<div class="circle-clipper left">
|
||||
<div class="circle"></div>
|
||||
</div>
|
||||
<div class="gap-patch">
|
||||
<div class="circle"></div>
|
||||
</div>
|
||||
<div class="circle-clipper right">
|
||||
<div class="circle"></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="spinner-layer spinner-red">
|
||||
<div class="circle-clipper left">
|
||||
<div class="circle"></div>
|
||||
</div>
|
||||
<div class="gap-patch">
|
||||
<div class="circle"></div>
|
||||
</div>
|
||||
<div class="circle-clipper right">
|
||||
<div class="circle"></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="spinner-layer spinner-yellow">
|
||||
<div class="circle-clipper left">
|
||||
<div class="circle"></div>
|
||||
</div>
|
||||
<div class="gap-patch">
|
||||
<div class="circle"></div>
|
||||
</div>
|
||||
<div class="circle-clipper right">
|
||||
<div class="circle"></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="spinner-layer spinner-green">
|
||||
<div class="circle-clipper left">
|
||||
<div class="circle"></div>
|
||||
</div>
|
||||
<div class="gap-patch">
|
||||
<div class="circle"></div>
|
||||
</div>
|
||||
<div class="circle-clipper right">
|
||||
<div class="circle"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</li>
|
||||
</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">
|
||||
<li class="white-bg exported-list white-bg">
|
||||
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
@@ -1,10 +0,0 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<title>Zöff Spotify Importer</title>
|
||||
<script type="text/javascript" src="/static/dist/spotify.min.js"></script>
|
||||
<meta charset="UTF-8"/>
|
||||
</head>
|
||||
<body>
|
||||
</body>
|
||||
</html>
|
||||
@@ -69,14 +69,14 @@
|
||||
line-height: 40px !important;
|
||||
}
|
||||
|
||||
.import-spotify-auth, .import-youtube{
|
||||
.import-spotify-auth, .import-youtube, .export-spotify-auth, .export-youtube, .exported-playlist{
|
||||
color:white !important;
|
||||
height:40px !important;
|
||||
line-height: 40px !important;
|
||||
margin: 0 4rem 0 0 !important;
|
||||
}
|
||||
|
||||
.import-buttons{
|
||||
.import-buttons, .export-buttons{
|
||||
padding:10px;
|
||||
}
|
||||
|
||||
@@ -424,11 +424,11 @@ display: inline;
|
||||
}
|
||||
|
||||
.white-bg{
|
||||
background-color:white;
|
||||
background-color:white !important;
|
||||
}
|
||||
|
||||
.white-bg:hover{
|
||||
background-color:white;
|
||||
background-color:white !important;
|
||||
}
|
||||
|
||||
.card .card-content {
|
||||
@@ -960,8 +960,9 @@ ul #chat-log{
|
||||
margin-top:15px;
|
||||
}
|
||||
|
||||
#playlist_loader, #playlist_loader_spotify {
|
||||
#playlist_loader, #playlist_loader_spotify, #playlist_loader_export {
|
||||
padding: 10px 0px 0px 70px;
|
||||
background-color: white !important;
|
||||
}
|
||||
|
||||
#search_loader:hover {
|
||||
@@ -1542,6 +1543,7 @@ nav ul li:hover, nav ul li.active {
|
||||
|
||||
.tabs_height{
|
||||
height:auto !important;
|
||||
overflow:initial;
|
||||
}
|
||||
|
||||
.brand-mobile{
|
||||
|
||||
2
static/dist/embed.min.js
vendored
2
static/dist/embed.min.js
vendored
File diff suppressed because one or more lines are too long
6
static/dist/main.min.js
vendored
6
static/dist/main.min.js
vendored
File diff suppressed because one or more lines are too long
2
static/dist/spotify.min.js
vendored
2
static/dist/spotify.min.js
vendored
@@ -1 +1 @@
|
||||
!function(){function o(o){var i,t=o.substring(1).split("&"),a={};for(var n in t)i=t[n].split("="),2==i.length&&(a[i[0]]=i[1]);return a}window.addEventListener("load",function(){var i="b934ecdd173648f5bcd38738af529d58",t=window.location.protocol+"//"+window.location.hostname+"/spotify_callback",a="token",n="playlist-read-private playlist-read-collaborative user-read-private";if(window.location.hash.length<=0)window.location.href="https://accounts.spotify.com/authorize?client_id="+i+"&scope="+n+"&show_dialog=false&response_type="+a+"&redirect_uri="+t;else{var e=o(window.location.hash);window.opener.callback(e)}})}();
|
||||
!function(){function e(e){var t,o=e.substring(1).split("&"),n={};for(var a in o)t=o[a].split("="),2==t.length&&(n[t[0]]=t[1]);return n}window.addEventListener("load",function(){var t,o,n,a=e(window.location.hash);window.location.protocol+"//"+window.location.hostname+"/callback";if(a.spotify)t="b934ecdd173648f5bcd38738af529d58",o="token",n="playlist-read-private playlist-read-collaborative user-read-private",console.log("spotify");else if(a.youtube)t="",o="",n="",console.log("youtube");else{var i=e(window.location.hash);window.opener.callback(i)}})}();
|
||||
@@ -179,6 +179,64 @@ var List = {
|
||||
return true;
|
||||
},
|
||||
|
||||
exportToYoutube: function(){
|
||||
var request_url = "https://www.googleapis.com/youtube/v3/playlists?part=snippet";
|
||||
$.ajax({
|
||||
type: "POST",
|
||||
url: request_url,
|
||||
headers: {
|
||||
'Authorization': 'Bearer ' + access_token_data_youtube.access_token,
|
||||
'Content-Type': 'application/json'
|
||||
},
|
||||
data: JSON.stringify({
|
||||
snippet: {
|
||||
title: chan.toLowerCase(),
|
||||
description: 'Playlist exported from zoff',
|
||||
}
|
||||
}),
|
||||
success: function(response){
|
||||
var number_added = 0;
|
||||
var playlist_id = response.id;
|
||||
$.each(full_playlist, function(i, data){
|
||||
var request_url = "https://www.googleapis.com/youtube/v3/playlistItems?part=snippet";
|
||||
$.ajax({
|
||||
type: "POST",
|
||||
url: request_url,
|
||||
headers: {
|
||||
'Authorization': 'Bearer ' + access_token_data_youtube.access_token,
|
||||
'Content-Type': 'application/json'
|
||||
},
|
||||
data: JSON.stringify({
|
||||
'snippet': {
|
||||
'playlistId': playlist_id,
|
||||
'resourceId': {
|
||||
'kind': 'youtube#video',
|
||||
'videoId': data.id
|
||||
}
|
||||
}
|
||||
}),
|
||||
success: function(response){
|
||||
Helper.log("Added video: " + data.id + " to playlist id " + playlist_id);
|
||||
if(number_added == full_playlist.length - 1){
|
||||
Helper.log("All videoes added!");
|
||||
Helper.log("url: https://www.youtube.com/playlist?list=" + playlist_id);
|
||||
$(".exported-list").append("<h5>Exported URL:</h5>");
|
||||
$(".exported-list").append("<a target='_blank' class='btn orange exported-playlist' href='https://www.youtube.com/playlist?list=" + playlist_id + "'>" + chan + "</a>");
|
||||
$("#playlist_loader_export").addClass("hide");
|
||||
//$(".youtube_export_button").removeClass("hide");
|
||||
$(".exported-list-container").removeClass("hide");
|
||||
}
|
||||
number_added += 1;
|
||||
}
|
||||
});
|
||||
});
|
||||
},
|
||||
error: function(response){
|
||||
Helper.log(response);
|
||||
}
|
||||
});
|
||||
},
|
||||
|
||||
importOldList: function(chan){
|
||||
var ids="";
|
||||
var num=0;
|
||||
|
||||
@@ -35,6 +35,8 @@ var embed_height = 300;
|
||||
var embed_width = 600;
|
||||
var embed_autoplay = "&autoplay";
|
||||
var connect_error = false;
|
||||
var access_token_data_youtube = {};
|
||||
var youtube_authenticated = false;
|
||||
|
||||
if(localStorage.debug === undefined){
|
||||
var debug = false;
|
||||
@@ -173,7 +175,6 @@ function init(){
|
||||
}
|
||||
|
||||
if($("#alreadychannel").length === 0 || Helper.mobilecheck()){
|
||||
Helper.log("ISAJODIJOQIJW");
|
||||
setup_youtube_listener();
|
||||
get_list_listener();
|
||||
setup_suggested_listener();
|
||||
@@ -314,6 +315,15 @@ function embed_code(autoplay, width, height){
|
||||
return '<embed src="https://zoff.no/embed.html#' + chan.toLowerCase() + autoplay + '" width="' + width + 'px" height="' + height + 'px">';
|
||||
}
|
||||
|
||||
function randomString(length){
|
||||
var text = "";
|
||||
var possible = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789.-_";
|
||||
for(var i = 0; i < length; i++) {
|
||||
text += possible.charAt(Math.floor(Math.random() * possible.length));
|
||||
}
|
||||
return text;
|
||||
}
|
||||
|
||||
function spotify_is_authenticated(bool){
|
||||
if(bool){
|
||||
Helper.log("------------------------");
|
||||
@@ -460,10 +470,45 @@ $("#clickme").click(function(){
|
||||
Player.player.playVideo();
|
||||
});
|
||||
|
||||
$(document).on("click", "#listExport", function(e){
|
||||
e.preventDefault();
|
||||
Helper.log(full_playlist);
|
||||
$("#playlist_loader_export").removeClass("hide");
|
||||
$(".youtube_export_button").addClass("hide");
|
||||
if(!youtube_authenticated){
|
||||
var nonce = randomString(29);
|
||||
window.callback = function(data) {
|
||||
access_token_data_youtube = data;
|
||||
if(access_token_data_youtube.state == nonce){
|
||||
youtube_authenticated = true;
|
||||
setTimeout(function(){
|
||||
youtube_authenticated = false;
|
||||
access_token_data_youtube = {};
|
||||
}, access_token_data_youtube.expires_in * 1000);
|
||||
List.exportToYoutube();
|
||||
} else {
|
||||
access_token_data_youtube = "";
|
||||
console.error("Nonce doesn't match");
|
||||
}
|
||||
youtube_window.close();
|
||||
window.callback = "";
|
||||
};
|
||||
youtube_window = window.open("/o_callback#youtube=true&nonce=" + nonce, "", "width=600, height=600");
|
||||
} else {
|
||||
List.exportToYoutube();
|
||||
}
|
||||
});
|
||||
|
||||
$(document).on("click", "#listExportSpotify", function(e){
|
||||
e.preventDefault();
|
||||
Helper.log(full_playlist);
|
||||
});
|
||||
|
||||
$(document).on("submit", "#listImport", function(e){
|
||||
e.preventDefault();
|
||||
if($("#import").val() !== ""){
|
||||
Search.importPlaylist(document.getElementById("import").value);
|
||||
var url = $("#import").val().split("https://www.youtube.com/playlist?list=");
|
||||
if($("#import").val() !== "" && url.length == 2){
|
||||
Search.importPlaylist(url[1]);
|
||||
document.getElementById("import").value = "";
|
||||
document.getElementById("import").disabled = true;
|
||||
$("#import").addClass("hide");
|
||||
@@ -616,20 +661,27 @@ $(document).on("click", ".suggested-link", function(e){
|
||||
|
||||
$(document).on("click", ".import-spotify-auth", function(e){
|
||||
e.preventDefault();
|
||||
var nonce = randomString(29);
|
||||
window.callback = function(data) {
|
||||
access_token_data = data;
|
||||
spotify_authenticated = true;
|
||||
spotify_is_authenticated(true);
|
||||
setTimeout(function(){
|
||||
spotify_authenticated = false;
|
||||
spotify_is_authenticated(false);
|
||||
$(".spotify_authenticated").css("display", "none");
|
||||
$(".spotify_unauthenticated").css("display", "block");
|
||||
}, access_token_data.expires_in * 1000);
|
||||
if(access_token_data.state == nonce){
|
||||
spotify_authenticated = true;
|
||||
spotify_is_authenticated(true);
|
||||
setTimeout(function(){
|
||||
spotify_authenticated = false;
|
||||
access_token_data = {};
|
||||
spotify_is_authenticated(false);
|
||||
$(".spotify_authenticated").css("display", "none");
|
||||
$(".spotify_unauthenticated").css("display", "block");
|
||||
}, access_token_data.expires_in * 1000);
|
||||
} else {
|
||||
access_token_data = {};
|
||||
console.error("States doesn't match");
|
||||
}
|
||||
spotify_window.close();
|
||||
window.callback = "";
|
||||
};
|
||||
spotify_window = window.open("/spotify_callback", "", "width=600, height=600");
|
||||
spotify_window = window.open("/o_callback#spotify=true&nonce=" + nonce, "", "width=600, height=600");
|
||||
});
|
||||
|
||||
$(document).on("click", ".import-youtube", function(e){
|
||||
|
||||
@@ -20,7 +20,7 @@ var Player = {
|
||||
} catch(e){}
|
||||
Helper.log("video_id variable: " + video_id);
|
||||
Helper.log("---------------------------------");
|
||||
if(obj.length === 0){
|
||||
if(!obj.np){
|
||||
|
||||
document.getElementById('song-title').innerHTML = "Empty channel. Add some songs!";
|
||||
$("#player_overlay").height($("#player").height());
|
||||
|
||||
@@ -227,11 +227,6 @@ var Search = {
|
||||
}
|
||||
}
|
||||
});
|
||||
if(current == totalNumber - 1){
|
||||
document.getElementById("import_spotify").disabled = false;
|
||||
$("#import_spotify").removeClass("hide");
|
||||
$("#playlist_loader_spotify").addClass("hide");
|
||||
}
|
||||
},
|
||||
|
||||
readySubmit: function(found, obj){
|
||||
@@ -247,6 +242,9 @@ var Search = {
|
||||
$.each(Search.submitArray, function(i, data){
|
||||
Search.submit(data.id, data.title, data.duration, true, i, Search.submitArray.length - 1);
|
||||
});
|
||||
document.getElementById("import_spotify").disabled = false;
|
||||
$("#import_spotify").removeClass("hide");
|
||||
$("#playlist_loader_spotify").addClass("hide");
|
||||
Search.submitArray = [];
|
||||
Search.submitArrayExpected = null;
|
||||
}
|
||||
@@ -265,22 +263,60 @@ var Search = {
|
||||
|
||||
importPlaylist: function(pId,pageToken){
|
||||
token = "";
|
||||
var headers;
|
||||
var datatype;
|
||||
if(pageToken !== undefined)
|
||||
token = "&pageToken="+pageToken;
|
||||
playlist_url = "https://www.googleapis.com/youtube/v3/playlistItems?part=contentDetails&maxResults=49&key="+api_key+"&playlistId="+pId+token;
|
||||
if(youtube_authenticated){
|
||||
datatype = "html";
|
||||
headers = {
|
||||
'Content-Type': 'application/json',
|
||||
'Authorization': 'Bearer ' + access_token_data_youtube.access_token
|
||||
};
|
||||
} else {
|
||||
headers = {};//'Content-Type': 'application/json'};
|
||||
datatype = "jsonp";
|
||||
}
|
||||
$.ajax({
|
||||
type: "GET",
|
||||
url: playlist_url,
|
||||
dataType:"jsonp",
|
||||
dataType: datatype,
|
||||
//dataType:"jsonp",
|
||||
headers: headers,
|
||||
success: function(response)
|
||||
{
|
||||
if(response.error){
|
||||
document.getElementById("import").disabled = false;
|
||||
$("#playlist_loader").addClass("hide");
|
||||
$("#import").removeClass("hide");
|
||||
Materialize.toast("It seems you've entered a invalid url.", 4000);
|
||||
} else {
|
||||
if(response.error.errors[0].reason == "playlistItemsNotAccessible"){
|
||||
var nonce = randomString(29);
|
||||
window.callback = function(data) {
|
||||
access_token_data_youtube = data;
|
||||
if(access_token_data_youtube.state == nonce){
|
||||
youtube_authenticated = true;
|
||||
setTimeout(function(){
|
||||
youtube_authenticated = false;
|
||||
access_token_data_youtube = {};
|
||||
}, access_token_data_youtube.expires_in * 1000);
|
||||
Search.importPlaylist(pId, pageToken);
|
||||
} else {
|
||||
access_token_data_youtube = "";
|
||||
console.error("Nonce doesn't match");
|
||||
}
|
||||
youtube_window.close();
|
||||
window.callback = "";
|
||||
};
|
||||
youtube_window = window.open("/o_callback#youtube=true&nonce=" + nonce, "", "width=600, height=600");
|
||||
} else {
|
||||
Helper.log(response.error);
|
||||
document.getElementById("import").disabled = false;
|
||||
$("#playlist_loader").addClass("hide");
|
||||
$("#import").removeClass("hide");
|
||||
Materialize.toast("It seems you've entered a invalid url.", 4000);
|
||||
}
|
||||
|
||||
} else {
|
||||
var ids="";
|
||||
if(typeof(response) == "string") response = $.parseJSON(response);
|
||||
//Search.addVideos(response.items[0].contentDetails.videoId);
|
||||
//response.items.shift();
|
||||
$.each(response.items, function(i,data)
|
||||
|
||||
@@ -1,25 +0,0 @@
|
||||
window.addEventListener("load", function(){
|
||||
var client_id = "b934ecdd173648f5bcd38738af529d58";
|
||||
var redirect = window.location.protocol + "//" + window.location.hostname + "/spotify_callback";
|
||||
var response = "token";
|
||||
var scope = "playlist-read-private playlist-read-collaborative user-read-private";
|
||||
if(window.location.hash.length <= 0){
|
||||
window.location.href = "https://accounts.spotify.com/authorize?client_id=" + client_id + "&scope=" + scope + "&show_dialog=false&response_type=" + response + "&redirect_uri=" + redirect;
|
||||
} else {
|
||||
var query_parameters = getQueryHash(window.location.hash);
|
||||
window.opener.callback(query_parameters);
|
||||
}
|
||||
});
|
||||
|
||||
function getQueryHash(url){
|
||||
var temp_arr = url.substring(1).split("&");
|
||||
var done_obj = {};
|
||||
var splitted;
|
||||
for(var i in temp_arr) {
|
||||
splitted = temp_arr[i].split("=");
|
||||
if(splitted.length == 2) {
|
||||
done_obj[splitted[0]] = splitted[1];
|
||||
}
|
||||
}
|
||||
return done_obj;
|
||||
}
|
||||
Reference in New Issue
Block a user