diff --git a/assets/css/components/calls/window.css b/assets/css/components/calls/window.css index 68cbbe9f..072a297a 100644 --- a/assets/css/components/calls/window.css +++ b/assets/css/components/calls/window.css @@ -130,6 +130,14 @@ flex-direction: column; } +.call-window .videos-area .video video { + border: 2px transparent solid; +} + +.call-window .videos-area .video video.talking { + border: 2px green solid; +} + .call-window .videos-area .video video { width: 100%; height: 100%; diff --git a/assets/js/components/calls/window.js b/assets/js/components/calls/window.js index 8ea4004e..0bfb4e5f 100644 --- a/assets/js/components/calls/window.js +++ b/assets/js/components/calls/window.js @@ -813,9 +813,15 @@ class CallWindow extends CustomEvents { const avg = sum/count; if(avg > 50) + { memberEl.classList.add("talking") + videoEl.classList.add("talking") + } else + { memberEl.classList.remove("talking"); + videoEl.classList.remove("talking") + } } @@ -829,6 +835,7 @@ class CallWindow extends CustomEvents { analyzer_node.disconnect(); memberEl.classList.remove("talking") + videoEl.classList.remove("talking") } })