add setSinkId for selecting different audio output devices (katspaugh…

…#1300)

* add support for sink id
* update changelog

CHANGES.md

@@ -1,6 +1,11 @@
 wavesurfer.js changelog
 =======================
 
+next (unreleased)
+-----------------
+
+- Added support for selecting different audio output devices using `setSinkId` (#1293)
+
 2.0.2 (10.01.2018)
 ------------------
 

src/mediaelement.js

@@ -301,6 +301,20 @@ export default class MediaElement extends WebAudio {
         return this.peaks || [];
     }
 
+    /**
+     * Set the sink id for the media player
+     *
+     * @param {string} deviceId String value representing audio device id.
+     */
+    setSinkId(deviceId) {
+        if (deviceId) {
+            if (!this.media.setSinkId) {
+                throw new Error('setSinkId is not supported in your browser');
+            }
+            this.media.setSinkId(deviceId);
+        }
+    }
+
     /**
      * Get the current volume
      *

src/wavesurfer.js

@@ -788,6 +788,15 @@ export default class WaveSurfer extends util.Observer {
         this.drawer.progress(0);
     }
 
+    /**
+     * Set the playback volume.
+     *
+     * @param {string} deviceId String value representing underlying output device
+     */
+    setSinkId(deviceId) {
+        this.backend.setSinkId(deviceId);
+    }
+
     /**
      * Set the playback volume.
      *

src/webaudio.js

@@ -275,6 +275,31 @@ export default class WebAudio extends util.Observer {
         this.gainNode.connect(this.ac.destination);
     }
 
+    /**
+     * Set the sink id for the media player
+     *
+     * @param {string} deviceId String value representing audio device id.
+     */
+    setSinkId(deviceId) {
+        if (deviceId) {
+            /**
+             * The webaudio api doesn't currently support setting the device
+             * output. Here we create an HTMLAudioElement, connect the
+             * webaudio stream to that element and setSinkId there.
+             */
+            let audio = new window.Audio();
+            if (!audio.setSinkId) {
+                throw new Error('setSinkId is not supported in your browser');
+            }
+            audio.autoplay = true;
+            var dest = this.ac.createMediaStreamDestination();
+            this.gainNode.disconnect();
+            this.gainNode.connect(dest);
+            audio.src = URL.createObjectURL(dest.stream);
+            audio.setSinkId(deviceId);
+        }
+    }
+
     /**
      * Set the audio volume
      *