+ className="min-h-screen">
{
!meetingId
?
diff --git a/webapp/components/device.tsx b/webapp/components/device.tsx
index 6795ff4..ba1e936 100644
--- a/webapp/components/device.tsx
+++ b/webapp/components/device.tsx
@@ -1,4 +1,4 @@
-import useWhipClient from "./use/whip"
+import useWhipClient from './use/whip'
import { useEffect, useState } from 'react'
import {
Device,
@@ -12,17 +12,17 @@ import SvgVideo from './svg/video'
import { SvgPresentCancel, SvgPresentToAll } from './svg/present'
function toDevice(info: MediaDeviceInfo): Device {
- const deviceId = info.deviceId;
- let label = info.label;
+ const deviceId = info.deviceId
+ let label = info.label
if (label.length <= 0) {
- label = `${info.kind} (${deviceId.substring(0, 8)})`;
+ label = `${info.kind} (${deviceId.substring(0, 8)})`
}
- return { deviceId, label };
+ return { deviceId, label }
}
export default function DeviceBar(props: { streamId: string }) {
- const [permissionAudio, setPermissionAudio] = useState("")
- const [permissionVideo, setPermissionVideo] = useState("")
+ const [permissionAudio, setPermissionAudio] = useState('')
+ const [permissionVideo, setPermissionVideo] = useState('')
const [loadingAudio, setLoadingAudio] = useState(false)
const [loadingVideo, setLoadingVideo] = useState(false)
@@ -42,7 +42,7 @@ export default function DeviceBar(props: { streamId: string }) {
const [deviceVideo, setDeviceVideo] = useState
([deviceNone])
const permissionsQuery = async () =>
- (await Promise.all(["camera", "microphone"].map(
+ (await Promise.all(['camera', 'microphone'].map(
// NOTE:
// Firefox don't have `camera` and `microphone` in permissions
// https://developer.mozilla.org/en-US/docs/Web/API/Permissions/query#name
@@ -57,10 +57,10 @@ export default function DeviceBar(props: { streamId: string }) {
// NOTE:
// Chrome: audio_capture, video_capture
// Safari: microphone, camera
- if (status.name === "audio_capture" || status.name === "microphone") {
+ if (status.name === 'audio_capture' || status.name === 'microphone') {
setPermissionAudio(status.state)
}
- if (status.name === "video_capture" || status.name === "camera") {
+ if (status.name === 'video_capture' || status.name === 'camera') {
setPermissionVideo(status.state)
}
})
@@ -68,7 +68,7 @@ export default function DeviceBar(props: { streamId: string }) {
const updateDeviceList = async () => {
// to obtain non-empty device label, there needs to be an active media stream or persistent permission
// https://developer.mozilla.org/en-US/docs/Web/API/MediaDeviceInfo/label#value
- await navigator.mediaDevices.getUserMedia({ audio: true, video: true });
+ await navigator.mediaDevices.getUserMedia({ audio: true, video: true })
const devices = (await navigator.mediaDevices.enumerateDevices()).filter(i => !!i.deviceId)
@@ -76,12 +76,12 @@ export default function DeviceBar(props: { streamId: string }) {
const videos = devices.filter(i => i.kind === 'videoinput').map(toDevice)
if (currentDeviceAudio === deviceNone.deviceId) {
- let device = audios[0]
+ const device = audios[0]
if (device) await setCurrentDeviceAudio(device.deviceId)
}
if (currentDeviceVideo === deviceNone.deviceId) {
- let device = videos[0]
+ const device = videos[0]
if (device) await setCurrentDeviceVideo(device.deviceId)
}
@@ -97,7 +97,7 @@ export default function DeviceBar(props: { streamId: string }) {
// - Android Web Browser
// - Wechat WebView
await permissionsQuery()
- } catch { }
+ } catch { /* empty */ }
await updateDeviceList()
}
@@ -107,8 +107,8 @@ export default function DeviceBar(props: { streamId: string }) {
useEffect(() => {
// Reference: https://developer.mozilla.org/en-US/docs/Web/API/MediaDevices/devicechange_event
- navigator.mediaDevices.addEventListener("devicechange", updateDeviceList)
- return () => { navigator.mediaDevices.removeEventListener("devicechange", updateDeviceList) }
+ navigator.mediaDevices.addEventListener('devicechange', updateDeviceList)
+ return () => { navigator.mediaDevices.removeEventListener('devicechange', updateDeviceList) }
}, [])
const onChangedDeviceAudio = async (current: string) => {
@@ -130,24 +130,24 @@ export default function DeviceBar(props: { streamId: string }) {
}
return (
-
-
-
- 
+ 