Spotlight: double focused participant size (2x widget width + window)
CI / ci (push) Successful in 38s
Release Creation / build (release) Successful in 42s

- _prepareContext doubles widgetWidth when _focusedUserId is set
- _onRender multiplies strip window dimensions by 2 in spotlight mode
- --sp-widget-width CSS var uses doubled value so tile renders at 2x
This commit is contained in:
2026-05-27 11:57:34 +02:00
parent 9e80c2c028
commit 156f786448
+9 -3
View File
@@ -274,6 +274,8 @@ export class ScryingPoolStrip extends _AppBase {
const widgetWidthMd = this._adapter.settings?.get?.('widgetWidthMd') ?? '150';
const isLarge = effectiveSize === 'md';
const effectiveWidth = isLarge ? widgetWidthMd : widgetWidthSm;
const isSpotlightActive = !!this._focusedUserId;
const widgetWidth = isSpotlightActive ? String(parseInt(effectiveWidth, 10) * 2) : effectiveWidth;
const isGM = this._adapter.users.isGM?.() ?? false;
@@ -294,7 +296,8 @@ export class ScryingPoolStrip extends _AppBase {
hasStreamAccess,
isGM,
// Story 5.2: Video widget width customization
widgetWidth: effectiveWidth,
isSpotlightActive,
widgetWidth,
// Tile shape
tileShape,
// Tile border
@@ -436,12 +439,15 @@ export class ScryingPoolStrip extends _AppBase {
setVar('--sp-tile-border-active', bw > 0 ? '1' : '0');
// Sync the outer Application window width with the selected dock layout.
// Spotlight mode doubles the strip window to fit the enlarged tile.
if (typeof this.setPosition === 'function') {
const layout = context?.dockLayout ?? 'vertical-sm';
const n = context?.participants?.length ?? 0;
const width = this._computeStripWidth(layout, n);
const spotlightMultiplier = context?.isSpotlightActive ? 2 : 1;
const width = this._computeStripWidth(layout, n) * spotlightMultiplier;
const height = this._computeStripHeight(layout, n);
this.setPosition(height === 'auto' ? { width, height: 'auto' } : { width, height });
const adjustedHeight = height === 'auto' ? 'auto' : height * spotlightMultiplier;
this.setPosition(adjustedHeight === 'auto' ? { width, height: 'auto' } : { width, height: adjustedHeight });
}
}