diff --git a/static/sfu.css b/static/sfu.css index 900bb1b..453d22a 100644 --- a/static/sfu.css +++ b/static/sfu.css @@ -171,6 +171,10 @@ h1 { margin-top: 5px; } +.label-fallback { + opacity: 0.5; +} + #inputform { width: 100%; } diff --git a/static/sfu.js b/static/sfu.js index 9a683cc..4886d0b 100644 --- a/static/sfu.js +++ b/static/sfu.js @@ -233,12 +233,21 @@ function delMedia(id) { mediadiv.removeChild(peer); } -function setLabel(id) { +function setLabel(id, fallback) { let label = document.getElementById('label-' + id); if(!label) return; let l = down[id] ? down[id].label : null; - label.textContent = l ? l : ''; + if(l) { + label.textContent = l; + label.classList.remove('label-fallback'); + } else if(fallback) { + label.textContent = fallback; + label.classList.add('label-fallback'); + } else { + label.textContent = ''; + label.classList.remove('label-fallback'); + } } function serverConnect() { @@ -429,6 +438,20 @@ async function setMaxBitrate(id, audio, video) { await s.setParameters(p); } } + + if((audio && audio < 128000) || (video && video < 256000)) { + let l = ''; + if(audio) + l = `${Math.round(audio/1000)}kbps` + if(video) { + if(l) + l = l + ' + '; + l = l + `${Math.round(video/1000)}kbps` + } + setLabel(id, l) + } else { + setLabel(id); + } } async function addIceCandidates(conn) {