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

final tweaks to v19.4 before v20 launches

Browse Source
This commit is contained in:
Steve Seguin 2021-12-21 10:29:29 -05:00 committed by GitHub
parent 552a3f4c09
commit 154a07aca7
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
6 changed files with 63 additions and 94 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
iframe.html
View File

@ -250,7 +250,7 @@
var button = document.createElement("button");
button.innerHTML = "Add Target Video";
button.onclick = function(){iframe.contentWindow.postMessage({"target":"*", "add":true, "settings":{"style":{"width":"640px", "height":"360px", "float":"left", "border":"10px solid red", "display":"block"}}}, '*');}; // target can be a stream ID or * for all.
button.onclick = function(){iframe.contentWindow.postMessage({"target":"*", "add":true, "settings": {"style": "width:640px;height:360px;float:left;border:10px solid red;display:block;"}}, '*');}; // target can be a stream ID or * for all.
iframeContainer.appendChild(button);
var button = document.createElement("button");

48
index.html
View File

@ -740,18 +740,15 @@
Some devices that use H264 hardware encoding can experience video glitching; switching to VP8 or VP9 as a codec can help.
</li>
<li>
Video glitching and random audio-loss can occur when using the OBS browser source. The <a href='https://github.com/steveseguin/electroncapture/blob/master/README.md' target="_blank">Electron Capture app</a> avoids these issues.
Video glitching and random audio-loss can occur when using the OBS browser source. The <a href='https://github.com/steveseguin/electroncapture/blob/master/README.md'>Electron Capture app</a> avoids these issues.
</li>
<li>
Chrome v95 with an AMD GPUs have an issue hardware encoding H264 video; this will be fixed in Chrome v96. <a href='https://bugs.chromium.org/p/chromium/issues/detail?id=1252710' target="_blank">Details here</a>.
</li>
<br />
<h4 style="color:#daad09;">
<font style="color:#daad09;">
👋 👀 Welcome to VDO Ninja! We've rebranded! 📼 Nothing else is changing and we're staying 100% free.
</h4>
</font>
<br />
🎁 Site updated October 19th (v19.4). The <a href="https://docs.vdo.ninja/release-notes/v19">v19 release notes are here</a>. If new issues occur, the older v18 can be <a href="https://vdo.ninja/v183/">found here</a>.
<br />
🎁 Last update was on October 14th (v19.4). The next version, v20, is now available for testing; <a href="https://vdo.ninja/beta/">available here</a>.
<br />
<br />
@ -1801,18 +1798,25 @@
// session.configuration.iceTransportPolicy = "relay"; // uncomment to enable "&privacy" and force the TURN server
// session.wss = "wss://api.vdo.ninja:443"; // US-East (Default)
///// Different officially hosted handshake endpoints are available; each isolated from each other.
// session.wss = "wss://wss13.obs.ninja:443"; // US-East (Default)
// session.wss = "wss://apibackup.obs.ninja:443"; // US-West
// session.wss = "wss://jp1wss.obs.ninja:443"; // Japan
// session.wss = "wss://au1wss.obs.ninja:443"; // Australia
// session.wss = "wss://de1wss.obs.ninja:443"; // Germany
// session.wss = "wss://insecure.cam:444"; // China
//////
/// If wanting to fully-self-host, uncomment the following and deploy your own websocket server; good for air-gapped deployments
// session.wss = "wss://wss.yourdomainhere.com:443"; // https://github.com/steveseguin/websocket_server
// session.customWSS = true;
//////
/////// Or you can use piesocket.com if you wish to have a basic free websocket server hosted for you by a third-party
//session.customWSS = true; // Set to true to have Piesocket.com
//var apiKey = "ZCu96UFf9ezeQeClK7BOCkq6Q0x0lxWAPJcgxjz5"; // GET YOUR OWN API KEY at piesocket.com
//session.wss = "wss://us-nyc-1.websocket.me/v3/1?api_key="+apiKey;
////////////
/// If wanting to fully-self-host, uncomment the following and deploy your own websocket server; good for air-gapped deployments
// session.wss = "wss://wss.contribute.cam:443"; // https://github.com/steveseguin/websocket_server
// session.customWSS = true;
//////
/////// Or you can use piesocket.com if you wish to have a basic free websocket server hosted for you by a third-party
//session.customWSS = true; // Set to true to have Piesocket.com
//var apiKey = "ZCu96UFf9ezeQeClK7BOCkq6Q0x0lxWAPJcgxjz5"; // GET YOUR OWN API KEY at piesocket.com, as using this one is a privacy hazard.
//session.wss = "wss://us-nyc-1.websocket.me/v3/1?api_key="+apiKey;
////////////
///// The following lets you set the defaults
@ -1835,7 +1839,7 @@
// session.width // int
// session.quality // int -- if setting == 0, then than the default resolution will be 1080p, instead of 720p
// session.sink
// session.offsetChannel //2 int
// session.offsetChannel /2 int
// session.audioChannels // int
// session.security
// session.framerate // int
@ -1846,11 +1850,11 @@
// session.title // "zzzz"
</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=204"></script>
<script type="text/javascript" crossorigin="anonymous" id="lib-js" src="./lib.js?ver=202"></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=277"></script>
<script type="text/javascript" crossorigin="anonymous" id="main-js" src="./main.js?ver=276"></script>
</body>
</html>

