elias/vdo.ninja
1
0
Fork 0
mirror of https://github.com/eliasstepanik/vdo.ninja.git synced 2026-01-11 13:48:38 +00:00
Code Issues Packages Projects Releases Wiki Activity

Select/Button for Audio/Video Settings

Browse Source
This commit is contained in:
lindenkron 2023-04-06 03:21:13 +02:00
parent 17709f53c0
commit 1ceae44e69
2 changed files with 56 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

16
lib.js
View File

@ -16236,8 +16236,8 @@ function createControlBox(UUID, soloLink, streamID) {
iframeDetails.id = "iframeDetails_" + UUID; // needed to delete on user disconnect
iframeDetails.className = "iframeDetails hidden";
controls.innerHTML += "<div id='advanced_audio_director_" + UUID + "' class='hidden advDirectGuestSettings'></div>";
controls.innerHTML += "<div id='advanced_video_director_" + UUID + "' class='hidden advDirectGuestSettings'></div>";
controls.innerHTML += "<div id='advanced_audio_director_" + UUID + "' class='hidden advancedAudioSettings'></div>";
controls.innerHTML += "<div id='advanced_video_director_" + UUID + "' class='hidden advancedVideoSettings'></div>";
var handsID = "hands_" + UUID;
@ -17971,7 +17971,7 @@ function gotDevicesRemote(deviceInfos, UUID) {
} else {
var videoSelect = document.createElement("select");
videoSelect.id = "remoteVideoSelect_"+UUID;
videoSelect.style = "max-width:170px;font-size: 70% !important; margin: 5px 5px 5px 0; padding:2px;";
videoSelect.style = "font-size: 70% !important;";
@ -18013,7 +18013,7 @@ function gotDevicesRemote(deviceInfos, UUID) {
} else {
var audioSelect = document.createElement("select");
audioSelect.id = "remoteAudioSelect_"+UUID;
audioSelect.style = "max-width:170px;font-size: 70% !important; margin: 5px 5px 5px 0; padding:2px;";
audioSelect.style = "font-size: 70% !important;";
audioSelect.onchange = function(){
@ -18029,7 +18029,7 @@ function gotDevicesRemote(deviceInfos, UUID) {
var buttonGO = document.createElement("button");
buttonGO.innerHTML = '<i class="las la-microphone-alt"></i> refresh';
buttonGO.style = "padding: 5px;";
// buttonGO.style = "padding: 5px;";
buttonGO.title = "This will refresh the current device";
buttonGO.id = "requestAudioDevice_"+UUID;
@ -18055,7 +18055,7 @@ function gotDevicesRemote(deviceInfos, UUID) {
} else {
var audioOutputSelect = document.createElement("select");
audioOutputSelect.id = "remoteAudioOutputSelect_"+UUID;
audioOutputSelect.style = "max-width:170px;font-size: 70% !important; margin: 5px 5px 5px 0; padding:2px;";
audioOutputSelect.style = "font-size: 70% !important;";
audioOutputSelect.onchange = function(){
if (session.rpcs[UUID].stats.info && session.rpcs[UUID].stats.info.consent){
@ -34930,8 +34930,8 @@ function createControlBoxScreenshare(UUID, soloLink, streamID) {
iframeDetails.id = "iframeDetails_" + UUID; // needed to delete on user disconnect
iframeDetails.className = "iframeDetails hidden";
controls.innerHTML += "<div id='advanced_audio_director_" + UUID + "' class='hidden advDirectGuestSettings'></div>";
controls.innerHTML += "<div id='advanced_video_director_" + UUID + "' class='hidden advDirectGuestSettings'></div>";
controls.innerHTML += "<div id='advanced_audio_director_" + UUID + "' class='hidden advancedAudioSettings'></div>";
controls.innerHTML += "<div id='advanced_video_director_" + UUID + "' class='hidden advancedVideoSettings'></div>";
var handsID = "hands_" + UUID;

51
main.css
View File

@ -587,15 +587,60 @@ body.darktheme .credits>a:visited {
background-color: black;
}
.advDirectGuestSettings {
padding: 10px 5px;
.advancedAudioSettings, .advancedVideoSettings {
display: flex;
flex-direction: column;
padding: 5px;
max-height: 400px;
overflow-y: auto;
border-radius: 0px 0px 4px 4px;
background-color: #222;
width: 100%;
}
.advancedAudioSettings div {
display: flex;
overflow: hidden;
align-items: center;
gap: 4px;
padding: 4px;
}
.advancedAudioSettings div button {
padding: 4px;
height: 24px;
margin: unset;
flex: 1;
}
.darktheme .advDirectGuestSettings label {
.advancedAudioSettings div select {
width: 100%;
border-radius: 4px;
flex: 2;
height: 24px;
}
.advancedVideoSettings div:nth-child(2) {
display: flex;
width: 100%;
padding: 4px;
align-items: center;
gap: 4px;
}
.advancedVideoSettings div:nth-child(2) select {
width: 100%;
flex: 2;
height: 24px;
border-radius: 4px;
}
.advancedVideoSettings div:nth-child(2) button {
width: 100%;
flex: 1;
height: 24px;
margin: unset;
}
.darktheme .advancedAudioSettings label, .darktheme .advancedVideoSettings label {
color: #FFF;
}