a bit of cleaning and bug fix (box-shadow not updating at launch ; player attempting to load playlist when a single video is given)

js/main.js

@@ -55,8 +55,10 @@ class player {
         let newPlaylistID = get_playlist_id(url);
 
         if (newPlaylistID[0] != 0) {
+          console.log('playlistid to load: ' + newPlaylistID);
           this.loadPlaylist(newPlaylistID);
         } else if (newTrackID != 0) {
+          console.log('track to load: ' + newTrackID);
           this.load(newTrackID);
         } else {
           console.log('Nothing to load!');
@@ -89,7 +91,7 @@ class player {
     //First element should be the playlist ID, second element the index of the video to play
     let list = playlistID[0];
     let index = playlistID[1];
-    console.log('playlistid to load: ' + playlistID);
+
     this.player.loadPlaylist({
       list: list,
       listType: 'playlist',
@@ -100,10 +102,12 @@ class player {
   volumeUpdate() {
     let outputVolume = Math.round(this.volume * this.crossfaderCoef);
     this.player.setVolume(outputVolume);
-    this.volVal.innerHTML = outputVolume + '%';
-  }
 
+    this.volVal.innerHTML = outputVolume + '%';
 
+    let boxShadowStyle = '0 0 3em #ddbddd'
+    this.iframe.style.boxShadow = boxShadowStyle + componentToHex(Math.round(this.crossfaderCoef*255));
+  }
 }
 
 
@@ -126,10 +130,6 @@ crossfader.addEventListener('input', (e) => {
 
   calcCrossfaderCoefs(crossfader.value);
 
-  let boxShadowStyle = '0 0 3em #ddbddd'
-  playerA.iframe.style.boxShadow = boxShadowStyle + componentToHex(Math.round(playerA.crossfaderCoef*255));
-  playerB.iframe.style.boxShadow = boxShadowStyle + componentToHex(Math.round(playerB.crossfaderCoef*255));
-
   playerA.volumeUpdate();
   playerB.volumeUpdate();
 
@@ -151,36 +151,9 @@ function calcCrossfaderCoefs(input) {
   // let coefB = (normVal ** 2) * (3 - 2 * normVal);
   // let coefA = 1 - coefB;
 
-  // return [coefA, coefB];
   playerA.crossfaderCoef = coefA;
   playerB.crossfaderCoef = coefB;
 }
-//
-
-
-// function updateCrossfader(input) {
-//   let normVal = crossfader.value / 1000;
-//
-//   // let coefB = normVal ** 2;
-//   // let coefA = (1 - normVal) ** 2;
-//   let coefB = Math.min(normVal*2, 1);
-//   let coefA = Math.min((1-normVal)*2, 1);
-//
-//
-//   // Sets box-shadow transparency depending on crossfader position
-//   let boxShadowStyle = '0 0 3em #ddbddd'
-//   playerA.iframe.style.boxShadow = boxShadowStyle + componentToHex(Math.round(coefA*255));
-//   playerB.iframe.style.boxShadow = boxShadowStyle + componentToHex(Math.round(coefB*255));
-//
-//   playerA.player.setVolume(playerA.volume * coefA);
-//   playerB.player.setVolume(playerB.volume * coefB);
-// }
-
-// From https://thomaspark.co/projects/needledrop/ by Thomas Park
-// function getYouTubeID(url){
-//   url = url.split(/(vi\/|v=|\/v\/|youtu\.be\/|\/embed\/)/);
-//   return (url[2] !== undefined) ? url[2].split(/[^0-9a-z_\-]/i)[0] : false;
-// }
 
 
 // From https://stackoverflow.com/a/55616161/14182148
@@ -197,7 +170,7 @@ function get_playlist_id(url) {
     if (match != null) {
       return [match[1], index];
     } else {
-      return 0;
+      return [0,0];
     }
 }
 
@@ -211,6 +184,12 @@ function get_video_id(url) { //originally 'video_id_from_playlist'
     }
 }
 
+// From https://thomaspark.co/projects/needledrop/ by Thomas Park
+// function getYouTubeID(url){
+//   url = url.split(/(vi\/|v=|\/v\/|youtu\.be\/|\/embed\/)/);
+//   return (url[2] !== undefined) ? url[2].split(/[^0-9a-z_\-]/i)[0] : false;
+// }
+
 // function get_video_id(url) {
 //     url = url.split(/(vi\/|v=|\/v\/|youtu\.be\/|\/embed\/)/);
 //     return (url[2] !== undefined) ? url[2].split(/[^0-9a-z_\-]/i)[0] : url[0];