in demo-website/src/meeting.js [994:1033]
updateTilePlacement(tileIndex, x, y, w, h) {
const tile = document.getElementById(`tile-${tileIndex}`);
const insetWidthSize = 4;
const insetHeightSize = insetWidthSize / (16 / 9);
tile.style.position = 'absolute';
tile.style.left = `${x + insetWidthSize}px`;
tile.style.top = `${y + insetHeightSize}px`;
tile.style.width = `${w - insetWidthSize * 2}px`;
tile.style.height = `${h - insetHeightSize * 2}px`;
tile.style.margin = '0';
tile.style.padding = '0';
tile.style.visibility = 'visible';
const video = document.getElementById(`video-${tileIndex}`);
if (video) {
video.style.position = 'absolute';
video.style.left = '0';
video.style.top = '0';
video.style.width = `${w}px`;
video.style.height = `${h}px`;
video.style.margin = '0';
video.style.padding = '0';
video.style.borderRadius = '8px';
}
const nameplate = document.getElementById(`nameplate-${tileIndex}`);
const nameplateSize = 24;
const nameplatePadding = 10;
nameplate.style.position = 'absolute';
nameplate.style.left = '0px';
nameplate.style.top = `${h - nameplateSize - nameplatePadding}px`;
nameplate.style.height = `${nameplateSize}px`;
nameplate.style.width = `${w}px`;
nameplate.style.margin = '0';
nameplate.style.padding = '0';
nameplate.style.paddingLeft = `${nameplatePadding}px`;
nameplate.style.color = '#fff';
nameplate.style.backgroundColor = 'rgba(0,0,0,0)';
nameplate.style.textShadow = '0px 0px 5px black';
nameplate.style.letterSpacing = '0.1em';
nameplate.style.fontSize = `${nameplateSize - 6}px`;
}