Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

test: add selector for audiooutput, allow to test different speakers #12667

Draft
wants to merge 1 commit into
base: main
Choose a base branch
from
Draft

test: add selector for audiooutput, allow to test different speakers #12667

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
9 changes: 8 additions & 1 deletion src/components/MediaSettings/MediaDevicesSpeakerTest.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -36,6 +36,13 @@ export default {
VolumeHighIcon,
},

props: {
deviceId: {
type: String,
required: true,
},
},

data() {
return {
isPlayingTestSound: false,
Expand Down Expand Up @@ -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
})
Expand Down
12 changes: 11 additions & 1 deletion src/components/MediaSettings/MediaSettings.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -107,7 +107,12 @@
:device-id="videoInputId"
@refresh="updateDevices"
@update:deviceId="handleVideoInputIdChange" />
<MediaDevicesSpeakerTest />
<MediaDevicesSelector kind="audiooutput"
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

MediaDevicesSelector has not icon for this defined

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Wanted to discuss it first before start actually doing something.
For now, see the mock for the reference

:devices="devices"
:device-id="audioOutputId"
@refresh="updateDevices"
@update:deviceId="handleAudioOutputIdChange" />
<MediaDevicesSpeakerTest :device-id="audioOutputId" />
</div>

<!-- Background selection -->
Expand Down Expand Up @@ -326,6 +331,7 @@ export default {
isRecordingFromStart: false,
isPublicShareAuthSidebar: false,
isMirrored: false,
audioOutputId: null,
}
},

Expand Down Expand Up @@ -692,6 +698,10 @@ export default {
this.videoInputId = videoInputId
this.updatePreferences('videoinput')
},

handleAudioOutputIdChange(audioOutputId) {
this.audioOutputId = audioOutputId
},
},
}
</script>
Expand Down
12 changes: 10 additions & 2 deletions src/store/soundsStore.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -17,6 +17,7 @@ const state = {
joinAudioObject: null,
leaveAudioObject: null,
waitAudioObject: null,
waitAudioObjectSinkId: null,
}

const getters = {
Expand Down Expand Up @@ -72,6 +73,7 @@ const mutations = {
*/
setWaitAudioObject(state, audioObject) {
state.waitAudioObject = audioObject
state.waitAudioObjectSinkId = audioObject.sinkId
},

/**
Expand Down Expand Up @@ -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
Expand All @@ -195,6 +202,7 @@ const actions = {

const audio = context.state.waitAudioObject
audio.pause()
audio.setSinkId(context.state.waitAudioObjectSinkId)
},

/**
Expand Down