Grid analyze
This commit is contained in:
parent
c6c42d4bd8
commit
3ebf5cc1f5
|
@ -7,73 +7,33 @@ body{
|
||||||
}
|
}
|
||||||
.root{
|
.root{
|
||||||
gap: 10px;
|
gap: 10px;
|
||||||
padding: 10px;
|
padding: 0px;
|
||||||
height: 100%;
|
height: 100%;
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-wrap: nowrap;
|
flex-wrap: nowrap;
|
||||||
flex-direction: row;
|
flex-direction: row;
|
||||||
box-sizing: border-box;
|
box-sizing: border-box;
|
||||||
}
|
}
|
||||||
.dialoque{
|
|
||||||
flex: 1;
|
|
||||||
display: flex;
|
|
||||||
flex-wrap: nowrap;
|
|
||||||
flex-direction: row;
|
|
||||||
position: relative;
|
|
||||||
}
|
|
||||||
.videolist{
|
.videolist{
|
||||||
flex: 0 0 200px;
|
|
||||||
display: flex;
|
|
||||||
flex-wrap: nowrap;
|
|
||||||
flex-direction: column;
|
|
||||||
gap: 10px;
|
|
||||||
overflow: auto;
|
|
||||||
padding-right: 10px;
|
padding-right: 10px;
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
}
|
|
||||||
.dialoque #primaryVideo{
|
|
||||||
width: 100%;
|
width: 100%;
|
||||||
height: 100%;
|
height: 100%;
|
||||||
box-sizing: border-box;
|
display: grid;
|
||||||
object-fit: contain;
|
grid-template-columns: repeat(auto-fit, minmax(500px, 1fr));
|
||||||
background-color: transparent/*#282828*/;
|
grid-template-rows: repeat(auto-fit, minmax(23vh, 1fr));
|
||||||
border-radius: 10px;
|
gap: 5px;
|
||||||
z-index: 2;
|
justify-content: center;
|
||||||
}
|
align-items: center;
|
||||||
.dialoque #primaryVideoShadow{
|
|
||||||
width: 100%;
|
|
||||||
height: 100%;
|
|
||||||
object-fit: cover;
|
|
||||||
border-radius: 10px;
|
|
||||||
position: absolute;
|
|
||||||
filter: brightness(0.5);
|
|
||||||
z-index: 1;
|
|
||||||
left: 0;
|
|
||||||
top: 0;
|
|
||||||
}
|
|
||||||
.dialoque #secondaryVideo{
|
|
||||||
width: 300px;
|
|
||||||
height: 200px;
|
|
||||||
min-width: 300px;
|
|
||||||
max-width: 30%;
|
|
||||||
min-height: 200px;
|
|
||||||
max-height: 35%;
|
|
||||||
position: absolute;
|
|
||||||
right: 10px;
|
|
||||||
bottom: 10px;
|
|
||||||
background-color: #383838;
|
|
||||||
border-radius: 10px;
|
|
||||||
z-index: 3;
|
|
||||||
outline-offset: 0px;
|
|
||||||
outline-style: solid;
|
|
||||||
outline-width: 5px;
|
|
||||||
outline-color: rgba(0,0,0,.5);
|
|
||||||
}
|
}
|
||||||
.videolist .frame{
|
.videolist .frame{
|
||||||
max-width: 200px;
|
|
||||||
object-fit: cover;
|
|
||||||
border-radius: 10px;
|
|
||||||
border: solid 3px transparent;
|
border: solid 3px transparent;
|
||||||
|
aspect-ratio: 16 / 9;
|
||||||
|
width: 100%;
|
||||||
|
object-fit: contain;
|
||||||
|
max-width: 100%;
|
||||||
|
max-height: 100%;
|
||||||
|
align-items: center;
|
||||||
}
|
}
|
||||||
.videolist .frame.active{
|
.videolist .frame.active{
|
||||||
border: solid 3px green;
|
border: solid 3px green;
|
||||||
|
@ -92,16 +52,5 @@ video{
|
||||||
::-webkit-scrollbar-track {
|
::-webkit-scrollbar-track {
|
||||||
background-color: #ffffff1f;
|
background-color: #ffffff1f;
|
||||||
}
|
}
|
||||||
#stats{
|
|
||||||
position: absolute;
|
|
||||||
z-index: 3;
|
|
||||||
font-size: 14px;
|
|
||||||
line-height: 1.5em;
|
|
||||||
color: white;
|
|
||||||
font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
|
|
||||||
padding: 10px;
|
|
||||||
text-shadow: 0 0 5px black;
|
|
||||||
background-color: rgba(0,0,0,.4);
|
|
||||||
overflow: auto;
|
|
||||||
max-height: 80vh;
|
|
||||||
}
|
|
||||||
|
|
|
@ -10,16 +10,10 @@
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<div class="root">
|
<div class="root">
|
||||||
<div class="dialoque">
|
|
||||||
<video id="primaryVideo" muted playsinline autoplay></video>
|
|
||||||
<video id="primaryVideoShadow" muted playsinline autoplay></video>
|
|
||||||
<div id="stats"></div>
|
|
||||||
</div>
|
|
||||||
<div class="videolist">
|
<div class="videolist">
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<script src="index.js?v=32"></script>
|
<script src="index.js?v=32"></script>
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
305
public/index.js
305
public/index.js
|
@ -22,22 +22,6 @@ let roomid;
|
||||||
* @type {import("./MWSE/Room").default}
|
* @type {import("./MWSE/Room").default}
|
||||||
*/
|
*/
|
||||||
let room;
|
let room;
|
||||||
/**
|
|
||||||
* @type {MediaStream}
|
|
||||||
*/
|
|
||||||
let primaryVideoContent;
|
|
||||||
/**
|
|
||||||
* @type {HTMLVideoElement}
|
|
||||||
*/
|
|
||||||
let primaryVideo;
|
|
||||||
/**
|
|
||||||
* @type {HTMLVideoElement}
|
|
||||||
*/
|
|
||||||
let primaryVideoShadow;
|
|
||||||
/**
|
|
||||||
* @type {HTMLVideoElement}
|
|
||||||
*/
|
|
||||||
let secondaryVideo;
|
|
||||||
/**
|
/**
|
||||||
* @type {MediaStream}
|
* @type {MediaStream}
|
||||||
*/
|
*/
|
||||||
|
@ -50,9 +34,6 @@ let outgoingStreamOnlyVideo;
|
||||||
* @type {HTMLDivElement}
|
* @type {HTMLDivElement}
|
||||||
*/
|
*/
|
||||||
let videoContainer = document.querySelector(".videolist");
|
let videoContainer = document.querySelector(".videolist");
|
||||||
|
|
||||||
let activePeerInfos = {};
|
|
||||||
let activePeer = null;
|
|
||||||
let maxbitrate;
|
let maxbitrate;
|
||||||
let resulation;
|
let resulation;
|
||||||
|
|
||||||
|
@ -69,29 +50,10 @@ function connect()
|
||||||
*/
|
*/
|
||||||
let activeVideo;
|
let activeVideo;
|
||||||
|
|
||||||
function setPrimaryVideo(video, soundOn)
|
|
||||||
{
|
|
||||||
primaryVideo.srcObject = video;
|
|
||||||
primaryVideoShadow.srcObject = video;
|
|
||||||
if(soundOn == undefined)
|
|
||||||
{
|
|
||||||
primaryVideo.muted = 1;
|
|
||||||
primaryVideo.volume = 0;
|
|
||||||
}else if(soundOn){
|
|
||||||
primaryVideo.muted = 0;
|
|
||||||
primaryVideo.volume = 1;
|
|
||||||
}else{
|
|
||||||
primaryVideo.muted = 0;
|
|
||||||
primaryVideo.volume = 0;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
function setSecondaryVideo(video)
|
|
||||||
{
|
|
||||||
// secondaryVideo.srcObject = video;
|
|
||||||
}
|
|
||||||
function templateVideo(name, stream)
|
function templateVideo(name, stream)
|
||||||
{
|
{
|
||||||
let i = document.createElement("video");
|
let i = document.createElement("video");
|
||||||
|
i.classList.add("dev0")
|
||||||
i.muted = 1;
|
i.muted = 1;
|
||||||
i.classList.add("frame")
|
i.classList.add("frame")
|
||||||
i.playsInline = 1;
|
i.playsInline = 1;
|
||||||
|
@ -106,16 +68,6 @@ function addVideoList(name, stream, peer)
|
||||||
{
|
{
|
||||||
let video = templateVideo(name, stream);
|
let video = templateVideo(name, stream);
|
||||||
video.dataset.user = peer.socketId;
|
video.dataset.user = peer.socketId;
|
||||||
video.onclick = function(){
|
|
||||||
if(activeVideo)
|
|
||||||
{
|
|
||||||
activeVideo.classList.remove("active");
|
|
||||||
};
|
|
||||||
video.classList.add("active");
|
|
||||||
activeVideo = video;
|
|
||||||
activePeer = peer.rtc.rtc;
|
|
||||||
setPrimaryVideo(stream, true);
|
|
||||||
};
|
|
||||||
videoContainer.appendChild(video);
|
videoContainer.appendChild(video);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@ -128,7 +80,6 @@ function removeVideoList(name)
|
||||||
if(k.dataset.user == activeVideo?.dataset.user || !activeVideo)
|
if(k.dataset.user == activeVideo?.dataset.user || !activeVideo)
|
||||||
{
|
{
|
||||||
activePeer = null;
|
activePeer = null;
|
||||||
setPrimaryVideo(outgoingStreamOnlyVideo, false);
|
|
||||||
}
|
}
|
||||||
k.remove();
|
k.remove();
|
||||||
}
|
}
|
||||||
|
@ -145,24 +96,6 @@ async function beginEngine()
|
||||||
let url = new URL(window.location);
|
let url = new URL(window.location);
|
||||||
roomid = url.searchParams.get("room");
|
roomid = url.searchParams.get("room");
|
||||||
|
|
||||||
if(url.searchParams.get("maxbitrate"))
|
|
||||||
{
|
|
||||||
let n = Number(url.searchParams.get("maxbitrate"));
|
|
||||||
if(Number.isFinite(n) && !Number.isNaN(n))
|
|
||||||
{
|
|
||||||
maxbitrate = n;
|
|
||||||
}else maxbitrate = 3_000_000;
|
|
||||||
}else maxbitrate = 3_000_000;
|
|
||||||
|
|
||||||
if(url.searchParams.get("resulation"))
|
|
||||||
{
|
|
||||||
let n = Number(url.searchParams.get("resulation"));
|
|
||||||
if(Number.isFinite(n) && !Number.isNaN(n))
|
|
||||||
{
|
|
||||||
resulation = n;
|
|
||||||
}else resulation = 1.5;
|
|
||||||
}else resulation = 1.5;
|
|
||||||
|
|
||||||
if(!!roomid == 0)
|
if(!!roomid == 0)
|
||||||
{
|
{
|
||||||
let hash = window.crypto.randomUUID();
|
let hash = window.crypto.randomUUID();
|
||||||
|
@ -174,9 +107,6 @@ async function beginEngine()
|
||||||
};
|
};
|
||||||
|
|
||||||
window.addEventListener("load", () => {
|
window.addEventListener("load", () => {
|
||||||
primaryVideo = document.querySelector("#primaryVideo");
|
|
||||||
secondaryVideo = document.querySelector("#secondaryVideo");
|
|
||||||
primaryVideoShadow = document.querySelector("#primaryVideoShadow");
|
|
||||||
connect()
|
connect()
|
||||||
});
|
});
|
||||||
|
|
||||||
|
@ -201,7 +131,6 @@ async function startOutgoingWebcam()
|
||||||
audio: false
|
audio: false
|
||||||
});
|
});
|
||||||
outgoingStreamOnlyVideo = new MediaStream(outgoingStream);
|
outgoingStreamOnlyVideo = new MediaStream(outgoingStream);
|
||||||
// outgoingStreamOnlyVideo.removeTrack(outgoingStreamOnlyVideo.getAudioTracks()[0])
|
|
||||||
}
|
}
|
||||||
|
|
||||||
async function connectRoom()
|
async function connectRoom()
|
||||||
|
@ -226,11 +155,6 @@ async function connectRoom()
|
||||||
for (const peer of await room.fetchPeers()) {
|
for (const peer of await room.fetchPeers()) {
|
||||||
IncomingPeer(peer)
|
IncomingPeer(peer)
|
||||||
}
|
}
|
||||||
if(!primaryVideoContent)
|
|
||||||
{
|
|
||||||
setPrimaryVideo(outgoingStreamOnlyVideo);
|
|
||||||
}
|
|
||||||
setSecondaryVideo(outgoingStreamOnlyVideo);
|
|
||||||
|
|
||||||
addVideoList("My Webcam",outgoingStreamOnlyVideo, mwse.peer("me"))
|
addVideoList("My Webcam",outgoingStreamOnlyVideo, mwse.peer("me"))
|
||||||
|
|
||||||
|
@ -245,9 +169,9 @@ function IncomingPeer(peer,activeConnect)
|
||||||
peer.createRTC({
|
peer.createRTC({
|
||||||
iceCandidatePoolSize: 0
|
iceCandidatePoolSize: 0
|
||||||
},[{
|
},[{
|
||||||
urls: "turn:161.97.136.175:3478",
|
urls: "turn:20.166.82.187:3478",
|
||||||
username: "argist-eu-east-25",
|
username: "turnserver",
|
||||||
credential: "ee7df17eed35f4cf5a207777f3c0cd7d3b1901a5de7aff52ea55742289d7fee2"
|
credential: "turnserver"
|
||||||
},{
|
},{
|
||||||
urls: "stun:stun.l.google.com:19302"
|
urls: "stun:stun.l.google.com:19302"
|
||||||
}]);
|
}]);
|
||||||
|
@ -269,14 +193,6 @@ function IncomingPeer(peer,activeConnect)
|
||||||
peer.rtc.on("stream:added", ({stream,name}) => {
|
peer.rtc.on("stream:added", ({stream,name}) => {
|
||||||
peer.streamY = peer.socketId + " | " + name + " - " + stream.id;
|
peer.streamY = peer.socketId + " | " + name + " - " + stream.id;
|
||||||
addVideoList(peer.socketId + " | " + name + " - " + stream.id,stream, peer);
|
addVideoList(peer.socketId + " | " + name + " - " + stream.id,stream, peer);
|
||||||
|
|
||||||
if(!primaryVideoContent)
|
|
||||||
{
|
|
||||||
activePeer = peer.rtc.rtc;
|
|
||||||
primaryVideoContent = stream;
|
|
||||||
setPrimaryVideo(primaryVideoContent, true);
|
|
||||||
}
|
|
||||||
|
|
||||||
if(activeConnect && !sendedOTP)
|
if(activeConnect && !sendedOTP)
|
||||||
{
|
{
|
||||||
sendedOTP = true;
|
sendedOTP = true;
|
||||||
|
@ -292,11 +208,7 @@ function OutgoingPeer(peer)
|
||||||
removeVideoList(peer.streamY, peer);
|
removeVideoList(peer.streamY, peer);
|
||||||
}
|
}
|
||||||
|
|
||||||
setInterval(()=>{
|
/*
|
||||||
getStats()
|
|
||||||
}, 1000)
|
|
||||||
|
|
||||||
|
|
||||||
setInterval(() => {
|
setInterval(() => {
|
||||||
if(activePeer?.turboBitrate === 0)
|
if(activePeer?.turboBitrate === 0)
|
||||||
{
|
{
|
||||||
|
@ -317,209 +229,6 @@ setInterval(() => {
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}, 5000);
|
}, 5000);*/
|
||||||
|
|
||||||
let relative;
|
let relative;
|
||||||
|
|
||||||
async function getStats()
|
|
||||||
{
|
|
||||||
let stats = {};
|
|
||||||
if(!activePeer) return document.querySelector("#stats").innerHTML = "";
|
|
||||||
let stat = await activePeer.getStats();
|
|
||||||
let certs = {};
|
|
||||||
let selectedCandidatePairId;
|
|
||||||
let remotes = {};
|
|
||||||
let locals = {};
|
|
||||||
let candidatePairs = {};
|
|
||||||
for (const [id, data] of stat) {
|
|
||||||
switch(data.type)
|
|
||||||
{
|
|
||||||
case "candidate-pair":{
|
|
||||||
if(data.state == "succeeded")
|
|
||||||
{
|
|
||||||
let t = {};
|
|
||||||
t.candidateBytesSent = data.bytesSent;
|
|
||||||
t.candidateBytesReceived = data.bytesReceived;
|
|
||||||
t.candidatePacketsReceived = data.packetsReceived;
|
|
||||||
t.candidatePacketsSent = data.packetsSent;
|
|
||||||
t.candidateTotalRoundTripTime = data.totalRoundTripTime;
|
|
||||||
t.currentRoundTripTime = data.currentRoundTripTime;
|
|
||||||
t.candidateRemoteCandidateId = data.remoteCandidateId;
|
|
||||||
t.candidateLocalCandidateId = data.localCandidateId;
|
|
||||||
candidatePairs[data.id] = t;
|
|
||||||
}
|
|
||||||
break;
|
|
||||||
}
|
|
||||||
case "remote-candidate":{
|
|
||||||
let t = {};
|
|
||||||
t.remoteCandidateType = data.candidateType;
|
|
||||||
t.remoteProtocol = data.protocol;
|
|
||||||
t.remoteAddress = data.address;
|
|
||||||
t.remoteIsRemote = data.isRemote;
|
|
||||||
t.remotePort = data.port;
|
|
||||||
remotes[data.id] = t;
|
|
||||||
break;
|
|
||||||
}
|
|
||||||
case "local-candidate":{
|
|
||||||
let t = {};
|
|
||||||
t.localCandidateType = data.candidateType;
|
|
||||||
t.localProtocol = data.protocol;
|
|
||||||
t.localAddress = data.address;
|
|
||||||
t.localIsRemote = data.isRemote;
|
|
||||||
t.localPort = data.port;
|
|
||||||
locals[data.id] = t;
|
|
||||||
break;
|
|
||||||
}
|
|
||||||
case "inbound-rtp":{
|
|
||||||
let k = stats["inbound" + data.mediaType] = {};
|
|
||||||
k.mediaType = data.mediaType;
|
|
||||||
k.trackIdentifier = data.trackIdentifier;
|
|
||||||
k.bytesReceived = data.bytesReceived;
|
|
||||||
k.totalSamplesReceived = data.totalSamplesReceived;
|
|
||||||
k.totalSamplesDuration = data.totalSamplesDuration;
|
|
||||||
k.audioLevel = data.audioLevel;
|
|
||||||
k.packetsReceived = data.packetsReceived;
|
|
||||||
k.framesReceived = data.framesReceived;
|
|
||||||
k.frameWidth = data.frameWidth;
|
|
||||||
k.frameHeight = data.frameHeight;
|
|
||||||
k.framesPerSecond = data.framesPerSecond;
|
|
||||||
k.totalDecodeTime = data.totalDecodeTime;
|
|
||||||
k.totalProcessingDelay = data.totalProcessingDelay;
|
|
||||||
k.totalAssemblyTime = data.totalAssemblyTime;
|
|
||||||
k.decoderImplementation = data.decoderImplementation;
|
|
||||||
k.powerEfficientDecoder = data.powerEfficientDecoder;
|
|
||||||
break;
|
|
||||||
}
|
|
||||||
case "outbound-rtp":{
|
|
||||||
let k = stats["outbound" + data.mediaType] = {};
|
|
||||||
k.mediaType = data.mediaType;
|
|
||||||
k.bytesSent = data.bytesSent;
|
|
||||||
k.framesEncoded = data.framesEncoded;
|
|
||||||
k.totalEncodeTime = data.totalEncodeTime;
|
|
||||||
k.frameWidth = data.frameWidth;
|
|
||||||
k.frameHeight = data.frameHeight;
|
|
||||||
k.framesPerSecond = data.framesPerSecond;
|
|
||||||
k.framesSent = data.framesSent;
|
|
||||||
k.encoderImplementation = data.encoderImplementation;
|
|
||||||
k.powerEfficientEncoder = data.powerEfficientEncoder;
|
|
||||||
k.qualityLimitationReason = data.qualityLimitationReason;
|
|
||||||
break;
|
|
||||||
}
|
|
||||||
case "transport":{
|
|
||||||
stats.srtpCipher = data.srtpCipher;
|
|
||||||
stats.dtlsCipher = data.dtlsCipher;
|
|
||||||
stats.localcert = certs[data.localCertificateId];
|
|
||||||
stats.remotecert = certs[data.localCertificateId];
|
|
||||||
selectedCandidatePairId = data.selectedCandidatePairId;
|
|
||||||
break;
|
|
||||||
}
|
|
||||||
case "certificate":{
|
|
||||||
certs[data.id] = {
|
|
||||||
fingerprintAlgorithm: data.fingerprintAlgorithm,
|
|
||||||
fingerprint: data.fingerprint
|
|
||||||
};
|
|
||||||
break;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
};
|
|
||||||
|
|
||||||
if(selectedCandidatePairId)
|
|
||||||
{
|
|
||||||
let pair = candidatePairs[selectedCandidatePairId];
|
|
||||||
if(!pair.candidateRemoteCandidateId)
|
|
||||||
{
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
stats = {
|
|
||||||
...stats,
|
|
||||||
...pair,
|
|
||||||
...remotes[pair.candidateRemoteCandidateId],
|
|
||||||
...locals[pair.candidateLocalCandidateId]
|
|
||||||
};
|
|
||||||
}else{
|
|
||||||
let pair = Object.values(candidatePairs)[0];
|
|
||||||
stats = {
|
|
||||||
...stats,
|
|
||||||
...pair,
|
|
||||||
...Object.values(remotes)[0],
|
|
||||||
...Object.values(locals)[0]
|
|
||||||
};
|
|
||||||
}
|
|
||||||
|
|
||||||
if(!stats.inboundvideo)
|
|
||||||
{
|
|
||||||
return document.querySelector("#stats").innerHTML = "";
|
|
||||||
}
|
|
||||||
|
|
||||||
if(!relative)
|
|
||||||
{
|
|
||||||
relative = stats;
|
|
||||||
}
|
|
||||||
|
|
||||||
let turnused = stats.localCandidateType == "relay" || stats.remoteCandidateType == "relay";
|
|
||||||
|
|
||||||
document.querySelector("#stats").innerHTML = `
|
|
||||||
Signalization Server: ws.saqut.com<br>
|
|
||||||
TURN Server: Adjusted / ${turnused ? "Using now":"Never used"}<br>
|
|
||||||
STUN Server: Adjusted / used<br>
|
|
||||||
Websocket: Active connected<hr>
|
|
||||||
Local Candidate Type: ${{
|
|
||||||
host:"Direct Connection",
|
|
||||||
srflx: "Behind NAT (with STUN)",
|
|
||||||
prflx: "Proxy Connection (with STUN)",
|
|
||||||
relay: "TURN Server Connection"
|
|
||||||
}[stats.localCandidateType]}<br>
|
|
||||||
Local Protocol: ${stats.localProtocol}<br>
|
|
||||||
Local Address: ${stats.localAddress}<br>
|
|
||||||
Local Port: ${stats.localPort}<hr>
|
|
||||||
|
|
||||||
Remote Candidate Type: ${{
|
|
||||||
host:"Direct Connection",
|
|
||||||
srflx: "Behind NAT (with STUN)",
|
|
||||||
prflx: "Proxy Connection (with STUN)",
|
|
||||||
relay: "TURN Server Connection"
|
|
||||||
}[stats.remoteCandidateType]}<br>
|
|
||||||
Remote Protocol: ${stats.remoteProtocol}<br>
|
|
||||||
Remote Address: ${stats.remoteAddress}<br>
|
|
||||||
Remote Port: ${stats.remotePort}<hr>
|
|
||||||
|
|
||||||
Connection Total Bytes Send: Total: ${hfs(stats.candidateBytesSent)} | Current : ${hfs(stats.candidateBytesSent - relative.candidateBytesSent)}<br>
|
|
||||||
Connection Total Bytes Recaived: Total: ${hfs(stats.candidateBytesReceived)} | Current : ${hfs(stats.candidateBytesReceived - relative.candidateBytesReceived)}<br>
|
|
||||||
Connection Round Trip Time: ${stats.currentRoundTripTime}ms<hr>
|
|
||||||
|
|
||||||
Incoming Video Decoder: ${stats.inboundvideo.decoderImplementation}<br>
|
|
||||||
Incoming Frame Width: ${stats.inboundvideo.frameWidth}px<br>
|
|
||||||
Incoming Frame Height: ${stats.inboundvideo.frameHeight}px<br>
|
|
||||||
Incoming Frame Per Second: ${stats.inboundvideo.framesPerSecond}<br>
|
|
||||||
Incoming Decode Time (CPU Time): ${(stats.inboundvideo.totalDecodeTime - relative.inboundvideo.totalDecodeTime).toFixed(3)}ms<hr>
|
|
||||||
|
|
||||||
Outgoing Video Encoder: ${stats.outboundvideo.encoderImplementation}<br>
|
|
||||||
Outgoing Frame Width: ${stats.outboundvideo.frameWidth}px<br>
|
|
||||||
Outgoing Frame Height: ${stats.outboundvideo.frameHeight}px<br>
|
|
||||||
Outgoing Frame Per Second: ${stats.outboundvideo.framesPerSecond}<br>
|
|
||||||
Outgoing Decode Time (CPU Time): ${(stats.outboundvideo.totalEncodeTime - relative.outboundvideo.totalEncodeTime).toFixed(3)}ms<br>
|
|
||||||
Quality Increase Limitator: ${stats.outboundvideo.qualityLimitationReason}<hr>
|
|
||||||
|
|
||||||
Crypting SRTP Cipher: ${stats.srtpCipher}<br>
|
|
||||||
Crypting D-TLS Cipher: ${stats.dtlsCipher}<br>
|
|
||||||
${stats.localcert ? `EndToEnd Crypto Local Cert. Algoritm: ${stats.localcert.fingerprintAlgorithm}<br>
|
|
||||||
EndToEnd Crypto Remote Cert. Algoritm: ${stats.remotecert.fingerprintAlgorithm}<hr>` : ''}
|
|
||||||
Bitrate Booster: ${activePeer.turboBitrate==0?"Waiting conditions":activePeer.turboBitrate==1?"Boosting":"Fail"}<br>
|
|
||||||
Codec Handcooling : Failed<br>
|
|
||||||
Hardware Accelerated : Failed<hr>
|
|
||||||
|
|
||||||
MWSE Version: 0.7.0-beta<br>
|
|
||||||
Load Balancing: Active<br>
|
|
||||||
Max P2P Hardware Connection: ~${((Math.random()*5)|0) + 72}<br>
|
|
||||||
Max P2P Software Connection: ~24<br>
|
|
||||||
Max Server Connection: 231<br>
|
|
||||||
SDP Adaptation: Long time session<br>
|
|
||||||
`;
|
|
||||||
relative = stats;
|
|
||||||
};
|
|
||||||
|
|
||||||
function hfs(size) {
|
|
||||||
if(!size)return 0;
|
|
||||||
var i = size == 0 ? 0 : Math.floor(Math.log(size) / Math.log(1024));
|
|
||||||
return (size / Math.pow(1024, i)).toFixed(2) * 1 + ' ' + ['B', 'kB', 'MB', 'GB', 'TB'][i];
|
|
||||||
}
|
|
Loading…
Reference in New Issue