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

Add files via upload

Browse Source
This commit is contained in:
Steve Seguin 2022-02-14 01:48:15 -05:00 committed by GitHub
parent abc139ce05
commit 75e4c13bf4
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
6 changed files with 138 additions and 80 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

18
index.html
View File

@ -24,7 +24,7 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" /> <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
<meta content="text/html;charset=utf-8" http-equiv="Content-Type" /> <meta content="text/html;charset=utf-8" http-equiv="Content-Type" />
<meta content="utf-8" http-equiv="encoding" /> <meta content="utf-8" http-equiv="encoding" />
<meta name="copyright" content="&copy; 2021 Steve Seguin" /> <meta name="copyright" content="&copy; 2022 Steve Seguin" />
<link rel="shortcut icon" href="data:image/x-icon;," type="image/x-icon" /> <link rel="shortcut icon" href="data:image/x-icon;," type="image/x-icon" />
<link rel="icon" type="image/png" sizes="32x32" href="./media/favicon-32x32.png" /> <link rel="icon" type="image/png" sizes="32x32" href="./media/favicon-32x32.png" />
<link rel="icon" type="image/png" sizes="16x16" href="./media/favicon-16x16.png" /> <link rel="icon" type="image/png" sizes="16x16" href="./media/favicon-16x16.png" />
@ -54,7 +54,7 @@
<meta property="twitter:image" content="./media/vdoNinja_logo_full.png" /> <meta property="twitter:image" content="./media/vdoNinja_logo_full.png" />
<meta name="msapplication-TileColor" content="#da532c" /> <meta name="msapplication-TileColor" content="#da532c" />
<meta name="theme-color" content="#ffffff" /> <meta name="theme-color" content="#ffffff" />
<link rel="stylesheet" href="./main.css?ver=152" /> <link rel="stylesheet" href="./main.css?ver=153" />
<script type="text/javascript" crossorigin="anonymous" src="./thirdparty/adapter.min.js"></script> <script type="text/javascript" crossorigin="anonymous" src="./thirdparty/adapter.min.js"></script>
<style id="lightbox-animations" type="text/css"></style> <style id="lightbox-animations" type="text/css"></style>
<!-- <link rel="manifest" href="manifest.json" /> --> <!-- <link rel="manifest" href="manifest.json" /> -->
@ -79,7 +79,7 @@
<link itemprop="url" href="./media/vdoNinja_logo_full.png" /> <link itemprop="url" href="./media/vdoNinja_logo_full.png" />
</span> </span>
<script type="text/javascript" crossorigin="anonymous" src="./thirdparty/CodecsHandler.js?ver=37"></script> <script type="text/javascript" crossorigin="anonymous" src="./thirdparty/CodecsHandler.js?ver=37"></script>
<script type="text/javascript" crossorigin="anonymous" src="./webrtc.js?ver=367"></script> <script type="text/javascript" crossorigin="anonymous" src="./webrtc.js?ver=368"></script>
<input id="zoomSlider" type="range" style="display: none;" /> <input id="zoomSlider" type="range" style="display: none;" />
<div id="header"> <div id="header">
@ -798,9 +798,6 @@
<li> <li>
Some devices that use hardware encoding can experience video issues; switching to VP8 or VP9 as a <a target='_blank' title='Jump to the documentation' href='https://docs.vdo.ninja/viewers-settings/codec'>codec</a> may help. Some devices that use hardware encoding can experience video issues; switching to VP8 or VP9 as a <a target='_blank' title='Jump to the documentation' href='https://docs.vdo.ninja/viewers-settings/codec'>codec</a> may help.
</li> </li>
<li>
iPhones continue to have random audio issues, such as lowered volume or no audio at all. These are issues that Apple needs to fix.</a>.
</li>
<li> <li>
Audio may drop out in OBS Studio at random times, yet still appear active. Delete the browser source and re-create, or use the <a href="https://github.com/steveseguin/electroncapture">Electron Capture</a> app instead</a>. Audio may drop out in OBS Studio at random times, yet still appear active. Delete the browser source and re-create, or use the <a href="https://github.com/steveseguin/electroncapture">Electron Capture</a> app instead</a>.
</li> </li>
@ -809,8 +806,7 @@
<font style="color:#daad09;">Welcome to VDO Ninja! We've rebranded! Nothing else is changing and we're staying 100% free.</font> <font style="color:#daad09;">Welcome to VDO Ninja! We've rebranded! Nothing else is changing and we're staying 100% free.</font>
</h4> </h4>
<br /> <br />
🎁 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. Site updated February 14th. <a target="_blank" href="https://docs.vdo.ninja/releases/v21">v21 release notes</a>. If having new issues, the previous version <a href="https://vdo.ninja/v20/">is here</a>, and the <a href="https://vdo.ninja/beta/">upcoming next version is here</a>; please test it when possible.
<br /> <br />
<br /> <br />
<h3> <h3>
@ -1932,7 +1928,7 @@
var session = WebRTC.Media; // session is a required global variable if configuring manually. Run before loading main.js but after webrtc.js. 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.7"; session.version = "21.0";
session.streamID = session.generateStreamID(); // randomly generates a streamID for this session. You can set your own programmatically if needed 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 session.defaultPassword = "someEncryptionKey123"; // Change this password if self-deploying for added security/privacy
@ -1998,11 +1994,11 @@
// session.lowBitrateCutoff = 300; // Set a minimum bitrate (in kbps) before the stream is hidden. Useful for IRL streams maybe // session.lowBitrateCutoff = 300; // Set a minimum bitrate (in kbps) before the stream is hidden. Useful for IRL streams maybe
</script> </script>
<script type="text/javascript" crossorigin="anonymous" src="./thirdparty/aes.js"></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=263"></script> <script type="text/javascript" crossorigin="anonymous" id="lib-js" src="./lib.js?ver=264"></script>
<!-- <!--
// If you wish to change branding, blank offers a good clean start. // 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" id="main-js" src="./main.js" data-translation="blank"></script>
--> -->
<script type="text/javascript" crossorigin="anonymous" id="main-js" src="./main.js?ver=301"></script> <script type="text/javascript" crossorigin="anonymous" id="main-js" src="./main.js?ver=302"></script>
</body> </body>
</html> </html>

