diff --git a/web/static/js/BareRTC.js b/web/static/js/BareRTC.js index 3b59786..a5519be 100644 --- a/web/static/js/BareRTC.js +++ b/web/static/js/BareRTC.js @@ -150,6 +150,7 @@ const app = Vue.createApp({ ], // Available cameras and microphones for the Settings modal. + gettingDevices: false, // busy indicator for refreshing devices videoDevices: [], videoDeviceID: null, audioDevices: [], @@ -1488,6 +1489,9 @@ const app = Vue.createApp({ return; } + if (this.webcam.gettingDevices) return; + this.webcam.gettingDevices = true; + navigator.mediaDevices.enumerateDevices().then(devices => { this.webcam.videoDevices = []; this.webcam.audioDevices = []; @@ -1508,6 +1512,11 @@ const app = Vue.createApp({ }) }).catch(err => { this.ChatClient(`Error listing your cameras and microphones: ${err.name}: ${err.message}`); + }).finally(() => { + // In the settings modal, let the spinner spin for a moment. + setTimeout(() => { + this.webcam.gettingDevices = false; + }, 500); }) }, diff --git a/web/templates/chat.html b/web/templates/chat.html index 92dd754..f5a37be 100644 --- a/web/templates/chat.html +++ b/web/templates/chat.html @@ -296,6 +296,13 @@

Webcam Devices +