Started to implement lbide265

web-service/server/public/js/index.js

@@ -40,12 +40,15 @@ const getAvailableStreams = async () => {
 }
 
 const videoPlayer = () => {
-    const containerDiv = document.getElementById('container');
-    window.open(`http://localhost:8080/stream?uri=${asd}`)   
+    const containerDiv = document.getElementById('container')
+    containerDiv.innerHTML = `<h1>Stream ${current_uri} is live right here!</h1><br><button onclick="renderThumbnails()">Go back</button><br>
+    <canvas id="ftlab-stream-video" width="0" height="0"></canvas>`;
+    containerDiv.innerHTML += '<br>'
+    containerDiv.innerHTML += ''
+    let decoder = new libde265.Decoder();
+    console.log(decoder)
 }
 
-let webSocket = new WebSocket('ws://localhost:8080/')
-
 
 /**
  * Creates thumbnail (image) for all available streams and adds them to div class='container'
@@ -58,6 +61,7 @@ const renderThumbnails = async () => {
     console.log(containerDiv)
     for(var i=0; i<thumbnails.length; i++){
         const encodedURI = encodeURIComponent(thumbnails[i])
+        current_uri = encodedURI
         console.log("THUMBNAIL[i]", thumbnails[i])
         try{
             const someData = await fetch(`http://localhost:8080/stream/rgb?uri=${encodedURI}`)
@@ -77,6 +81,7 @@ const renderThumbnails = async () => {
     }
 }
 
+
 // //FOR LAPTOP
 // const renderThumbnails = async () => {
 //     const containerDiv = document.getElementById('container')
@@ -118,7 +123,7 @@ const createCard = (url, viewers, uri) => {
     return `<div class='ftlab-card-component' >
                 <img src='${url}' class="thumbnail-img" alt="Hups" width="250px"></img>
                 <p>Viewers: ${viewers}</p>
-                <button onclick="current_uri=${uri}; window.location.href='/stream?uri=${uri}';">button</button>
+                <button onclick="videoPlayer()">button</button>
             </div>`
 }
 

web-service/server/src/index.js

@@ -275,9 +275,11 @@ app.get('/stream/config', async(req, res) => {
 
 app.get('/stream', (req, res) => {
 	let uri = req.query.uri;
-	uri_data[uri]
+	console.log(uri_data[uri]);
+	
 
 	console.log(uri)
+	res.end();
 })
 
 /*