85
lib.js
View File

@ -1,5 +1,5 @@
/* /*
* Copyright (c) 2021 Steve Seguin. All Rights Reserved. * Copyright (c) 2022 Steve Seguin. All Rights Reserved.
* *
* Use of this source code is governed by the APGLv3 open-source license * Use of this source code is governed by the APGLv3 open-source license
* that can be found in the LICENSE file in the root of the source * that can be found in the LICENSE file in the root of the source
@ -15862,6 +15862,11 @@ async function publishScreen2(constraints, audioList=[], audio=true){ // webcam
}; };
var transferList = [];
var msgTransferList = [];
function cancelFile(ele){ function cancelFile(ele){
var idx = ele.dataset.tid; var idx = ele.dataset.tid;
try{ try{
@ -15871,7 +15876,6 @@ function cancelFile(ele){
updateDownloadLink(idx); updateDownloadLink(idx);
} }
function requestFile(ele){ function requestFile(ele){
var idx = ele.dataset.tid; var idx = ele.dataset.tid;
transferList[idx].status = 1; transferList[idx].status = 1;
@ -15887,8 +15891,11 @@ function requestFile(ele){
pokeIframeAPI('request-file', fid, UUID); pokeIframeAPI('request-file', fid, UUID);
} }
var transferList = []; function clearDownloadFile(ele){
var msgTransferList = []; var idx = ele.dataset.tid;
transferList[idx].status = 6;
updateDownloadLink(idx);
}
function addDownloadLink(fileList, UUID, pc){ function addDownloadLink(fileList, UUID, pc){
if (session.nodownloads){return;} // downloads are blocked if (session.nodownloads){return;} // downloads are blocked
@ -15923,9 +15930,9 @@ function addDownloadLink(fileList, UUID, pc){
getById("chatNotification").classList.add("notification"); getById("chatNotification").classList.add("notification");
} }
if (session.broadcastChannel !== false) { //if (session.broadcastChannel !== false) {
session.broadcastChannel.postMessage(data); /* send */ // session.broadcastChannel.postMessage(data); /* send */
} //}
} }
function updateDownloadLink(idx){ function updateDownloadLink(idx){
@ -15952,6 +15959,9 @@ function updateDownloadLink(idx){
elements[0].innerHTML = "Cancelled"; elements[0].innerHTML = "Cancelled";
elements[0].onclick = null; elements[0].onclick = null;
elements[0].disabled = true; elements[0].disabled = true;
} else if (transferList[idx].status === 6){
getById("transfer_"+idx).style.display = "none";
//delete(transferList[idx]);
} }
} }
} }
@ -15976,9 +15986,9 @@ function fileShareMessage(fileinfo, idx){
} }
} }
var data = {}; var data = {};
data.idx = idx;
if (fileinfo.status === 0){ if (fileinfo.status === 0){
data.msg = " has a shared a file with you:<br /><i>"+fileinfo.name+"</i><br />Do you trust them? <button title='file size: "+fileinfo.size+" bytes' data-button-type='download' data-fid='"+fileinfo.id+"' data-tid='"+idx+"' onclick='requestFile(this);'>Download it here</button>"; data.msg = " has a shared a file with you:<br /><i>"+fileinfo.name+"</i><br />Do you trust them? <button title='file size: "+fileinfo.size+" bytes' data-button-type='download' data-fid='"+fileinfo.id+"' data-tid='"+idx+"' onclick='requestFile(this);'>Download it here</button><button data-button-type='clear' data-fid='"+fileinfo.id+"' data-tid='"+idx+"' style='margin:10px 0 10px 2px;' onclick='clearDownloadFile(this);'>Clear</button>";
} else if (fileinfo.status === 1){ } else if (fileinfo.status === 1){
data.msg = " has a shared a file with you:<br /><i>"+fileinfo.name+"</i><br /><button title='file size: "+fileinfo.size+" bytes' data-button-type='download' data-fid='"+fileinfo.id+"' data-tid='"+idx+"'>Requested</button>"; data.msg = " has a shared a file with you:<br /><i>"+fileinfo.name+"</i><br /><button title='file size: "+fileinfo.size+" bytes' data-button-type='download' data-fid='"+fileinfo.id+"' data-tid='"+idx+"'>Requested</button>";
} else if (fileinfo.status === 2){ } else if (fileinfo.status === 2){
@ -15989,6 +15999,8 @@ function fileShareMessage(fileinfo, idx){
data.msg = " has a shared a file with you:<br /><i>"+fileinfo.name+"</i><br /><button title='file size: "+fileinfo.size+" bytes' data-button-type='download' data-fid='"+fileinfo.id+"' data-tid='"+idx+"' disabled >No longer available</button>"; data.msg = " has a shared a file with you:<br /><i>"+fileinfo.name+"</i><br /><button title='file size: "+fileinfo.size+" bytes' data-button-type='download' data-fid='"+fileinfo.id+"' data-tid='"+idx+"' disabled >No longer available</button>";
} else if (fileinfo.status === 5){ } else if (fileinfo.status === 5){
data.msg = " has a shared a file with you:<br /><i>"+fileinfo.name+"</i><br /><button title='file size: "+fileinfo.size+" bytes' data-button-type='download' data-fid='"+fileinfo.id+"' data-tid='"+idx+"' disabled >Cancelled</button>"; data.msg = " has a shared a file with you:<br /><i>"+fileinfo.name+"</i><br /><button title='file size: "+fileinfo.size+" bytes' data-button-type='download' data-fid='"+fileinfo.id+"' data-tid='"+idx+"' disabled >Cancelled</button>";
} else if (fileinfo.status === 6){
return;
} }
var director=false; // add back in later. var director=false; // add back in later.
@ -16003,11 +16015,11 @@ function fileShareMessage(fileinfo, idx){
data.label = "<b>" + data.label + "</b>"; data.label = "<b>" + data.label + "</b>";
} }
} else if (director) { } else if (director) {
data.label = "<b><i>Director:</i></b> "; data.label = "<b><i>Director</i></b>";
} else { } else {
data.label = "Someone "; data.label = "Someone";
} }
data.type = "recv"; data.type = "action";
msgTransferList.push(data); msgTransferList.push(data);
} }
@ -20264,6 +20276,17 @@ function sendChatMessage(chatMsg = false) { // filtered + visual
msg = convertShortcodes(msg); msg = convertShortcodes(msg);
var label = "";
if (session.label){
if (session.director){
label = "<b><i><span class='chat_name'>" + session.label + "</span>:</i></b> ";
} else {
label = "<b><span class='chat_name'>" + session.label + "</span>:</b> ";
}
} else if (session.director){
label = "<b><i><span class='chat_name'>Director</span>:</i></b> ";
}
if (msg.trim()==="/list"){ if (msg.trim()==="/list"){
var listMsg = null; var listMsg = null;
for (var UUID in session.rpcs){ for (var UUID in session.rpcs){
@ -20317,7 +20340,7 @@ function sendChatMessage(chatMsg = false) { // filtered + visual
var data = {}; var data = {};
data.time = Date.now(); data.time = Date.now();
data.msg = sanitizeChat(msg); // this is what the other person should see data.msg = sanitizeChat(msg); // this is what the other person should see
data.label = false; data.label = label;
data.type = "sent"; data.type = "sent";
messageList.push(data); messageList.push(data);
sent=true; sent=true;
@ -20326,7 +20349,7 @@ function sendChatMessage(chatMsg = false) { // filtered + visual
var data = {}; var data = {};
data.time = Date.now(); data.time = Date.now();
data.msg = sanitizeChat(msg); // this is what the other person should see data.msg = sanitizeChat(msg); // this is what the other person should see
data.label = false; data.label = label;
data.type = "sent"; data.type = "sent";
messageList.push(data); messageList.push(data);
sent=true; sent=true;
@ -20335,7 +20358,7 @@ function sendChatMessage(chatMsg = false) { // filtered + visual
var data = {}; var data = {};
data.time = Date.now(); data.time = Date.now();
data.msg = sanitizeChat(msg); // this is what the other person should see data.msg = sanitizeChat(msg); // this is what the other person should see
data.label = false; data.label = label;
data.type = "sent"; data.type = "sent";
messageList.push(data); messageList.push(data);
sent=true; sent=true;
@ -20348,7 +20371,7 @@ function sendChatMessage(chatMsg = false) { // filtered + visual
var data = {}; var data = {};
data.time = Date.now(); data.time = Date.now();
data.msg = sanitizeChat(msg); // this is what the other person should see data.msg = sanitizeChat(msg); // this is what the other person should see
data.label = false; data.label = label;
data.type = "sent"; data.type = "sent";
messageList.push(data); messageList.push(data);
sent=true; sent=true;
@ -20357,7 +20380,7 @@ function sendChatMessage(chatMsg = false) { // filtered + visual
var data = {}; var data = {};
data.time = Date.now(); data.time = Date.now();
data.msg = sanitizeChat(msg); // this is what the other person should see data.msg = sanitizeChat(msg); // this is what the other person should see
data.label = false; data.label = label;
data.type = "sent"; data.type = "sent";
messageList.push(data); messageList.push(data);
sent=true; sent=true;
@ -20366,7 +20389,7 @@ function sendChatMessage(chatMsg = false) { // filtered + visual
var data = {}; var data = {};
data.time = Date.now(); data.time = Date.now();
data.msg = sanitizeChat(msg); // this is what the other person should see data.msg = sanitizeChat(msg); // this is what the other person should see
data.label = false; data.label = label;
data.type = "sent"; data.type = "sent";
messageList.push(data); messageList.push(data);
sent=true; sent=true;
@ -20398,7 +20421,7 @@ function sendChatMessage(chatMsg = false) { // filtered + visual
var data = {}; var data = {};
data.time = Date.now(); data.time = Date.now();
data.msg = sanitizeChat(msg); // this is what the other person should see data.msg = sanitizeChat(msg); // this is what the other person should see
data.label = false; data.label = label;
data.type = "sent"; data.type = "sent";
messageList.push(data); messageList.push(data);
} }
@ -20406,7 +20429,7 @@ function sendChatMessage(chatMsg = false) { // filtered + visual
sendChat(msg); // send message to peers sendChat(msg); // send message to peers
data.time = Date.now(); data.time = Date.now();
data.msg = sanitizeChat(msg); // this is what the other person should see data.msg = sanitizeChat(msg); // this is what the other person should see
data.label = false; data.label = label;
data.type = "sent"; data.type = "sent";
messageList.push(data); messageList.push(data);
} }
@ -20540,17 +20563,17 @@ function getChatMessage(msg, label = false, director = false, overlay = false) {
if (label) { if (label) {
data.label = label; data.label = label;
if (director) { if (director) {
data.label = "<b><i>" + data.label + ":</i></b> "; data.label = "<b><i><span class='chat_director chat_name'>" + data.label + "</span>:</i></b> ";
} else { } else {
data.label = "<b>" + data.label + ":</b> "; data.label = "<b><span class='chat_name'>" + data.label + "</span>:</b> ";
} }
label = label+":"; label = "<span class='chat_name'>"+label+"</span>:"; // label+":";
} else if (director) { } else if (director) {
data.label = "<b><i>Director:</i></b> "; data.label = "<b><i><span class='chat_director chat_name'>Director</span>:</i></b> ";
label = "Director:"; label = "<span class='chat_director chat_name'>Director</span>:";
} else { } else {
if (session.director){ if (session.director){
data.label = "Someone: "; data.label = "<span class='chat_name'>Someone</span>: ";
} else { } else {
data.label = ""; data.label = "";
} }
@ -20672,7 +20695,7 @@ function updateClosedCaptions(msg, label, UUID) {
} }
var chatUpdateTimeout = null; var chatUpdateTimeout = null;
function updateMessages() { function updateMessages(){
if (session.chatbutton===false){return;} if (session.chatbutton===false){return;}
document.getElementById("chatBody").innerHTML = ""; document.getElementById("chatBody").innerHTML = "";
for (var i in messageList) { for (var i in messageList) {
@ -20683,7 +20706,7 @@ function updateMessages() {
if (messageList[i].type == "sent") { if (messageList[i].type == "sent") {
msg.innerHTML = messageList[i].msg + " <i><small> <small>- " + time + "</small></small></i>"; msg.innerHTML = messageList[i].msg + " <i><small> <small>- " + time + "</small></small></i>";
msg.classList.add("outMessage"); msg.classList.add("outMessage");
} else if (messageList[i].type == "recv") { } else if ((messageList[i].type == "recv") || (messageList[i].type == "action")) {
var label = ""; var label = "";
if (messageList[i].label) { if (messageList[i].label) {
label = messageList[i].label; label = messageList[i].label;
@ -20704,11 +20727,13 @@ function updateMessages() {
for (var i in msgTransferList) { for (var i in msgTransferList) {
var time = timeSince(msgTransferList[i].time) || ""; var time = timeSince(msgTransferList[i].time) || "";
var msg = document.createElement("div"); var msg = document.createElement("div");
if ("idx" in msgTransferList[i]){
msg.id = "transfer_"+msgTransferList[i].idx;
}
if (msgTransferList[i].type == "sent") { if (msgTransferList[i].type == "sent") {
msg.innerHTML = msgTransferList[i].msg + " <i><small> <small>- " + time + "</small></small></i>"; msg.innerHTML = msgTransferList[i].msg + " <i><small> <small>- " + time + "</small></small></i>";
msg.classList.add("outMessage"); msg.classList.add("outMessage");
} else if (msgTransferList[i].type == "recv") { } else if ((msgTransferList[i].type == "recv") || (msgTransferList[i].type == "action")) {
var label = ""; var label = "";
if (msgTransferList[i].label) { if (msgTransferList[i].label) {
label = msgTransferList[i].label; label = msgTransferList[i].label;

12
main.css
View File

@ -2560,6 +2560,15 @@ input[type=checkbox] {
text-align: left; text-align: left;
margin: 10px 3px; margin: 10px 3px;
} }
.actionMessage {
color: #000;
margin: 3px;
border-radius: 5px;
background: #FFF;
padding: 5px;
text-align: left;
margin: 10px 3px;
}
.outMessage { .outMessage {
color: #000; color: #000;
margin: 3px; margin: 3px;
@ -3875,6 +3884,9 @@ body.darktheme .outMessage{
body.darktheme .inMessage { body.darktheme .inMessage {
background-color: #b1b1b1; background-color: #b1b1b1;
} }
body.darktheme .actionMessage {
background-color: #b1b1b1;
}
body.darktheme #chatInput{ body.darktheme #chatInput{
background-color:#ccc; background-color:#ccc;
} }

4
main.js
View File

@ -1,5 +1,5 @@
/* /*
* Copyright (c) 2021 Steve Seguin. All Rights Reserved. * Copyright (c) 2022 Steve Seguin. All Rights Reserved.
* *
* Use of this source code is governed by the APGLv3 open-source license * Use of this source code is governed by the APGLv3 open-source license
* that can be found in the LICENSE file in the root of the source * that can be found in the LICENSE file in the root of the source
@ -4142,7 +4142,7 @@ setTimeout(function(){ // lazy load
script.onload = function() { script.onload = function() {
var script = document.createElement('script'); var script = document.createElement('script');
document.head.appendChild(script); document.head.appendChild(script);
script.src = "./thirdparty/StreamSaver.js?t="+Date.now(); // dynamically load this only if its needed. Keeps loading time down. script.src = "./thirdparty/StreamSaver.js?v=4"; // dynamically load this only if its needed. Keeps loading time down.
}; };
script.src = "./thirdparty/polyfill.min.js"; // dynamically load this only if its needed. Keeps loading time down. script.src = "./thirdparty/polyfill.min.js"; // dynamically load this only if its needed. Keeps loading time down.
},0); },0);

97
popout.html
View File

@ -1,11 +1,7 @@
<html> <html>
<head> <head>
<meta name="theme-color" content="#ffffff" /> <meta name="theme-color" content="#ffffff" />
<!-- <script src="//console.re/connector.js" data-channel="obsninjadev" type="text/javascript" id="consolerescript"></script>--> <!-- <script src="//console.re/connector.js" data-channel="vdoninjadev" type="text/javascript" id="consolerescript"></script>-->
<link rel="stylesheet" href="./lineawesome/css/line-awesome.min.css">
<script type="text/javascript" crossorigin="anonymous" src="./thirdparty/adapter-latest.js"></script>
<script type="text/javascript" crossorigin="anonymous" src="./thirdparty/qrcode.min.js"></script>
<script type="text/javascript" src="./thirdparty/jquery.min.js"></script>
<link rel="stylesheet" href="./main.css?ver=22" /> <link rel="stylesheet" href="./main.css?ver=22" />
<style> <style>
#chatModule{ #chatModule{
@ -41,11 +37,8 @@ body{
<body> <body>
<div id="chatModule" > <div id="chatModule" >
<div id="chatBody"> <div id="chatBody">
<div class="inMessage" data-translate='welcome-to-obs-ninja-chat'> <div class="inMessage" data-translate='welcome-to-vdo-ninja-chat'>
Welcome to OBS.Ninja! You can send text messages directly to connected peers from here. Welcome to VDO.Ninja! You can send text messages directly to connected peers from here.
</div>
<div class="outMessage" data-translate='names-and-labels-coming-soon'>
Names identifying connected peers will be a feature in an upcoming release.
</div> </div>
</div> </div>
<input id="chatInput" placeholder="Enter chat message to send here" onkeypress="EnterButtonChat(event)" /> <input id="chatInput" placeholder="Enter chat message to send here" onkeypress="EnterButtonChat(event)" />
@ -55,9 +48,8 @@ body{
/// If you have a routing system setup, you could have just one global listener for all iframes instead. /// If you have a routing system setup, you could have just one global listener for all iframes instead.
var chatUpdateTimeout = null; //var chatUpdateTimeout = null;
var messageList = []; var messageList = [];
(function (w) { (function (w) {
w.URLSearchParams = w.URLSearchParams || function (searchString) { w.URLSearchParams = w.URLSearchParams || function (searchString) {
var self = this; var self = this;
@ -88,7 +80,7 @@ bc.onmessage = function (e) {
if ("msg" in e.data){ if ("msg" in e.data){
messageList.push(e.data); messageList.push(e.data);
messageList = messageList.slice(-100); messageList = messageList.slice(-100);
updateMessages(); updateMessages(e.data);
} else if ("messageList" in e.data){ } else if ("messageList" in e.data){
messageList = e.data.messageList; messageList = e.data.messageList;
updateMessages(); updateMessages();
@ -151,40 +143,73 @@ function timeSince(date) {
function updateMessages(){ function updateMessages(message = false){
document.getElementById("chatBody").innerHTML = ""; if (message){
for (i in messageList){ var time = timeSince(message.time);
var time = timeSince(messageList[i].time);
var msg = document.createElement("div"); var msg = document.createElement("div");
////// KEEP THIS IN ///////// ////// KEEP THIS IN /////////
console.log(messageList[i].msg); // Display Recieved messages for View-Only clients. console.log(message.msg); // Display Recieved messages for View-Only clients.
///////////////////////////// /////////////////////////////
if (messageList[i].type == "sent"){ var label = "";
msg.innerHTML = messageList[i].msg + " <i><small> <small>- "+time+"</small></small></i>"; if (message.label){
label = message.label;
}
if (message.type == "sent"){
msg.innerHTML = "<span class='chat_message chat_sent'>"+message.msg + " </span><i><small> <small>- "+time+"</small></small></i><span style='display:none'>"+label+"</span>";
msg.classList.add("outMessage"); msg.classList.add("outMessage");
} else if (messageList[i].type == "recv"){ } else if (message.type == "recv"){
msg.innerHTML = label+"<span class='chat_message chat_recv'>"+message.msg + " </span><i><small> <small>- "+time+"</small></small></i>";
msg.classList.add("inMessage");
} else if (message.type == "action"){
msg.innerHTML = label+"<span class='chat_message chat_action'>"+message.msg + " </span><i><small> <small>- "+time+"</small></small></i>";
msg.classList.add("actionMessage");
} else if (message.type == "alert"){
msg.innerHTML = "<span class='chat_message chat_alert'>"+message.msg + " </span><i><small> <small>- "+time+"</small></small></i>";
msg.classList.add("inMessage");
} else {
msg.innerHTML = "<span class='chat_message chat_other'>"+message.msg + " </span><i><small> <small>- "+time+"</small></small></i>";
msg.classList.add("inMessage");
}
document.getElementById("chatBody").appendChild(msg);
} else {
document.getElementById("chatBody").innerHTML = "";
for (i in messageList){
var time = timeSince(messageList[i].time);
var msg = document.createElement("div");
////// KEEP THIS IN /////////
console.log(messageList[i].msg); // Display Recieved messages for View-Only clients.
/////////////////////////////
var label = ""; var label = "";
if (messageList[i].label){ if (messageList[i].label){
label = messageList[i].label; label = messageList[i].label;
} }
msg.innerHTML = label+messageList[i].msg + " <i><small> <small>- "+time+"</small></small></i>";
msg.classList.add("inMessage");
} else if (messageList[i].type == "alert"){
msg.innerHTML = messageList[i].msg + " <i><small> <small>- "+time+"</small></small></i>";
msg.classList.add("inMessage");
} else {
msg.innerHTML = messageList[i].msg + " <i><small> <small>- "+time+"</small></small></i>";
msg.classList.add("inMessage");
}
document.getElementById("chatBody").appendChild(msg); if (messageList[i].type == "sent"){
} msg.innerHTML = "<span class='chat_message chat_sent'>"+messageList[i].msg + " </span><i><small> <small>- "+time+"</small></small></i><span style='display:none'>"+label+"</span>";
if (chatUpdateTimeout){ msg.classList.add("outMessage");
clearInterval(chatUpdateTimeout); } else if (messageList[i].type == "recv"){
msg.innerHTML = label+"<span class='chat_message chat_recv'>"+messageList[i].msg + " </span><i><small> <small>- "+time+"</small></small></i>";
msg.classList.add("inMessage");
} else if (messageList[i].type == "action"){
msg.innerHTML = label+"<span class='chat_message chat_action'>"+messageList[i].msg + " </span><i><small> <small>- "+time+"</small></small></i>";
msg.classList.add("actionMessage");
} else if (messageList[i].type == "alert"){
msg.innerHTML = "<span class='chat_message chat_alert'>"+messageList[i].msg + " </span><i><small> <small>- "+time+"</small></small></i>";
msg.classList.add("inMessage");
} else {
msg.innerHTML = "<span class='chat_message chat_other'>"+messageList[i].msg + " </span><i><small> <small>- "+time+"</small></small></i>";
msg.classList.add("inMessage");
}
document.getElementById("chatBody").appendChild(msg);
}
} }
//if (chatUpdateTimeout){
// clearInterval(chatUpdateTimeout);
//}
document.getElementById("chatBody").scrollTop = document.getElementById("chatBody").scrollHeight; document.getElementById("chatBody").scrollTop = document.getElementById("chatBody").scrollHeight;
chatUpdateTimeout = setTimeout(function(){updateMessages()},60000); //chatUpdateTimeout = setTimeout(function(){updateMessages()},60000);
} }
</script> </script>

2
webrtc.js
View File

@ -1,5 +1,5 @@
/* /*
* Copyright (c) 2021 Steve Seguin. All Rights Reserved. * Copyright (c) 2022 Steve Seguin. All Rights Reserved.
* *
* This file is part of VDO.Ninja, yet is not intended to be modified. * This file is part of VDO.Ninja, yet is not intended to be modified.
* This file cannot be modified without the express permission of its author. * This file cannot be modified without the express permission of its author.