Added Helper.log and error message on connection failure

.htaccess

@@ -25,18 +25,6 @@ RewriteCond %{HTTP_HOST} ^localhost
 RewriteCond %{REQUEST_URI} /spotify_callback
 RewriteRule ^(.*)$ php/spotify.html [L,NC,QSA]
 
-#RewriteCond %{HTTP_HOST} ^(remote\.)?zoff\.no
-#RewriteCond %{REQUEST_URI} !remote/
-#RewriteRule ^(.*)$ remote/$1 [L]
-
-#RewriteCond %{HTTP_HOST} ^(www\.)?etys\.no
-#RewriteCond %{REQUEST_URI} !etys/
-#RewriteRule ^(.*)$ etys/$1 [L]
-
-#Comment out the two folling lines when running server locally to fix issues with localhost
-#RewriteCond %{HTTPS} !=on
-#RewriteRule ^/?(.*) https://%{SERVER_NAME}/$1 [R,L]
-
 
 #RewriteRule (?i)^remote/(.*) php/controller.php?id=$1 [L]
 #RewriteRule (?i)^remote php/controller.php [L]

php/nochan.php

@@ -74,8 +74,8 @@ if(isset($_GET['chan'])){
         <div id="help" class="modal">
             <div class="modal-content">
                 <h4>So you need help?</h4>
-                <p>At the center of the site, you'll see a input field. This is meant to navigate to new or existing channels. If you input something here that already doesn't exist, a new channel will be create at the blink of an eye! Remember to put a password on the list you've created, so no one else takes it from you! (It's on a first come, first serve basis). When you're ready to proceed, just click the listen button!</p>
+                <p>At the center of the site, you'll see a input field. This is meant to navigate to new or existing channels. If you input something here that doesn't exist, a new channel will be create at the blink of an eye! Remember to put a password on the list you've created, so no one else takes it from you! (It's on a first come, first serve basis). When you're ready to proceed, just click the listen button!</p>
-                <p>Underneath the input fields, there are several tiles. These are channels that already exists, and they can be clicked! To enter one of these channels and listen to it's content, it is just to click the tile.</p>
+                <p>Underneath the input fields, there are several tiles. These are channels that already exists, and they can be clicked! To listen to one of these channels, it is just to click the tile.</p>
             </div>
             <div class="modal-footer">
                 <a href="#" class=" modal-action modal-close waves-effect waves-green btn-flat">Close</a>

static/dist/spotify.min.js

@@ -1 +1 @@
-!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(){console.log("hello");var t="b934ecdd173648f5bcd38738af529d58",o=window.location.protocol+"//"+window.location.hostname+"/spotify_callback",n="token",a="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="+t+"&scope="+a+"&show_dialog=false&response_type="+n+"&redirect_uri="+o;else{var i=e(window.location.hash);window.opener.callback(i)}})}();
+!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="b934ecdd173648f5bcd38738af529d58",o=window.location.protocol+"//"+window.location.hostname+"/spotify_callback",n="token",a="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="+t+"&scope="+a+"&show_dialog=false&response_type="+n+"&redirect_uri="+o;else{var i=e(window.location.hash);window.opener.callback(i)}})}();

static/js/admin.js

@@ -165,7 +165,6 @@ var Admin = {
             $('ul.playlist-tabs-loggedIn').tabs('select_tab', 'wrapper');
             $("#wrapper").removeClass("tabs_height");
         } else {
-            console.log("not-suggested");
             $('ul.playlist-tabs').tabs('select_tab', $(".playlist-tabs-loggedIn li a.active").attr("href").substring(1));
         }
         $("#admin-lock").removeClass("mdi-action-lock-open clickable");

static/js/helpers.js

