Implement local mute.

static/sfu.css

@@ -64,9 +64,17 @@ h1 {
 #audioselect {
     width: 8em;
     text-align-last: center;
+}
+
+#mutebutton {
+    width: 6em;
     margin-right: 0.4em;
 }
 
+.muted {
+    color: red;
+}
+
 #sharebutton, #unsharebutton {
     width: 8em;
     white-space: nowrap;

static/sfu.html

@@ -44,6 +44,7 @@
             <option>default</option>
             <option>off</option>
           </select>
+          <button id="mutebutton">Mute</button>
         </span>
 
         <button id="sharebutton" class="invisible">Share screen</button>

static/sfu.js

@@ -170,16 +170,38 @@ function setButtonsVisibility() {
     setVisibility('mediaoptions', permissions.present);
 }
 
-document.getElementById('audioselect').onchange = function(e) {
-    e.preventDefault();
-    changePresentation();
-};
+let localMute = false;
+
+function toggleLocalMute() {
+    setLocalMute(!localMute);
+}
+
+function setLocalMute(mute) {
+    localMute = mute;
+    muteLocalTracks(localMute);
+    let button = document.getElementById('mutebutton');
+    button.textContent = localMute ? 'Unmute' : 'Mute';
+    if(localMute)
+        button.classList.add('muted');
+    else
+        button.classList.remove('muted');
+}
 
 document.getElementById('videoselect').onchange = function(e) {
     e.preventDefault();
     changePresentation();
 };
 
+document.getElementById('audioselect').onchange = function(e) {
+    e.preventDefault();
+    changePresentation();
+};
+
+document.getElementById('mutebutton').onclick = function(e) {
+    e.preventDefault();
+    toggleLocalMute();
+}
+
 document.getElementById('sharebutton').onclick = function(e) {
     e.preventDefault();
     addShareMedia();
@@ -349,6 +371,8 @@ async function addLocalMedia() {
     c.stream = stream;
     stream.getTracks().forEach(t => {
         c.labels[t.id] = t.kind
+        if(t.kind == 'audio' && localMute)
+            t.enabled = false;
         let sender = c.pc.addTrack(t, stream);
         c.setInterval(() => {
             updateStats(c, sender);
@@ -428,6 +452,20 @@ function findUpMedia(kind) {
     return false;
 }
 
+function muteLocalTracks(mute) {
+    for(let id in up) {
+        let c = up[id];
+        if(c.kind === 'local') {
+            let stream = c.stream;
+            stream.getTracks().forEach(t => {
+                if(t.kind === 'audio') {
+                    t.enabled = !mute;
+                }
+            });
+        }
+    }
+}
+
 function setMedia(id) {
     let mine = true;
     let c = up[id];
@@ -1194,6 +1232,8 @@ function start() {
         document.getElementById('title').textContent = title;
     }
 
+    setLocalMute(localMute);
+
     myid = randomid();
 
     getIceServers().catch(console.error).then(c => {