Attempt to make custom audio outputs work again

martpie · Apr 3, 2024 · 34e2c8a · 34e2c8a
1 parent 5ce99d4
commit 34e2c8a
Show file tree

Hide file tree

Showing 2 changed files with 14 additions and 10 deletions.
diff --git a/src/components/AudioOutputSelect/AudioOutputSelect.tsx b/src/components/AudioOutputSelect/AudioOutputSelect.tsx
@@ -18,12 +18,12 @@ export default function AudioOutputSelect(props: Props) {
   useEffect(() => {
     const refreshDevices = async () => {
       try {
-        // Webkit sucks, we need to request permissions for inputs, when we only
-        // need outputs
-        // const test = await navigator.mediaDevices.getUserMedia({
-        //   audio: true,
-        //   video: false,
-        // });
+        // This will display a popup to users asking them to give microphone access,
+        // which is lame because we only need outputs.
+        // Does not work on macOS/linux for now.
+        await navigator.mediaDevices.getUserMedia({
+          audio: true,
+        });
         const devices = await navigator.mediaDevices.enumerateDevices();
         const audioDevices = devices.filter(
           (device) => device.kind === 'audiooutput' && device.deviceId !== '',

diff --git a/src/lib/player.ts b/src/lib/player.ts
@@ -37,10 +37,14 @@ class Player {
     this.track = null;
 
     this.audio.defaultPlaybackRate = mergedOptions.playbackRate;
-    // eslint-disable-next-line
-    // @ts-ignore
-    // TODO:
-    // this.audio.setSinkId(mergedOptions.audioOutputDevice);
+
+    // FIXME: this will not do anything unless we recall getUserMedia()
+    if ('setSinkId' in this.audio) {
+      // eslint-disable-next-line
+      // @ts-ignore
+      this.audio.setSinkId(mergedOptions.audioOutputDevice);
+    }
+
     this.audio.playbackRate = mergedOptions.playbackRate;
     this.audio.volume = mergedOptions.volume;
     this.audio.muted = mergedOptions.muted;