@@ -1,4 +1,11 @@
 var Helper = {
+
+    log: function(to_log){
+        if(localStorage.debug === "true") {
+            console.log(to_log);
+        }
+    },
+
     rnd: function(arr)
     {
     	return arr[Math.floor(Math.random() * arr.length)];

static/js/hostcontroller.js

@@ -29,7 +29,7 @@ var Hostcontroller = {
     if(enabled){
       if(arr[0] == "volume"){
         $("#volume").slider("value", arr[1]);
-        Player.ytplayer.setVolume(arr[1]);
+        Player.player.setVolume(arr[1]);
         localStorage.setItem("volume", arr[1]);
         Playercontrols.choose_button(arr[1], false);
       }else if(arr[0] == "channel"){
@@ -48,9 +48,9 @@ var Hostcontroller = {
 
         window.history.pushState("object or string", "Title", "/"+chan.toLowerCase());
       }else if(arr[0] == "pause")
-        Player.ytplayer.pauseVideo();
+        Player.player.pauseVideo();
       else if(arr[0] == "play")
-        Player.ytplayer.playVideo();
+        Player.player.playVideo();
       else if(arr[0] == "skip")
         List.skip();
     }

static/js/list.js

@@ -58,12 +58,10 @@ var List = {
         List.sortList();
 		$("#wrapper").empty();
 
-        if(localStorage.debug === "true") {
+        Helper.log("---------------------------");
-            console.log("---------------------------");
+        Helper.log("---------FULL PLAYLIST-----");
-            console.log("---------FULL PLAYLIST-----");
+        Helper.log(full_playlist);
-            console.log(full_playlist);
+        Helper.log("---------------------------");
-            console.log("---------------------------");
-        }
 
         if(full_playlist.length > 1){
     		$.each(full_playlist, function(j, current_song){
@@ -153,12 +151,10 @@ var List = {
         full_playlist[0].guids              = [];
         full_playlist[0].added              = time;
         full_playlist[length].now_playing   = false;
-        if(localStorage.debug === "true") {
+        Helper.log("---------------------------");
-            console.log("---------------------------");
+        Helper.log("---SONG ON FIRST INDEX-----");
-            console.log("---SONG ON FIRST INDEX-----");
+        Helper.log(full_playlist[0]);
-            console.log(full_playlist[0]);
+        Helper.log("---------------------------");
-            console.log("---------------------------");
-        }
         try{
             full_playlist.push(full_playlist.shift());
             if(!List.empty)

static/js/listeners.js

@@ -34,6 +34,7 @@ var not_import_html       = "";
 var embed_height          = 300;
 var embed_width           = 600;
 var embed_autoplay        = "&autoplay";
+var connect_error         = false;
 
 if(localStorage.debug === undefined){
 	var debug = false;
@@ -69,13 +70,13 @@ var fromChannel = false;
 if (navigator.serviceWorker) {
     navigator.serviceWorker.register('/service-worker.js', {scope: '/'})
         .then(function (registration) {
-            console.log(registration);
+            Helper.log(registration);
         })
         .catch(function (e) {
             console.error(e);
         });
 } else {
-    console.log('Service Worker is not supported in this browser.');
+    Helper.log('Service Worker is not supported in this browser.');
 }
 
 $().ready(function(){
@@ -84,8 +85,20 @@ $().ready(function(){
 		initfp();
 	}
 
+    socket.on("connect", function(){
+        if(connect_error){
+            connect_error = false;
+            $(".connect_error").fadeOut(function(){
+                $(".connect_error").remove();
+                Materialize.toast("Connected!", 2000, "green lighten");
+            });
+
+        }
+    });
+
     setup_no_connection_listener();
 
+    try{
         git_info = $.ajax({ type: "GET",
     		     url: "https://api.github.com/repos/zoff-music/zoff/commits",
     		     async: false
@@ -98,6 +111,9 @@ $().ready(function(){
             "<br><a href='"+git_info[0].html_url+"'>" +
             git_info[0].sha.substring(0,10) + "</a>: " +
             git_info[0].commit.message+"<br");
+    } catch(error){
+        Helper.log("Error with fetching GitHub commit info");
+    }
 });
 
 
@@ -157,6 +173,7 @@ function init(){
 	}
 
 	if($("#alreadychannel").length === 0 || Helper.mobilecheck()){
+        Helper.log("ISAJODIJOQIJW");
 		setup_youtube_listener();
 		get_list_listener();
 		setup_suggested_listener();
@@ -168,9 +185,9 @@ function init(){
 		$("#controls").css("opacity", "1");
 		$(".playlist").css("opacity", "1");
 		Player.readyLooks();
-		Playercontrols.initYoutubeControls(Player.ytplayer);
+		Playercontrols.initYoutubeControls(Player.player);
 		Playercontrols.initSlider();
-		Player.ytplayer.setVolume(Crypt.get_volume());
+		Player.player.setVolume(Crypt.get_volume());
         $(".video-container").removeClass("no-opacity");
 
         var codeURL = "https://remote."+window.location.hostname+"/"+id;
@@ -188,7 +205,7 @@ function init(){
 		$("#channel-load").css("display", "none");
  	} else {
  		window.onYouTubeIframeAPIReady = Player.onYouTubeIframeAPIReady;
- 		if(Player.ytplayer === "" || Player.ytplayer === undefined || Helper.mobilecheck()) Player.loadPlayer();
+ 		if(Player.player === "" || Player.player === undefined || Helper.mobilecheck()) Player.loadPlayer();
  	}
 
  	if(Helper.mobilecheck()) Mobile_remote.initiate_volume();
@@ -214,11 +231,19 @@ function init(){
 
 function setup_no_connection_listener(){
     socket.on('connect_failed', function(){
-        console.log('Connection Failed');
+        Helper.log('Connection Failed');
+        if(!connect_error){
+            connect_error = true;
+            Materialize.toast("Error connecting to server, please wait..", 100000000, "red lighten connect_error");
+        }
     });
 
     socket.on("connect_error", function(){
-        console.log("Connection failed.");
+        Helper.log("Connection Failed.");
+        if(!connect_error){
+            connect_error = true;
+            Materialize.toast("Error connecting to server, please wait..", 100000000, "red lighten connect_error");
+        }
     });
 }
 
@@ -291,25 +316,21 @@ function embed_code(autoplay, width, height){
 
 function spotify_is_authenticated(bool){
     if(bool){
-        if(localStorage.debug === "true"){
+        Helper.log("------------------------");
-            console.log("------------------------");
+        Helper.log("Spotify is authenticated");
-            console.log("Spotify is authenticated");
+        Helper.log("access_token: " + access_token_data.access_token);
-            console.log("access_token: " + access_token_data.access_token);
+        Helper.log("token_type:" + access_token_data.token_type);
-            console.log("token_type:" + access_token_data.token_type);
+        Helper.log("expires_in: " + access_token_data.expires_in);
-            console.log("expires_in: " + access_token_data.expires_in);
+        Helper.log("------------------------");
-            console.log("------------------------");
-        }
         $(".spotify_authenticated").css("display", "block");
         $(".spotify_unauthenticated").css("display", "none");
     } else {
-        if(localStorage.debug === "true"){
+        Helper.log("----------------------------");
-            console.log("----------------------------");
+        Helper.log("Spotify is not authenticated");
-            console.log("Spotify is not authenticated");
+        Helper.log("----------------------------");
-            console.log("----------------------------");
         $(".spotify_authenticated").css("display", "none");
         $(".spotify_unauthenticated").css("display", "block");
     }
-    }
 }
 
 window.enable_debug = enable_debug;
@@ -340,6 +361,14 @@ $(document).on('click', '#cookieok', function() {
     });
 });
 
+$(document).on("click", ".connect_error", function(e){
+    e.preventDefault();
+    $(this).fadeOut(function(){
+        $(this).remove();
+        connect_error = false;
+    });
+});
+
 $(document).on("click", ".extra-button-search", function(e){
     e.preventDefault();
     $("#search").val($(this).attr("data-text"));
@@ -349,27 +378,29 @@ $(document).on("click", ".extra-button-search", function(e){
 $(document).on("click", ".extra-button-delete", function(e){
     e.preventDefault();
     $(this).parent().remove();
-    if($(".not-imported-container").children().length == 0){
+    if($(".not-imported-container").children().length === 0){
         $(".not-imported").toggleClass("hide");
     }
-})
+});
 
 $(document).on("click", "#closePlayer", function(e){
   	e.preventDefault();
 	socket.emit("change_channel");
-  	Player.ytplayer.destroy();
+    try{
+        Player.player.destroy();
+    } catch(error){}
     socket.removeEventListener("np");
   	socket.removeEventListener("id");
 	socket.removeEventListener(id);
   	$("#alreadychannel").remove();
-  	Player.ytplayer = "";
+  	Player.player = "";
   	document.title = "Zöff";
   	$("#closePlayer").remove();
 });
 
 $(document).on('click', '#toast-container', function(){
-  $(this).fadeOut(function(){
+    $(".toast").fadeOut(function(){
-        $(this).remove();
+        $(".toast").remove();
     });
 });
 
@@ -426,7 +457,7 @@ $(document).on("change", 'input[class=conf]', function()
 });
 
 $("#clickme").click(function(){
-	Player.ytplayer.playVideo();
+	Player.player.playVideo();
 });
 
 $(document).on("submit", "#listImport", function(e){
@@ -446,7 +477,7 @@ $(document).on("submit", "#listImport", function(e){
 $(document).on("submit", "#listImportSpotify", function(e){
     e.preventDefault();
     if(spotify_authenticated && $("#import_spotify").val() !== ""){
-        //console.log("Import this playlist: " + document.getElementById("import_spotify").value);
+        //Helper.log("Import this playlist: " + document.getElementById("import_spotify").value);
         var url = $("#import_spotify").val().split("https://open.spotify.com/user/");
         if(url.length == 2) {
             url = url[1].split("/");
@@ -814,14 +845,14 @@ function onepage_load(){
 		    		$("#main-row").addClass("frontpage_modified_heights");
 		    		$("#player").css("opacity", "1");
 		    		$("#video-container").removeClass("no-opacity");
-		    		$("#main-row").prepend("<div id='player_bottom_overlay' title='To Channel' class='ytplayer player_bottom'></div>");
+		    		$("#main-row").prepend("<div id='player_bottom_overlay' title='To Channel' class='player player_bottom'></div>");
 		    	} else {
                     try{
-                    	Player.ytplayer.destroy();
+                    	Player.player.destroy();
                     } catch(error){
                         //No player to destroy
                     }
-                    Player.ytplayer = "";
+                    Player.player = "";
 		    		document.title = "Zöff";
 		    	}
 

static/js/mobileremote.js

@@ -50,7 +50,7 @@ var Mobile_remote = {
           },*/
           stop:function(event, ui) {
             socket.emit("id", [Mobile_remote.id, "volume", ui.value]);
-            console.log("volume");
+            Helper.log("volume");
             //console.log(ui.value);
           }
       });

static/js/nochan.js

@@ -235,8 +235,8 @@ var Nochan = {
 
       success: function(e){
 
-        if(Player.ytplayer !== ""){
+        if(Player.player !== ""){
-          //Player.ytplayer.destroy();
+          //Player.player.destroy();
           socket.emit("change_channel", {channel: chan.toLowerCase()});
         }
         $("#frontpage_player").empty();
@@ -252,7 +252,7 @@ var Nochan = {
         $("main").attr("class", "container center-align main");
         $("body").attr("id", "channelpage");
         $("header").html($($(e)[59]).html());
-        if($("#alreadychannel").length === 0 || Helper.mobilecheck() || Player.ytplayer === undefined){
+        if($("#alreadychannel").length === 0 || Helper.mobilecheck() || Player.player === undefined){
           $("main").html($($(e)[63]).html());
         } else {
           var main = $($($($($(e)[63]).html())[0]).html());

static/js/player.js

@@ -3,25 +3,23 @@ var Player = {
     loaded: true,
     before_load: "",
     after_load: "",
-    ytplayer: "",
+    player: "",
     stopInterval: false,
 
     youtube_listener: function(obj)
     {
         Player.loaded      = false;
-        if(localStorage.debug === "true"){
+        Helper.log("--------youtube_listener--------");
-            console.log("--------youtube_listener--------");
 
-            console.log("Received: ");
+        Helper.log("Received: ");
-            console.log(obj);
+        Helper.log(obj);
-            console.log("paused variable: " + paused);
+        Helper.log("paused variable: " + paused);
-            console.log("mobile_beginning variable: " + mobile_beginning);
+        Helper.log("mobile_beginning variable: " + mobile_beginning);
         try{
-                console.log("getVideoUrl(): " + Player.ytplayer.getVideoUrl().split('v=')[1]);
+            Helper.log("getVideoUrl(): " + Player.player.getVideoUrl().split('v=')[1]);
         } catch(e){}
-            console.log("video_id variable: " + video_id);
+        Helper.log("video_id variable: " + video_id);
-            console.log("---------------------------------");
+        Helper.log("---------------------------------");
-        }
         if(obj.length === 0){
 
             document.getElementById('song-title').innerHTML = "Empty channel. Add some songs!";
@@ -29,12 +27,12 @@ var Player = {
 
             if(!window.MSStream) $("#player_overlay").toggleClass("hide");
             try{
-                Player.ytplayer.stopVideo();
+                Player.player.stopVideo();
             }catch(e){}
             //List.importOldList(channel.toLowerCase());
         }
         else{
-            //console.log("gotten new song");
+            //Helper.log("gotten new song");
             if(previous_video_id === undefined)
                 previous_video_id = obj[0][0].id;
             else if(previous_video_id != video_id)
@@ -64,23 +62,23 @@ var Player = {
             {
 
                 try{
-                    if(Player.ytplayer.getVideoUrl().split('v=')[1] != video_id)
+                    if(Player.player.getVideoUrl().split('v=')[1] != video_id)
                     {
-                        Player.ytplayer.loadVideoById(video_id);
+                        Player.player.loadVideoById(video_id);
                         Player.notifyUser(video_id, song_title);
-                        Player.ytplayer.seekTo(seekTo);
+                        Player.player.seekTo(seekTo);
                         if(paused)
-                            Player.ytplayer.pauseVideo();
+                            Player.player.pauseVideo();
                     }
 
                     if(!paused){
                         if(!mobile_beginning)
-                           Player.ytplayer.playVideo();
+                           Player.player.playVideo();
                         if(!durationBegun)
                             Player.durationSetter();
                     }
-                    if(Player.ytplayer.getDuration() > seekTo || Player.ytplayer.getDuration() === 0)
+                    if(Player.player.getDuration() > seekTo || Player.player.getDuration() === 0)
-                        Player.ytplayer.seekTo(seekTo);
+                        Player.player.seekTo(seekTo);
                     Player.after_load  = video_id;
 
                     if(!Player.loaded) setTimeout(function(){Player.loaded = true;},500);
@@ -95,17 +93,15 @@ var Player = {
     },
 
     onPlayerStateChange: function(newState) {
-        if(localStorage.debug === "true"){
+        Helper.log("-------onPlayerStateChange------");
-            console.log("-------onPlayerStateChange------");
+        Helper.log("New state\nState: ");
-            console.log("New state\nState: ");
+        Helper.log(newState);
-            console.log(newState);
         try{
-                console.log("Duration: " + Player.ytplayer.getDuration(), "Current time: " + Player.ytplayer.getCurrentTime());
+            Helper.log("Duration: " + Player.player.getDuration(), "Current time: " + Player.player.getCurrentTime());
-                console.log("getVideoUrl(): " + Player.ytplayer.getVideoUrl().split('v=')[1]);
+            Helper.log("getVideoUrl(): " + Player.player.getVideoUrl().split('v=')[1]);
         }catch(e){}
-            console.log("video_id variable: " + video_id);
+        Helper.log("video_id variable: " + video_id);
-            console.log("---------------------------------");
+        Helper.log("---------------------------------");
-        }
     	switch(newState.data)
     	{
     		case -1:
@@ -118,7 +114,7 @@ var Player = {
     		case 1:
     			playing = true;
                 if(beginning && Helper.mobilecheck()){
-                    Player.ytplayer.pauseVideo();
+                    Player.player.pauseVideo();
                     beginning = false;
                     mobile_beginning = false;
                 }
@@ -143,7 +139,7 @@ var Player = {
                     mobile_beginning = true;
                 /*}
                 else
-                    Player.ytplayer.playVideo();*/
+                    Player.player.playVideo();*/
     			//
     			break;
     		case 3:
@@ -175,24 +171,24 @@ var Player = {
         {
             /*if(Player.count == 2){
                 Player.count = 0;*/
-            /*console.log("Before: " + Player.before_load);
+            /*Helper.log("Before: " + Player.before_load);
-            console.log("Now: " + video_id);
+            Helper.log("Now: " + video_id);
-            console.log("After: " + Player.after_load);
+            Helper.log("After: " + Player.after_load);
-            console.log(Player.before_load == Player.ytplayer.getVideoUrl);*/
+            Helper.log(Player.before_load == Player.player.getVideoUrl);*/
-            curr_playing = Player.ytplayer.getVideoUrl().replace("https://www.youtube.com/watch?v=", "");
+            curr_playing = Player.player.getVideoUrl().replace("https://www.youtube.com/watch?v=", "");
 
 
                 socket.emit("skip", {error: newState.data, id: video_id, pass: adminpass, channel: chan.toLowerCase});
-                //console.log(video_id, Player.ytplayer.getVideoUrl(), Player.ytplayer.getPlayerState());
+                //Helper.log(video_id, Player.player.getVideoUrl(), Player.player.getPlayerState());
 
             /*}else{
                 setTimeout(function(){
-                Player.ytplayer.loadVideoById(video_id);
+                Player.player.loadVideoById(video_id);
                 Player.count ++;
                 }, Math.floor((Math.random() * 100) + 1));
             }*/
     	}else if(video_id !== undefined)
-    		Player.ytplayer.loadVideoById(video_id);
+    		Player.player.loadVideoById(video_id);
     },
 
     onPlayerReady: function(event) {
@@ -205,26 +201,26 @@ var Player = {
     			$("#player").css("opacity", "1");
     			$("#controls").css("opacity", "1");
     			$(".playlist").css("opacity", "1");
-    			Player.ytplayer.loadVideoById(video_id);
+    			Player.player.loadVideoById(video_id);
                 if(autoplay && !Helper.mobilecheck())
-                    Player.ytplayer.playVideo();
+                    Player.player.playVideo();
                 if(!durationBegun)
                     Player.durationSetter();
                 if(embed){
                     setTimeout(function(){
-                        Player.ytplayer.seekTo(seekTo);
+                        Player.player.seekTo(seekTo);
                         if(!autoplay){
-                            Player.ytplayer.pauseVideo();
+                            Player.player.pauseVideo();
                             Playercontrols.play_pause_show();
                         }
                     }, 1000);
                 }else
-                Player.ytplayer.seekTo(seekTo);
+                Player.player.seekTo(seekTo);
     		}
     		Player.readyLooks();
-    		Playercontrols.initYoutubeControls(Player.ytplayer);
+    		Playercontrols.initYoutubeControls(Player.player);
     		Playercontrols.initSlider();
-    		Player.ytplayer.setVolume(Crypt.get_volume());
+    		Player.player.setVolume(Crypt.get_volume());
             $(".video-container").removeClass("no-opacity");
         }catch(e){}
     },
@@ -281,7 +277,7 @@ var Player = {
     },
 
     onYouTubeIframeAPIReady: function() {
-      Player.ytplayer = new YT.Player('player', {
+      Player.player = new YT.Player('player', {
         videoId: video_id,
         playerVars: { rel:"0", wmode:"transparent", controls: "0" , iv_load_policy: "3", theme:"light", color:"white", showinfo: 0},
         events: {
@@ -296,14 +292,14 @@ var Player = {
     durationSetter: function()
     {
         /*try{
-            //duration = Player.ytplayer.getDuration();
+            //duration = Player.player.getDuration();
         }catch(e){};*/
         if(duration !== undefined){
             try{
                 if(!Player.stopInterval) durationBegun = true;
                 dMinutes = Math.floor(duration / 60);
                 dSeconds = duration - dMinutes * 60;
-                currDurr = Player.ytplayer.getCurrentTime() !== undefined ? Math.floor(Player.ytplayer.getCurrentTime()) : seekTo;
+                currDurr = Player.player.getCurrentTime() !== undefined ? Math.floor(Player.player.getCurrentTime()) : seekTo;
                 if(currDurr > duration)
                     currDurr = duration;
                 minutes = Math.floor(currDurr / 60);
@@ -324,8 +320,12 @@ var Player = {
 
     loadPlayer: function() {
         if($("script[src='https://www.youtube.com/iframe_api']").length == 1){
+            try{
                 Player.onYouTubeIframeAPIReady();
-        }else{
+            } catch(error){
+                console.error("Seems YouTube iFrame script isn't correctly loaded. Please reload the page.");
+            }
+        } else {
         tag            = document.createElement('script');
         tag.src        = "https://www.youtube.com/iframe_api";
         firstScriptTag = document.getElementsByTagName('script')[0];

static/js/playercontrols.js

@@ -37,7 +37,7 @@ var Playercontrols = {
     	    }
     	});
         Playercontrols.choose_button(vol, false);
-    	//$("#volume").slider("value", ytplayer.getVolume());
+    	//$("#volume").slider("value", player.getVolume());
     },
 
     fullscreen: function()
@@ -52,17 +52,17 @@ var Playercontrols = {
     play_pause: function()
     {
 
-    	if(Player.ytplayer.getPlayerState() == 1)
+    	if(Player.player.getPlayerState() == 1)
     	{
-    		Player.ytplayer.pauseVideo();
+    		Player.player.pauseVideo();
             if(Helper.mobilecheck() && !/iPad|iPhone|iPod/.test(navigator.userAgent) && !window.MSStream){
                 document.getElementById("player").style.display = "none";
                 $(".video-container").toggleClass("click-through");
                 $(".page-footer").toggleClass("padding-bottom-extra");
             }
-    	} else if(Player.ytplayer.getPlayerState() == 2 || Player.ytplayer.getPlayerState() === 0)
+    	} else if(Player.player.getPlayerState() == 2 || Player.player.getPlayerState() === 0)
     	{
-    		Player.ytplayer.playVideo();
+    		Player.player.playVideo();
             if(Helper.mobilecheck() && !/iPad|iPhone|iPod/.test(navigator.userAgent) && !window.MSStream){
                 document.getElementById("player").style.display = "block";
                 $(".video-container").toggleClass("click-through");
@@ -86,33 +86,33 @@ var Playercontrols = {
 
     changeQuality: function(wantedQ)
     {
-    	if(Player.ytplayer.getPlaybackQuality != wantedQ)
+    	if(Player.player.getPlaybackQuality != wantedQ)
     	{
-    		Player.ytplayer.setPlaybackQuality(wantedQ);
+    		Player.player.setPlaybackQuality(wantedQ);
-    		Player.ytplayer.getPlaybackQuality();
+    		Player.player.getPlaybackQuality();
     	}
     	$("#qS").toggleClass("hide");
     },
 
     mute_video: function()
     {
-    	if(!Player.ytplayer.isMuted())
+    	if(!Player.player.isMuted())
     	{
         Playercontrols.choose_button(0, true);
-    		Player.ytplayer.mute();
+    		Player.player.mute();
     	}else
     	{
-    		Player.ytplayer.unMute();
+    		Player.player.unMute();
-        Playercontrols.choose_button(Player.ytplayer.getVolume(), false);
+        Playercontrols.choose_button(Player.player.getVolume(), false);
     	}
     },
 
     setVolume: function(vol)
     {
-    	Player.ytplayer.setVolume(vol);
+    	Player.player.setVolume(vol);
         Playercontrols.choose_button(vol, false);
-    	if(Player.ytplayer.isMuted())
+    	if(Player.player.isMuted())
-    		Player.ytplayer.unMute();
+    		Player.player.unMute();
     },
 
     choose_button: function(vol, mute)
@@ -161,35 +161,35 @@ var Playercontrols = {
 
     playPause: function()
     {
-    	state = Player.ytplayer.getPlayerState();
+    	state = Player.player.getPlayerState();
     	button = document.getElementById("playpause");
     	if(state == 1)
     	{
-    		Player.ytplayer.pauseVideo();
+    		Player.player.pauseVideo();
     	}else if(state == 2)
     	{
-    		Player.ytplayer.playVideo();
+    		Player.player.playVideo();
     	}
     },
 
     volumeOptions: function()
     {
-    	if(Player.ytplayer.isMuted())
+    	if(Player.player.isMuted())
     	{
-    		Player.ytplayer.unMute();
+    		Player.player.unMute();
-    		vol = Player.ytplayer.getVolume();
+    		vol = Player.player.getVolume();
-    		$("#volume").slider("value", Player.ytplayer.getVolume());
+    		$("#volume").slider("value", Player.player.getVolume());
     	}
     	else
     	{
-    		Player.ytplayer.mute();
+    		Player.player.mute();
     		$("#volume").slider("value", 0);
     	}
     },
 
     hoverMute: function(foo)
     {
-    	vol = Player.ytplayer.getVolume();
+    	vol = Player.player.getVolume();
 
     }
 

static/js/remotecontroller.js

@@ -116,7 +116,7 @@ var Remotecontroller = {
           range: "min",
           animate: true,
           /*slide: function(event, ui) {
-            console.log(ui.value);
+            Helper.log(ui.value);
             //localStorage.setItem("volume", ui.value);
           },*/
           stop:function(event, ui) {

static/js/search.js

@@ -139,16 +139,14 @@ var Search = {
             url: yt_url,
             dataType:"jsonp",
             success: function(response){
-                //console.log(response);
+                //Helper.log(response);
                 if(response.items.length === 0){
                     Search.readySubmit(false, {totalLength: totalNumber - 1});
-                    if(localStorage.debug === "true") {
+                    Helper.log("------------------------------");
-                        console.log("------------------------------");
+                    Helper.log("NO MATCH FOR:");
-                        console.log("NO MATCH FOR:");
+                    Helper.log("Spotify title: " + title + " " + artist.join(" "));
-                        console.log("Spotify title: " + title + " " + artist.join(" "));
+                    Helper.log("Spotify length: " + length);
-                        console.log("Spotify length: " + length);
+                    Helper.log("------------------------------");
-                        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(" "));
@@ -169,7 +167,7 @@ var Search = {
                           if(response.items.length > 0) {
                               var matched = false;
                               $.each(response.items, function(i, data){
-                                  //console.log(data);
+                                  //Helper.log(data);
                                  //var title = data.snippet.title;
                                  var duration = Search.durationToSeconds(data.contentDetails.duration);
                                  var not_matched = false;
@@ -195,14 +193,14 @@ var Search = {
                                      )
                                  ){
                                      matched = true;
-                                     /*console.log("------------------------------");
+                                     /*Helper.log("------------------------------");
-                                     console.log("MATCH FOR:");
+                                     Helper.log("MATCH FOR:");
-                                     console.log("YouTube title: " + data.snippet.title);
+                                     Helper.log("YouTube title: " + data.snippet.title);
-                                     console.log("YouTube Channel: " + data.snippet.channelTitle);
+                                     Helper.log("YouTube Channel: " + data.snippet.channelTitle);
-                                     console.log("YouTube duration: " + duration);
+                                     Helper.log("YouTube duration: " + duration);
-                                     console.log("Spotify title: " + title + " " + artist.join(" "));
+                                     Helper.log("Spotify title: " + title + " " + artist.join(" "));
-                                     console.log("Spotify length: " + length);
+                                     Helper.log("Spotify length: " + length);
-                                     console.log("------------------------------");*/
+                                     Helper.log("------------------------------");*/
                                      //Search.submit(data.id,data.snippet.title, duration, true, current, totalNumber);
                                      Search.readySubmit(true, { id: data.id, title: data.snippet.title, duration: duration, totalLength: totalNumber - 1});
                                      return false;
@@ -210,13 +208,11 @@ var Search = {
                               });
                               if(!matched){
                                   Search.readySubmit(false, {totalLength: totalNumber - 1});
-                                  if(localStorage.debug === "true") {
+                                  Helper.log("------------------------------");
-                                      console.log("------------------------------");
+                                  Helper.log("NO MATCH FOR:");
-                                      console.log("NO MATCH FOR:");
+                                  Helper.log("Spotify title: " + title + " " + artist.join(" "));
-                                      console.log("Spotify title: " + title + " " + artist.join(" "));
+                                  Helper.log("Spotify length: " + length);
-                                      console.log("Spotify length: " + length);
+                                  Helper.log("------------------------------");
-                                      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(" "));

static/js/spotify.js

@@ -1,5 +1,4 @@
 window.addEventListener("load", function(){
-  console.log("hello");
   var client_id = "b934ecdd173648f5bcd38738af529d58";
   var redirect  = window.location.protocol + "//" + window.location.hostname + "/spotify_callback";
   var response  = "token";