diff --git a/web/plugin.head.html b/web/plugin.head.html index a76d350..45c99f0 100644 --- a/web/plugin.head.html +++ b/web/plugin.head.html @@ -2411,19 +2411,60 @@ return String(value || '').replace(/\s+/g, ' ').trim(); } - function getPoliticTalkDominantSpeakerRoleMetadata(videospace, tiles) { + function normalizePoliticTalkDisplayName(value) { + return String(value || '') + .replace(/\(you\)/ig, '') + .replace(/\bmoderator\b/ig, '') + .replace(/\s+/g, ' ') + .trim() + .toLowerCase(); + } + + function getPoliticTalkRoleMetadataForDisplayName(displayName, videospace, tiles, thumbnails) { + var normalizedName = normalizePoliticTalkDisplayName(displayName); + + if (!normalizedName) { + return null; + } + + var matchingRow = getPoliticTalkParticipantPaneRows().find(function(row) { + return normalizePoliticTalkDisplayName(getPoliticTalkParticipantPaneDisplayName(row)) === normalizedName; + }); + + if (matchingRow) { + return getPoliticTalkParticipantPaneRoleMetadata(matchingRow, videospace, tiles, thumbnails) + || getPoliticTalkRoleMetadataFromElement(matchingRow); + } + + var candidates = (thumbnails || []).concat(tiles || []); + var matchingCandidate = candidates.find(function(candidate) { + return normalizePoliticTalkDisplayName(getPoliticTalkVisibleDisplayName(candidate)) === normalizedName; + }); + + if (matchingCandidate) { + return getPoliticTalkTileRoleMetadata(matchingCandidate) + || getPoliticTalkRoleMetadataFromElement(matchingCandidate); + } + + return null; + } + + function getPoliticTalkDominantSpeakerRoleMetadata(videospace, tiles, thumbnails) { var dominantName = getPoliticTalkVisibleDisplayName( videospace.querySelector('[data-testid="stage-display-name"]') ); - var candidates = tiles || []; + var candidates = (thumbnails || []).concat(tiles || []); if (dominantName) { - var matchingTile = candidates.find(function(tile) { - return getPoliticTalkVisibleDisplayName(tile) === dominantName; - }); + var matchingMetadata = getPoliticTalkRoleMetadataForDisplayName( + dominantName, + videospace, + tiles, + thumbnails + ); - if (matchingTile) { - return getPoliticTalkTileRoleMetadata(matchingTile) || getPoliticTalkGuestRoleMetadata(); + if (matchingMetadata) { + return matchingMetadata; } } @@ -2434,7 +2475,7 @@ return getPoliticTalkLocalRoleMetadata(); } - function applyPoliticTalkDominantSpeakerTheme(videospace, tiles, metadataOverride) { + function applyPoliticTalkDominantSpeakerTheme(videospace, tiles, thumbnails, metadataOverride) { var avatar = videospace.querySelector('#dominantSpeakerAvatar'); var avatarContainer = videospace.querySelector('#dominantSpeakerAvatarContainer'); @@ -2442,7 +2483,7 @@ return; } - var metadata = metadataOverride || getPoliticTalkDominantSpeakerRoleMetadata(videospace, tiles); + var metadata = metadataOverride || getPoliticTalkDominantSpeakerRoleMetadata(videospace, tiles, thumbnails); var roleWasApplied = applyPoliticTalkRoleToElement(avatar, metadata); addPoliticTalkClass(avatar, 'politictalk-avatar-themed'); @@ -2633,14 +2674,16 @@ var tiles = getPoliticTalkTileCandidates(videospace); var thumbnails = getPoliticTalkThumbnailCandidates(videospace); + applyPoliticTalkParticipantPaneAvatarTheme(videospace, tiles, thumbnails); + var dominantName = getPoliticTalkVisibleDisplayName( videospace.querySelector('[data-testid="stage-display-name"]') ); - var dominantMetadata = getPoliticTalkDominantSpeakerRoleMetadata(videospace, tiles); + var dominantMetadata = getPoliticTalkDominantSpeakerRoleMetadata(videospace, tiles, thumbnails); applyPoliticTalkLargeVideoLayout(videospace, tiles); applyPoliticTalkTileLayout(videospace, tiles); - applyPoliticTalkDominantSpeakerTheme(videospace, tiles, dominantMetadata); + applyPoliticTalkDominantSpeakerTheme(videospace, tiles, thumbnails, dominantMetadata); tiles.forEach(function(tile) { addPoliticTalkClass(tile, 'politictalk-themed-tile');