v20.1 ; bug fixes, couple minor features

fixes for how audio only and meshcast is displayed and a bit more
This commit is contained in:
Steve Seguin 2021-12-28 15:17:26 -05:00 committed by GitHub
parent d940550b34
commit be0a0ab889
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
5 changed files with 102 additions and 41 deletions

View File

@ -67,7 +67,7 @@
<link itemprop="url" href="./media/vdoNinja_logo_full.png" />
</span>
<script type="text/javascript" crossorigin="anonymous" src="./thirdparty/CodecsHandler.js?ver=35"></script>
<script type="text/javascript" crossorigin="anonymous" src="./webrtc.js?ver=338"></script>
<script type="text/javascript" crossorigin="anonymous" src="./webrtc.js?ver=339"></script>
<input id="zoomSlider" type="range" style="display: none;" />
<div id="header">
@ -783,7 +783,7 @@
<font style="color:#daad09;">Welcome to VDO Ninja! We've rebranded! Nothing else is changing and we're staying 100% free.</font>
</h4>
<br />
🎁 Welcome to v20, updated December 24th. 🎄 <a target="_blank" href="https://docs.vdo.ninja/release-notes/v20">Release notes are here</a>. The previous version is <a href="https://vdo.ninja/v19/">available here</a> if you have new issues.
🎁 Welcome to v20, released December 24th. 🎄 <a target="_blank" href="https://docs.vdo.ninja/release-notes/v20">Release notes are here</a>. The previous version is <a href="https://vdo.ninja/v19/">available here</a> if you have new issues.
<br />
<br />
@ -1840,7 +1840,7 @@
var session = WebRTC.Media; // session is a required global variable if configuring manually. Run before loading main.js but after webrtc.js.
session.version = "20.0";
session.version = "20.1";
session.streamID = session.generateStreamID(); // randomly generates a streamID for this session. You can set your own programmatically if needed
session.defaultPassword = "someEncryptionKey123"; // Change this password if self-deploying for added security/privacy
@ -1905,11 +1905,11 @@
// session.introOnClean = true; // this will load the page with the webcam selection screen if &push or &room is in the URL; no need to use &webcam.
</script>
<script type="text/javascript" crossorigin="anonymous" src="./thirdparty/aes.js"></script>
<script type="text/javascript" crossorigin="anonymous" id="lib-js" src="./lib.js?ver=246"></script>
<script type="text/javascript" crossorigin="anonymous" id="lib-js" src="./lib.js?ver=247"></script>
<!--
// If you wish to change branding, blank offers a good clean start.
<script type="text/javascript" id="main-js" src="./main.js" data-translation="blank"></script>
-->
<script type="text/javascript" crossorigin="anonymous" id="main-js" src="./main.js?ver=287"></script>
<script type="text/javascript" crossorigin="anonymous" id="main-js" src="./main.js?ver=288"></script>
</body>
</html>

62
lib.js
View File

