diff --git a/src/app/components/VoiceCallAudioSettingsDialog.svelte b/src/app/components/VoiceCallAudioSettingsDialog.svelte new file mode 100644 index 00000000..c8afccc0 --- /dev/null +++ b/src/app/components/VoiceCallAudioSettingsDialog.svelte @@ -0,0 +1,128 @@ + + + + + + Audio settings + Choose microphone and speaker for this call. + +
+ + {#snippet label()} +

Microphone

+ {/snippet} + {#snippet input()} + + {/snippet} +
+ {#if canPickOutput} + + {#snippet label()} +

Speaker

+ {/snippet} + {#snippet input()} + + {/snippet} +
+ {/if} +
+
+ + + +
diff --git a/src/app/components/VoiceRoomJoinDialog.svelte b/src/app/components/VoiceRoomJoinDialog.svelte index 044fcd64..8bba88b5 100644 --- a/src/app/components/VoiceRoomJoinDialog.svelte +++ b/src/app/components/VoiceRoomJoinDialog.svelte @@ -12,9 +12,11 @@ import ModalHeader from "@lib/components/ModalHeader.svelte" import ModalSubtitle from "@lib/components/ModalSubtitle.svelte" import ModalTitle from "@lib/components/ModalTitle.svelte" + import {AbortError, TimeoutError} from "$lib/util" import {displayRoom} from "@app/core/state" import {joinVoiceRoom} from "@app/voice" import {popModal} from "@app/util/modal" + import {pushToast} from "@app/util/toast" type Props = { url: string @@ -45,6 +47,16 @@ const goBack = () => history.back() + const handleJoinError = (e: unknown) => { + if (e instanceof AbortError) return + console.error("Failed to join voice room", e) + let message = "Failed to join voice room" + if (e instanceof TimeoutError) + message = "Connection timed out. Please check your network and try again." + else if (e instanceof Error) message = e.message + pushToast({theme: "error", message}) + } + const joinVoice = async () => { popModal() await joinVoiceRoom( @@ -52,7 +64,7 @@ h, startWithoutMic, startWithoutMic ? undefined : selectedDeviceId || undefined, - ) + ).catch(handleJoinError) } diff --git a/src/app/components/VoiceWidget.svelte b/src/app/components/VoiceWidget.svelte index 603d2efc..1ed8356e 100644 --- a/src/app/components/VoiceWidget.svelte +++ b/src/app/components/VoiceWidget.svelte @@ -9,8 +9,10 @@ import PhoneRounded from "@assets/icons/phone-rounded.svg?dataurl" import PhoneCallingRounded from "@assets/icons/phone-calling-rounded.svg?dataurl" import CloseCircle from "@assets/icons/close-circle.svg?dataurl" + import Settings from "@assets/icons/settings.svg?dataurl" import Icon from "@lib/components/Icon.svelte" import Button from "@lib/components/Button.svelte" + import VoiceCallAudioSettingsDialog from "@app/components/VoiceCallAudioSettingsDialog.svelte" import VoiceRoomJoinDialog from "@app/components/VoiceRoomJoinDialog.svelte" import { decodeRelay, @@ -63,6 +65,10 @@ await goto(makeRoomPath(targetRoom.url, targetRoom.h)) pushModal(VoiceRoomJoinDialog, {url: targetRoom.url, h: targetRoom.h}) } + + const openAudioSettings = () => { + pushModal(VoiceCallAudioSettingsDialog) + } {#if targetRoom} @@ -100,6 +106,12 @@ onclick={toggleMute}> +