Add re-order, spotlight/focus, and auto-position-snapshots features

- HTML5 drag-and-drop reordering of strip participants (per-GM flag)
- Shift+click toggles spotlight focus on a participant (gold ring indicator)
- Escape exits focus mode
- Auto-save strip position on drag end + every 30s with viewport validation
- Reset strip position button in Director's Board
- French locale strings for reset button
This commit is contained in:
2026-05-27 11:44:24 +02:00
parent 816b7951fb
commit 9e80c2c028
44 changed files with 1770 additions and 11 deletions
+9 -2
View File
@@ -120,7 +120,7 @@
<div class="directors-board__widget-width-row">
<span>{{localize "scrying-pool.directorsBoard.widgetWidth.small"}}</span>
<select class="directors-board__widget-width-select" data-action="set-widget-width-sm" data-selected="{{widgetWidthSm}}">
{{#each widthOptions}}
{{#each smWidthOptions}}
<option value="{{this.value}}">{{this.label}}</option>
{{/each}}
</select>
@@ -128,7 +128,7 @@
<div class="directors-board__widget-width-row">
<span>{{localize "scrying-pool.directorsBoard.widgetWidth.large"}}</span>
<select class="directors-board__widget-width-select" data-action="set-widget-width-md" data-selected="{{widgetWidthMd}}">
{{#each widthOptions}}
{{#each mdWidthOptions}}
<option value="{{this.value}}">{{this.label}}</option>
{{/each}}
</select>
@@ -137,6 +137,13 @@
</div>
<footer class="directors-board__footer">
<div class="directors-board__footer-group directors-board__footer-group--strip">
<button type="button" class="directors-board__footer-btn directors-board__footer-btn--secondary" data-action="reset-strip-position"
data-tooltip="{{localize "scrying-pool.directorsBoard.footer.resetStrip"}}">
<i class="fas fa-undo-alt" aria-hidden="true"></i>
{{localize "scrying-pool.directorsBoard.footer.resetStrip"}}
</button>
</div>
<div class="directors-board__footer-group directors-board__footer-group--presets">
<button type="button" class="directors-board__footer-btn" data-action="save-preset"
data-tooltip="{{localize "scrying-pool.directorsBoard.footer.savePreset"}}">
+1 -1
View File
@@ -51,7 +51,7 @@
{{#each participants}}
<li class="sp-strip__participant-item" role="listitem">
{{!-- ParticipantAvatar (44×44px container) --}}
<button class="sp-participant-avatar sp-state-{{state}}{{#if hasPendingOp}} sp-state-pending{{/if}} sp-shape-{{../tileShape}}"
<button class="sp-participant-avatar sp-state-{{state}}{{#if hasPendingOp}} sp-state-pending{{/if}}{{#if isFocused}} sp-state-focused{{/if}} sp-shape-{{../tileShape}}"
data-user-id="{{userId}}"
data-action="open-popover"
role="button"