From 8cf227490b007ae5261f9a9c5b2c671c50caf84b Mon Sep 17 00:00:00 2001
From: Maksim Sukharev <antreesy.web@gmail.com>
Date: Wed, 10 Jul 2024 13:24:43 +0200
Subject: [PATCH] test: add selector for audiooutput, allow to test different
 speakers

[wip]
[skip ci]

Signed-off-by: Maksim Sukharev <antreesy.web@gmail.com>
---
 .../MediaSettings/MediaDevicesSpeakerTest.vue        |  9 ++++++++-
 src/components/MediaSettings/MediaSettings.vue       | 12 +++++++++++-
 src/store/soundsStore.js                             | 12 ++++++++++--
 3 files changed, 29 insertions(+), 4 deletions(-)

diff --git a/src/components/MediaSettings/MediaDevicesSpeakerTest.vue b/src/components/MediaSettings/MediaDevicesSpeakerTest.vue
index 2bd7712304d..84e068fbbd9 100644
--- a/src/components/MediaSettings/MediaDevicesSpeakerTest.vue
+++ b/src/components/MediaSettings/MediaDevicesSpeakerTest.vue
@@ -36,6 +36,13 @@ export default {
 		VolumeHighIcon,
 	},
 
+	props: {
+		deviceId: {
+			type: String,
+			required: true,
+		},
+	},
+
 	data() {
 		return {
 			isPlayingTestSound: false,
@@ -69,7 +76,7 @@ export default {
 				return
 			}
 			this.isPlayingTestSound = true
-			this.$store.dispatch('playWaitAudio').then((response) => {
+			this.$store.dispatch('playWaitAudio', this.deviceId).then((response) => {
 				response.addEventListener('ended', () => {
 					this.isPlayingTestSound = false
 				})
diff --git a/src/components/MediaSettings/MediaSettings.vue b/src/components/MediaSettings/MediaSettings.vue
index 498f7c9c8d9..34463ea2411 100644
--- a/src/components/MediaSettings/MediaSettings.vue
+++ b/src/components/MediaSettings/MediaSettings.vue
@@ -107,7 +107,12 @@
 					:device-id="videoInputId"
 					@refresh="updateDevices"
 					@update:deviceId="handleVideoInputIdChange" />
-				<MediaDevicesSpeakerTest />
+				<MediaDevicesSelector kind="audiooutput"
+					:devices="devices"
+					:device-id="audioOutputId"
+					@refresh="updateDevices"
+					@update:deviceId="handleAudioOutputIdChange" />
+				<MediaDevicesSpeakerTest :device-id="audioOutputId" />
 			</div>
 
 			<!-- Background selection -->
@@ -326,6 +331,7 @@ export default {
 			isRecordingFromStart: false,
 			isPublicShareAuthSidebar: false,
 			isMirrored: false,
+			audioOutputId: null,
 		}
 	},
 
@@ -692,6 +698,10 @@ export default {
 			this.videoInputId = videoInputId
 			this.updatePreferences('videoinput')
 		},
+
+		handleAudioOutputIdChange(audioOutputId) {
+			this.audioOutputId = audioOutputId
+		},
 	},
 }
 </script>
diff --git a/src/store/soundsStore.js b/src/store/soundsStore.js
index 485537f39ff..54996705044 100644
--- a/src/store/soundsStore.js
+++ b/src/store/soundsStore.js
@@ -17,6 +17,7 @@ const state = {
 	joinAudioObject: null,
 	leaveAudioObject: null,
 	waitAudioObject: null,
+	waitAudioObjectSinkId: null,
 }
 
 const getters = {
@@ -72,6 +73,7 @@ const mutations = {
 	 */
 	setWaitAudioObject(state, audioObject) {
 		state.waitAudioObject = audioObject
+		state.waitAudioObjectSinkId = audioObject.sinkId
 	},
 
 	/**
@@ -171,14 +173,19 @@ const actions = {
 	 * Plays the wait audio file with a volume of 0.5
 	 *
 	 * @param {object} context default store context
+	 * @param {string} deviceId id of audioOutput device to play sound via
 	 */
-	playWaitAudio(context) {
+	async playWaitAudio(context, deviceId) {
 		// Make sure the audio objects are really created before playing it
-		context.dispatch('createAudioObjects')
+		await context.dispatch('createAudioObjects')
 
 		const audio = context.state.waitAudioObject
 		audio.load()
 		audio.volume = 0.5
+
+		if (deviceId) {
+			await audio.setSinkId(deviceId)
+		}
 		audio.play()
 
 		return audio
@@ -195,6 +202,7 @@ const actions = {
 
 		const audio = context.state.waitAudioObject
 		audio.pause()
+		audio.setSinkId(context.state.waitAudioObjectSinkId)
 	},
 
 	/**