diff --git a/examples/lobbys/index.html b/examples/lobbys/index.html
index 80c5ae3..54e4d61 100644
--- a/examples/lobbys/index.html
+++ b/examples/lobbys/index.html
@@ -17,7 +17,9 @@
Select a lobby to join!
-
+
+
+
@@ -26,7 +28,7 @@
const roomContainer = document.getElementById('list')
const localVideoContainer = document.getElementById('localVideo')
const remoteVideoContainer = document.getElementById('remoteVideos')
-
+ const localVideoElement = document.getElementById("video-local");
// creates a DOM element to allow the user to see/join rooms
function createRoomElement (id) {
const element = document.createElement('div')
@@ -41,6 +43,7 @@
function createVideoElement(container, mediaStream, muted=false) {
const videoElement = document.createElement('video')
videoElement.autoplay = true
+ videoElement.playsInline = true
videoElement.srcObject = mediaStream
videoElement.muted = muted
container.appendChild(videoElement)
@@ -98,10 +101,10 @@
}
signalClient.addListener('discover', onRoomPeers)
}
-
- // request local webcam
- navigator.getUserMedia({ audio: true, video: true }, (localStream) => {
- const videoElement = createVideoElement(localVideoContainer, localStream, true) // display local video
+
+ function userMediaProcess(localStream, localVideoElement) {
+ localVideoElement.style.display = "block"
+ localVideoElement.srcObject = localStream;
signalClient.discover(null) // begin discovering rooms
signalClient.on('request', async (request) => {
@@ -118,6 +121,22 @@
roomElement.addEventListener('click', () => joinRoom(roomID, localStream)) // register a click handler to join room
})
})
- }, () => alert('No webcam access!'))
+ }
+
+ // request local webcam
+ try {
+ navigator.mediaDevices.getUserMedia({
+ video: true,
+ audio: false
+ }).then(localStream => {
+ userMediaProcess(localStream, localVideoElement);
+ }).catch(err => {
+ alert("No webcam access!");
+ });
+ }
+ catch (err) {
+ alert("No webcam access!");
+ }
+