// establishes socket connection
function establishWebsocketConnection() {
  mySocket = io();

  mySocket.on("connect", () => {
    console.log("My socket ID is", mySocket.id);

    //client side channel
    mySocket.on("askToPlay",()=>{
      //
      document.getElementById("video").play();
      mySocket.emit("playSong", "500.mp4");

    });
 

    mySocket.on("sendCurrentSong",(currentSong)=>{
      //
      console.log('receive song data');
      console.log(currentSong);
     
      //myScene.video.src = './' + currentSong.name + '.mp4';
      let videoEl = document.getElementById("video");
      videoEl.src = './' + currentSong.name + '.mp4';
      videoEl.play();
      console.log(myScene.video.src)

      
      setTimeout(()=>{
        let timeDiff = (new Date().getTime() - currentSong.startTime)/1000;
        console.log(timeDiff)
        document.getElementById("video").currentTime = timeDiff;
      },1000)

      // console.log(myScene.gui.children);
      // try yo figure out how to detect the gui changed
      // console.log (myScene.gui.children); 
    });
  

    myScene.gui.onChange(()=>{
      
        let songName = myScene.gui.children[1].object.currentSong;
        console.log(songName);
        mySocket.emit("playSong",songName);
    }) ;

      
  });