-
Notifications
You must be signed in to change notification settings - Fork 0
/
app.js
69 lines (62 loc) · 2.06 KB
/
app.js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
var video = document.querySelector("#videoElement");
var selector = document.querySelector("#selector");
var selection = document.querySelector("#selection");
var videoSourcesSelect = document.getElementById("video-source");
var audioSourcesSelect = document.getElementById("audio-source");
videoSourcesSelect.appendChild(new Option());
audioSourcesSelect.appendChild(new Option());
if (navigator.mediaDevices.getUserMedia) {
navigator.mediaDevices
.enumerateDevices()
.then((devices) => {
devices.forEach((device) => {
console.log(device);
let option = new Option();
option.value = device.deviceId;
switch (device.kind) {
// Append device to list of Cameras
case "videoinput":
option.text = device.label || `Camera ${videoSourcesSelect.length}`;
videoSourcesSelect.appendChild(option);
break;
// Append device to list of Microphone
case "audioinput":
option.text =
device.label || `Microphone ${videoSourcesSelect.length}`;
audioSourcesSelect.appendChild(option);
break;
default:
break;
}
});
})
.catch(function (e) {
console.log(e.name + ": " + e.message);
});
}
selection.onclick = function () {
selector.style.visibility = "hidden";
selector.style.display = "none";
video.style.visibility = "visible";
const audioSource = audioSourcesSelect.value;
const videoSource = videoSourcesSelect.value;
const constraints = {
audio: {
deviceId: audioSource ? { exact: audioSource } : undefined,
echoCancellation: true
},
video: {
deviceId: videoSource ? { exact: videoSource } : undefined,
width: { min: 1920 },
height: { min: 1080 }
}
};
navigator.mediaDevices
.getUserMedia(constraints)
.then(function (stream) {
video.srcObject = stream;
})
.catch(function (error) {
console.log("Something went wrong!");
});
};