diff --git a/assets/index.html b/assets/index.html
new file mode 100644
index 0000000..4e0876e
--- /dev/null
+++ b/assets/index.html
@@ -0,0 +1,77 @@
+<html>
+    <head>
+        <script type='text/javascript' src='http://www.youtube.com/player_api'></script>
+        <title>Weirdradio</title></head>
+    <body onload="connectSocket()">
+        <div id="player"></div>
+    </body>
+    <script>
+        // 2. This code loads the IFrame Player API code asynchronously.
+        var tag = document.createElement('script');
+  
+        tag.src = "https://www.youtube.com/iframe_api";
+        var firstScriptTag = document.getElementsByTagName('script')[0];
+        firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);
+  
+        // 3. This function creates an <iframe> (and YouTube player)
+        //    after the API code downloads.
+        var player;
+        function onYouTubeIframeAPIReady() {
+          player = new YT.Player('player', {
+            height: '390',
+            width: '640',
+            videoId: 'Wch3gJG2GJ4',
+            playerVars: {
+              'playsinline': 1
+            },
+            events: {
+              'onReady': onPlayerReady,
+              'onStateChange': onPlayerStateChange
+            }
+          });
+        }
+  
+        // 4. The API will call this function when the video player is ready.
+        function onPlayerReady(event) {
+          event.target.playVideo();
+        }
+              
+        // 5. The API calls this function when the player's state changes.
+        //    The function indicates that when playing a video (state=1),
+        //    the player should play for six seconds and then stop.
+        var done = false;
+        function onPlayerStateChange(event) {
+          if (event.data == 0) {
+            console.log("playing stopped")
+          }
+          //if (event.data == YT.PlayerState.PLAYING && !done) {
+          //  setTimeout(stopVideo, 6000);
+          //  done = true;
+          //}
+        }
+        function stopVideo() {
+          player.stopVideo();
+        }
+      </script>
+  
+    <script lang="Javascript">
+            
+        function connectSocket() {
+            baseUrl = (window.location.host).replace("8080", "8090")
+            let socket = new WebSocket("ws://"+baseUrl);
+            socket.onopen = function(e) {
+                console.log("[open] Connection established");
+            };
+            socket.onmessage = function(event) {
+                data = JSON.parse(event.data)
+                if (data["videoId"] != undefined && data["videoId"] != null) {
+                    player.loadVideoById(data["videoId"])
+                    player.playVideo()
+                    console.log(`[message] Data received from server: ${event.data}`);
+                } else {
+                    console.log(`[unparseable message] Data received from server ${event.data}`)
+                }
+            };
+        }
+    </script>
+</html>
\ No newline at end of file
diff --git a/weirdradio.js b/weirdradio.js
index 3e971dd..803418a 100644
--- a/weirdradio.js
+++ b/weirdradio.js
@@ -81,14 +81,16 @@ client.on("room.message", (roomId, event) => {
     //link_matches = body.match(/https?:\/\/[^\ ]*youtu[^\ ]*/g);
     var r = new RegExp(/https?:\/\/[^\ ]*youtube.com\/watch\?v=([^\ ]*)/g);
     link_matches = r.exec(body);
-    console.log(link_matches);
     if (link_matches && link_matches.length > 1) {
-      console.log("Relaying: " + link_matches[0]);
       // pass to server
       var obj = {
-        link:
+        link: link_matches[0],
+        embedLink:
           "https://www.youtube.com/embed/" + link_matches[1] + "?autoplay=1",
+        videoId: link_matches[1],
+    
       };
+      console.log("Relaying: " + obj.link);
       sockets.forEach((s) => s.send(JSON.stringify(obj)));
     }
   }
