amardeep/politictalk
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

position fina

Browse Source
This commit is contained in:
Amardeep
2026-06-06 02:27:46 +05:30
parent 12431f5658
commit 532fdd98d8
1 changed files with 82 additions and 8 deletions
Download Patch File Download Diff File Expand all files Collapse all files

90
web/plugin.head.html
View File

@@ -87,7 +87,10 @@
max-height: 100% !important;
}
html:not(.politictalk-direct-access-blocked) #videospace .politictalk-themed-tile {
html:not(.politictalk-direct-access-blocked) #videospace .politictalk-themed-tile,
html:not(.politictalk-direct-access-blocked) #videospace #remoteVideos [id^="participant_"],
html:not(.politictalk-direct-access-blocked) #videospace #remoteVideos [id^="remoteVideo_"],
html:not(.politictalk-direct-access-blocked) #videospace #remoteVideos #localVideo_container {
background: transparent !important;
background-color: transparent !important;
border: 0 !important;
@@ -115,7 +118,10 @@
--politictalk-tile-border-color: #63477a;
}
html:not(.politictalk-direct-access-blocked) #videospace .politictalk-themed-tile::after {
html:not(.politictalk-direct-access-blocked) #videospace .politictalk-themed-tile::after,
html:not(.politictalk-direct-access-blocked) #videospace #remoteVideos [id^="participant_"]::after,
html:not(.politictalk-direct-access-blocked) #videospace #remoteVideos [id^="remoteVideo_"]::after,
html:not(.politictalk-direct-access-blocked) #videospace #remoteVideos #localVideo_container::after {
border: 2px solid var(--politictalk-tile-border-color, #63477a) !important;
border-radius: 3px !important;
bottom: 2px;
@@ -144,6 +150,14 @@
background-image: none !important;
}
html:not(.politictalk-direct-access-blocked) #videospace #remoteVideos [id^="participant_"] > [class*="containerBackground"],
html:not(.politictalk-direct-access-blocked) #videospace #remoteVideos [id^="remoteVideo_"] > [class*="containerBackground"],
html:not(.politictalk-direct-access-blocked) #videospace #remoteVideos #localVideo_container > [class*="containerBackground"] {
background: transparent !important;
background-color: transparent !important;
background-image: none !important;
}
html:not(.politictalk-direct-access-blocked) #videospace .politictalk-avatar-shell {
background: transparent !important;
border-radius: 50% !important;
@@ -157,6 +171,28 @@
overflow: hidden !important;
}
html:not(.politictalk-direct-access-blocked) #videospace .politictalk-themed-tile > .avatar-container,
html:not(.politictalk-direct-access-blocked) #videospace .politictalk-themed-tile > [class*="avatar-container"],
html:not(.politictalk-direct-access-blocked) #videospace .politictalk-themed-tile > [class*="avatarContainer"],
html:not(.politictalk-direct-access-blocked) #videospace #remoteVideos [id^="participant_"] > .avatar-container,
html:not(.politictalk-direct-access-blocked) #videospace #remoteVideos [id^="participant_"] > [class*="avatar-container"],
html:not(.politictalk-direct-access-blocked) #videospace #remoteVideos [id^="participant_"] > [class*="avatarContainer"],
html:not(.politictalk-direct-access-blocked) #videospace #remoteVideos [id^="remoteVideo_"] > .avatar-container,
html:not(.politictalk-direct-access-blocked) #videospace #remoteVideos [id^="remoteVideo_"] > [class*="avatar-container"],
html:not(.politictalk-direct-access-blocked) #videospace #remoteVideos [id^="remoteVideo_"] > [class*="avatarContainer"],
html:not(.politictalk-direct-access-blocked) #videospace #remoteVideos #localVideo_container > .avatar-container,
html:not(.politictalk-direct-access-blocked) #videospace #remoteVideos #localVideo_container > [class*="avatar-container"],
html:not(.politictalk-direct-access-blocked) #videospace #remoteVideos #localVideo_container > [class*="avatarContainer"] {
bottom: auto !important;
left: 50% !important;
margin: 0 !important;
position: absolute !important;
right: auto !important;
top: 50% !important;
transform: translate(-50%, -50%) !important;
}
html:not(.politictalk-direct-access-blocked) #largeVideoContainer #dominantSpeaker {
align-items: center !important;
bottom: 0 !important;
@@ -1764,6 +1800,7 @@
function getPoliticTalkTileCandidates(videospace) {
var stageRect = videospace.getBoundingClientRect();
var renderedTiles = getPoliticTalkRenderedParticipantTiles(videospace, 160, 140);
var candidates = Array.prototype.slice.call(videospace.querySelectorAll([
'#localVideo_container',
'[id^="remoteVideo_"]',
@@ -1774,8 +1811,12 @@
return isPoliticTalkTileCandidate(candidate, stageRect);
});
return candidates.filter(function(candidate) {
return !candidates.some(function(otherCandidate) {
var uniqueCandidates = renderedTiles.concat(candidates).filter(function(candidate, index, allCandidates) {
return allCandidates.indexOf(candidate) === index;
});
return uniqueCandidates.filter(function(candidate) {
return !uniqueCandidates.some(function(otherCandidate) {
return otherCandidate !== candidate
&& candidate.contains(otherCandidate)
&& getPoliticTalkElementArea(otherCandidate) >= 12000;
@@ -1805,14 +1846,16 @@
});
}
function getPoliticTalkRenderedParticipantTileCount(videospace) {
function getPoliticTalkRenderedParticipantTiles(videospace, minimumWidth, minimumHeight) {
if (!videospace) {
return 0;
return [];
}
var remoteVideos = videospace.querySelector('#remoteVideos') || videospace.querySelector('.remote-videos');
var scope = remoteVideos || videospace;
var countedIds = {};
var minWidth = Number.isFinite(minimumWidth) ? minimumWidth : 44;
var minHeight = Number.isFinite(minimumHeight) ? minimumHeight : 44;
return Array.prototype.slice.call(scope.querySelectorAll([
'#localVideo_container',
@@ -1832,14 +1875,18 @@
var rect = candidate.getBoundingClientRect();
var styles = window.getComputedStyle(candidate);
if (rect.width < 44 || rect.height < 44 || styles.display === 'none' || styles.visibility === 'hidden') {
if (rect.width < minWidth || rect.height < minHeight || styles.display === 'none' || styles.visibility === 'hidden') {
return false;
}
countedIds[candidateId] = true;
return true;
}).length;
});
}
function getPoliticTalkRenderedParticipantTileCount(videospace) {
return getPoliticTalkRenderedParticipantTiles(videospace, 44, 44).length;
}
function isPoliticTalkAvatarShell(element, tile) {
@@ -1936,6 +1983,31 @@
&& backgroundColor !== 'transparent';
}
function centerPoliticTalkTileAvatar(tile) {
if (!tile) {
return;
}
Array.prototype.slice.call(tile.children || []).forEach(function(candidate) {
var className = String(candidate.className || '');
var isAvatarContainer = candidate.classList.contains('avatar-container')
|| className.indexOf('avatar-container') !== -1
|| className.indexOf('avatarContainer') !== -1;
if (!isAvatarContainer) {
return;
}
setPoliticTalkImportantStyle(candidate, 'bottom', 'auto');
setPoliticTalkImportantStyle(candidate, 'left', '50%');
setPoliticTalkImportantStyle(candidate, 'margin', '0');
setPoliticTalkImportantStyle(candidate, 'position', 'absolute');
setPoliticTalkImportantStyle(candidate, 'right', 'auto');
setPoliticTalkImportantStyle(candidate, 'top', '50%');
setPoliticTalkImportantStyle(candidate, 'transform', 'translate(-50%, -50%)');
});
}
function getPoliticTalkAvailableTileHeight(videospace) {
var videospaceRect = videospace.getBoundingClientRect();
var toolbar = getVisiblePoliticTalkToolbar();
@@ -2421,6 +2493,7 @@
setPoliticTalkImportantStyle(metric.tile, 'max-height', nextHeight + 'px');
setPoliticTalkImportantStyle(metric.tile, 'box-sizing', 'border-box');
setPoliticTalkImportantStyle(metric.tile, 'overflow', 'hidden');
centerPoliticTalkTileAvatar(metric.tile);
});
}
@@ -2453,6 +2526,7 @@
applyPoliticTalkRoleToTile(tile, metadata);
applyPoliticTalkAvatarThemeInContainer(tile, metadata);
centerPoliticTalkTileAvatar(tile);
tile.querySelectorAll('div, span').forEach(function(candidate) {
if (isPoliticTalkTransparentTileLayer(candidate, tile)) {