Support the Repl.it Audio messages

This change:

a) Adds a button to toggle the audio stream. This is needed since most
   browsers require the audio play action to be run in a user event
   handler, so having the toggle audio be an explicit button achieves
   that (and is also to avoid annoying users).
b) Drops support for the QEMU audio extension and instead uses the
   Repl.it Audio messages, which allows for explicit negotiation for
   audio compression.
c) Makes the audio library more robust and now works in Chrome and
   Firefox.

app/ui.js

@@ -224,6 +224,9 @@ const UI = {
         document.getElementById("noVNC_view_drag_button")
             .addEventListener('click', UI.toggleViewDrag);
 
+        document.getElementById("noVNC_audio_button")
+            .addEventListener('click', UI.toggleEnableAudio);
+
         document.getElementById("noVNC_control_bar_handle")
             .addEventListener('mousedown', UI.controlbarHandleMouseDown);
         document.getElementById("noVNC_control_bar_handle")
@@ -438,7 +441,7 @@ const UI = {
             UI.enableSetting('port');
             UI.enableSetting('path');
             UI.enableSetting('repeaterID');
-            UI.updatePowerButton();
+            UI.updateCapabilities();
             UI.keepControlbar();
         }
 
@@ -869,6 +872,24 @@ const UI = {
         }
     },
 
+    updateCapabilities() {
+        UI.updatePowerButton();
+        UI.updateAudioButton();
+    },
+
+    updateAudioButton() {
+        if (UI.connected &&
+            UI.rfb.capabilities.audio) {
+            document.getElementById('noVNC_audio_button')
+                .classList.remove("noVNC_hidden");
+            document.getElementById('noVNC_audio_button')
+                .classList.remove("noVNC_selected");
+        } else {
+            document.getElementById('noVNC_audio_button')
+                .classList.add("noVNC_hidden");
+        }
+    },
+
 /* ------^-------
  *   /SETTINGS
  * ==============
@@ -1032,7 +1053,7 @@ const UI = {
         UI.rfb.addEventListener("disconnect", UI.disconnectFinished);
         UI.rfb.addEventListener("credentialsrequired", UI.credentials);
         UI.rfb.addEventListener("securityfailure", UI.securityFailed);
-        UI.rfb.addEventListener("capabilities", UI.updatePowerButton);
+        UI.rfb.addEventListener("capabilities", UI.updateCapabilities);
         UI.rfb.addEventListener("clipboard", UI.clipboardReceive);
         UI.rfb.addEventListener("bell", UI.bell);
         UI.rfb.addEventListener("desktopname", UI.updateDesktopName);
@@ -1647,6 +1668,27 @@ const UI = {
         }
     },
 
+    toggleEnableAudio() {
+        if (!UI.rfb) return;
+
+        if (!document.getElementById('noVNC_audio_button')
+            .classList.contains("noVNC_selected")) {
+            UI.rfb.enableAudio(
+                2,
+                MediaSource.isTypeSupported('audio/webm;codecs=opus') ?
+                    RFB.audioCodecs.OpusWebM :
+                    RFB.audioCodecs.MP3,
+                32 * 1024  // 32kbps
+            );
+            document.getElementById('noVNC_audio_button')
+                .classList.add("noVNC_selected");
+        } else {
+            UI.rfb.disableAudio();
+            document.getElementById('noVNC_audio_button')
+                .classList.remove("noVNC_selected");
+        }
+    },
+
     updateShowDotCursor() {
         if (!UI.rfb) return;
         UI.rfb.showDotCursor = UI.getSetting('show_dot');

core/encodings.js

@@ -27,6 +27,7 @@ export const encodings = {
     pseudoEncodingContinuousUpdates: -313,
     pseudoEncodingCompressLevel9: -247,
     pseudoEncodingCompressLevel0: -256,
+    pseudoEncodingReplitAudio: 0x52706c41,
     pseudoEncodingVMwareCursor: 0x574d5664,
     pseudoEncodingExtendedClipboard: 0xc0a1e5ce
 };