From 58ba37d8da032193dc9eb72abac3e6168539ac6d Mon Sep 17 00:00:00 2001
From: Juliusz Chroboczek <jch@irif.fr>
Date: Tue, 24 Nov 2020 22:41:43 +0100
Subject: [PATCH] Implement stopping of videos.

---
 static/sfu.html |  6 ++++++
 static/sfu.js   | 16 ++++++++++++++++
 2 files changed, 22 insertions(+)

diff --git a/static/sfu.html b/static/sfu.html
index 0ac445d..fef6eb6 100644
--- a/static/sfu.html
+++ b/static/sfu.html
@@ -65,6 +65,12 @@
                     <label>Unshare Screen</label>
                   </div>
                 </li>
+                <li>
+                  <div id="stopvideobutton" class="invisible nav-link nav-button nav-cancel">
+                    <span><i class="fas fa-window-close" aria-hidden="true"></i></span>
+                    <label>Stop Video</label>
+                  </div>
+                </li>
                 <li>
                   <div class="nav-button nav-link invisible" id="user">
                     <span><i class="fas fa-user dropbtn" aria-hidden="true"></i></span>
diff --git a/static/sfu.js b/static/sfu.js
index ad36a46..81717ed 100644
--- a/static/sfu.js
+++ b/static/sfu.js
@@ -393,6 +393,7 @@ function setButtonsVisibility() {
     let permissions = serverConnection.permissions;
     let local = !!findUpMedia('local');
     let share = !!findUpMedia('screenshare');
+    let video = !!findUpMedia('video');
 
     // don't allow multiple presentations
     setVisibility('presentbutton', permissions.present && !local);
@@ -403,6 +404,8 @@ function setButtonsVisibility() {
                   ('getDisplayMedia' in navigator.mediaDevices));
     setVisibility('unsharebutton', share);
 
+    setVisibility('stopvideobutton', video);
+
     setVisibility('mediaoptions', permissions.present);
 }
 
@@ -467,6 +470,12 @@ document.getElementById('unsharebutton').onclick = function(e) {
     resizePeers();
 }
 
+document.getElementById('stopvideobutton').onclick = function(e) {
+    e.preventDefault();
+    delUpMediaKind('video');
+    resizePeers();
+}
+
 /** @returns {number} */
 function getMaxVideoThroughput() {
     let v = getSettings().send;
@@ -528,6 +537,7 @@ getInputElement('fileinput').onchange = function(e) {
     let files = input.files;
     for(let i = 0; i < files.length; i++)
         addFileMedia(files[i]);
+    input.value = '';
 }
 
 /**
@@ -900,6 +910,7 @@ async function addFileMedia(file) {
     };
     setMedia(c, true, video);
     video.play();
+    setButtonsVisibility()
 }
 
 /**
@@ -1190,6 +1201,11 @@ function delMedia(id) {
     let media = /** @type{HTMLVideoElement} */
         (document.getElementById('media-' + id));
 
+    if(media.src) {
+        URL.revokeObjectURL(media.src);
+        media.src = null;
+    }
+
     media.srcObject = null;
     mediadiv.removeChild(peer);