66
lib.js
View File

@ -1707,16 +1707,16 @@ function updateMixerRun(e=false){ // this is the main auto-mixing code. It's a
session.rpcs[j].videoElement.order=0;
}
///////////
if (session.activeSpeaker && (!session.rpcs[j].defaultSpeaker)){ // not the active speaker
//if (session.activeSpeaker && (!session.rpcs[j].defaultSpeaker)){ // not the active speaker
//mediaPool_invisible.push(session.rpcs[j].videoElement);
session.requestRateLimit(0, j); // keep audio good, but disable video
} else {
// session.requestRateLimit(0, j); // keep audio good, but disable video
//} else {
mediaPool.push(session.rpcs[j].videoElement); // active speaker
session.rpcs[j].videoElement.style.visibility = "visible";
if ((session.rpcs[j].targetBandwidth!==-1) && (session.rpcs[j].targetBandwidth<session.zoomedBitrate)){
session.requestRateLimit(session.zoomedBitrate, j); // 1.2mbps is decent, no? in-focus, so higher bitrate
}
}
//}
}
} catch(e){errorlog(e);}
}
@ -5283,36 +5283,23 @@ function directMigrate(ele, event, room=false) { // everyone in the room will ha
if (migrateRoom) {
previousRoom = migrateRoom;
var msg = {};
msg.request = "migrate";
if (session.password) {
return generateHash(migrateRoom + session.password + session.salt, 16).then(function(rid) {
var msg = {};
if (session.director && session.directorUUID && (session.directorUUID !==true)){
msg.migrate = ele.dataset.UUID;
msg.roomid = rid;
session.sendRequest(msg, session.directorUUID);
log(msg);
} else {
msg.request = "migrate";
msg.roomid = rid;
msg.target = ele.dataset.UUID;
session.sendMsg(msg); // send to everyone in the room, so they know if they are on air or not.
}
msg.request = "migrate";
msg.roomid = rid;
msg.target = ele.dataset.UUID;
session.sendMsg(msg); // send to everyone in the room, so they know if they are on air or not.
}).catch(errorlog);
} else {
var msg = {};
if (session.director && session.directorUUID && (session.directorUUID !==true)){
msg.migrate = ele.dataset.UUID;
msg.roomid = migrateRoom;
session.sendRequest(msg, session.directorUUID);
log(msg);
} else {
msg.request = "migrate";
msg.roomid = migrateRoom;
msg.target = ele.dataset.UUID;
session.sendMsg(msg); // send to everyone in the room, so they know if they are on air or not.
}
msg.request = "migrate";
msg.roomid = migrateRoom;
msg.target = ele.dataset.UUID;
session.sendMsg(msg); // send to everyone in the room, so they know if they are on air or not.
}
}
}
@ -6457,7 +6444,7 @@ session.publishIFrame = function(iframeURL){
function outboundAudioPipeline(stream) {
if (session.disableWebAudio) {
//if (session.mobile){return stream;} // iOS devices can't remap video tracks, else KABOOM. Might as well do this for android also.
if (session.mobile){return stream;} // iOS devices can't remap video tracks, else KABOOM. Might as well do this for android also.
var newStream = createMediaStream();
stream.getTracks().forEach(function(track) { // this seems to fix a bug with macbooks.
@ -10873,8 +10860,7 @@ async function grabVideo(quality = 0, eleName = 'previewWebcam', selector = "sel
});
updateRenderOutpipe();
// senderAudioUpdate
if (wasDisabled && !session.videoMuted){
var msg = {};
@ -10926,6 +10912,7 @@ async function grabVideo(quality = 0, eleName = 'previewWebcam', selector = "sel
grabVideoTimer = setTimeout(function(callback3) {
updateRenderOutpipe();
makeImages(true);
if (getById("popupSelector_constraints_loading")) {
@ -15314,22 +15301,11 @@ Promise.wait = function(ms) {
Promise.prototype.timeout = function(ms) {
return Promise.race([
this, Promise.wait(ms).then(function() {
if (iOS || iPad){
var errormsg = new Error("Time Out\nDid you accept camera permissions in time? Please do so first.\n\nIf using an iPhone or iPad, try fully closing your browser and open it again; Safari sometimes jams up the camera.");
errormsg.name = "timedOut";
errormsg.message = "Time Out\nDid you accept camera permissions in time? Please do so first.\n\nIf using an iPhone or iPad, try fully closing your browser and open it again; Safari sometimes jams up the camera."
throw errormsg;
} else if (session.mobile){
var errormsg = new Error("Time Out\nDid you accept camera permissions in time? Please do so first.\n\nMake sure no other application is using the camera already and that you are using a compatible browser. If issues persist, maybe try the official native mobile app.");
errormsg.name = "timedOut";
errormsg.message = "Time Out\nDid you accept camera permissions in time? Please do so first.\n\nMake sure no other application is using the camera already and that you are using a compatible browser. If issues persist, maybe try the official native mobile app."
throw errormsg;
} else {
var errormsg = new Error("Time Out\nDid you accept camera permissions in time? Please do so first.\n\nOtherwise, do you have NDI Tools installed? Maybe try uninstalling it.\n\nPlease also ensure your camera and audio device are correctly connected and not already in use. You may also need to refresh the page.");
errormsg.name = "timedOut";
errormsg.message = "Time Out\nDid you accept camera permissions in time? Please do so first.\n\nOtherwise, do you have NDI Tools installed? Maybe try uninstalling it.\n\nPlease also ensure your camera and audio device are correctly connected and not already in use. You may also need to refresh the page."
throw errormsg;
}
var errormsg = new Error("Time Out\nDid you accept camera permissions in time? Please do so first.\n\nOtherwise, do you have NDI Tools installed? Maybe try uninstalling it.\n\nPlease also ensure your camera and audio device are correctly connected and not already in use. You may also need to refresh the page.");
errormsg.name = "timedOut";
errormsg.message = "Time Out\nDid you accept camera permissions in time? Please do so first.\n\nOtherwise, do you have NDI Tools installed? Maybe try uninstalling it.\n\nPlease also ensure your camera and audio device are correctly connected and not already in use. You may also need to refresh the page."
throw errormsg;
})
])
};

5
main.css
View File

@ -15,8 +15,7 @@
--color-mode: light;
--button-radius: 2px;
--myvideo-max-width: min(800px,100vw);
--myvideo-width:unset;
--myvideo-height:auto;
--myvideo-width:800px;
}
* {
@ -1523,7 +1522,7 @@ img {
width: var(--myvideo-width);
max-width: 800px !important;
max-height: 100% !important;
height: var(--myvideo-height) !important;
height: auto !important;
display: block !important;
margin: auto auto !important;
position: relative !important;

34
main.js
View File

@ -141,10 +141,6 @@ async function main(){ // main asyncronous thread; mostly initializes the user s
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'));
@ -511,7 +507,6 @@ async function main(){ // main asyncronous thread; mostly initializes the user s
document.documentElement.style.setProperty('--fit-style', 'cover');
document.documentElement.style.setProperty('--myvideo-max-width', '100vw');
document.documentElement.style.setProperty('--myvideo-width', '100vw');
document.documentElement.style.setProperty('--myvideo-height', '100vh');
}
if (urlParams.has('record')) {
@ -740,16 +735,13 @@ async function main(){ // main asyncronous thread; mostly initializes the user s
}
if (urlParams.has('transparent') || urlParams.has('transparency')) { // sets the window to be transparent - useful for IFRAMES?
session.transparent=true;
}
if (session.transparent){
getById("main").style.backgroundColor = "rgba(0,0,0,0)";
document.documentElement.style.setProperty('--container-color', '#0000');
document.documentElement.style.setProperty('--background-color', '#0000');
document.documentElement.style.setProperty('--regular-margin', '0');
document.documentElement.style.setProperty('--director-margin', '0 25px 0 0');
getById("directorLinksButton").style.color = "black";
session.transparent=true;
}
if (urlParams.has('stereo') || urlParams.has('s') || urlParams.has('proaudio')) { // both peers need this enabled for HD stereo to be on. If just pub, you get no echo/noise cancellation. if just viewer, you get high bitrate mono
@ -1036,6 +1028,8 @@ async function main(){ // main asyncronous thread; mostly initializes the user s
session.micDelay = parseInt(session.micDelay) || 0;
session.disableWebAudio = false;
}
if (urlParams.has('tips')){
getById("guestTips").style.display="flex";
@ -1136,9 +1130,9 @@ async function main(){ // main asyncronous thread; mostly initializes the user s
}
}
//if (navigator.userAgent.indexOf('Mac OS X') != -1) {
// session.codec = "h264"; // default the codec to h264 if OBS is on macOS (that's all it supports with hardware) // oct 2021, OBS now supports vp8 and actually breaks with h264 android devices.
//}
if (navigator.userAgent.indexOf('Mac OS X') != -1) {
session.codec = "h264"; // default the codec to h264 if OBS is on macOS (that's all it supports with hardware)
}
if (session.disableOBS===false){
window.addEventListener("obsSourceVisibleChanged", obsSourceVisibleChanged);
@ -2265,12 +2259,6 @@ async function main(){ // main asyncronous thread; mostly initializes the user s
}
}
if (session.cleanViewer){
if (session.view && !session.director && session.permaid===false){
session.cleanOutput = true;
}
}
if (urlParams.has('hidescreenshare') || urlParams.has('hidess') || urlParams.has('sshide') || urlParams.has('screensharehide')) { // this way I don't need to remember what it's called. I can just guess. :D
session.screenShareElementHidden = true;
}
@ -2299,7 +2287,7 @@ async function main(){ // main asyncronous thread; mostly initializes the user s
if (urlParams.has('screensharequality') || urlParams.has('ssq')) {
if (urlParams.get('screensharequality') || urlParams.get('ssq')) {
session.screensharequality = urlParams.get('screensharequality') || urlParams.get('ssq');
session.screensharequality = parseInt(session.screensharequality) || 1;
session.screensharequality = parseInt(session.screensharequality) || 0;
}
}
@ -3071,7 +3059,9 @@ async function main(){ // main asyncronous thread; mostly initializes the user s
}
}
if ("add" in e.data) {
getById("gridlayout").appendChild(session.rpcs[i].videoElement);
try {
getById("gridlayout").appendChild(session.rpcs[i].videoElement);
} catch(e){}
} else if ("remove" in e.data) {
try {
@ -3160,7 +3150,7 @@ async function main(){ // main asyncronous thread; mostly initializes the user s
log(e);
var note = e.note.name + e.note.octave;
var velocity = e.velocity || false;
midiHotkeysNote(node,velocity);
midiHotkeysNote(note,velocity);
});
input.addListener('controlchange', "all", function(e) {
@ -3181,7 +3171,7 @@ async function main(){ // main asyncronous thread; mostly initializes the user s
var command = e.controller.number;
var value = e.value;
midiHotkeys(command, value)
midiHotkeysCommand(command, value)
}
});
}

2
webrtc.js
View File

File diff suppressed because one or more lines are too long