@ -692,8 +692,8 @@ var sanitizeStreamID = function(streamID) {
warnUser(miscTranslations["alphanumeric-only"]);
}
}
if (streamID_sanitized.length > 44) {
streamID_sanitized = streamID_sanitized.substring(0, 44);
if (streamID_sanitized.length >= 49) {
streamID_sanitized = streamID_sanitized.substring(0, 50);
if (!(session.cleanOutput)) {
warnUser(miscTranslations["stream-id-too-long"]);
}
@ -7055,40 +7055,48 @@ function loadDirectorSettings(){
if (settings.customizeLinks1){
var customizeLinks1 = getById("customizeLinks1");
Object.keys(settings.customizeLinks1).forEach((key, index) => {
if (customizeLinks1.querySelector('[data-param="'+key+'"]').checked != settings.customizeLinks1[key]){
customizeLinks1.querySelector('[data-param="'+key+'"]').checked = settings.customizeLinks1[key];
customizeLinks1.querySelector('[data-param="'+key+'"]').onchange();
}
try {
if (customizeLinks1.querySelector('[data-param="'+key+'"]').checked != settings.customizeLinks1[key]){
customizeLinks1.querySelector('[data-param="'+key+'"]').checked = settings.customizeLinks1[key];
customizeLinks1.querySelector('[data-param="'+key+'"]').onchange();
}
} catch(e){errorlog(e);}
});
}
if (settings.customizeLinks3){
var customizeLinks3 = getById("customizeLinks3");
Object.keys(settings.customizeLinks3).forEach((key, index) => {
if (customizeLinks3.querySelector('[data-param="'+key+'"]').checked == settings.customizeLinks3[key]){
customizeLinks3.querySelector('[data-param="'+key+'"]').checked = settings.customizeLinks3[key];
customizeLinks3.querySelector('[data-param="'+key+'"]').onchange();
}
try {
if (customizeLinks3.querySelector('[data-param="'+key+'"]').checked == settings.customizeLinks3[key]){
customizeLinks3.querySelector('[data-param="'+key+'"]').checked = settings.customizeLinks3[key];
customizeLinks3.querySelector('[data-param="'+key+'"]').onchange();
}
} catch(e){errorlog(e);}
});
}
if (settings.directorLinks1){
var directorLinks1 = getById("directorLinks1");
Object.keys(settings.directorLinks1).forEach((key, index) => {
if (directorLinks1.querySelector('[data-param="'+key+'"]').checked == settings.directorLinks1[key]){
directorLinks1.querySelector('[data-param="'+key+'"]').checked = settings.directorLinks1[key];
directorLinks1.querySelector('[data-param="'+key+'"]').onchange();
}
try {
if (directorLinks1.querySelector('[data-param="'+key+'"]').checked == settings.directorLinks1[key]){
directorLinks1.querySelector('[data-param="'+key+'"]').checked = settings.directorLinks1[key];
directorLinks1.querySelector('[data-param="'+key+'"]').onchange();
}
} catch(e){errorlog(e);}
});
}
if (settings.directorLinks2){
var directorLinks2 = getById("directorLinks2");
Object.keys(settings.directorLinks2).forEach((key, index) => {
if (directorLinks2.querySelector('[data-param="'+key+'"]').checked == settings.directorLinks2[key]){
directorLinks2.querySelector('[data-param="'+key+'"]').checked = settings.directorLinks2[key];
directorLinks2.querySelector('[data-param="'+key+'"]').onchange();
}
try {
if (directorLinks2.querySelector('[data-param="'+key+'"]').checked == settings.directorLinks2[key]){
directorLinks2.querySelector('[data-param="'+key+'"]').checked = settings.directorLinks2[key];
directorLinks2.querySelector('[data-param="'+key+'"]').onchange();
}
} catch(e){errorlog(e);}
});
}
}
@ -8283,7 +8291,7 @@ function activeSpeaker(border=false) {
} else if (lastActiveSpeaker){
session.rpcs[lastActiveSpeaker].defaultSpeaker=true;
changed=true;
} else if (session.scene===false || (session.nopreview===false & session.minipreview!==1)){
} else if (session.scene===false || (session.nopreview===false && session.minipreview!==1)){
// we don't need to care.
} else {
for (var UUID in session.rpcs) {
@ -8339,7 +8347,7 @@ function activeSpeaker(border=false) {
} else if (lastActiveSpeaker){
session.rpcs[lastActiveSpeaker].defaultSpeaker=true;
changed=true;
} else if (session.scene===false || (session.nopreview===false & session.minipreview!==1)){
} else if (session.scene===false || (session.nopreview===false && session.minipreview!==1)){
// we don't need to care.
} else {
for (var UUID in session.rpcs) {
@ -15643,6 +15651,7 @@ function updateDirectorsAudio(dataN, UUID) {
}
if ((i === "height") || (i === "width")){
input.title = "Hold CTRL (or cmd) to lock width and height together when changing them";
input.min = 16;
}
if ("step" in data.audioConstraints[i]) {
@ -15861,6 +15870,7 @@ function updateDirectorsVideo(data, UUID) {
if ((i === "height") || (i === "width")){
input.title = "Hold CTRL (or cmd) to lock width and height together when changing them";
input.min = 16;
}
@ -16264,6 +16274,7 @@ function listAudioSettings() {
if ((i === "height") || (i === "width")){
input.title = "Hold CTRL (or cmd) to lock width and height together when changing them";
input.min = 16;
}
if ("step" in session.audioConstraints[i]) {
@ -16711,6 +16722,7 @@ function listCameraSettings() {
}
if ((i === "height") || (i === "width")){
input.title = "Hold CTRL (or cmd) to lock width and height together when changing them";
input.min = 16;
}
if ("step" in session.cameraConstraints[i]) {
input.step = session.cameraConstraints[i].step;
@ -20110,6 +20122,16 @@ function applyStyleEffect(UUID){
session.rpcs[UUID].canvasCtx.textAlign = "center";
session.rpcs[UUID].canvasCtx.font = parseInt(session.rpcs[UUID].canvas.height/2.11)+"px Arial";
session.rpcs[UUID].canvasCtx.fillText(session.rpcs[UUID].label[0].toUpperCase(), parseInt(session.rpcs[UUID].canvas.width/2), parseInt(session.rpcs[UUID].canvas.height*2/3));
} else {
var tmp = getComputedStyle(document.querySelector(':root')).getPropertyValue('--video-background-image').split('"');
if (tmp.length===3){
var img = new Image();
img.onload = function() {
session.rpcs[UUID].canvasCtx.fillStyle = "rgb(25,0,0)";
session.rpcs[UUID].canvasCtx.drawImage(img, parseInt(session.rpcs[UUID].canvas.width/2-110), parseInt(session.rpcs[UUID].canvas.height/2-110),220,220);
}
img.src = tmp[1];
}
}
}

View File

@ -17,6 +17,8 @@
--myvideo-max-width: min(800px,100vw);
--myvideo-width:unset;
--myvideo-height:auto;
--myvideo-background: #FFF1;
--video-background-image: url("data:image/svg+xml,%3Csvg viewBox='-42 0 512 512.002' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='m210.351562 246.632812c33.882813 0 63.222657-12.152343 87.195313-36.128906 23.972656-23.972656 36.125-53.304687 36.125-87.191406 0-33.875-12.152344-63.210938-36.128906-87.191406-23.976563-23.96875-53.3125-36.121094-87.191407-36.121094-33.886718 0-63.21875 12.152344-87.191406 36.125s-36.128906 53.308594-36.128906 87.1875c0 33.886719 12.15625 63.222656 36.132812 87.195312 23.976563 23.96875 53.3125 36.125 87.1875 36.125zm0 0'/%3E%3Cpath d='m426.128906 393.703125c-.691406-9.976563-2.089844-20.859375-4.148437-32.351563-2.078125-11.578124-4.753907-22.523437-7.957031-32.527343-3.308594-10.339844-7.808594-20.550781-13.371094-30.335938-5.773438-10.15625-12.554688-19-20.164063-26.277343-7.957031-7.613282-17.699219-13.734376-28.964843-18.199219-11.226563-4.441407-23.667969-6.691407-36.976563-6.691407-5.226563 0-10.28125 2.144532-20.042969 8.5-6.007812 3.917969-13.035156 8.449219-20.878906 13.460938-6.707031 4.273438-15.792969 8.277344-27.015625 11.902344-10.949219 3.542968-22.066406 5.339844-33.039063 5.339844-10.972656 0-22.085937-1.796876-33.046874-5.339844-11.210938-3.621094-20.296876-7.625-26.996094-11.898438-7.769532-4.964844-14.800782-9.496094-20.898438-13.46875-9.75-6.355468-14.808594-8.5-20.035156-8.5-13.3125 0-25.75 2.253906-36.972656 6.699219-11.257813 4.457031-21.003906 10.578125-28.96875 18.199219-7.605469 7.28125-14.390625 16.121094-20.15625 26.273437-5.558594 9.785157-10.058594 19.992188-13.371094 30.339844-3.199219 10.003906-5.875 20.945313-7.953125 32.523437-2.058594 11.476563-3.457031 22.363282-4.148437 32.363282-.679688 9.796875-1.023438 19.964844-1.023438 30.234375 0 26.726562 8.496094 48.363281 25.25 64.320312 16.546875 15.746094 38.441406 23.734375 65.066406 23.734375h246.53125c26.625 0 48.511719-7.984375 65.0625-23.734375 16.757813-15.945312 25.253906-37.585937 25.253906-64.324219-.003906-10.316406-.351562-20.492187-1.035156-30.242187zm0 0'/%3E%3C/svg%3E");
}
* {
@ -460,7 +462,6 @@ hr {
.tile {
object-fit: var(--fit-style);
background-color: black;
width: 100%;
height: 100%;
border: 0;
@ -1737,7 +1738,7 @@ img {
margin: auto auto !important;
position: relative !important;
top: 50% !important;
background-color: #FFF1 !important;
background-color: var(--myvideo-background);
object-fit: var(--fit-style);
max-width: var(--myvideo-max-width) !important;
}
@ -1995,7 +1996,7 @@ video {
-moz-transition: opacity .25s ease-in-out;
-webkit-transition: opacity .25s ease-in-out;
pointer-events: auto;
background-color: transparent !important;
background-color: transparent;
border: 0;
margin: 0;
user-select:none;
@ -2007,7 +2008,7 @@ video {
background-size: auto 50px;
background-repeat: no-repeat;
background-position: center;
background-image: url("data:image/svg+xml,%3Csvg viewBox='-42 0 512 512.002' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='m210.351562 246.632812c33.882813 0 63.222657-12.152343 87.195313-36.128906 23.972656-23.972656 36.125-53.304687 36.125-87.191406 0-33.875-12.152344-63.210938-36.128906-87.191406-23.976563-23.96875-53.3125-36.121094-87.191407-36.121094-33.886718 0-63.21875 12.152344-87.191406 36.125s-36.128906 53.308594-36.128906 87.1875c0 33.886719 12.15625 63.222656 36.132812 87.195312 23.976563 23.96875 53.3125 36.125 87.1875 36.125zm0 0'/%3E%3Cpath d='m426.128906 393.703125c-.691406-9.976563-2.089844-20.859375-4.148437-32.351563-2.078125-11.578124-4.753907-22.523437-7.957031-32.527343-3.308594-10.339844-7.808594-20.550781-13.371094-30.335938-5.773438-10.15625-12.554688-19-20.164063-26.277343-7.957031-7.613282-17.699219-13.734376-28.964843-18.199219-11.226563-4.441407-23.667969-6.691407-36.976563-6.691407-5.226563 0-10.28125 2.144532-20.042969 8.5-6.007812 3.917969-13.035156 8.449219-20.878906 13.460938-6.707031 4.273438-15.792969 8.277344-27.015625 11.902344-10.949219 3.542968-22.066406 5.339844-33.039063 5.339844-10.972656 0-22.085937-1.796876-33.046874-5.339844-11.210938-3.621094-20.296876-7.625-26.996094-11.898438-7.769532-4.964844-14.800782-9.496094-20.898438-13.46875-9.75-6.355468-14.808594-8.5-20.035156-8.5-13.3125 0-25.75 2.253906-36.972656 6.699219-11.257813 4.457031-21.003906 10.578125-28.96875 18.199219-7.605469 7.28125-14.390625 16.121094-20.15625 26.273437-5.558594 9.785157-10.058594 19.992188-13.371094 30.339844-3.199219 10.003906-5.875 20.945313-7.953125 32.523437-2.058594 11.476563-3.457031 22.363282-4.148437 32.363282-.679688 9.796875-1.023438 19.964844-1.023438 30.234375 0 26.726562 8.496094 48.363281 25.25 64.320312 16.546875 15.746094 38.441406 23.734375 65.066406 23.734375h246.53125c26.625 0 48.511719-7.984375 65.0625-23.734375 16.757813-15.945312 25.253906-37.585937 25.253906-64.324219-.003906-10.316406-.351562-20.492187-1.035156-30.242187zm0 0'/%3E%3C/svg%3E");
background-image: var(--video-background-image);
}
.nogb { background-image: unset !important }

60
main.js
View File

@ -90,6 +90,14 @@ async function main(){ // main asyncronous thread; mostly initializes the user s
//// translation stuff ends ////
if (urlParams.has('cleanoutput') || urlParams.has('clean') || urlParams.has('cleanish')) {
session.cleanOutput = true;
}
if (urlParams.has('cleanviewer') || urlParams.has('cv')) {
session.cleanViewer = true;
}
if (!isIFrame){
if (getStorage("redirect") == "yes") {
@ -107,6 +115,10 @@ async function main(){ // main asyncronous thread; mostly initializes the user s
setStorage("redirect", "yes", 1);
window.location.replace(cookieSettings);
}
} else {
var cookieSettings = decodeURI(getStorage("settings"));
setStorage("redirect", "yes", 1);
window.location.replace(cookieSettings);
}
}
@ -138,13 +150,7 @@ async function main(){ // main asyncronous thread; mostly initializes the user s
} catch(e){}
}
if (urlParams.has('cleanoutput') || urlParams.has('clean') || urlParams.has('cleanish')) {
session.cleanOutput = true;
}
if (urlParams.has('cleanviewer') || urlParams.has('cv')) {
session.cleanViewer = true;
}
if (urlParams.has('retrytimeout')) {
session.retryTimeout = parseInt(urlParams.get('retrytimeout'));
@ -686,6 +692,7 @@ async function main(){ // main asyncronous thread; mostly initializes the user s
session.disableWebAudio = true;
session.audioEffects = false;
session.audioMeterGuest = false;
session.style = 1;
}
if (urlParams.has('autoadd')) { // the streams we want to view; if set, but let blank, we will request no streams to watch.
@ -837,12 +844,13 @@ async function main(){ // main asyncronous thread; mostly initializes the user s
if (urlParams.has('showlabels') || urlParams.has('showlabel') || urlParams.has('sl')) {
session.showlabels = urlParams.get('showlabels') || urlParams.get('showlabel') || urlParams.get('sl') || "";
session.showlabels = sanitizeLabel(session.showlabels.replace(/[\W]+/g, "_").replace(/_+/g, '_'));
//session.style = 6;
session.showlabels = true;
if (session.showlabels == "") {
session.showlabels = true;
session.labelstyle = false;
} else {
session.labelstyle = session.showlabels;
session.showlabels = true;
}
}
@ -1450,6 +1458,13 @@ async function main(){ // main asyncronous thread; mostly initializes the user s
}
if (urlParams.has('retry')) {
session.forceRetry = parseInt(urlParams.get('retry')) || 30;
}
if (session.forceRetry){
setTimeout(function(){session.retryWatchInterval();},30000);
}
var darkmode=false;
try {
if (urlParams.has("darkmode") || urlParams.has("nightmode")){
@ -1593,6 +1608,9 @@ async function main(){ // main asyncronous thread; mostly initializes the user s
if (urlParams.has('autojoin') || urlParams.has('autostart') || urlParams.has('aj') || urlParams.has('as')) {
session.autostart = true;
}
if (session.autostart){
if (session.screenshare!==false) {
delayedStartupFuncs.push([publishScreen]);
}
@ -1891,6 +1909,11 @@ async function main(){ // main asyncronous thread; mostly initializes the user s
session.meshcastBitrate = parseInt(session.meshcastBitrate);
}
if (urlParams.has('mcab') || urlParams.has('mcaudiobitrate') || urlParams.has('meshcastab')){
session.meshcastAudioBitrate = urlParams.get('mcab') || urlParams.get('mcaudiobitrate') || urlParams.get('meshcastab') || 32;
session.meshcastAudioBitrate = parseInt(session.meshcastAudioBitrate);
}
if (urlParams.has('mccodec') || urlParams.has('meshcastcodec')){
session.meshcastCodec = urlParams.get('mccodec') || urlParams.get('meshcastcodec') || false;
}
@ -1960,6 +1983,17 @@ async function main(){ // main asyncronous thread; mostly initializes the user s
if (urlParams.has('stats')) {
session.statsMenu = true;
}
if (urlParams.has('datamode')) {
session.cleanOutput=true;
session.videoDevice = 0;
session.audioDevice = 0;
session.autostart = true;
session.novideo = [];
session.noaudio = [];
session.noiframe = [];
session.webcamonly = true;
}
if (urlParams.has('cleandirector') || urlParams.has('cdv')) {
session.cleanDirector = true;
@ -1976,6 +2010,7 @@ async function main(){ // main asyncronous thread; mostly initializes the user s
getById("reportbutton").style.opacity = 0;
getById("calendarButton").style.display = "none";
getById("calendarButton").style.opacity = 0;
document.documentElement.style.setProperty('--myvideo-background', '#0000');
var styleTmp = document.createElement('style');
styleTmp.innerHTML = `
video {
@ -2206,7 +2241,7 @@ async function main(){ // main asyncronous thread; mostly initializes the user s
if (urlParams.has('activespeaker') || urlParams.has('speakerview') || urlParams.has('sas')){
session.activeSpeaker = urlParams.get('activespeaker') || urlParams.get('speakerview') || urlParams.get('sas') || 1;
session.activeSpeaker = parseInt(session.activeSpeaker);
session.style=6;
session.audioEffects = true;
session.audioMeterGuest = true;
session.minipreview = 2;
@ -2262,7 +2297,7 @@ async function main(){ // main asyncronous thread; mostly initializes the user s
if (urlParams.has('meter') || urlParams.has('meterstyle')){ // same as also adding &style=3
session.meterStyle = urlParams.get('meter') || urlParams.get('meterstyle') || 1;
session.meterStyle = parseInt(session.meterStyle);
session.style = 3;
session.style=3;
session.audioEffects = true;
}
@ -2659,7 +2694,7 @@ async function main(){ // main asyncronous thread; mostly initializes the user s
session.screenshareid = urlParams.get('screenshareid') || urlParams.get('ssid');
session.screenshareid = sanitizeStreamID(session.screenshareid);
} else {
session.screenshareid = session.streamID + "_screenshare";
session.screenshareid = session.streamID + "_ss";
}
}
@ -2827,6 +2862,9 @@ async function main(){ // main asyncronous thread; mostly initializes the user s
//if (!session.activeSpeaker){
session.audioMeterGuest = false;
//}
if (session.style===false){
session.style = 1;
}
if (session.audioEffects === null) {
session.audioEffects = false;
}

File diff suppressed because one or more lines are too long