diff --git a/web/plugin.head.html b/web/plugin.head.html
index 44b0784..f8a5c06 100644
--- a/web/plugin.head.html
+++ b/web/plugin.head.html
@@ -12,7 +12,7 @@
html:not(.politictalk-direct-access-blocked) {
--politictalk-avatar-background: #63477a;
- --politictalk-stage-bottom-inset: 92px;
+ --politictalk-stage-bottom-inset: 128px;
--politictalk-stage-side-inset: 8px;
--politictalk-stage-top-inset: 96px;
--politictalk-tile-border-color: rgba(179, 165, 228, 0.72);
@@ -44,15 +44,29 @@
}
html.politictalk-stage-brand-inset:not(.politictalk-direct-access-blocked) #videospace {
- bottom: var(--politictalk-stage-bottom-inset, 92px) !important;
+ bottom: var(--politictalk-stage-bottom-inset, 128px) !important;
box-sizing: border-box !important;
- height: calc(100% - var(--politictalk-stage-top-inset, 96px) - var(--politictalk-stage-bottom-inset, 92px)) !important;
+ height: calc(100% - var(--politictalk-stage-top-inset, 96px) - var(--politictalk-stage-bottom-inset, 128px)) !important;
left: var(--politictalk-stage-side-inset, 8px) !important;
right: var(--politictalk-stage-side-inset, 8px) !important;
top: var(--politictalk-stage-top-inset, 96px) !important;
width: auto !important;
}
+ html.politictalk-stage-brand-inset:not(.politictalk-direct-access-blocked) #videospace .filmstrip,
+ html.politictalk-stage-brand-inset:not(.politictalk-direct-access-blocked) #videospace #remoteVideos,
+ html.politictalk-stage-brand-inset:not(.politictalk-direct-access-blocked) #videospace .filmstrip__videos,
+ html.politictalk-stage-brand-inset:not(.politictalk-direct-access-blocked) #videospace .remote-videos {
+ height: 100% !important;
+ max-height: 100% !important;
+ min-height: 0 !important;
+ overflow: hidden !important;
+ }
+
+ html.politictalk-stage-brand-inset:not(.politictalk-direct-access-blocked) #videospace .remote-videos > div {
+ max-height: 100% !important;
+ }
+
html:not(.politictalk-direct-access-blocked) #videospace .politictalk-themed-tile {
background: transparent !important;
background-color: transparent !important;
@@ -60,6 +74,15 @@
box-sizing: border-box !important;
}
+ html:not(.politictalk-direct-access-blocked) #videospace #largeVideoContainer,
+ html:not(.politictalk-direct-access-blocked) #videospace #largeVideoContainer.politictalk-themed-tile,
+ html:not(.politictalk-direct-access-blocked) #videospace .filmstrip,
+ html:not(.politictalk-direct-access-blocked) #videospace .filmstrip__videos,
+ html:not(.politictalk-direct-access-blocked) #videospace .remote-videos {
+ border: 0 !important;
+ outline: 0 !important;
+ }
+
html:not(.politictalk-direct-access-blocked) #videospace .politictalk-tile-transparent-layer {
background: transparent !important;
background-color: transparent !important;
@@ -67,6 +90,21 @@
}
html:not(.politictalk-direct-access-blocked) #videospace .politictalk-avatar-shell {
+ background: transparent !important;
+ border-radius: 50% !important;
+ overflow: hidden !important;
+ }
+
+ html:not(.politictalk-direct-access-blocked) #videospace .avatar-container,
+ html:not(.politictalk-direct-access-blocked) #videospace #dominantSpeakerAvatarContainer {
+ background: transparent !important;
+ border-radius: 50% !important;
+ overflow: hidden !important;
+ }
+
+ html:not(.politictalk-direct-access-blocked) #videospace .avatar:not(img),
+ html:not(.politictalk-direct-access-blocked) #videospace .userAvatar:not(img),
+ html:not(.politictalk-direct-access-blocked) #videospace #dominantSpeakerAvatar:not(img) {
border-radius: 50% !important;
overflow: hidden !important;
}
@@ -81,7 +119,9 @@
html:not(.politictalk-direct-access-blocked) #videospace .politictalk-avatar-shell canvas,
html:not(.politictalk-direct-access-blocked) #videospace .politictalk-avatar-themed > img,
html:not(.politictalk-direct-access-blocked) #videospace .politictalk-avatar-themed picture,
- html:not(.politictalk-direct-access-blocked) #videospace .politictalk-avatar-themed picture > img {
+ html:not(.politictalk-direct-access-blocked) #videospace .politictalk-avatar-themed picture > img,
+ html:not(.politictalk-direct-access-blocked) #videospace img.avatar,
+ html:not(.politictalk-direct-access-blocked) #videospace img.userAvatar {
border-radius: 50% !important;
}
@@ -553,7 +593,7 @@
}
html:not(.politictalk-direct-access-blocked) {
- --politictalk-stage-bottom-inset: 104px;
+ --politictalk-stage-bottom-inset: 132px;
--politictalk-stage-side-inset: 6px;
--politictalk-stage-top-inset: 88px;
}
@@ -1239,6 +1279,16 @@
return false;
}
+ var elementId = element.id || '';
+
+ if (elementId === 'largeVideoContainer'
+ || elementId === 'largeVideoElementsContainer'
+ || elementId === 'largeVideoWrapper'
+ || elementId === 'dominantSpeaker'
+ || elementId === 'dominantSpeakerAvatarContainer') {
+ return false;
+ }
+
var rect = element.getBoundingClientRect();
if (rect.width < 160 || rect.height < 140) {
@@ -1249,10 +1299,11 @@
return false;
}
- var elementId = element.id || '';
var className = String(element.className || '');
- if (elementId === 'localVideo_container' || elementId.indexOf('remoteVideo_') === 0) {
+ if (elementId === 'localVideo_container'
+ || elementId.indexOf('remoteVideo_') === 0
+ || elementId.indexOf('participant_') === 0) {
return true;
}
@@ -1268,6 +1319,7 @@
var candidates = Array.prototype.slice.call(videospace.querySelectorAll([
'#localVideo_container',
'[id^="remoteVideo_"]',
+ '[id^="participant_"]',
'.videocontainer',
'.video-container'
].join(','))).filter(function(candidate) {
@@ -1323,6 +1375,32 @@
return Boolean(text) && text.length <= 4;
}
+ function getPoliticTalkInitialsAvatarTarget(element) {
+ if (!element) {
+ return null;
+ }
+
+ var elementId = element.id || '';
+ var className = String(element.className || '');
+ var isAvatarElement = elementId === 'dominantSpeakerAvatar'
+ || /(^|\s)(avatar|userAvatar)(\s|$)/.test(className)
+ || /avatar/i.test(className);
+
+ if (isAvatarElement && isPoliticTalkInitialsAvatar(element)) {
+ return element;
+ }
+
+ return Array.prototype.slice.call(element.querySelectorAll([
+ '#dominantSpeakerAvatar:not(img)',
+ '.avatar:not(img)',
+ '.userAvatar:not(img)',
+ '[class*="avatar"]:not(img)',
+ '[class*="Avatar"]:not(img)'
+ ].join(','))).find(function(candidate) {
+ return isPoliticTalkInitialsAvatar(candidate);
+ }) || null;
+ }
+
function isPoliticTalkTransparentTileLayer(element, tile) {
if (!element || element === tile || element.classList.contains('politictalk-avatar-shell')) {
return false;
@@ -1378,10 +1456,12 @@
tile.querySelectorAll('div, span').forEach(function(candidate) {
if (isPoliticTalkAvatarShell(candidate, tile)) {
+ var initialsTarget = getPoliticTalkInitialsAvatarTarget(candidate);
+
candidate.classList.add('politictalk-avatar-shell');
- if (isPoliticTalkInitialsAvatar(candidate)) {
- candidate.classList.add('politictalk-avatar-themed');
+ if (initialsTarget) {
+ initialsTarget.classList.add('politictalk-avatar-themed');
}
return;