diff --git a/web/plugin.head.html b/web/plugin.head.html index c7f649f..92a2dd0 100644 --- a/web/plugin.head.html +++ b/web/plugin.head.html @@ -198,7 +198,11 @@ html:not(.politictalk-direct-access-blocked) #largeVideoContainer.politictalk-hide-dominant-speaker #dominantSpeaker, html:not(.politictalk-direct-access-blocked) #largeVideoContainer.politictalk-hide-dominant-speaker [data-testid="stage-display-name"], html:not(.politictalk-direct-access-blocked) #largeVideoContainer.politictalk-hide-dominant-speaker #remotePresenceMessage, - html:not(.politictalk-direct-access-blocked) #largeVideoContainer.politictalk-hide-dominant-speaker #remoteConnectionMessage { + html:not(.politictalk-direct-access-blocked) #largeVideoContainer.politictalk-hide-dominant-speaker #remoteConnectionMessage, + html.politictalk-multi-tile-view:not(.politictalk-direct-access-blocked) #largeVideoContainer #dominantSpeaker, + html.politictalk-multi-tile-view:not(.politictalk-direct-access-blocked) #largeVideoContainer [data-testid="stage-display-name"], + html.politictalk-multi-tile-view:not(.politictalk-direct-access-blocked) #largeVideoContainer #remotePresenceMessage, + html.politictalk-multi-tile-view:not(.politictalk-direct-access-blocked) #largeVideoContainer #remoteConnectionMessage { opacity: 0 !important; pointer-events: none !important; visibility: hidden !important; @@ -1801,6 +1805,43 @@ }); } + function getPoliticTalkRenderedParticipantTileCount(videospace) { + if (!videospace) { + return 0; + } + + var remoteVideos = videospace.querySelector('#remoteVideos') || videospace.querySelector('.remote-videos'); + var scope = remoteVideos || videospace; + var countedIds = {}; + + return Array.prototype.slice.call(scope.querySelectorAll([ + '#localVideo_container', + '[id^="remoteVideo_"]', + '[id^="participant_"]' + ].join(','))).filter(function(candidate) { + if (!candidate || candidate.id === 'largeVideoContainer' || candidate.closest('#largeVideoContainer')) { + return false; + } + + var candidateId = candidate.id || ''; + + if (!candidateId || countedIds[candidateId]) { + return false; + } + + var rect = candidate.getBoundingClientRect(); + var styles = window.getComputedStyle(candidate); + + if (rect.width < 44 || rect.height < 44 || styles.display === 'none' || styles.visibility === 'hidden') { + return false; + } + + countedIds[candidateId] = true; + + return true; + }).length; + } + function isPoliticTalkAvatarShell(element, tile) { if (!element || element === tile || element.tagName === 'IMG' || element.tagName === 'CANVAS') { return false; @@ -2261,6 +2302,7 @@ } largeVideoContainer.classList.toggle('politictalk-hide-dominant-speaker', !shouldShow); + document.documentElement.classList.toggle('politictalk-multi-tile-view', !shouldShow); [ largeVideoContainer.querySelector('#dominantSpeaker'), @@ -2289,7 +2331,11 @@ return; } - setPoliticTalkDominantSpeakerLayerVisibility(videospace, !tiles || tiles.length <= 1); + var candidateTileCount = Array.isArray(tiles) ? tiles.length : 0; + var renderedTileCount = getPoliticTalkRenderedParticipantTileCount(videospace); + var visibleTileCount = Math.max(candidateTileCount, renderedTileCount); + + setPoliticTalkDominantSpeakerLayerVisibility(videospace, visibleTileCount <= 1); var availableHeight = getPoliticTalkAvailableTileHeight(videospace);