elias/vdo.ninja
1
0
Fork 0
mirror of https://github.com/eliasstepanik/vdo.ninja.git synced 2026-01-14 07:08:32 +00:00
Code Issues Packages Projects Releases Wiki Activity

Merge pull request #707 from filiptronicek/devices-refactor

Browse Source 
Devices refactor
This commit is contained in:
Joel Calado 2021-02-08 17:58:19 +00:00 committed by GitHub
commit e5a7b29a46
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 35 additions and 39 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

74
devices.html
View File

@ -47,45 +47,46 @@
</div>
<script>
var list = [];
var url = new URL(document.location.origin);
var audioInputDevices = [];
const list = [];
const url = new URL(document.location.origin);
const audioInputDevices = [];
function isAudioInput(value) {
return value.kind == "audioinput";
return value.kind === "audioinput";
}
function isAudioOutput(value) {
return value.kind == "audiooutput";
return value.kind === "audiooutput";
}
function isVideoInput(value) {
return value.kind == "videoinput";
return value.kind === "videoinput";
}
function addDevice(element) {
var info = element.getElementsByClassName("device-id")[0];
var type = info.dataset.deviceType;
const info = element.getElementsByClassName("device-id")[0];
const type = info.dataset.deviceType;
if (type == "audioinput") {
if (type === "audioinput") {
setAudioSearchParams(info);
}
if (type == "videoinput") {
if (type === "videoinput") {
setVideoSearchParams(info);
}
if (type == "audiooutput") {
if (type === "audiooutput") {
return;
}
/*
Allows for multiple audio devices to be selected
Will be output as a comma separated string to &ad
Allows for multiple audio devices to be selected
Will be output as a comma separated string to &ad
*/
function setAudioSearchParams(info) {
// Device was already selected
if (info.parentNode.className == "device selected") {
if (info.parentNode.className === "device selected") {
// Remove device from list of selected devices
var index = audioInputDevices.indexOf(info.innerText);
const index = audioInputDevices.indexOf(info.innerText);
if (index !== -1) {
audioInputDevices.splice(index, 1);
}
@ -95,7 +96,7 @@
element.className = "device";
// If no audio devices remained, just remove the param completely
if (audioInputDevices.length == 0) {
if (audioInputDevices.length === 0) {
url.searchParams.delete("ad");
}
} else {
@ -111,7 +112,7 @@
*/
function setVideoSearchParams(info) {
// Device was already selected
if (info.parentNode.className == "device selected") {
if (info.parentNode.className === "device selected") {
info.parentNode.className = "device";
// Set the url param to the devices that are left
@ -119,7 +120,7 @@
element.className = "device";
// If no devices remained, just remove the param completely
if (audioInputDevices.length == 0) {
if (audioInputDevices.length === 0) {
url.searchParams.delete("vd");
}
} else {
@ -139,40 +140,35 @@
}
function prettyPrint(json, element) {
var output = "<div class='prettyJson two-col'>";
var nestedObjs;
let output = "<div class='prettyJson two-col'>";
let nestedObjs;
Object.entries(json)
.sort()
.forEach(([key, value]) => {
output += "<div class='device' onclick='addDevice(this)'>";
output +=
"<span class='device-name'>" +
value.label +
"</span><span class='device-id' data-device-type='" +
value.kind +
"'>" +
value.deviceId +
"</span>";
output += "</div>";
output += `
<div class='device' onclick='addDevice(this)'>
<span class='device-name'>${value.label}</span>
<span class='device-id' data-device-type='${value.kind}'>
${value.deviceId}
</span>
</div>`;
});
output += "</div>";
document.getElementById(element).innerHTML = output;
}
document.getElementById("devicesUrl").onclick = function () {
this.select();
document.getElementById("devicesUrl").onclick = (e) => {
e.target.select();
document.execCommand("copy");
};
navigator.mediaDevices
.enumerateDevices()
.then(function (devices) {
devices.forEach(function (device) {
.then((devices) => {
devices.forEach((device) => {
console.log(
device.kind + ": " + device.label + " id = " + device.deviceId
`${device.kind}: ${device.label} id = ${device.deviceId}`
);
list.push(device);
});
@ -180,8 +176,8 @@
prettyPrint(devices.filter(isAudioOutput), "audioOutputs");
prettyPrint(devices.filter(isVideoInput), "videoInputs");
})
.catch(function (err) {
console.log(err.name + ": " + err.message);
.catch((err) => {
console.log(`${err.name}: ${err.message}`);
});
</script>
</body>