Story 4.1: Tasks 3-6 Complete - Director's Board Integration & Settings Menu

- Task 3: Extended FoundryAdapter with user flag access methods
  - Added getFlag(userId, scope, key) method
  - Added setFlag(userId, scope, key, value) method
  - Added getFlagModule(userId, key) convenience method
  - Added setFlagModule(userId, key, value) convenience method

- Task 4: Integrated Privacy Settings with Director's Board
  - Updated participant-card.hbs to show Reaction Cam badge
  - Modified boardUtils.js to pass playerPrivacyManager through context
  - Updated DirectorsBoard to accept and pass playerPrivacyManager
  - Added CSS styles for Reaction Cam badge (SP accent color)

- Task 5: Registered PlayerPrivacyPanel in module settings
  - Added settings menu registration in module.js Hooks.once('ready')
  - Available to all users (restricted: false)
  - Uses localized labels and hints

- Task 6: Added all localization strings
  - Added SCRYING_POOL.PrivacyPanel.* strings for panel UI
  - Added SCRYING_POOL.Settings.* strings for settings menu

- Updated story file with task completion status

Generated by Mistral Vibe.
Co-Authored-By: Mistral Vibe <vibe@mistral.ai>
This commit is contained in:
2026-05-23 21:29:58 +02:00
parent 61f362004e
commit fd0a7868f3
13 changed files with 1049 additions and 47 deletions
+27
View File
@@ -39,6 +39,7 @@
height: 48px;
margin: 8px auto 4px;
flex-shrink: 0;
position: relative;
img {
width: 100%;
@@ -47,6 +48,32 @@
object-fit: cover;
display: block;
}
// ── Badge (Reaction Cam enabled indicator) ─────────────────────────────
&-badge {
position: absolute;
width: 16px;
height: 16px;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
font-size: 8px;
border: 1px solid var(--sp-surface);
box-shadow: 0 0 0 2px var(--sp-surface);
i {
font-size: 10px;
color: var(--sp-text-primary);
}
&--reaction-cam {
background: var(--sp-accent);
bottom: 0;
right: 0;
cursor: help;
}
}
}
// ── Name (12px, 2-line truncate) ─────────────────────────────────────────
@@ -0,0 +1,171 @@
/**
* Player Privacy Panel styles.
*
* Uses SP (Scrying Pool) semantic token system.
* All colors and spacing come from SP tokens, not Foundry tokens directly.
*/
// Import SP tokens
@import "../tokens/_base.less";
.scrying-pool {
// Container
.player-privacy-panel__container {
display: flex;
flex-direction: column;
min-width: 300px;
max-width: 400px;
}
// Header
.player-privacy-panel__header {
padding: @sp-spacing-sm @sp-spacing-md;
border-bottom: 1px solid var(--sp-border);
background: var(--sp-surface);
}
.player-privacy-panel__title {
margin: 0;
font-size: 1.1em;
font-weight: 600;
color: var(--sp-text-primary);
text-align: center;
}
// Body
.player-privacy-panel__body {
padding: @sp-spacing-md;
background: var(--sp-surface);
}
// Notice (read-only)
.player-privacy-panel__notice {
padding: @sp-spacing-sm @sp-spacing-md;
margin-bottom: @sp-spacing-md;
border-radius: @sp-border-radius;
font-size: 0.85em;
text-align: center;
}
.player-privacy-panel__notice--readonly {
background: var(--sp-urgency-awareness);
color: var(--sp-text-secondary);
border: 1px solid var(--sp-border);
}
// Section
.player-privacy-panel__section {
margin-bottom: @sp-spacing-md;
}
.player-privacy-panel__section-header {
margin: 0 0 @sp-spacing-xs 0;
font-size: 0.95em;
font-weight: 600;
color: var(--sp-text-primary);
}
.player-privacy-panel__section-description {
margin: 0 0 @sp-spacing-md 0;
font-size: 0.85em;
color: var(--sp-text-secondary);
line-height: 1.4;
}
// Effects list
.player-privacy-panel__effects-list {
display: flex;
flex-direction: column;
gap: @sp-spacing-md;
}
// Individual effect
.player-privacy-panel__effect {
padding: @sp-spacing-sm;
border: 1px solid var(--sp-border);
border-radius: @sp-border-radius;
background: var(--sp-surface-elevated);
}
.player-privacy-panel__effect-header {
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: @sp-spacing-xs;
}
.player-privacy-panel__effect-label {
margin: 0;
font-size: 0.9em;
font-weight: 500;
color: var(--sp-text-primary);
}
.player-privacy-panel__effect-description {
margin: 0;
font-size: 0.8em;
color: var(--sp-text-secondary);
line-height: 1.4;
}
// Toggle switch
.player-privacy-panel__toggle {
display: flex;
align-items: center;
}
.player-privacy-panel__toggle-label {
display: flex;
align-items: center;
gap: @sp-spacing-xs;
cursor: pointer;
user-select: none;
font-size: 0.85em;
}
// Toggle input - visually hidden, uses custom styling
.player-privacy-panel__toggle-input {
position: absolute;
opacity: 0;
width: 0;
height: 0;
&:focus-visible + .player-privacy-panel__toggle-text {
outline: 2px solid var(--sp-focus);
outline-offset: 2px;
}
&:disabled + .player-privacy-panel__toggle-text {
opacity: 0.6;
cursor: not-allowed;
}
}
.player-privacy-panel__toggle-text {
display: inline-block;
padding: @sp-spacing-xs @sp-spacing-sm;
border: 1px solid var(--sp-border);
border-radius: @sp-border-radius;
background: var(--sp-surface);
color: var(--sp-text-primary);
font-weight: 500;
transition: all 0.15s ease;
.player-privacy-panel__toggle-input:checked + & {
background: var(--sp-accent);
color: white;
border-color: var(--sp-accent);
}
.player-privacy-panel__toggle-input:disabled + & {
background: var(--sp-surface);
border-color: var(--sp-border);
}
.player-privacy-panel__toggle-input:checked:disabled + & {
background: var(--sp-accent);
color: white;
opacity: 0.6;
}
}
}