Compare commits
1 Commits
dev/issue-
...
review/pr-
| Author | SHA1 | Date | |
|---|---|---|---|
| e10fc6d116 |
@@ -1,7 +0,0 @@
|
||||
{
|
||||
"permissions": {
|
||||
"allow": [
|
||||
"Bash"
|
||||
]
|
||||
}
|
||||
}
|
||||
@@ -31,14 +31,3 @@ jobs:
|
||||
|
||||
- name: Tests
|
||||
run: python manage.py test lobby -v 1
|
||||
|
||||
- name: Setup Node
|
||||
uses: actions/setup-node@v4
|
||||
with:
|
||||
node-version: "22"
|
||||
|
||||
- name: Install SPA dependencies
|
||||
run: npm ci --prefix frontend/angular
|
||||
|
||||
- name: SPA Angular smoke tests
|
||||
run: npm --prefix frontend/angular test
|
||||
|
||||
@@ -1,10 +1,5 @@
|
||||
# Changelog
|
||||
|
||||
## [Unreleased]
|
||||
### Docs
|
||||
- Added `docs/ISSUE-279-I18N-MVP-CLOSEOUT.md` with the issue #279 i18n MVP close-out note, including migration impact, reusable release-note text, and a release-readiness checklist refreshed against `main@1bc4c27` after PR #282/#283 landed on 2026-03-13 UTC.
|
||||
- Clarified that the close-out note supersedes earlier PR snapshot assumptions and now treats PR #282 (`6ad5430`) and PR #283 (`1bc4c27`) as already merged on `main`.
|
||||
|
||||
## [0.1.0] - 2026-02-27
|
||||
### Added
|
||||
- Projekt scaffold for Weirsøe Party Protocol (Django 6.0.2)
|
||||
|
||||
119
CLAUDE.md
119
CLAUDE.md
@@ -1,119 +0,0 @@
|
||||
# CLAUDE.md
|
||||
|
||||
This file provides guidance to Claude Code (claude.ai/code) when working with code in this repository.
|
||||
|
||||
## Project Overview
|
||||
|
||||
**Weirsøe Party Protocol** is a Danish party game web platform (Jackbox-style) where games display on a primary screen and players participate via mobile. The MVP game is "Fup og Fakta" (a Fibbage-style lie-and-guess game).
|
||||
|
||||
- Backend: Django 6.0.2 + Django Channels (WebSockets) + Redis
|
||||
- Frontend: Angular 19 shell + shared TypeScript API client library
|
||||
- Database: MySQL (SQLite fallback for dev)
|
||||
- Deployment: Proxmox LXC containers (not Docker)
|
||||
|
||||
## Commands
|
||||
|
||||
### Backend (Django)
|
||||
```bash
|
||||
python manage.py runserver # Dev server
|
||||
python manage.py migrate # Apply migrations
|
||||
python manage.py test # Run all backend tests
|
||||
python manage.py test lobby # Run tests for a single app
|
||||
python manage.py shell # Django shell
|
||||
```
|
||||
|
||||
### Frontend — API client (`/frontend`)
|
||||
```bash
|
||||
cd frontend
|
||||
npm install
|
||||
npm test # Vitest unit tests
|
||||
npm run build # TypeScript compile check (--noEmit)
|
||||
```
|
||||
|
||||
### Frontend — Angular shell (`/frontend/angular`)
|
||||
```bash
|
||||
cd frontend/angular
|
||||
npm install
|
||||
npm start # Dev server (ng serve)
|
||||
npm run build # Production build
|
||||
npm run test # Vitest unit tests
|
||||
```
|
||||
|
||||
### i18n validation
|
||||
```bash
|
||||
python scripts/check_i18n_drift.py # Check for key drift between locales
|
||||
```
|
||||
|
||||
## Architecture
|
||||
|
||||
### Backend apps
|
||||
|
||||
| App | Purpose |
|
||||
|-----|---------|
|
||||
| `partyhub/` | Main Django project — settings, root URLs, ASGI/WSGI, i18n bootstrap |
|
||||
| `lobby/` | Session & player management — create/join session, locale-aware error responses |
|
||||
| `fupogfakta/` | Game logic — all domain models, score calculation (server-authoritative) |
|
||||
| `realtime/` | WebSocket event layer (stub) |
|
||||
| `voice/` | Voice/TTS interface (stub, Phase 2) |
|
||||
| `core_admin/` | Health endpoint (`/healthz`), global admin |
|
||||
|
||||
**Key domain models** (all in `fupogfakta/models.py`): `GameSession`, `Player`, `Category`, `Question`, `RoundConfig`, `RoundQuestion`, `LieAnswer`, `Guess`, `ScoreEvent`.
|
||||
|
||||
Score calculation is server-side only. `ScoreEvent` provides an auditable trail of all point changes.
|
||||
|
||||
### Frontend layers
|
||||
|
||||
1. **Shared API client** (`frontend/src/`) — pure TypeScript, framework-agnostic. Defines all API types (`api/types.ts`) and HTTP client abstraction (`api/client.ts`).
|
||||
2. **Angular shell** (`frontend/angular/`) — Angular 19 standalone components (no NgModules), hash-based routing. `host-shell.component` for the presenter screen; `player-shell.component` for mobile players.
|
||||
|
||||
The Angular shell consumes the shared client via `frontend/src/api/angular-client.ts`.
|
||||
|
||||
### Real-time flow
|
||||
|
||||
`LOBBY → LIE → GUESS → REVEAL → FINISHED` — phase transitions broadcast a `PhaseViewModel` to all connected clients via WebSocket. Clients are read-only; only the server is authoritative for state.
|
||||
|
||||
### i18n
|
||||
|
||||
- **Single source of truth**: `shared/i18n/lobby.json` (keys in both `en` and `da`)
|
||||
- Loaded once at startup with LRU cache (`partyhub/i18n_bootstrap.py`)
|
||||
- Key naming: domain-first — `frontend.ui.host.*`, `frontend.ui.player.*`, `backend.errors.*`, `backend.error_codes.*`
|
||||
- Locale resolved from `Accept-Language` header; missing key returns key + logs warning; missing translation falls back to `en`
|
||||
|
||||
## Key Conventions
|
||||
|
||||
### Errors
|
||||
Backend error responses use stable machine-readable codes (`backend.error_codes.*`) with separately localized messages. Never couple error code strings to locale.
|
||||
|
||||
### Game constraints (MVP)
|
||||
- 3–12 players per session
|
||||
- Session codes: 6-char alphanumeric (no 0/O/1/I/L)
|
||||
- Anti-cheat: no duplicate lies, lies cannot match the correct answer, answer order randomized
|
||||
|
||||
### Git workflow
|
||||
- `main`: stable baseline
|
||||
- `feature/<name>`: development branches
|
||||
- `release/vX.Y.Z`: release preparation
|
||||
- Release: merge → create release branch → update `VERSION` + `CHANGELOG.md` → tag → push
|
||||
|
||||
### TypeScript
|
||||
Strict mode required. Target ES2022. API response interfaces in `frontend/src/api/types.ts` must match backend responses exactly.
|
||||
|
||||
### Database
|
||||
Use `ForeignKey` with explicit `on_delete` (`PROTECT`/`CASCADE`/`SET_NULL`). Add `db_index=True` on frequently queried fields. Migrations are auto-generated by Django and versioned in `migrations/`.
|
||||
|
||||
## Environment Variables
|
||||
|
||||
```
|
||||
DJANGO_SECRET_KEY, DJANGO_DEBUG, DJANGO_ALLOWED_HOSTS
|
||||
DB_ENGINE, DB_NAME, DB_USER, DB_PASSWORD, DB_HOST, DB_PORT
|
||||
CHANNEL_REDIS_HOST, CHANNEL_REDIS_PORT
|
||||
USE_SPA_UI (fallback: WPP_SPA_ENABLED)
|
||||
WPP_SPA_ASSET_BASE, WPP_SPA_ASSET_VERSION
|
||||
```
|
||||
|
||||
## Test Files of Note
|
||||
|
||||
- `lobby/tests.py` — comprehensive Django TestCase coverage for session/player/i18n/error flows
|
||||
- `frontend/angular/src/app/api-contract-smoke.spec.ts` — API contract smoke tests
|
||||
- `frontend/angular/src/app/lobby-i18n.spec.ts` — i18n parity checks
|
||||
- `frontend/tests/lobby-loader.parity.test.ts` — shared i18n loader parity
|
||||
71
PROMPT.md
71
PROMPT.md
@@ -1,71 +0,0 @@
|
||||
# Ralph Loop: Implement WebSocket push for Weirsøe Party Protocol
|
||||
|
||||
## Context
|
||||
- Project: /home/agw/projects/weirsoe-party-protocol
|
||||
- Backend: Django 6.0.2 + Django Channels + Redis
|
||||
- The full game REST flow is already implemented in lobby/views.py
|
||||
(create_session, join_session, start_round, show_question, submit_lie,
|
||||
mix_answers, submit_guess, calculate_scores, reveal_scoreboard, finish_game)
|
||||
- realtime/ app exists but is a stub (no consumers.py, no routing)
|
||||
- partyhub/settings.py has channels in INSTALLED_APPS but no CHANNEL_LAYERS or routing
|
||||
- PO hard requirement: WebSocket push is mandatory in MVP (no polling)
|
||||
|
||||
## What to build
|
||||
|
||||
### 1. realtime/consumers.py — GameConsumer
|
||||
- AsyncJsonWebsocketConsumer
|
||||
- Connects to group game_{session_code} on connect (session_code from URL)
|
||||
- Player auth: session_token query param validated against Player model
|
||||
- Host auth: query param role=host, no token required for MVP
|
||||
- On disconnect: clean leave from group
|
||||
- Handles incoming message type "ping" -> replies with {"type": "pong"}
|
||||
- Forwards broadcast group events to WebSocket client
|
||||
|
||||
### 2. partyhub/settings.py — CHANNEL_LAYERS
|
||||
Add CHANNEL_LAYERS using channels_redis.core.RedisChannelLayer.
|
||||
Read CHANNEL_REDIS_HOST (default 127.0.0.1) and CHANNEL_REDIS_PORT (default 6379) from env.
|
||||
|
||||
### 3. partyhub/asgi.py — ASGI routing
|
||||
Wire URLRouter so ws/game/<session_code>/ routes to GameConsumer.
|
||||
Keep existing HTTP routing intact.
|
||||
|
||||
### 4. realtime/routing.py
|
||||
Define websocket_urlpatterns list.
|
||||
|
||||
### 5. realtime/broadcast.py — broadcast helper
|
||||
- async def broadcast_phase_event(session_code, event_type, payload)
|
||||
Sends to group game_{session_code} via channel layer.
|
||||
- def sync_broadcast_phase_event(session_code, event_type, payload)
|
||||
Sync wrapper using async_to_sync for calling from sync REST views.
|
||||
|
||||
### 6. lobby/views.py — hook broadcasts into phase transitions
|
||||
After each phase transition, call sync_broadcast_phase_event:
|
||||
- start_round -> phase.lie_started (question prompt + time limit)
|
||||
- show_question -> phase.question_shown (question text)
|
||||
- mix_answers -> phase.guess_started (shuffled answers + time limit)
|
||||
- calculate_scores -> phase.scores_calculated (per-player score delta)
|
||||
- reveal_scoreboard -> phase.scoreboard (ranked player list)
|
||||
- finish_game -> phase.game_over (final rankings)
|
||||
|
||||
### 7. realtime/tests.py — basic tests
|
||||
- Connect/disconnect test using channels.testing.WebsocketCommunicator
|
||||
- Verify a broadcast reaches a connected client
|
||||
|
||||
## Constraints
|
||||
- Keep auth simple: session_token query param for players, unauthenticated host in MVP
|
||||
- Use async_to_sync wrapper for sync REST views calling async broadcast
|
||||
- Do not break existing REST tests (python manage.py test lobby must still pass)
|
||||
- After each file written, run: python manage.py check
|
||||
- Follow existing code style in lobby/views.py
|
||||
|
||||
## Completion criteria
|
||||
Output the exact text: WEBSOCKET COMPLETE
|
||||
|
||||
...when ALL of the following are true:
|
||||
- realtime/consumers.py exists and handles connect/disconnect/ping
|
||||
- realtime/broadcast.py exists with sync_broadcast_phase_event
|
||||
- partyhub/settings.py has CHANNEL_LAYERS configured
|
||||
- partyhub/asgi.py routes ws/game/<code>/ to GameConsumer
|
||||
- All 6 phase transitions in lobby/views.py call sync_broadcast_phase_event
|
||||
- python manage.py check passes with no errors
|
||||
- python manage.py test lobby passes (existing tests not broken)
|
||||
26
TODO.md
26
TODO.md
@@ -37,8 +37,8 @@ Byg **Weirsøe Party Protocol**: en dansk party-webapp platform ala Jackbox, hvo
|
||||
- [x] `core_admin` (global administration)
|
||||
- [x] `fupogfakta` (Spil 1)
|
||||
- [x] `lobby` (room/session/player join flow)
|
||||
- [x] `realtime` (app-skelet oprettet — consumers/routing IKKE implementeret endnu)
|
||||
- [x] `voice` (fælles voice-acting interface — stub)
|
||||
- [x] `realtime` (channels events, game state broadcast)
|
||||
- [x] `voice` (fælles voice-acting interface)
|
||||
- [x] Miljøfiler (`.env.test`, `.env.prod` skabeloner)
|
||||
- [x] Konfig for MySQL test/prod
|
||||
|
||||
@@ -53,15 +53,14 @@ Byg **Weirsøe Party Protocol**: en dansk party-webapp platform ala Jackbox, hvo
|
||||
- [x] `ScoreEvent` (auditérbar pointslog)
|
||||
|
||||
### Fase 3 — Spilflow `Fup og Fakta`
|
||||
- [x] Lobby: host opretter session, spillere joiner via kode (REST)
|
||||
- [x] Runde starter med kategori (REST)
|
||||
- [x] Spørgsmål vises -> alle skriver løgn inden X sek (REST)
|
||||
- [x] System blander korrekt svar + løgne (persisted i JSONField, anti-cheat dedup)
|
||||
- [x] Guessfase: alle gætter inden Z sek (REST)
|
||||
- [x] Pointudregning (konfigurerbar pr. runde, ScoreEvent audit trail)
|
||||
- [x] Scoreboard + næste spørgsmål/runde (REST)
|
||||
- [x] Slutresultat (REST)
|
||||
- [x] **WebSocket push af phase-events til host + spillere** (GameConsumer + broadcast.py, InMemoryChannelLayer i tests)
|
||||
- [x] Lobby: host opretter session, spillere joiner via kode
|
||||
- [x] Runde starter med kategori
|
||||
- [x] Spørgsmål vises -> alle skriver løgn inden X sek
|
||||
- [x] System blander korrekt svar + løgne
|
||||
- [x] Guessfase: alle gætter inden Z sek
|
||||
- [x] Pointudregning (konfigurerbar pr. runde)
|
||||
- [x] Scoreboard + næste spørgsmål/runde
|
||||
- [x] Slutresultat
|
||||
|
||||
### Fase 4 — Voice-acting (platformkrav)
|
||||
- [ ] Definér TTS provider-interface
|
||||
@@ -104,11 +103,10 @@ Byg **Weirsøe Party Protocol**: en dansk party-webapp platform ala Jackbox, hvo
|
||||
- [ ] Migrations + static + health checks
|
||||
|
||||
### Backlog — Need-to-have / Nice-to-have
|
||||
- [x] (Need-to-have) Persistér mixed svarrækkefølge pr. round question — DONE (JSONField + migration 0003 + test)
|
||||
- [ ] (Need-to-have) Persistér mixed svarrækkefølge pr. round question, så alle spillere ser samme rækkefølge ved reconnect/refresh
|
||||
- [x] (Need-to-have) Tilføj spiller-auth/session-token for submit_lie (pt. baseret på player_id i payload)
|
||||
- [ ] (Nice-to-have) Endpoint til status/progress i løgnfasen (antal indsendt ud af total)
|
||||
- [ ] (Need-to-have) Fjern ubrugte scaffold-imports i core_admin/*, realtime/*, voice/*, fupogfakta/views.py (kør `ruff check --fix`) så CI quality gate er grøn
|
||||
- [x] (Need-to-have) [Issue #251] Release-often lane: SPA MVP opdelt i 3 merge-klare micro-PR batches (plan + acceptance criteria dokumenteret i `docs/ISSUE-251-RELEASE-OFTEN-SPA-MVP-BATCH-PLAN.md`).
|
||||
- [ ] (Need-to-have) [Fejltype: CI/lint F401] [Fil/område: core_admin/*, fupogfakta/tests.py+views.py, lobby/admin.py+models.py, realtime/*, voice/*] [Branch/PR: feature/f3-lobby-create-join, feature/fase0-mvp-fup-og-fakta, feature/lobby-mvp (ingen åbne PRs fundet)] Fjern ubrugte scaffold-imports (eller kør ruff check --fix) så quality gate kan blive grøn før merge.
|
||||
- [ ] (Need-to-have) Rate limiting på join/submit endpoints
|
||||
- [ ] (Need-to-have) Session-kode brute-force beskyttelse
|
||||
- [ ] (Need-to-have) Audit-log for host-handlinger (start/stop/skip)
|
||||
|
||||
BIN
db.sqlite3
Normal file
BIN
db.sqlite3
Normal file
Binary file not shown.
@@ -1,49 +0,0 @@
|
||||
# Shared i18n architecture (frontend + backend)
|
||||
|
||||
## Scope
|
||||
Issue #175 requires one shared i18n contract for MVP host/player flows across frontend and backend.
|
||||
|
||||
## Source of truth
|
||||
- Catalog: `shared/i18n/lobby.json`
|
||||
- Locales:
|
||||
- supported: `en`, `da`
|
||||
- default/fallback: `en`
|
||||
|
||||
Django (`lobby/i18n.py`) reads directly from the catalog. Frontend runtimes are Angular-first and use a shared loader (`frontend/shared/i18n/lobby-loader.ts`) so Angular shell and SPA fallback consume the same keyspace + locale normalization.
|
||||
|
||||
## Key naming convention
|
||||
- Domain-first namespaces:
|
||||
- `frontend.ui.common.*`
|
||||
- `frontend.ui.host.*`
|
||||
- `frontend.ui.player.*`
|
||||
- `frontend.errors.*`
|
||||
- `backend.errors.*`
|
||||
- `backend.error_codes.*`
|
||||
- UI lookup keys in Angular are shortened aliases mapped under `frontend.ui`, e.g.:
|
||||
- `host.start_round`
|
||||
- `player.submit_guess`
|
||||
- `common.session_code`
|
||||
- Backend API errors return stable code + localized message:
|
||||
- `error_code` = machine-stable key from `backend.error_codes`
|
||||
- `error` = localized message from `backend.errors`
|
||||
- `locale` = resolved request locale
|
||||
|
||||
## Fallback model (robust)
|
||||
1. Resolve requested locale (`Accept-Language` on backend, user/browser preference on frontend).
|
||||
2. If locale unsupported -> use default `en`.
|
||||
3. If key missing -> return key and log warning.
|
||||
4. If locale translation missing for key -> fallback to `en` translation.
|
||||
|
||||
## Audio-routing policy
|
||||
- Catalog capability: `frontend.capabilities.client_has_no_audio_output = true`
|
||||
- Host/player clients expose this as a read-only capability flag.
|
||||
- Policy: phone clients must not play audio directly; only primary/host output is allowed.
|
||||
|
||||
## Verification
|
||||
- Backend tests: `lobby/tests.py` i18n coverage for locale selection + fallback + error-code/message matrix.
|
||||
- Frontend smoke/e2e-level unit coverage:
|
||||
- `frontend/angular/src/app/lobby-i18n.spec.ts`
|
||||
- `frontend/angular/src/app/i18n-mvp-flow-smoke.spec.ts`
|
||||
- `frontend/angular/src/app/features/host/host-shell.component.spec.ts`
|
||||
- `frontend/angular/src/app/features/player/player-shell.component.spec.ts`
|
||||
- `frontend/tests/lobby-loader.parity.test.ts` (minimal da/en key parity guard for shared keyspace)
|
||||
@@ -1,35 +0,0 @@
|
||||
# ISSUE-175 Artifact — shared i18n contract + MVP host/player flow
|
||||
|
||||
## Delivered
|
||||
- Shared i18n contract is centralized in `shared/i18n/lobby.json` (da/en, default `en`, robust fallback).
|
||||
- Frontend host/player MVP copy is read via shared keys (no hardcoded Danish strings in Angular MVP flow components).
|
||||
- Backend error messages resolve from shared keyspace with locale-aware API payload (`error_code`, `error`, `locale`).
|
||||
- Audio-routing policy is explicit and shared: `frontend.capabilities.client_has_no_audio_output=true`.
|
||||
- Architecture + key naming documented in `docs/I18N_ARCHITECTURE.md`.
|
||||
|
||||
## Smoke / e2e evidence
|
||||
### Backend locale + fallback
|
||||
Command:
|
||||
```bash
|
||||
. .venv/bin/activate && python manage.py test \
|
||||
lobby.tests.LobbyFlowTests.test_join_error_localizes_to_danish_with_accept_language_header \
|
||||
lobby.tests.LobbyFlowTests.test_join_error_falls_back_to_english_for_unsupported_locale \
|
||||
lobby.tests.I18nResolverTests
|
||||
```
|
||||
Result:
|
||||
- PASS (7 tests)
|
||||
- Confirms `da` localization and fallback to `en` for unsupported locale.
|
||||
|
||||
### Frontend host/player + language switch + audio policy
|
||||
Command:
|
||||
```bash
|
||||
cd frontend/angular
|
||||
npm test -- --run \
|
||||
src/app/lobby-i18n.spec.ts \
|
||||
src/app/i18n-mvp-flow-smoke.spec.ts \
|
||||
src/app/features/host/host-shell.component.spec.ts \
|
||||
src/app/features/player/player-shell.component.spec.ts
|
||||
```
|
||||
Result:
|
||||
- PASS (22 tests)
|
||||
- Includes smoke for host/player copy in **both en and da** and verifies primary-only audio policy flag (`clientHasNoAudioOutput=true`).
|
||||
@@ -1,28 +0,0 @@
|
||||
# Issue #180 Evidence — SPA next-round + final leaderboard
|
||||
|
||||
## Flow log (Angular SPA)
|
||||
1. Host reaches `reveal` phase and runs `loadScoreboard()` (`GET /lobby/sessions/:code/scoreboard`).
|
||||
2. Host can start next round directly in SPA via `startNextRound()` (`POST /lobby/sessions/:code/rounds/next`) and then session hydrate (`GET /lobby/sessions/:code`) without page reload.
|
||||
3. Host can finish game directly in SPA via `finishGame()` (`POST /lobby/sessions/:code/finish`), rendering winner + sorted final leaderboard (plus raw payload for debug) in the same shell.
|
||||
4. Player SPA renders final leaderboard from refreshed finished-session payload (sorted by score desc, nickname tiebreak) without leaving SPA route.
|
||||
5. Error/retry paths are implemented and covered:
|
||||
- scoreboard failure -> `scoreboardError` + retry button
|
||||
- next-round failure -> `nextRoundError` + retry button
|
||||
- finish-game/final-leaderboard failure -> `finishError` + retry button
|
||||
|
||||
## Test evidence
|
||||
### `frontend/angular` (Vitest)
|
||||
- `src/app/features/host/host-shell.component.spec.ts`
|
||||
- `runs next-round transition without reload and clears scoreboard payload`
|
||||
- `captures finish-game failure for retry and stores final leaderboard on success`
|
||||
- `src/app/features/player/player-shell.component.spec.ts`
|
||||
- `builds final leaderboard in finished status without legacy page hop`
|
||||
|
||||
Result:
|
||||
- Test Files: 2 passed
|
||||
- Tests: 9 passed
|
||||
|
||||
### `frontend` shared SPA tests (regression)
|
||||
Result:
|
||||
- Test Files: 5 passed
|
||||
- Tests: 24 passed
|
||||
@@ -1,47 +0,0 @@
|
||||
# Issue #188 Artifact — SPA cutover hardening (asset versioning + rollback)
|
||||
|
||||
## Scope
|
||||
Acceptance for `[READY][SPA][P11] Cutover hardening`:
|
||||
1. Dokumenteret strategi for cache-busting/versionering af SPA assets i Django staticfiles/reverse proxy setup.
|
||||
2. Konfigurerbar rollback-procedure for `USE_SPA_UI` (trin-for-trin, target <10 min).
|
||||
3. Smoke-artefakt for både SPA on/off i samme release-vindue.
|
||||
4. Ingen gameplay-ændringer.
|
||||
|
||||
## 1) Asset versioning/cache-busting strategi
|
||||
Implementeret i SPA shell render-path:
|
||||
|
||||
- Konfiguration i `partyhub/settings.py`:
|
||||
- `WPP_SPA_ASSET_BASE` (eksisterende)
|
||||
- `WPP_SPA_ASSET_VERSION` (ny)
|
||||
- `lobby/ui_views.py` injicerer `spa_asset_version` til template-context.
|
||||
- `lobby/templates/lobby/spa_shell.html` appender `?v={{ spa_asset_version }}` på:
|
||||
- `styles.css`
|
||||
- `main.js`
|
||||
|
||||
Effekt:
|
||||
- Ny release-version (fx SHA/tag) kan tvinge cache-miss i browser/proxy uden ændring af route.
|
||||
- Rollback kan pege på tidligere stabil version-token med samme mekanisme.
|
||||
|
||||
## 2) Rollback playbook (`USE_SPA_UI`) — target <10 min
|
||||
Dokumenteret i `docs/spa-cutover-flag.md`:
|
||||
|
||||
1. Sæt `USE_SPA_UI=false`.
|
||||
2. Sæt `WPP_SPA_ASSET_VERSION` til sidste stabile release-token.
|
||||
3. Deploy/reload app-processer.
|
||||
4. Verificér legacy routes (`/lobby/ui/host` + `/lobby/ui/player`).
|
||||
5. Kør hurtig smoke sanity.
|
||||
6. Log trigger/timestamp/resultat i smoke artifact.
|
||||
|
||||
## 3) Smoke artifact for SPA OFF/ON i samme release-vindue
|
||||
Dokumenteret i:
|
||||
- `docs/UI_SMOKE.md` (sektion: "Samme release-vindue: SPA OFF + ON verifikation")
|
||||
- `docs/STAGING_GAMEPLAY_SMOKE_ARTIFACT.md` (template udvidet med release-window check + `WPP_SPA_ASSET_VERSION`)
|
||||
|
||||
Krav:
|
||||
- OFF-pass (legacy) og ON-pass (SPA) køres i samme deploy/release-vindue.
|
||||
- Begge passes logges i samme artifact med UTC timestamps og version-token.
|
||||
|
||||
## Non-goals bekræftet
|
||||
- Ingen gameplay-regler ændret.
|
||||
- Ingen API-kontrakter ændret.
|
||||
- Ingen UX-redesign; kun drift/cutover-hardening.
|
||||
@@ -1,57 +0,0 @@
|
||||
# Issue #200 Artifact — SPA host→player phase sync (no reload)
|
||||
|
||||
## Scope
|
||||
Acceptance for `[READY][SPA][P14] Gameplay MVP-del 5`:
|
||||
1. Host handlinger (`start round` / `næste fase`) propagere korrekt til player-ruter i SPA.
|
||||
2. Happy-path artefakt for én fuld faseovergang uden page reload.
|
||||
3. Sync-fejl giver kontrolleret fallback/error state.
|
||||
|
||||
Afgrænsning overholdt: ingen nye spilregler og ingen redesign af backend event-model.
|
||||
|
||||
## Happy-path faseovergang (uden page reload)
|
||||
Reference-flow i Angular shell:
|
||||
|
||||
1. **Host starter runde/fase**
|
||||
- Host action kalder backend endpoint (`POST /lobby/sessions/:code/start` eller fase-endpoint)
|
||||
- Host shell hydrerer session igen (`GET /lobby/sessions/:code`)
|
||||
- Host route synkes via hash-rewrite i samme SPA shell:
|
||||
- `#/host/<phase>/<CODE>`
|
||||
- Implementeret i `HostShellComponent.syncRouteFromSession()`
|
||||
|
||||
2. **Player modtager ny fase via state sync**
|
||||
- Player shell kører periodisk session-refresh (3s), uden hard reload
|
||||
- Når `session.status` ændrer sig, synkes hash-route i samme SPA shell:
|
||||
- `#/player/<phase>/<CODE>`
|
||||
- Implementeret i `PlayerShellComponent.syncRouteFromSession()`
|
||||
|
||||
3. **Ingen page reload**
|
||||
- Routing sker med `window.history.replaceState(...)`
|
||||
- URL opdateres i eksisterende SPA instans (ingen template-hop, ingen full refresh)
|
||||
|
||||
## Kontrolleret fallback ved sync-fejl
|
||||
Når player-sync fejler (netværk/fetch/session-refresh):
|
||||
|
||||
- UI går i kontrolleret connection-state:
|
||||
- `reconnecting` ved online netværksfejl
|
||||
- `offline` når browser rapporterer offline
|
||||
- Fejl vises med retry/back-to-join handlinger
|
||||
- Reconnect forsøges igen via timer (`scheduleReconnect`) uden at crashe shell
|
||||
|
||||
## Verifikation (tests)
|
||||
Kørt i `frontend/angular` med Vitest:
|
||||
|
||||
- `src/app/features/host/host-shell.component.spec.ts`
|
||||
- Verificerer host-faseflow og hash-route sync uden reload
|
||||
- `src/app/features/player/player-shell.component.spec.ts`
|
||||
- Verificerer periodisk player state sync + hash-route sync
|
||||
- Verificerer reconnect/offline fallback ved sync-fejl
|
||||
- `src/app/api-contract-smoke.spec.ts`
|
||||
- `src/app/session-route-context.spec.ts`
|
||||
|
||||
Kommando:
|
||||
|
||||
```bash
|
||||
npm test -- --reporter=dot
|
||||
```
|
||||
|
||||
Resultat: **4/4 testfiler grønne, 22/22 tests bestået**.
|
||||
@@ -1,36 +0,0 @@
|
||||
# Issue #205 — Django i18n foundation (da/en)
|
||||
|
||||
## Implemented acceptance checks
|
||||
|
||||
- **Django i18n setup for `en` + `da` with `en` fallback**
|
||||
- `LANGUAGE_CODE` set to `en`.
|
||||
- `LANGUAGES = [('en', 'English'), ('da', 'Danish')]`.
|
||||
- `LocaleMiddleware` enabled in middleware chain.
|
||||
- **Shared-key resolver/adapter (no ad hoc backend mapping)**
|
||||
- Backend error responses now resolve from shared catalog keys in `shared/i18n/lobby.json`.
|
||||
- `lobby.i18n.api_error()` accepts a shared key and resolves locale-specific text.
|
||||
- **Representative API flow documented with key/locale behavior**
|
||||
- `POST /lobby/join` with empty code returns:
|
||||
- `error_code: "session_code_required"`
|
||||
- localized `error`
|
||||
- resolved `locale`
|
||||
- **Missing key handling deterministic and loggable**
|
||||
- `resolve_error_message()` returns key string when key/translation is missing.
|
||||
- Warning is logged (`lobby.i18n` logger) for missing key/translation.
|
||||
|
||||
## Example response behavior
|
||||
|
||||
### Request
|
||||
`POST /lobby/join` with empty code and header `Accept-Language: da`
|
||||
|
||||
### Response (400)
|
||||
|
||||
```json
|
||||
{
|
||||
"error": "Sessionskode er påkrævet",
|
||||
"error_code": "session_code_required",
|
||||
"locale": "da"
|
||||
}
|
||||
```
|
||||
|
||||
If locale is unsupported (e.g. `fr`), response uses `locale: "en"` and English message.
|
||||
@@ -1,35 +0,0 @@
|
||||
# Issue #207 Artifact — da/en locale switch + audio routing (primary-only)
|
||||
|
||||
## Scope
|
||||
Acceptance for `[READY][i18n][P19]`:
|
||||
1. Verify one MVP host+player flow in both `en` and `da` locale context.
|
||||
2. Verify controlled fallback to `en` when a locale key is missing.
|
||||
3. Verify audio-routing policy is primary-only (client/player has no audio output).
|
||||
|
||||
No new feature behavior added — this is verification-only evidence.
|
||||
|
||||
## Smoke/e2e evidence (Angular shell test run)
|
||||
Executed from `frontend/angular`:
|
||||
|
||||
```bash
|
||||
npm test -- --reporter=dot src/app/lobby-i18n.spec.ts src/app/features/host/host-shell.component.spec.ts src/app/features/player/player-shell.component.spec.ts
|
||||
```
|
||||
|
||||
Evidence covered by the run:
|
||||
- `lobby-i18n.spec.ts`
|
||||
- subscriber locale switch updates (`en -> da -> en`)
|
||||
- controlled fallback where `da` key is removed during test and `en` copy is returned
|
||||
- `clientHasNoAudioOutput === true` (primary-only audio routing)
|
||||
- `host-shell.component.spec.ts`
|
||||
- host actions and route sync in SPA (no reload)
|
||||
- `player-shell.component.spec.ts`
|
||||
- player session refresh/sync path and retry behavior
|
||||
|
||||
## Policy evidence
|
||||
- Shared catalog capability: `shared/i18n/lobby.json`
|
||||
- `frontend.capabilities.client_has_no_audio_output = true`
|
||||
- Angular host/player shells bind this capability:
|
||||
- `HostShellComponent.clientHasNoAudioOutput`
|
||||
- `PlayerShellComponent.clientHasNoAudioOutput`
|
||||
|
||||
Conclusion: locale switching works in `da`/`en`, fallback resolves to `en` when locale key is intentionally missing, and client audio remains disabled by policy (`primary-only`).
|
||||
@@ -1,20 +0,0 @@
|
||||
# Issue #223 — Telefon-klient audio guard (artifact)
|
||||
|
||||
## Scope leveret
|
||||
- Telefon-/player-klient installerer en eksplicit audio guard ved mount (`installSecondaryDeviceAudioGuard`).
|
||||
- Guard overskriver `HTMLMediaElement.prototype.play` til en no-op på secondary device (client policy: `client_has_no_audio_output=true`).
|
||||
- Guard fjernes igen ved unmount (`ngOnDestroy`) så øvrige flows/enheder ikke påvirkes.
|
||||
- Ingen audio-controls er eksponeret i player-shell UI.
|
||||
|
||||
## Acceptance mapping
|
||||
1. **Telefon-klient trigger ikke audio playback i kerneflow**
|
||||
- Verificeret af test: `player-shell.component.spec.ts` (`installs secondary-device audio guard while player shell is mounted`).
|
||||
2. **Primær enhed påvirkes ikke negativt**
|
||||
- Guard er scoped til player-shell lifecycle og restore'r original `play` ved destroy.
|
||||
3. **Enkel test/verifikation dokumenteret**
|
||||
- Dokumenteret her + testkørsel nedenfor.
|
||||
|
||||
## Testkørsel
|
||||
- Kommando:
|
||||
- `cd frontend/angular && npm test -- src/app/features/player/player-shell.component.spec.ts`
|
||||
- Resultat: bestået (inkl. audio-guard test).
|
||||
@@ -1,55 +0,0 @@
|
||||
# Issue #224 — Trunk-sekvens for #175 (A/B/C)
|
||||
|
||||
Formål: gøre #175 scheduler-klar som tre små, uafhængige og mergeklare bidder.
|
||||
|
||||
## Sekvens
|
||||
|
||||
### A) Backend i18n baseline
|
||||
- Tracking issue: #225
|
||||
- Scope:
|
||||
- Backend resolver til locale (da/en)
|
||||
- Fallback til `en` ved unsupported locale
|
||||
- Stabil fejlkontrakt i payload (`error_code`, `error`, `locale`)
|
||||
- Mergebarhed: Kan merges uden frontend-ændringer.
|
||||
- Acceptance:
|
||||
- Backend tests dækker `da` + fallback `en`
|
||||
- Kontraktfelter er stabile i response
|
||||
|
||||
### B) Shared key-map + locale-kontrakt
|
||||
- Tracking issue: #226
|
||||
- Scope:
|
||||
- Én shared key-map for lobby/kerneflow
|
||||
- Locale-kontrakt (tilladte locales, default locale, fallback-regler)
|
||||
- Dokumentation af naming + ownership
|
||||
- Mergebarhed: Kan merges uden host/player UI-migrering.
|
||||
- Acceptance:
|
||||
- Shared kontrakt findes ét sted
|
||||
- Begge sider kan importere den
|
||||
- Docs opdateret med da/en eksempler
|
||||
|
||||
### C) Angular host/player integration + hardcoded-text cleanup
|
||||
- Tracking issue: #227
|
||||
- Scope:
|
||||
- Angular host/player kerneflow bruger shared keys
|
||||
- Hardcoded tekster fjernes i aftalte kernekomponenter
|
||||
- Sprogskift verificeres i kritiske states
|
||||
- Mergebarhed: Kan merges selvstændigt når frontend-tests er grønne.
|
||||
- Acceptance:
|
||||
- Korrekt i18n-copy i da/en i kerneflow
|
||||
- Ingen hardcoded kerneflow-tekster tilbage
|
||||
- Frontend tests/smoke grønne
|
||||
|
||||
## PR-grænser (per bid)
|
||||
- 1 PR pr. bid (A/B/C) mod `main`
|
||||
- Mål: ~200–300 net LOC per PR (ekskl. generated artefakter)
|
||||
- Undgå cross-layer scope creep
|
||||
- Review-tid <30 min
|
||||
|
||||
## Overordnet acceptance for #224
|
||||
- A/B/C-sekvens er tydelig med links
|
||||
- Hver bid er mergebar isoleret
|
||||
- Scheduler kan assign’e direkte uden ekstra afklaring
|
||||
|
||||
## Verification (docs-only)
|
||||
- Verificeret at dokumentet kun beskriver trunk-sekvensen for issue #224 og linker til #225/#226/#227.
|
||||
- Ingen runtime-kode ændret; der er derfor ikke kørt kode/tests i denne PR.
|
||||
@@ -1,44 +0,0 @@
|
||||
# ISSUE-225 Artifact — Backend i18n baseline (resolver + fallback)
|
||||
|
||||
Issue: **#225** (`[MVP][READY] #175-A: Backend i18n baseline (resolver + fallback)`)
|
||||
|
||||
## Scope verified
|
||||
|
||||
- Backend locale resolver supports `da` + `en` and normalizes language tags.
|
||||
- Unsupported locale requests fall back to default locale (`en`).
|
||||
- Error payload contract is stable for API errors:
|
||||
- `error_code`
|
||||
- `error`
|
||||
- `locale`
|
||||
|
||||
## Implementation references
|
||||
|
||||
- Locale resolution + fallback chain:
|
||||
- `lobby/i18n.py`
|
||||
- `resolve_locale()`
|
||||
- `resolve_error_message()`
|
||||
- `api_error()`
|
||||
- Shared locale contract source:
|
||||
- `shared/i18n/lobby.json` (`locales.default=en`, supported includes `en`, `da`)
|
||||
|
||||
## Acceptance checks run
|
||||
|
||||
Command:
|
||||
|
||||
```bash
|
||||
.venv/bin/python manage.py test \
|
||||
lobby.tests.I18nResolverTests \
|
||||
lobby.tests.LobbyFlowTests \
|
||||
lobby.tests.StartRoundTests
|
||||
```
|
||||
|
||||
Result (2026-03-02):
|
||||
|
||||
- `Ran 28 tests in 24.781s — OK`
|
||||
- `System check identified no issues (0 silenced).`
|
||||
- Confirms resolver behavior for locale normalization + fallback and stable error payload fields across flow endpoints.
|
||||
|
||||
## Notes
|
||||
|
||||
- Existing merged follow-ups in `main` include Accept-Language parsing fixes for q-values and locale tag normalization.
|
||||
- This artifact documents the final baseline state and verification evidence for #225.
|
||||
@@ -1,30 +0,0 @@
|
||||
# ISSUE-226 — Shared key-map + locale-kontrakt (backend/frontend)
|
||||
|
||||
## Source of truth
|
||||
- Single shared artifact: `shared/i18n/lobby.json`
|
||||
- Ownership is documented under `contract.ownership` in the same artifact.
|
||||
|
||||
## Locale contract
|
||||
Defined under `contract.locale`:
|
||||
- default locale: `en`
|
||||
- supported locales: `en`, `da`
|
||||
- fallback rule: use default locale when requested locale is unsupported or a key translation is missing.
|
||||
|
||||
## Shared backend→frontend key-map
|
||||
Defined under `contract.backend_to_frontend_error_keys`.
|
||||
|
||||
Examples:
|
||||
- `session_not_found -> session_not_found`
|
||||
- `session_not_joinable -> join_failed`
|
||||
- `round_start_invalid_phase -> start_round_failed`
|
||||
|
||||
This allows backend error codes to remain stable while frontend copy keys stay UX-oriented.
|
||||
|
||||
## da/en example values
|
||||
From `shared/i18n/lobby.json`:
|
||||
- `frontend.errors.session_code_required.en = "Session code is required."`
|
||||
- `frontend.errors.session_code_required.da = "Sessionskoden er påkrævet."`
|
||||
|
||||
## Verification
|
||||
- Backend: `python manage.py test lobby.tests.I18nResolverTests`
|
||||
- Frontend: `npm test -- --run tests/lobby-i18n.contract.test.ts`
|
||||
@@ -1,16 +0,0 @@
|
||||
# Issue #250 Artifact — MVP guardrail (telefon-klient uden lydafspilning)
|
||||
|
||||
## Scope
|
||||
Implementeret guardrail for `primary-device only` audio policy i SPA player-flow.
|
||||
|
||||
## Acceptance mapping
|
||||
1. **Telefon-klient flow indeholder ingen audio-play init-path**
|
||||
- Test: `player-shell.component.spec.ts` → `does not trigger original media play during player-shell init path`.
|
||||
2. **Primær enhed policy er dokumenteret og testbar**
|
||||
- Policy i contract: `shared/i18n/lobby.json` → `frontend.capabilities.client_has_no_audio_output=true`.
|
||||
- Testbar via eksisterende guard-tests + init-path test i player-shell specs.
|
||||
3. **Krav er refereret i SPA-plan/cutover-noter**
|
||||
- Dokumenteret i `docs/spa-cutover-flag.md` under *MVP audio policy guardrail (telefon-klient)*.
|
||||
|
||||
## UX/i18n note
|
||||
- Player shell viser advarselstekst via i18n key: `frontend.ui.player.audio_policy_notice`.
|
||||
@@ -1,124 +0,0 @@
|
||||
# Issue #251 — Release-often lane for SPA MVP (3 micro-PR batches)
|
||||
|
||||
## Formål
|
||||
Bryde SPA MVP-arbejdet op i **3 merge-klare micro-PRs** med tydelige acceptance criteria,
|
||||
så vi kan levere værdi oftere, reducere review-risiko og holde `main` grøn.
|
||||
|
||||
## Scope (issue-bound)
|
||||
Denne plan dækker kun planlægning/acceptance for den kommende SPA MVP-lane.
|
||||
Implementering af de konkrete features sker i efterfølgende PRs.
|
||||
|
||||
## Hard acceptance criteria for issue #251
|
||||
- [x] Der findes en dokumenteret plan med præcis **3 batches**.
|
||||
- [x] Hver batch har:
|
||||
- [x] mål og afgrænsning
|
||||
- [x] konkrete leverancer (kodeområder)
|
||||
- [x] test/checks før merge
|
||||
- [x] rollback-note
|
||||
- [x] "ikke med i denne batch" for at undgå scope creep
|
||||
- [x] Batch-rækkefølgen er dependencies-sikker (batch B bygger på batch A, batch C på batch B).
|
||||
- [x] Hver batch kan merges/releaseres uafhængigt uden at blokere drift på `main`.
|
||||
- [x] Planen linker til konkrete dev-opgaver for lane-kørsel.
|
||||
|
||||
## Batch-plan (merge-klare micro-PRs)
|
||||
|
||||
### Batch A — SPA shell + routing baseline
|
||||
**Mål:** Et stabilt SPA-skelet med route-struktur og guard-basics.
|
||||
|
||||
**Leverancer (kodeområder)**
|
||||
- `frontend/angular/src/app/app.routes.ts` (host/player entry routes + fallback)
|
||||
- `frontend/angular/src/app/session-route-context.ts` (baseline route guards)
|
||||
- `frontend/angular/src/app/app.component.*` (shell-nav + route outlet wiring)
|
||||
- `lobby/templates/lobby/spa_shell.html` (kompatibel shell-entry ved SPA cutover)
|
||||
|
||||
**Done-kriterier**
|
||||
- Host- og player-entry routes kan åbnes uden runtime-fejl i samme SPA-shell.
|
||||
- Route guards afviser ugyldige parametre deterministisk (ingen hard crash).
|
||||
- `USE_SPA_UI=false` fortsætter med legacy-flow uden regression.
|
||||
|
||||
**Checks før merge**
|
||||
- `cd frontend/angular && npm test -- --run src/app/app.routes.spec.ts src/app/session-route-context.spec.ts`
|
||||
- `cd frontend/angular && npm run build`
|
||||
- Manual smoke: `/lobby/ui/host` + `/lobby/ui/player` (både `USE_SPA_UI=false` og `true`).
|
||||
|
||||
**Rollback-note**
|
||||
- Sæt `USE_SPA_UI=false` og redeploy; verificér legacy routes svarer 200.
|
||||
|
||||
**Ikke med i batch A**
|
||||
- Fuld gameplay-state synkronisering.
|
||||
- Audio/polish og i18n finpudsning ud over baseline wiring.
|
||||
|
||||
---
|
||||
|
||||
### Batch B — Session-state + host/player sync MVP
|
||||
**Mål:** Korrekt synkronisering af session-state mellem host og spillerklient.
|
||||
|
||||
**Leverancer (kodeområder)**
|
||||
- `frontend/angular/src/app/features/host/host-shell.component.ts`
|
||||
- `frontend/angular/src/app/features/player/player-shell.component.ts`
|
||||
- `frontend/src/api/angular-client.ts` (MVP-kald for status/phase-overgange)
|
||||
|
||||
**Done-kriterier**
|
||||
- Host handlinger (`start`, `show`, `mix`, `score`, `next`, `finish`) afspejles hos player uden side-reload.
|
||||
- Session-phase transitions er deterministiske i happy-path (`lobby -> question -> score -> next/finish`).
|
||||
- Guardrails reducerer race-condition regressions ved hurtige phase-skift.
|
||||
|
||||
**Checks før merge**
|
||||
- `cd frontend/angular && npm test -- --run src/app/features/host/host-shell.component.spec.ts src/app/features/player/player-shell.component.spec.ts`
|
||||
- `cd frontend && npm test -- --run tests/angular-api-client.test.ts`
|
||||
- Manual smoke: host action -> player phase sync indenfor forventet latenstid.
|
||||
|
||||
**Rollback-note**
|
||||
- Slå `USE_SPA_UI=false`, redeploy, og kør hurtig gameplay-smoke i legacy flow.
|
||||
|
||||
**Ikke med i batch B**
|
||||
- Avanceret UX-polish/animation.
|
||||
- Udvidet observability udenfor MVP-kritiske logs.
|
||||
|
||||
---
|
||||
|
||||
### Batch C — Lobby/join/start minimal flow + release readiness
|
||||
**Mål:** Gøre SPA MVP release-klar med fokus på stabilitet og driftssikkerhed omkring det minimale flow.
|
||||
|
||||
**Leverancer (kodeområder)**
|
||||
- `frontend/angular/src/app/i18n-mvp-flow-smoke.spec.ts` + relevante shell-tests
|
||||
- `docs/UI_SMOKE.md` + `docs/STAGING_GAMEPLAY_SMOKE_ARTIFACT.md`
|
||||
- `CHANGELOG.md` release-input for SPA MVP lane
|
||||
|
||||
**Done-kriterier**
|
||||
- End-to-end minimal flow (`lobby -> join -> start`) er dokumenteret PASS i SPA.
|
||||
- Fejl-/empty-/loading states for flowets kritiske skærme er verificeret.
|
||||
- Driftsteam kan udføre cutover + rollback uden tvetydighed.
|
||||
|
||||
**Checks før merge**
|
||||
- `cd frontend/angular && npm test -- --run src/app/i18n-mvp-flow-smoke.spec.ts`
|
||||
- `python manage.py test lobby.tests.LobbyFlowTests`
|
||||
- Opdateret staging-smoke artifact med UTC tidsstempler og gate-resultat.
|
||||
|
||||
**Rollback-note**
|
||||
- Brug eksisterende playbook i `docs/spa-cutover-flag.md` (`USE_SPA_UI=false` + asset-version rollback).
|
||||
|
||||
**Ikke med i batch C**
|
||||
- Post-MVP featureudvidelser.
|
||||
- Større refactors uden direkte release-værdi.
|
||||
|
||||
## Rækkefølge og parallel-kørsel
|
||||
- **Dependency-rækkefølge:** A -> B -> C.
|
||||
- **Kan køres parallelt uden konflikt:**
|
||||
- Test-/doc-forberedelse til C kan startes parallelt med B (ingen blokering af runtime-kode), men merges først efter B.
|
||||
- Drift-smoke templates kan opdateres tidligt, så længe de ikke ændrer runtime-adfærd.
|
||||
- **Må ikke køre parallelt:**
|
||||
- Runtime routing/guard ændringer i A og session-sync logik i B på samme filer uden feature-flag koordinering.
|
||||
|
||||
## Konkret lane-opgavebinding (dev-opgaver)
|
||||
- Batch A PR: `feat/issue-251-batch-1-spa-shell-routing`
|
||||
- Batch B PR: `feat/issue-251-batch-2-session-sync`
|
||||
- Batch C PR: `feat/issue-251-batch-3-lobby-join-start-release-readiness`
|
||||
|
||||
Hver PR skal linke tilbage til issue #251 og inkludere test-evidence + rollback-check.
|
||||
|
||||
## Merge-gate for alle 3 batches
|
||||
- Små PRs (mål: reviewbar størrelse, helst < ~300 netto-linjer når muligt).
|
||||
- Grøn CI/checks før review-request.
|
||||
- Tydelig PR-beskrivelse med: scope, test evidence, out-of-scope.
|
||||
- Ingen skjulte sideeffekter på tværs af apps/domæner.
|
||||
@@ -1,27 +0,0 @@
|
||||
# ISSUE-252 Artifact — React fallback trigger criteria (delivery-blocking only)
|
||||
|
||||
Issue: **#252**
|
||||
|
||||
## Leveret ændring
|
||||
Dokumentationen i `docs/spa-cutover-flag.md` er opdateret med en dedikeret sektion:
|
||||
- **React fallback trigger-kriterier (kun delivery-blocking)**
|
||||
- klare **tilladelses-kriterier** (alle skal være opfyldt)
|
||||
- tydelige **scope-limits**
|
||||
- eksplicitte **ikke-tilladte** anvendelser
|
||||
|
||||
## Acceptance mapping
|
||||
1. **Clear trigger criteria**
|
||||
- Definerer præcist hvornår fallback er tilladt:
|
||||
- aktiv delivery-blocking fejl i Angular SPA
|
||||
- ingen sikker Angular-fix inden release-vinduet
|
||||
- rollback alene er utilstrækkelig for leveringsbehovet
|
||||
- beslutning + evidens logges eksplicit (inkl. issue/incident-reference)
|
||||
2. **Scope limits**
|
||||
- Begrænset til delivery-blocking host/player-paths.
|
||||
- Ingen feature-bundling eller ikke-kritiske ændringer.
|
||||
- Midlertidig anvendelse kun i aktiv incident/release-vindue.
|
||||
3. **When fallback is allowed**
|
||||
- Kun når alle trigger-kriterier er opfyldt og dokumenteret.
|
||||
|
||||
## Resultat
|
||||
Issue #252 er dokumenteret med operationelle guardrails, så React fallback kun bruges i kontrollerede, leveringsblokerende situationer.
|
||||
@@ -1,32 +0,0 @@
|
||||
# ISSUE-257 Artifact — Shared i18n keyspace + frontend loader (da/en, Angular-first)
|
||||
|
||||
Issue: **#257** (`[MVP][READY] #175-B: Shared i18n keyspace + frontend loader`)
|
||||
|
||||
## Acceptance checklist
|
||||
|
||||
- [x] **Delt key-strategi dokumenteret (frontend/backend)**
|
||||
- Arkitektur/deling beskrevet i `docs/I18N_ARCHITECTURE.md`.
|
||||
- Shared contract + keyspace source of truth: `shared/i18n/lobby.json`.
|
||||
|
||||
- [x] **Frontend loader kan indlæse da+en med samme keyspace**
|
||||
- Shared loader: `frontend/shared/i18n/lobby-loader.ts`.
|
||||
- Angular-first integration via `frontend/angular/src/app/lobby-i18n.ts` (samme loader/samme keyspace).
|
||||
- Locale-normalisering inkluderer underscore/hyphen variants (`da_DK` → `da`).
|
||||
|
||||
- [x] **Minimal check for key-paritet da/en**
|
||||
- `collectLocaleParityIssues(...)` i shared loader.
|
||||
- Testet i `frontend/tests/lobby-loader.parity.test.ts`.
|
||||
|
||||
- [x] **Ingen API-kontraktbrud**
|
||||
- Contract-test: `frontend/tests/lobby-i18n.contract.test.ts`.
|
||||
- Drift-check mellem manifest og katalog: `scripts/check_i18n_drift.py`.
|
||||
|
||||
## Kørte checks
|
||||
|
||||
```bash
|
||||
python3 scripts/check_i18n_drift.py
|
||||
cd frontend && npm test -- --run tests/lobby-loader.parity.test.ts tests/lobby-i18n.contract.test.ts
|
||||
cd frontend/angular && npm test -- --run src/app/lobby-i18n.spec.ts src/app/i18n-mvp-flow-smoke.spec.ts
|
||||
```
|
||||
|
||||
Resultat: alle checks grønne.
|
||||
@@ -1,37 +0,0 @@
|
||||
# ISSUE-257 Artifact — shared i18n keyspace + frontend loader (Angular-first)
|
||||
|
||||
Issue: **#257** (`[MVP][READY] #175-B: Shared i18n keyspace + frontend loader (da/en, Angular-first)`)
|
||||
|
||||
## Acceptance mapping
|
||||
|
||||
### 1) Delt key-strategi dokumenteret (frontend/backend)
|
||||
- Shared contract source: `shared/i18n/lobby.json`
|
||||
- Architecture doc: `docs/I18N_ARCHITECTURE.md`
|
||||
- Key-map/contract doc: `docs/ISSUE-226-SHARED-KEYMAP-LOCALE-CONTRACT.md`
|
||||
|
||||
### 2) Frontend loader kan indlæse da+en med samme keyspace
|
||||
- Shared loader: `frontend/shared/i18n/lobby-loader.ts`
|
||||
- Angular-first consumer path:
|
||||
- `frontend/src/spa/lobby-i18n.ts`
|
||||
- Angular shell/tests continue to consume same shared catalog through shared loader contract.
|
||||
|
||||
### 3) Minimal check for key-paritet da/en
|
||||
- Guard test: `frontend/tests/lobby-loader.parity.test.ts`
|
||||
- Contract test: `frontend/tests/lobby-i18n.contract.test.ts`
|
||||
|
||||
### 4) Ingen API-kontraktbrud
|
||||
- Frontend API contract smoke:
|
||||
- `frontend/angular/src/app/api-contract-smoke.spec.ts`
|
||||
- `frontend/tests/angular-api-client.test.ts`
|
||||
|
||||
## Verification run (this lane)
|
||||
|
||||
```bash
|
||||
cd frontend
|
||||
npm test -- --run tests/lobby-loader.parity.test.ts tests/lobby-i18n.contract.test.ts tests/angular-api-client.test.ts
|
||||
|
||||
cd ../frontend/angular
|
||||
npm test -- --run src/app/api-contract-smoke.spec.ts
|
||||
```
|
||||
|
||||
Result: PASS (all selected suites green).
|
||||
@@ -1,18 +0,0 @@
|
||||
# Issue #260 Artifact — Phone/client no-audio guard (primary-device only playback)
|
||||
|
||||
## Scope
|
||||
Added regression coverage for MVP audio policy to ensure phone/client flows never claim playback ownership, while primary-device playback stays unaffected.
|
||||
|
||||
## Acceptance mapping
|
||||
1. **client/phone triggers no playback**
|
||||
- Existing test coverage retained in `player-shell.component.spec.ts`:
|
||||
- `does not trigger original media play during player-shell init path`
|
||||
- `installs secondary-device audio guard while player shell is mounted`
|
||||
2. **primary device playback unaffected**
|
||||
- New negative test in `player-shell.component.spec.ts`:
|
||||
- `keeps primary-device playback untouched when no-audio capability is disabled`
|
||||
3. **one negative test for phone audio**
|
||||
- Existing negative path preserved:
|
||||
- `does not trigger original media play during player-shell init path`
|
||||
4. **no backend contract changes**
|
||||
- Frontend test/docs-only scope; no backend contract files changed.
|
||||
@@ -1,80 +0,0 @@
|
||||
# ISSUE-277 Artifact — shared i18n registry parity report (Django ↔ Angular MVP)
|
||||
|
||||
Issue: **#277** (`[READY][#175][P3] Shared i18n registry artifact: backend/frontend keyspace parity report`)
|
||||
|
||||
## Artifact metadata
|
||||
|
||||
- `artifact_id`: `issue-277-shared-i18n-parity-report`
|
||||
- `artifact_version`: `1.0`
|
||||
- `catalog_source`: `shared/i18n/lobby.json`
|
||||
- `generator`: `scripts/report_i18n_parity.py`
|
||||
|
||||
## Naming/version rules (email-manager-inspired strategy)
|
||||
|
||||
- **Single canonical artifact per issue**: issue-bundne rapporter navngives `docs/ISSUE-<nr>-<slug>-ARTIFACT.md`.
|
||||
- **Stable artifact identity**: `artifact_id` ændres ikke ved tekstlige opdateringer i samme rapporttype; det er den faste reference i review/ops.
|
||||
- **Explicit artifact versioning**: `artifact_version` bumpes, når rapportlogik eller scope ændres, så drift/review kan se forskel på format- vs. dataændringer.
|
||||
- **Shared namespace first**: keys refereres med fulde navnerum (`frontend.ui.*`, `frontend.errors.*`, `backend.error_codes.*`, `backend.errors.*`) i stedet for lokale aliases i artefakter.
|
||||
- **Source-of-truth before consumers**: rapporten afledes fra `shared/i18n/lobby.json`; Django/Angular beskrives som consumers af samme registry og ikke som parallelle kontrakter.
|
||||
|
||||
## MVP-critical parity summary
|
||||
|
||||
- Frontend UI gameplay keys checked: **16** → `OK`
|
||||
- Frontend error keys checked: **7** → `OK`
|
||||
- Backend gameplay/error codes checked: **9** → `OK`
|
||||
- Distinct frontend error keys reached from backend MVP flow: **6** (`join_failed, nickname_invalid, nickname_taken, session_code_required, session_not_found, start_round_failed`)
|
||||
|
||||
Status: **Shared locale matrix is aligned (`en`, `da`) and backend→frontend error handling is contract-complete for MVP-critical flow.**
|
||||
|
||||
## Django ↔ Angular parity matrix (MVP-critical error contract)
|
||||
|
||||
| Backend code (`backend.error_codes.*`) | Django message key (`backend.errors.*`) | Angular key (`frontend.errors.*`) | Locales `en/da` | Parity note |
|
||||
|---|---|---|---|---|
|
||||
| `session_code_required` | `session_code_required` | `session_code_required` | `OK` | 1:1 |
|
||||
| `nickname_invalid` | `nickname_invalid` | `nickname_invalid` | `OK` | 1:1 |
|
||||
| `session_not_found` | `session_not_found` | `session_not_found` | `OK` | 1:1 |
|
||||
| `session_not_joinable` | `session_not_joinable` | `join_failed` | `OK` | mapped alias |
|
||||
| `nickname_taken` | `nickname_taken` | `nickname_taken` | `OK` | 1:1 |
|
||||
| `category_slug_required` | `category_slug_required` | `start_round_failed` | `OK` | many:1 collapse |
|
||||
| `category_not_found` | `category_not_found` | `start_round_failed` | `OK` | many:1 collapse |
|
||||
| `round_start_invalid_phase` | `round_start_invalid_phase` | `start_round_failed` | `OK` | many:1 collapse |
|
||||
| `round_already_configured` | `round_already_configured` | `start_round_failed` | `OK` | many:1 collapse |
|
||||
|
||||
## Scope notes
|
||||
|
||||
- **Django** consumes backend codes/messages directly from `shared/i18n/lobby.json` via `lobby/i18n.py`.
|
||||
- **Angular** consumes the same registry via `frontend/shared/i18n/lobby-loader.ts` and runtime helpers in `frontend/angular/src/app/lobby-i18n.ts`.
|
||||
- **Parity in MVP** is therefore strongest on the shared error contract and locale matrix; gameplay UI labels are frontend-owned but still live in the same registry.
|
||||
|
||||
## Verified MVP gameplay UI keyspace present in the shared registry
|
||||
|
||||
- `frontend.ui.host.title`
|
||||
- `frontend.ui.player.title`
|
||||
- `frontend.ui.common.session_code`
|
||||
- `frontend.ui.player.nickname`
|
||||
- `frontend.ui.player.join`
|
||||
- `frontend.ui.host.start_round`
|
||||
- `frontend.ui.host.show_question`
|
||||
- `frontend.ui.player.lie_label`
|
||||
- `frontend.ui.player.submit_lie`
|
||||
- `frontend.ui.player.submit_guess`
|
||||
- `frontend.ui.host.mix_answers`
|
||||
- `frontend.ui.host.calculate_scores`
|
||||
- `frontend.ui.host.load_scoreboard`
|
||||
- `frontend.ui.host.final_leaderboard`
|
||||
- `frontend.ui.player.final_leaderboard`
|
||||
- `frontend.ui.common.points_short`
|
||||
|
||||
## Concrete deviations / follow-up items
|
||||
|
||||
1. **Error granularity collapse remains intentional**: backend codes `category_slug_required, category_not_found, round_start_invalid_phase, round_already_configured` all map to `frontend.errors.start_round_failed`. Follow-up only if product wants case-specific Angular copy instead of one shared host failure message.
|
||||
2. **Frontend-only fallback copy is not mirrored in Django**: `frontend.errors.unknown` and `frontend.errors.session_fetch_failed` are Angular-side resilience keys, not backend contract keys. Follow-up if API responses should expose stable backend equivalents for these states.
|
||||
3. **Gameplay UI labels are registry-shared but not backend-rendered**: `frontend.ui.host.*`, `frontend.ui.player.*`, and `frontend.ui.common.*` are available in the shared artifact, but Django currently consumes only the backend error slice. Follow-up only if server-rendered views must guarantee the same UI label surface as Angular.
|
||||
|
||||
## Re-run
|
||||
|
||||
```bash
|
||||
python3 scripts/check_i18n_drift.py
|
||||
python3 scripts/report_i18n_parity.py
|
||||
python3 scripts/check_i18n_parity_artifact.py
|
||||
```
|
||||
@@ -1,36 +0,0 @@
|
||||
# Issue #278 Artifact — smoke/e2e gate for da+en locale flow and primary-only audio
|
||||
|
||||
## Scope
|
||||
Acceptance for `[READY][#175][P4]`:
|
||||
1. Verify one MVP host+player smoke run in `en`.
|
||||
2. Verify one MVP host+player smoke run in `da`.
|
||||
3. Verify audio routing remains `primary-device only` so phone/player clients never take playback ownership.
|
||||
|
||||
Dette er en gate-/evidensleverance. Ingen ny produktfunktion ud over test/verifikation.
|
||||
|
||||
## Implemented smoke gate
|
||||
Angular smoke spec: `frontend/angular/src/app/i18n-mvp-flow-smoke.spec.ts`
|
||||
|
||||
The gate now runs two explicit locale scenarios:
|
||||
- `en`: host refresh/start-round copy + player submit-guess copy
|
||||
- `da`: samme flow med dansk copy
|
||||
|
||||
Audio-policy delen af samme smoke-spec verificerer:
|
||||
- host/primary playback path er uændret før player mount
|
||||
- player mount installerer no-audio guard på secondary device
|
||||
- guard fjernes igen ved unmount, så primary path fortsat er eneste aktive output
|
||||
|
||||
## Recommended verification command
|
||||
Køres fra `frontend/angular`:
|
||||
|
||||
```bash
|
||||
npm test -- --run src/app/i18n-mvp-flow-smoke.spec.ts src/app/lobby-i18n.spec.ts src/app/features/player/player-shell.component.spec.ts
|
||||
```
|
||||
|
||||
## Why this is the gate
|
||||
- `i18n-mvp-flow-smoke.spec.ts` giver en lille, samlet smoke/e2e-lignende verifikation af host+player i begge locale-kontekster.
|
||||
- `lobby-i18n.spec.ts` holder shared locale propagation + contract fallback grøn.
|
||||
- `player-shell.component.spec.ts` dækker den dybere regressionflade for audio-guard på secondary device.
|
||||
|
||||
## Conclusion
|
||||
Gate’en verificerer nu eksplicit begge locale-runs (`da` + `en`) og bekræfter primary-only audio routing i MVP-flowet.
|
||||
@@ -1,168 +0,0 @@
|
||||
# ISSUE-279 — i18n MVP close-out note
|
||||
|
||||
Issue: **#279** (`[READY][#175][P5] MVP close-out note: migration/changelog + release-readiness checklist for i18n`)
|
||||
|
||||
## Scope
|
||||
|
||||
Dette dokument lukker MVP-sporet for issue #175 med tre konkrete ting:
|
||||
|
||||
1. en migrationsnote for release/deploy,
|
||||
2. changelog-indhold der kan genbruges i næste release-note,
|
||||
3. en release-readiness checkliste for i18n, forankret i et verificeret snapshot af `main` ved reviewtidspunktet.
|
||||
|
||||
Repo-state ved review-opdatering:
|
||||
- `main` peger nu på merge commit `1bc4c27` (PR #283), og inkluderer også PR #282 via merge commit `6ad5430`.
|
||||
- Denne note er opdateret mod repo-tilstanden verificeret 2026-03-13 UTC, ikke en løbende garanti for senere `main`-ændringer.
|
||||
- Denne revision afløser de tidligere snapshot-antagelser fra PR-historikken, hvor #282/#283 endnu ikke var landet.
|
||||
- Der er ingen åbne release-afklaringer tilbage for PR #282/#283; begge er allerede landet på `main`.
|
||||
|
||||
## Current i18n MVP state on `main`
|
||||
|
||||
Følgende er allerede til stede på `main`:
|
||||
|
||||
- **Shared contract** i `shared/i18n/lobby.json`
|
||||
- default locale: `en`
|
||||
- supported locales: `en`, `da`
|
||||
- fælles frontend/backend keyspace + fallback-regler
|
||||
- **Django bootstrap** via `partyhub/i18n_bootstrap.py` og `partyhub/settings.py`
|
||||
- `LocaleMiddleware` aktiv
|
||||
- `LANGUAGE_CODE` + `LANGUAGES` bootstrappes fra shared catalog
|
||||
- **Backend locale/error flow** via `lobby/i18n.py`
|
||||
- normalisering af locale-tags
|
||||
- locale-aware fejlpayload med `error_code`, `error`, `locale`
|
||||
- fallback til `en` når locale eller oversættelse mangler
|
||||
- **Angular MVP wiring** via
|
||||
- `frontend/shared/i18n/lobby-loader.ts`
|
||||
- `frontend/angular/src/app/lobby-i18n.ts`
|
||||
- host/player shells med locale switch og shared copy-opslag
|
||||
- **Drift/parity guardrails**
|
||||
- `shared/i18n/key-manifest.json`
|
||||
- `scripts/check_i18n_drift.py`
|
||||
- frontend parity/contract tests
|
||||
- **Existing documentation/artifacts**
|
||||
- `docs/I18N_ARCHITECTURE.md`
|
||||
- `docs/ISSUE-175-I18N-SHARED-CONTRACT-ARTIFACT.md`
|
||||
- `docs/ISSUE-225-BACKEND-I18N-BASELINE-ARTIFACT.md`
|
||||
- `docs/ISSUE-257-SHARED-I18N-KEYSPACE-FRONTEND-LOADER-ARTIFACT.md`
|
||||
- `docs/ISSUE-207-I18N-AUDIO-SMOKE-ARTIFACT.md`
|
||||
- `docs/i18n-drift-check.md`
|
||||
|
||||
## Migration note for release
|
||||
|
||||
### Schema impact
|
||||
|
||||
**Der er ingen nye Django-migrations i selve i18n-MVP-sporet på `main`.**
|
||||
|
||||
Den i18n-relaterede leverance ligger i shared catalog, locale-bootstrap, error-payload-kontrakt, Angular wiring og test/documentation. Den kræver derfor ikke en særskilt i18n-database-migration for at gå i release.
|
||||
|
||||
### Release/deploy expectation
|
||||
|
||||
Selv om issue #279 ikke introducerer schemaændringer, skal release-flow stadig følge repoets generelle migreringsgate:
|
||||
|
||||
```bash
|
||||
python manage.py makemigrations --check --dry-run
|
||||
python manage.py migrate --check --noinput
|
||||
```
|
||||
|
||||
Hvorfor: release-policyen kræver, at vi undgår code/schema drift, og staging-smoke-suiten forventer eksplicit migration consistency check.
|
||||
|
||||
### Praktisk migrationskonklusion
|
||||
|
||||
Til release-notes/deploy-runbook kan i18n-sporet beskrives sådan her:
|
||||
|
||||
- **Migration impact:** none for i18n MVP itself
|
||||
- **Deploy requirement:** run standard Django migration consistency checks anyway
|
||||
- **Rollback note:** rollback er primært kode-/asset-baseret (shared catalog, frontend bundles, backend locale resolver), ikke schema-baseret
|
||||
|
||||
## Suggested changelog content
|
||||
|
||||
Følgende tekst kan bruges direkte i næste unreleased/release-sektion:
|
||||
|
||||
```markdown
|
||||
### i18n
|
||||
- Shared da/en lobby i18n contract is now wired across Django and Angular MVP flows via `shared/i18n/lobby.json`.
|
||||
- Backend error payloads expose stable locale-aware fields (`error_code`, `error`, `locale`) with fallback to English for unsupported locales.
|
||||
- Angular host/player shells now consume shared i18n copy, persist preferred locale, and keep audio-policy messaging aligned with the shared catalog.
|
||||
- Added repo guardrails for i18n drift/parity through the shared key manifest, drift checker, and focused frontend/backend contract tests.
|
||||
- Release migration impact for the i18n MVP is **none** beyond the standard Django migration consistency checks.
|
||||
```
|
||||
|
||||
Kort version til annoterede release-notes:
|
||||
|
||||
```markdown
|
||||
## i18n MVP close-out
|
||||
- Shared da/en contract is active across backend + Angular MVP shell.
|
||||
- Locale fallback remains `en` for unsupported requests and missing translations.
|
||||
- No i18n-specific schema migration is required; keep standard `migrate --check --noinput` in release verification.
|
||||
```
|
||||
|
||||
## Release-readiness checklist for i18n
|
||||
|
||||
Status er vurderet mod verificeret snapshot `main@1bc4c27` (reviewet 2026-03-13 UTC, inkl. PR #282/#283).
|
||||
|
||||
### 1) Shared contract and locale behavior
|
||||
|
||||
- [x] Shared catalog findes i `shared/i18n/lobby.json`.
|
||||
- [x] Default/supported locales er dokumenteret og implementeret som `en` + `da`.
|
||||
- [x] Backend bruger shared contract til locale-aware fejlbeskeder.
|
||||
- [x] Frontend/Angular bruger shared loader + shared keyspace.
|
||||
- [x] Fallback-regel til `en` er dokumenteret og testet.
|
||||
|
||||
### 2) Verification artifacts and local checks
|
||||
|
||||
- [x] Arkitektur-note findes: `docs/I18N_ARCHITECTURE.md`.
|
||||
- [x] Baseline artifact for issue #175 findes.
|
||||
- [x] Backend artifact for issue #225 findes.
|
||||
- [x] Frontend/shared loader artifact for issue #257 findes.
|
||||
- [x] Drift-check dokumentation findes i `docs/i18n-drift-check.md`.
|
||||
- [x] Parity artifact fra issue #277 er på `main` via PR #282 (merge commit `6ad5430`).
|
||||
|
||||
### 3) Code readiness on current branch topology
|
||||
|
||||
- [x] Angular MVP host/player i18n flow er på `main` (PR #281).
|
||||
- [x] Shared locale/bootstrap wiring er på `main`.
|
||||
- [x] Django i18n hardening fra issue #275 er på `main` via PR #283 (merge commit `1bc4c27`).
|
||||
- [x] PR #283 er ikke længere en separat release-afklaring; hardeningen er allerede indarbejdet på `main`.
|
||||
|
||||
### 4) Release gate before shipping i18n as “done”
|
||||
|
||||
- [x] PR #282 er allerede merged, så parity-artifact-status er afklaret på `main`.
|
||||
- [x] PR #283 er allerede merged, så backend hardening-status er afklaret på `main`.
|
||||
- [ ] Kør drift-check fra repo root:
|
||||
```bash
|
||||
python3 scripts/check_i18n_drift.py
|
||||
```
|
||||
- [ ] Kør backend i18n regressions:
|
||||
```bash
|
||||
. .venv/bin/activate && python manage.py test \
|
||||
partyhub.tests_i18n_bootstrap \
|
||||
lobby.tests.I18nResolverTests
|
||||
```
|
||||
- [ ] Kør frontend shared-contract/parity checks:
|
||||
```bash
|
||||
cd frontend && npm test -- --run \
|
||||
tests/lobby-loader.parity.test.ts \
|
||||
tests/lobby-i18n.contract.test.ts
|
||||
```
|
||||
- [ ] Kør Angular MVP locale smoke:
|
||||
```bash
|
||||
cd frontend/angular && npm test -- --run \
|
||||
src/app/lobby-i18n.spec.ts \
|
||||
src/app/i18n-mvp-flow-smoke.spec.ts \
|
||||
src/app/features/host/host-shell.component.spec.ts \
|
||||
src/app/features/player/player-shell.component.spec.ts
|
||||
```
|
||||
- [ ] Bekræft standard migration consistency gate:
|
||||
```bash
|
||||
. .venv/bin/activate && python manage.py makemigrations --check --dry-run
|
||||
. .venv/bin/activate && python manage.py migrate --check --noinput
|
||||
```
|
||||
- [ ] Følg `docs/RELEASE_POLICY.md`: staging deploy, `/healthz`, smoke-resultat og changelog-reference før tag.
|
||||
|
||||
## Close-out conclusion
|
||||
|
||||
**Konklusion:** i18n-MVP'en er implementeret på `main`, og issue #279 leverer den manglende release-/migration-closeout dokumentation uden nye kodeændringer i app-logikken.
|
||||
|
||||
PR #282 (parity artifact) og PR #283 (Django i18n hardening) er nu begge merged på `main`, så close-out-noten, changelog-teksten og release-readiness-checklisten kan behandles som indbyrdes konsistente for det verificerede snapshot.
|
||||
|
||||
Det betyder, at de resterende release-gates for i18n nu er de almindelige verificeringstrin (drift-check, backend/frontend-smoke, migrations-konsistens, staging deploy og changelog-reference) — ikke længere afklaring af om #282/#283 skal lande.
|
||||
@@ -1,22 +0,0 @@
|
||||
# Issue #287 — Canonical round-flow backend artifact
|
||||
|
||||
## State-transition matrix
|
||||
|
||||
| Trigger | From | To | Server-owned effect |
|
||||
|---|---|---|---|
|
||||
| `POST /lobby/sessions/{code}/rounds/start` | `lobby` | `lie` | Opretter `RoundConfig`, vælger/låser konkret `RoundQuestion`, eksponerer prompt + lie-deadline i samme svar |
|
||||
| Sidste gyldige `submit_lie` for aktivt spørgsmål | `lie` | `guess` | Dedupe/shuffle `correct_answer + lies`, persisterer `mixed_answers`, broadcaster `phase.guess_started` |
|
||||
| Sidste gyldige `submit_guess` for aktivt spørgsmål | `guess` | `reveal` | Beregner score deterministisk, persisterer `ScoreEvent` + opdaterede `Player.score`, returnerer canonical reveal payload |
|
||||
| Første canonical state-read efter resolved reveal (`session_detail`, og idempotent `GET /scoreboard` hvis state allerede er resolved) | `reveal` | `scoreboard` | Promoverer scoreboard som state, broadcaster `phase.scoreboard`, eksponerer leaderboard + readiness |
|
||||
| `POST /lobby/sessions/{code}/rounds/next` | `scoreboard` | `lie` | Increment round counter, kopierer seneste `RoundConfig`, vælger/låser næste spørgsmål i samme kategori og broadcaster `phase.lie_started` |
|
||||
| `POST /lobby/sessions/{code}/finish` | `scoreboard` | `finished` | Fryser slutresultat og returnerer final leaderboard |
|
||||
|
||||
## Flow-log (happy path)
|
||||
|
||||
1. Host starter runde med kategori.
|
||||
2. Server vælger straks spørgsmål og går i `lie`.
|
||||
3. Spillere sender løgne; sidste submission auto-advancer til `guess`.
|
||||
4. Spillere sender gæt; sidste submission auto-advancer til `reveal` og scorer runden.
|
||||
5. Næste canonical state-read promoverer resolved reveal til `scoreboard`; state findes uden separat debug-knap.
|
||||
6. Host kan nu kun vælge `next round` eller `finish game`.
|
||||
7. `next round` starter næste runde direkte i `lie` med nyt konkret spørgsmål; ingen mellem-hop tilbage til `lobby`.
|
||||
@@ -1,25 +0,0 @@
|
||||
# Issue #300 — scoreboard -> next-round bootstrap invariant
|
||||
|
||||
Refs: #300, parent #287
|
||||
|
||||
## Hardened invariant
|
||||
|
||||
`POST /lobby/sessions/{code}/rounds/next` now treats `scoreboard -> next round` as a deterministic backend-owned bootstrap boundary:
|
||||
|
||||
- stale pre-created `RoundConfig` / `RoundQuestion` rows for the next round are deleted before bootstrap
|
||||
- dependent lies / guesses for that stale next-round question are cleared with it
|
||||
- `current_round` increments exactly once when a fresh next-round question can be selected
|
||||
- the response makes reset semantics explicit with:
|
||||
- `round_bootstrap.active_submissions = { lies: 0, guesses: 0 }`
|
||||
- `round_question.answers = []`
|
||||
- `submission_progress = { lies_submitted: 0, guesses_submitted: 0, players_expected: N }`
|
||||
- `reveal = null`
|
||||
- `leaderboard = null`
|
||||
|
||||
## Regression coverage
|
||||
|
||||
Targeted Django tests lock:
|
||||
|
||||
1. scoreboard -> next-round bootstrap returns explicit reset semantics
|
||||
2. stale future round artifacts are removed before the next round is exposed
|
||||
3. two consecutive round bootstraps do not leak prior-round state into the next round
|
||||
@@ -1,66 +0,0 @@
|
||||
# Staging gameplay smoke artifact (Issue #144)
|
||||
|
||||
Formål: levere et lille, ensartet evidensformat for release-nær gameplay-smoke i #16/#90-sporet uden scope-udvidelse.
|
||||
|
||||
## Guardrails (MVP)
|
||||
- Hold scope inden for #16 (execution board) og #17 (scope guardrail).
|
||||
- Kun verifikation af eksisterende flow; ingen nye features/polish.
|
||||
|
||||
## Hvornår bruges artifacten
|
||||
- Efter staging-smoke af gameplay-flowet: lobby -> join -> start -> runde -> scoreboard -> next/final.
|
||||
- Resultatet logges i issue/PR-kommentar med denne skabelon.
|
||||
|
||||
## Evidence template (kopiér i PR/issue-kommentar)
|
||||
```markdown
|
||||
### Staging gameplay smoke evidence
|
||||
- Timestamp (UTC): <YYYY-MM-DD HH:MM>
|
||||
- Environment: staging
|
||||
- Commit/Head SHA: <sha>
|
||||
- Linked scope: #16 #17 #90 #129 #144
|
||||
|
||||
#### Setup
|
||||
- Host authenticated in Django admin: <yes/no>
|
||||
- Active category/questions present: <yes/no>
|
||||
- Participants: host + <N> players
|
||||
- `USE_SPA_UI`: <on/off>
|
||||
- `WPP_SPA_ASSET_VERSION`: <release-token/sha>
|
||||
- UI route used:
|
||||
- OFF (legacy): `/lobby/ui/host` + `/lobby/ui/player`
|
||||
- ON (SPA shell): `/lobby/ui/host/<spa-path>` + `/lobby/ui/player`
|
||||
|
||||
#### Checks (PASS/FAIL)
|
||||
0. Same release-window verification
|
||||
- OFF + ON smoke kørt i samme release-vindue: <pass/fail>
|
||||
1. Cutover route sanity
|
||||
- Flag OFF serves legacy UI templates: <pass/fail>
|
||||
- Flag ON serves SPA shell on expected path(s): <pass/fail>
|
||||
2. Lobby -> join -> start
|
||||
- Mixed-case + whitespace session code accepted: <pass/fail>
|
||||
3. One full round to scoreboard
|
||||
- submit lie -> mix -> submit guess -> calculate score -> show scoreboard: <pass/fail>
|
||||
4. Next-round + game-end sanity
|
||||
- next round transitions: <pass/fail>
|
||||
- final leaderboard visible: <pass/fail>
|
||||
|
||||
#### Smoke-gate decision (før `USE_SPA_UI=true`)
|
||||
- Gate status: <GREEN/RED>
|
||||
- Gate criteria met:
|
||||
- [ ] Cutover route sanity = PASS (OFF + ON)
|
||||
- [ ] Full gameplay round = PASS
|
||||
- [ ] Next-round/final leaderboard sanity = PASS
|
||||
- [ ] Ingen nye blocker-regressioner i host/player flow
|
||||
|
||||
#### Rollback checkpoint
|
||||
- Rollback required: <yes/no>
|
||||
- Trigger reason (if yes): <kort trigger>
|
||||
- Rollback done (`USE_SPA_UI=false`) verified: <yes/no>
|
||||
|
||||
#### Evidence pointers
|
||||
- Command(s): `<exact command(s)>`
|
||||
- UI notes/screenshots/log refs: <short refs>
|
||||
- Result: <PASS/FAIL>
|
||||
- If FAIL: blocker issue link + shortest repro
|
||||
```
|
||||
|
||||
## Anti-stall minimum
|
||||
Hvis der ikke er ny kode at ændre, er denne artifact-skabelon den mindste gyldige leverance for at sikre ensartet, reviewbar smoke-evidens i staging.
|
||||
@@ -4,45 +4,15 @@
|
||||
- Host er logget ind i Django.
|
||||
- Mindst én aktiv kategori med spørgsmål findes.
|
||||
|
||||
## Cutover-forudsætning (`USE_SPA_UI`)
|
||||
- `USE_SPA_UI=false` (default): brug legacy routes `/lobby/ui/host` + `/lobby/ui/player`.
|
||||
- `USE_SPA_UI=true`: host må gerne testes på SPA deep-link route `/lobby/ui/host/<spa-path>` (fx `/lobby/ui/host/guess`), player på `/lobby/ui/player`.
|
||||
|
||||
## Flow
|
||||
1. Verificér cutover-route matcher valgt flag (legacy vs SPA shell).
|
||||
2. Åbn host-siden og tryk Opret session.
|
||||
3. Åbn player-siden i 3 faner/enheder.
|
||||
4. Join alle spillere med sessionkode og nickname.
|
||||
5. Host: vælg kategori, Start runde, Vis spørgsmål.
|
||||
6. Spillere: brug round_question_id og submit løgn.
|
||||
7. Host: Mix svar.
|
||||
8. Spillere: submit gæt.
|
||||
9. Host: Beregn score og Vis scoreboard.
|
||||
10. Host: Næste runde eller Afslut spil.
|
||||
|
||||
## Smoke-gate (staging cutover)
|
||||
`USE_SPA_UI` må kun aktiveres i staging når følgende er opfyldt:
|
||||
- Cutover route sanity er PASS for både OFF (legacy) og ON (SPA shell).
|
||||
- Én fuld gameplay-runde til scoreboard er PASS.
|
||||
- Next-round/final leaderboard sanity er PASS.
|
||||
- Ingen nye blocker-regressioner i host/player kerneflow.
|
||||
|
||||
## Samme release-vindue: SPA OFF + ON verifikation
|
||||
Kør begge checks i samme release-vindue (samme deploy/artifact version):
|
||||
|
||||
1. **OFF-pass (legacy)**
|
||||
- `USE_SPA_UI=false`
|
||||
- Verificér legacy routes + fuld runde.
|
||||
2. **ON-pass (SPA)**
|
||||
- `USE_SPA_UI=true`
|
||||
- Behold samme release artifact og kun toggl flag/version-token ved behov.
|
||||
- Verificér SPA shell routes + fuld runde.
|
||||
3. Dokumentér begge pass i samme smoke-artifact med UTC timestamps og `WPP_SPA_ASSET_VERSION`.
|
||||
|
||||
## Rollback check points
|
||||
Skift straks tilbage til `USE_SPA_UI=false` hvis en gate fejler:
|
||||
1. Verificér legacy routes (`/lobby/ui/host` + `/lobby/ui/player`) fungerer igen.
|
||||
2. Log rollback trigger + kort repro i smoke artifact.
|
||||
3. Opret/link blocker issue før nyt cutover-forsøg.
|
||||
1. Åbn host-siden på /lobby/ui/host og tryk Opret session.
|
||||
2. Åbn player-siden i 3 faner/enheder på /lobby/ui/player.
|
||||
3. Join alle spillere med sessionkode og nickname.
|
||||
4. Host: vælg kategori, Start runde, Vis spørgsmål.
|
||||
5. Spillere: brug round_question_id og submit løgn.
|
||||
6. Host: Mix svar.
|
||||
7. Spillere: submit gæt.
|
||||
8. Host: Beregn score og Vis scoreboard.
|
||||
9. Host: Næste runde eller Afslut spil.
|
||||
|
||||
Resultat: En fuld runde kan køres uden rå API-kald fra terminal.
|
||||
|
||||
@@ -1,34 +0,0 @@
|
||||
# i18n key manifest + drift check
|
||||
|
||||
Issue: #240
|
||||
|
||||
This repo keeps shared lobby keyspaces in two files:
|
||||
|
||||
- Contract source: `shared/i18n/lobby.json`
|
||||
- Key manifest: `shared/i18n/key-manifest.json`
|
||||
|
||||
The manifest is intentionally small and explicit. It lists:
|
||||
|
||||
- Supported locales (`locales`)
|
||||
- Frontend error key set (`frontend_error_keys`)
|
||||
- Backend error code set (`backend_error_codes`)
|
||||
- Backend translation key set (`backend_error_keys`)
|
||||
- Optional contract-only aliases (`allowed_contract_only_backend_codes`)
|
||||
|
||||
## Local check
|
||||
|
||||
Run the read-only drift checker from repo root:
|
||||
|
||||
```bash
|
||||
python3 scripts/check_i18n_drift.py
|
||||
```
|
||||
|
||||
The script returns non-zero when it detects drift, including:
|
||||
|
||||
- key set mismatch between manifest and shared catalog
|
||||
- missing backend→frontend mapping coverage
|
||||
- mapping to unknown frontend keys
|
||||
- mappings for unknown backend codes
|
||||
- missing/empty locale translations (`en`/`da`)
|
||||
|
||||
No CI gating changes are included in this task; this is a local guardrail.
|
||||
@@ -1,69 +0,0 @@
|
||||
# i18n key-map bootstrap (Angular host/player MVP)
|
||||
|
||||
Issue: #220
|
||||
Scope: Lobby → Join → Start round → Round → Reveal → Scoreboard
|
||||
Locales: `en`, `da`
|
||||
|
||||
This document is the gameplay key-namespace map for Angular host/player MVP.
|
||||
It maps existing text keys only (no feature expansion) and stays aligned with `shared/i18n/lobby.json`.
|
||||
|
||||
## Key families
|
||||
|
||||
- `host` — `frontend.ui.host.*` host-facing gameplay actions and status text.
|
||||
- `player` — `frontend.ui.player.*` player-facing gameplay actions and status text.
|
||||
- `system` — shared UI labels used across host/player views (implemented under `frontend.ui.common.*` in `shared/i18n/lobby.json`).
|
||||
- `errors` — user-facing error keys shown by frontend (`frontend.errors.*`) plus backend code → frontend key bridge via `backend.error_codes.*` / `contract.backend_to_frontend_error_keys.*`.
|
||||
|
||||
## Gameplay flow key map
|
||||
|
||||
| Flow step | Family | Key | en | da |
|
||||
|---|---|---|---|---|
|
||||
| Lobby | `host` | `host.title` | Host gameplay flow | Vært gameplay-flow |
|
||||
| Lobby | `player` | `player.title` | Player gameplay flow | Spiller gameplay-flow |
|
||||
| Lobby | `system` (`frontend.ui.common`) | `common.session_code` | Session code | Sessionskode |
|
||||
| Lobby | `player` | `player.nickname` | Nickname | Kaldenavn |
|
||||
| Join | `player` | `player.join` | Join | Join |
|
||||
| Start round | `host` | `host.start_round` | Start round | Start runde |
|
||||
| Round | `host` | `host.show_question` | Show question | Vis spørgsmål |
|
||||
| Round | `player` | `player.lie_label` | Lie | Løgn |
|
||||
| Round | `player` | `player.submit_lie` | Submit lie | Send løgn |
|
||||
| Round | `player` | `player.submit_guess` | Submit guess | Send gæt |
|
||||
| Reveal | `host` | `host.mix_answers` | Mix answers → guess | Bland svar → gæt |
|
||||
| Reveal | `host` | `host.calculate_scores` | Calculate scores → reveal | Udregn score → afslør |
|
||||
| Scoreboard | `host` | `host.load_scoreboard` | Load scoreboard | Hent scoreboard |
|
||||
| Scoreboard | `host` | `host.final_leaderboard` | Final leaderboard | Finale leaderboard |
|
||||
| Scoreboard | `player` | `player.final_leaderboard` | Final leaderboard | Finale leaderboard |
|
||||
| Scoreboard | `system` (`frontend.ui.common`) | `common.points_short` | pts | point |
|
||||
|
||||
## Frontend error keys used in flow scope
|
||||
|
||||
| Error family | Key | en | da |
|
||||
|---|---|---|---|
|
||||
| Join | `frontend.errors.session_code_required` | Session code is required. | Sessionskoden er påkrævet. |
|
||||
| Join | `frontend.errors.session_not_found` | Session code is invalid or the session no longer exists. | Sessionskoden er ugyldig, eller sessionen findes ikke længere. |
|
||||
| Join | `frontend.errors.nickname_invalid` | Nickname must be between 2 and 40 characters. | Kaldenavn skal være mellem 2 og 40 tegn. |
|
||||
| Join | `frontend.errors.nickname_taken` | Nickname is already taken. | Kaldenavnet er allerede taget. |
|
||||
| Join | `frontend.errors.join_failed` | Join failed. Check code or nickname and try again. | Kunne ikke joine. Tjek kode eller kaldenavn og prøv igen. |
|
||||
| Start round | `frontend.errors.start_round_failed` | Could not start round. Refresh the lobby and try again. | Kunne ikke starte runden. Opdater lobbyen og prøv igen. |
|
||||
| Any | `frontend.errors.unknown` | Action failed. Refresh status and try again. | Handlingen fejlede. Opdater status og prøv igen. |
|
||||
|
||||
## Backend→frontend mapping for gameplay errors
|
||||
|
||||
Mapped in `contract.backend_to_frontend_error_keys` (source: `shared/i18n/lobby.json`):
|
||||
|
||||
> Note: `host_only_action` is **not** part of the current shared contract mapping and is intentionally not listed here.
|
||||
|
||||
- `session_code_required` → `session_code_required`
|
||||
- `nickname_invalid` → `nickname_invalid`
|
||||
- `session_not_found` → `session_not_found`
|
||||
- `session_not_joinable` → `join_failed`
|
||||
- `nickname_taken` → `nickname_taken`
|
||||
- `category_slug_required` → `start_round_failed`
|
||||
- `category_not_found` → `start_round_failed`
|
||||
- `round_start_invalid_phase` → `start_round_failed`
|
||||
- `round_already_configured` → `start_round_failed`
|
||||
|
||||
## Notes
|
||||
|
||||
- This is a bootstrap key-map doc for MVP mergeability.
|
||||
- The key/value source of truth remains `shared/i18n/lobby.json`.
|
||||
@@ -1,28 +0,0 @@
|
||||
# Issue #180 – SPA gameplay flow evidence
|
||||
|
||||
## Flow log (host + player, no page reload)
|
||||
|
||||
1. Host opens SPA host shell and loads scoreboard (`GET /lobby/sessions/{code}/scoreboard`).
|
||||
2. Host starts next round (`POST /lobby/sessions/{code}/rounds/next`).
|
||||
3. Host shell refreshes session state in-place (`GET /lobby/sessions/{code}`) and clears old scoreboard/final leaderboard payloads.
|
||||
4. Player shell performs periodic session refresh while online (3s cadence) and transitions from `scoreboard` to `lobby` without page reload.
|
||||
5. Host finishes game (`POST /lobby/sessions/{code}/finish`) and renders final leaderboard directly in SPA shell.
|
||||
6. Player shell reads `finished` state and renders final leaderboard in SPA (sorted by score).
|
||||
7. Error/retry paths available:
|
||||
- Host: next-round and finish-game retry buttons with explicit error feedback.
|
||||
- Player: reconnect + submit retry feedback.
|
||||
|
||||
## Test output snapshot
|
||||
|
||||
Command:
|
||||
|
||||
```bash
|
||||
cd frontend/angular
|
||||
npm test -- --run src/app/features/host/host-shell.component.spec.ts src/app/features/player/player-shell.component.spec.ts
|
||||
```
|
||||
|
||||
Result:
|
||||
|
||||
- `host-shell.component.spec.ts`: 6 passed
|
||||
- `player-shell.component.spec.ts`: 7 passed
|
||||
- Total: 13 passed, 0 failed
|
||||
@@ -1,272 +0,0 @@
|
||||
# Design: Fup og Fakta — Game Engine & Platform Architecture
|
||||
|
||||
**Date:** 2026-03-09
|
||||
**Status:** Approved
|
||||
|
||||
---
|
||||
|
||||
## Overview
|
||||
|
||||
Build a working Fup og Fakta game (Fibbage-style) on top of a **pluggable game platform**. The platform handles sessions, players, WebSocket push, and Celery-driven timers. Each game is a self-contained **cartridge** that implements a shared driver interface and owns its own models, config, and phase logic.
|
||||
|
||||
---
|
||||
|
||||
## Platform Architecture
|
||||
|
||||
```
|
||||
partyhub/ Django project — settings, Celery app, ASGI
|
||||
lobby/ Platform layer — sessions, players, GameRun, timer dispatch
|
||||
realtime/ WebSocket consumers (already built)
|
||||
fupogfakta/ Game cartridge #1
|
||||
future_game/ Game cartridge #N (same interface)
|
||||
```
|
||||
|
||||
### Platform provides (`lobby/`)
|
||||
|
||||
#### Models
|
||||
|
||||
**`GameSession`** (exists, minor additions)
|
||||
- `game_type` (CharField) — e.g. `"fupogfakta"`
|
||||
- `host` (FK → User)
|
||||
- `code` (6-char session code)
|
||||
- `status` (LOBBY / ACTIVE / FINISHED)
|
||||
- `config_id` / `config_snapshot` — see Config section
|
||||
|
||||
**`GameRun`** (new — ephemeral, deleted on game exit)
|
||||
- `session` (OneToOne → GameSession)
|
||||
- `current_state` (CharField — game-defined state string)
|
||||
- `phase_deadline` (DateTimeField, nullable)
|
||||
- `is_paused` (BooleanField, default False)
|
||||
- `paused_remaining_seconds` (FloatField, nullable)
|
||||
- `celery_task_id` (CharField, nullable)
|
||||
- `state_data` (JSONField) — game-specific snapshot for current phase
|
||||
|
||||
**`Player`** (exists)
|
||||
- `session`, `nickname`, `score`, `session_token`, `is_connected`
|
||||
|
||||
#### GameDriver interface
|
||||
|
||||
Each cartridge implements:
|
||||
|
||||
```python
|
||||
class GameDriver:
|
||||
game_type: str # e.g. "fupogfakta"
|
||||
|
||||
def on_game_start(session, run, config) -> PhaseResult
|
||||
def on_timer_expired(session, run, config) -> PhaseResult
|
||||
def on_pause(session, run) -> None
|
||||
def on_resume(session, run) -> None
|
||||
def on_exit(session, run) -> None # must clean up all game data
|
||||
def get_ws_payload(state, state_data) -> dict
|
||||
```
|
||||
|
||||
`PhaseResult` = `(next_state: str, duration_seconds: int | None, broadcast_payload: dict)`
|
||||
|
||||
#### Celery task
|
||||
|
||||
```python
|
||||
@app.task
|
||||
def handle_timer_expired(run_id: int, expected_state: str):
|
||||
# If run no longer exists or state has changed → stale task, ignore
|
||||
# Call driver.on_timer_expired(session, run, config)
|
||||
# Apply PhaseResult: update run, broadcast via channel layer, schedule next task
|
||||
```
|
||||
|
||||
`expected_state` prevents stale tasks from firing after pause/resume or manual state changes.
|
||||
|
||||
#### REST endpoints (platform-level)
|
||||
|
||||
- `POST /sessions/{code}/play` — start or resume
|
||||
- `POST /sessions/{code}/pause` — pause current phase timer
|
||||
- `POST /sessions/{code}/exit` — end game, delete GameRun + all game data
|
||||
|
||||
---
|
||||
|
||||
## Configuration System
|
||||
|
||||
### Base config model (`partyhub/`)
|
||||
|
||||
```python
|
||||
class BaseGameConfig(models.Model):
|
||||
class Meta:
|
||||
abstract = True
|
||||
|
||||
name = models.CharField(max_length=100) # "Quick game", "Full evening"
|
||||
user = models.ForeignKey(User, null=True, ...) # null = system default
|
||||
is_default = models.BooleanField(default=False)
|
||||
created_at = models.DateTimeField(auto_now_add=True)
|
||||
```
|
||||
|
||||
### Game-specific config (`fupogfakta/`)
|
||||
|
||||
```python
|
||||
class FupOgFaktaConfig(BaseGameConfig):
|
||||
num_rounds = PositiveIntegerField(default=3)
|
||||
questions_per_round = PositiveIntegerField(default=3)
|
||||
min_players = PositiveIntegerField(default=2)
|
||||
max_players = PositiveIntegerField(default=8)
|
||||
lie_seconds = PositiveIntegerField(default=45)
|
||||
guess_seconds = PositiveIntegerField(default=30)
|
||||
reveal_seconds_per_lie = PositiveIntegerField(default=8)
|
||||
scoreboard_recap_seconds = PositiveIntegerField(default=10)
|
||||
# Escalating scoring per round (stored as arrays or separate fields)
|
||||
points_correct = JSONField(default=[1500, 3000, 4500])
|
||||
points_bluff = JSONField(default=[500, 1000, 1500])
|
||||
# Reaction bonus (static, feeds post-game awards only)
|
||||
reaction_bonus = IntegerField(default=5)
|
||||
```
|
||||
|
||||
### Default resolution at session start
|
||||
|
||||
1. User has `is_default=True` row for this game type → use that
|
||||
2. System default (`user=null, is_default=True`) — set in Django admin
|
||||
3. Model field `default=` values (hardcoded)
|
||||
|
||||
User can have **multiple named presets** (one-to-many). When starting a session they choose which to use (or it auto-selects their default). The chosen config's values are **snapshotted into `GameRun.state_data`** at game start — immutable for the life of the session.
|
||||
|
||||
---
|
||||
|
||||
## Fup og Fakta — Game States
|
||||
|
||||
```
|
||||
LOBBY
|
||||
│ (host presses Play)
|
||||
▼
|
||||
LIE_PHASE timer: lie_seconds
|
||||
│ (all submitted OR timer expires)
|
||||
▼
|
||||
GUESS_PHASE timer: guess_seconds
|
||||
│ (timer expires — no mercy)
|
||||
▼
|
||||
REVEAL_LIE_{n} timer: reveal_seconds_per_lie (one per lie with ≥1 guess)
|
||||
│ → score liar incrementally as each is shown
|
||||
▼
|
||||
REVEAL_TRUTH timer: reveal_seconds_per_lie
|
||||
│ → score correct guessers
|
||||
▼
|
||||
SCOREBOARD_RECAP timer: scoreboard_recap_seconds
|
||||
│
|
||||
├─ more questions in round → back to LIE_PHASE (next question)
|
||||
├─ round done, more rounds → back to LIE_PHASE (next round, next category)
|
||||
└─ all rounds done → POST_GAME_AWARDS
|
||||
timer: configurable
|
||||
→ FINISHED (GameRun deleted, GameSession status = FINISHED)
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## Fup og Fakta — Phase Details
|
||||
|
||||
### LIE_PHASE
|
||||
- Question shown to all clients via WebSocket (`phase.lie_started` event)
|
||||
- Players submit lie via `POST /fupogfakta/{code}/lie`
|
||||
- **If lie matches correct answer (case-insensitive):** return `error_code: lie_matches_correct_answer` — player prompted again, does not consume their submission
|
||||
- Anonymous to other players during this phase
|
||||
- `state_data` tracks: question id, round number, how many have submitted (for progress display on host screen)
|
||||
- Timer expires → transition to GUESS_PHASE regardless of how many submitted
|
||||
|
||||
### GUESS_PHASE
|
||||
- Answers mixed (lies + truth, deduped) broadcast to all clients (`phase.guess_started`)
|
||||
- Players guess via `POST /fupogfakta/{code}/guess`
|
||||
- **After selecting:** player can react to other lies with 👍 😂 ❤️ etc. until timer expires. Cannot change guess.
|
||||
- Reactions stored in `LieReaction` model (player, lie, reaction_type)
|
||||
- Timer expires → transition to first REVEAL_LIE (or REVEAL_TRUTH if no lies had guesses)
|
||||
|
||||
### REVEAL_LIE_{n}
|
||||
- One Celery task per lie to reveal (only lies with ≥1 guesser)
|
||||
- Broadcast: which lie, who wrote it, who guessed it (`phase.reveal_lie`)
|
||||
- Score awarded to liar: `points_bluff[round_index] × guesser_count`
|
||||
- Score broadcast immediately (`phase.score_delta`)
|
||||
- Skipped lies (0 guesses): not shown at all
|
||||
|
||||
### REVEAL_TRUTH
|
||||
- Broadcast: correct answer, who guessed correctly (`phase.reveal_truth`)
|
||||
- Score awarded: `points_correct[round_index]` per correct guesser
|
||||
- Also show reaction totals on each lie during this phase
|
||||
|
||||
### SCOREBOARD_RECAP
|
||||
- Full leaderboard broadcast (`phase.scoreboard`)
|
||||
- Auto-advances to next question, next round, or post-game
|
||||
|
||||
### POST_GAME_AWARDS
|
||||
- Computed from `LieReaction` aggregate:
|
||||
- "Most Hilarious Liar" — most 😂 reactions total
|
||||
- "Most Beloved Lie" — most ❤️ reactions on a single lie
|
||||
- etc. (extensible)
|
||||
- Broadcast as `phase.awards`
|
||||
- Then FINISHED → GameRun deleted, all session game data wiped
|
||||
|
||||
---
|
||||
|
||||
## Fup og Fakta — Models
|
||||
|
||||
**Existing (keep):** `Category`, `Question`, `RoundQuestion`, `LieAnswer`, `Guess`
|
||||
|
||||
**Remove:** `ScoreEvent` (no audit trail needed — game state is ephemeral)
|
||||
|
||||
**New:**
|
||||
```python
|
||||
class LieReaction(models.Model):
|
||||
lie = ForeignKey(LieAnswer, on_delete=CASCADE)
|
||||
player = ForeignKey(Player, on_delete=CASCADE)
|
||||
reaction = CharField(max_length=20) # "laugh", "heart", "fire", etc.
|
||||
created_at = auto_now_add
|
||||
class Meta:
|
||||
unique_together = [("lie", "player", "reaction")]
|
||||
```
|
||||
|
||||
**Modify `RoundQuestion`:**
|
||||
- Add `reveal_order` (PositiveIntegerField, nullable) — set when GUESS_PHASE ends, determines reveal sequence
|
||||
|
||||
---
|
||||
|
||||
## Pause / Resume
|
||||
|
||||
- **Pause:** compute `remaining = phase_deadline - now`, store in `paused_remaining_seconds`, set `is_paused=True`, revoke Celery task by `celery_task_id`
|
||||
- **Resume:** set `phase_deadline = now + paused_remaining_seconds`, schedule new Celery task, clear pause fields
|
||||
- Stale task guard: every Celery task checks `expected_state == run.current_state` before firing
|
||||
|
||||
---
|
||||
|
||||
## Host Controls (Session Owner Only)
|
||||
|
||||
| Action | Effect |
|
||||
|--------|--------|
|
||||
| Play | Starts game from LOBBY, or resumes from paused |
|
||||
| Pause | Freezes current phase timer, broadcasts `phase.paused` |
|
||||
| Exit | Ends game immediately, deletes GameRun + all game data |
|
||||
|
||||
Cannot skip. Cannot manually advance phases.
|
||||
|
||||
---
|
||||
|
||||
## WebSocket Event Reference
|
||||
|
||||
| Event | Triggered by | Payload |
|
||||
|-------|-------------|---------|
|
||||
| `phase.lie_started` | LIE_PHASE start | question prompt, deadline, round info |
|
||||
| `phase.lie_progress` | Each lie submitted | n_submitted / n_players (no names) |
|
||||
| `phase.guess_started` | GUESS_PHASE start | mixed answers, deadline |
|
||||
| `phase.reveal_lie` | REVEAL_LIE_{n} | lie text, author, guessers, score delta |
|
||||
| `phase.reveal_truth` | REVEAL_TRUTH | correct answer, correct guessers, score delta |
|
||||
| `phase.scoreboard` | SCOREBOARD_RECAP | full leaderboard |
|
||||
| `phase.awards` | POST_GAME_AWARDS | award winners |
|
||||
| `phase.paused` | Pause | remaining_seconds |
|
||||
| `phase.resumed` | Resume | new deadline |
|
||||
| `phase.game_over` | FINISHED | final leaderboard |
|
||||
|
||||
---
|
||||
|
||||
## Data Lifecycle
|
||||
|
||||
All game session data (`GameRun`, `RoundQuestion`, `LieAnswer`, `Guess`, `LieReaction`, `Player`) is **deleted when host exits or game reaches FINISHED**. `GameSession` row is kept (with status=FINISHED) for the session code uniqueness constraint. `Category` and `Question` content is permanent.
|
||||
|
||||
---
|
||||
|
||||
## Not In Scope (This Implementation)
|
||||
|
||||
- TTS / read-aloud (Fase 4, deferred)
|
||||
- Reconnect recovery after server restart (game is gone if server dies)
|
||||
- Spectator/viewer mode (post-MVP)
|
||||
- Rate limiting on endpoints (backlog)
|
||||
- Bulk question import (Fase 5)
|
||||
File diff suppressed because it is too large
Load Diff
@@ -1,99 +0,0 @@
|
||||
# SPA cutover feature flag (`USE_SPA_UI`)
|
||||
|
||||
## Formål
|
||||
`USE_SPA_UI` styrer om host/player UI routes serverer Angular SPA shell eller legacy Django templates.
|
||||
|
||||
## Miljø-toggle (uden kodeændring)
|
||||
Sæt env var pr. miljø:
|
||||
|
||||
- `USE_SPA_UI=true` -> `/lobby/ui/host` og `/lobby/ui/player` returnerer SPA shell
|
||||
- `USE_SPA_UI=false` (default) -> legacy template-flow bruges uændret
|
||||
|
||||
Backward compatibility under cutover:
|
||||
- Hvis `USE_SPA_UI` ikke er sat, bruges `WPP_SPA_ENABLED` som fallback.
|
||||
|
||||
## Static asset versioning/cache-busting (hardening)
|
||||
Formål: sikre at browser/proxy/CDN hurtigt henter ny SPA bundle i release-vinduet uden at kræve hard refresh.
|
||||
|
||||
- `WPP_SPA_ASSET_BASE` peger fortsat på build-output (`/static/frontend/angular/browser`).
|
||||
- `WPP_SPA_ASSET_VERSION` injiceres i SPA shell URLs som query-param (`?v=<version>`).
|
||||
- Anbefalet værdi for `WPP_SPA_ASSET_VERSION`: release-tag eller kort commit SHA.
|
||||
- Ved rollback sættes `WPP_SPA_ASSET_VERSION` til den tidligere kendte stabile release-værdi.
|
||||
|
||||
Eksempel (staging/prod env):
|
||||
|
||||
```env
|
||||
USE_SPA_UI=true
|
||||
WPP_SPA_ASSET_BASE=/static/frontend/angular/browser
|
||||
WPP_SPA_ASSET_VERSION=rel-2026-03-01-bb82357
|
||||
```
|
||||
|
||||
## Staging rollout-checkliste (`USE_SPA_UI`)
|
||||
1. **Baseline (flag OFF)**
|
||||
- Bekræft at staging kører med `USE_SPA_UI=false`.
|
||||
- Kør gameplay smoke på legacy routes (`/lobby/ui/host` + `/lobby/ui/player`).
|
||||
2. **Smoke-gate før aktivering (skal være grøn)**
|
||||
- Cutover route sanity = PASS for både OFF og ON checks.
|
||||
- Full gameplay round (join/start/round/scoreboard) = PASS.
|
||||
- Next-round/final leaderboard sanity = PASS.
|
||||
- Ingen nye blocker-regressioner i host/player kerneflow.
|
||||
3. **Kontrolleret aktivering i staging**
|
||||
- Sæt `USE_SPA_UI=true` i staging miljøet.
|
||||
- Kør smoke-flow igen med SPA-route-verifikation.
|
||||
4. **Post-cutover dokumentation**
|
||||
- Log evidens med commit/head SHA, UTC timestamp og gate-status.
|
||||
|
||||
## Rollback playbook (`USE_SPA_UI`) — mål: <10 min
|
||||
Rollback til legacy (`USE_SPA_UI=false`) udføres straks hvis et checkpoint fejler:
|
||||
- Forkert route/shell for valgt flag i cutover route sanity.
|
||||
- Gameplay smoke kan ikke gennemføres til scoreboard/final leaderboard.
|
||||
- Kritisk regression i host/player flow under smoke.
|
||||
|
||||
Trin-for-trin:
|
||||
1. Sæt `USE_SPA_UI=false` i deploy-env.
|
||||
2. Sæt `WPP_SPA_ASSET_VERSION` til sidste stabile release-token.
|
||||
3. Deploy/reload app-processer.
|
||||
4. Verificér legacy routes: `/lobby/ui/host` + `/lobby/ui/player`.
|
||||
5. Kør hurtig smoke sanity (join/start/scoreboard path).
|
||||
6. Log UTC tid, trigger, release-token og resultat i smoke artifact.
|
||||
|
||||
Target: rollback + sanity-verifikation inden for 10 minutter.
|
||||
|
||||
## React fallback trigger-kriterier (kun delivery-blocking)
|
||||
Formål: React fallback må kun bruges som kortvarig leverings-sikring, når release ellers er blokeret.
|
||||
|
||||
### Hvornår fallback er tilladt
|
||||
Alle punkter skal være opfyldt:
|
||||
1. **Delivery-blocking fejl i Angular SPA**
|
||||
- Host/player kerneflow kan ikke leveres i release-vinduet (fx login/join/start/round/scoreboard stopper).
|
||||
2. **Ingen hurtig Angular-fix inden for release-vinduet**
|
||||
- Teamet har vurderet at patch + verificering ikke kan nås sikkert i tide.
|
||||
3. **Rollback alene løser ikke leveringsbehovet**
|
||||
- `USE_SPA_UI=false` (legacy) er enten utilstrækkelig for den konkrete leverance eller allerede verificeret som ikke tilstrækkelig.
|
||||
4. **Beslutning er eksplicit logget**
|
||||
- Trigger, impact, UTC-tid, ansvarlig, issue/incident-reference og plan for tilbagevenden til Angular er dokumenteret i release/smoke artifact.
|
||||
|
||||
### Scope-limits for fallback
|
||||
- Fallback omfatter kun **delivery-blocking host/player-paths**.
|
||||
- Ingen nye features, UX-forbedringer eller ikke-kritiske ændringer må bundtes ind i fallback.
|
||||
- Fallback er **midlertidig** og gælder kun for aktiv incident/release-vindue.
|
||||
- Når blocker er fjernet, skal miljøet tilbage på standard cutover-spor (Angular + `USE_SPA_UI` styring).
|
||||
|
||||
### Ikke tilladt
|
||||
- Proaktiv fallback "for en sikkerheds skyld" uden aktiv blocker.
|
||||
- Brug af fallback til at omgå normale kvalitetsgates eller testkrav.
|
||||
- Langvarig drift i fallback-mode uden dokumenteret blocker og opfølgningsplan.
|
||||
|
||||
## Verifikation
|
||||
- Flag OFF: `UiScreenTests.test_legacy_templates_are_used_when_spa_flag_is_off`
|
||||
- Flag ON (host): `UiScreenTests.test_host_screen_can_render_angular_shell_when_feature_flag_enabled`
|
||||
- Flag ON (host deep-link): `UiScreenTests.test_host_screen_deeplink_preserves_spa_path_when_feature_flag_enabled`
|
||||
- Flag ON (player): `UiScreenTests.test_player_screen_can_render_angular_shell_when_feature_flag_enabled`
|
||||
- Smoke-checkliste for cutover paths: `docs/STAGING_GAMEPLAY_SMOKE_ARTIFACT.md` + `docs/UI_SMOKE.md`
|
||||
|
||||
|
||||
## MVP audio policy guardrail (telefon-klient)
|
||||
- Telefon-/player-klienten må ikke starte lydafspilning lokalt i MVP (`primary-device only`).
|
||||
- Policy er bundet til capability-flaget `frontend.capabilities.client_has_no_audio_output=true` i `shared/i18n/lobby.json`.
|
||||
- Brugeradvarsel i player UI leveres via i18n key: `frontend.ui.player.audio_policy_notice`.
|
||||
- Acceptance-spec er dækket i Angular tests (`player-shell.component.spec.ts`), inkl. at init-path ikke kalder original media `play`.
|
||||
1
frontend/.gitignore
vendored
1
frontend/.gitignore
vendored
@@ -1 +0,0 @@
|
||||
node_modules/
|
||||
@@ -1,12 +0,0 @@
|
||||
# Frontend API client baseline
|
||||
|
||||
Dette er baseline-klientlaget for SPA-sporet.
|
||||
|
||||
## Kører checks lokalt
|
||||
|
||||
```bash
|
||||
cd frontend
|
||||
npm install
|
||||
npm test
|
||||
npm run build
|
||||
```
|
||||
3
frontend/angular/.gitignore
vendored
3
frontend/angular/.gitignore
vendored
@@ -1,3 +0,0 @@
|
||||
node_modules/
|
||||
dist/
|
||||
.angular/
|
||||
@@ -1,36 +0,0 @@
|
||||
{
|
||||
"$schema": "./node_modules/@angular/cli/lib/config/schema.json",
|
||||
"version": 1,
|
||||
"projects": {
|
||||
"wpp-angular-shell": {
|
||||
"projectType": "application",
|
||||
"root": "",
|
||||
"sourceRoot": "src",
|
||||
"prefix": "app",
|
||||
"architect": {
|
||||
"build": {
|
||||
"builder": "@angular/build:application",
|
||||
"options": {
|
||||
"outputPath": "dist/wpp-angular-shell",
|
||||
"index": "src/index.html",
|
||||
"browser": "src/main.ts",
|
||||
"polyfills": ["zone.js"],
|
||||
"tsConfig": "tsconfig.app.json",
|
||||
"assets": [],
|
||||
"styles": ["src/styles.css"],
|
||||
"outputHashing": "none"
|
||||
}
|
||||
},
|
||||
"serve": {
|
||||
"builder": "@angular/build:dev-server",
|
||||
"options": {
|
||||
"buildTarget": "wpp-angular-shell:build"
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
"cli": {
|
||||
"analytics": false
|
||||
}
|
||||
}
|
||||
8577
frontend/angular/package-lock.json
generated
8577
frontend/angular/package-lock.json
generated
File diff suppressed because it is too large
Load Diff
@@ -1,28 +0,0 @@
|
||||
{
|
||||
"name": "wpp-angular-shell",
|
||||
"version": "0.0.0",
|
||||
"private": true,
|
||||
"scripts": {
|
||||
"start": "ng serve",
|
||||
"build": "ng build",
|
||||
"test": "vitest run"
|
||||
},
|
||||
"dependencies": {
|
||||
"@angular/common": "^19.2.0",
|
||||
"@angular/compiler": "^19.2.0",
|
||||
"@angular/core": "^19.2.0",
|
||||
"@angular/forms": "^19.2.0",
|
||||
"@angular/platform-browser": "^19.2.0",
|
||||
"@angular/router": "^19.2.0",
|
||||
"rxjs": "~7.8.0",
|
||||
"tslib": "^2.3.0",
|
||||
"zone.js": "~0.15.0"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@angular/build": "^19.2.0",
|
||||
"@angular/cli": "^19.2.0",
|
||||
"@angular/compiler-cli": "^19.2.0",
|
||||
"typescript": "~5.7.2",
|
||||
"vitest": "^2.1.9"
|
||||
}
|
||||
}
|
||||
@@ -1,273 +0,0 @@
|
||||
import { describe, expect, it, vi } from 'vitest';
|
||||
|
||||
import { createAngularApiClient, type AngularHttpClientLike } from '../../../src/api/angular-client';
|
||||
|
||||
describe('SPA Angular API contract smoke (host/player foundation)', () => {
|
||||
it('smoke-checks canonical host/player endpoint contracts', async () => {
|
||||
const get = vi.fn<AngularHttpClientLike['get']>(async <T>(url: string) => {
|
||||
if (url === '/lobby/sessions/ABCD12') {
|
||||
return {
|
||||
session: { code: 'ABCD12', status: 'lobby', host_id: 1, current_round: 1, players_count: 2 },
|
||||
players: [
|
||||
{ id: 2, nickname: 'Maja', score: 0, is_connected: true },
|
||||
{ id: 3, nickname: 'Bo', score: 0, is_connected: true }
|
||||
],
|
||||
round_question: {
|
||||
id: 77,
|
||||
round_number: 1,
|
||||
prompt: 'Q?',
|
||||
shown_at: '2026-03-01T18:00:00Z',
|
||||
answers: [{ text: 'A' }, { text: 'B' }]
|
||||
},
|
||||
reveal: {
|
||||
round_question_id: 77,
|
||||
round_number: 1,
|
||||
prompt: 'Q?',
|
||||
correct_answer: 'A',
|
||||
lies: [{ player_id: 2, nickname: 'Maja', text: 'B', created_at: '2026-03-01T18:00:05Z' }],
|
||||
guesses: [
|
||||
{
|
||||
player_id: 3,
|
||||
nickname: 'Bo',
|
||||
selected_text: 'B',
|
||||
is_correct: false,
|
||||
fooled_player_id: 2,
|
||||
fooled_player_nickname: 'Maja',
|
||||
created_at: '2026-03-01T18:00:15Z'
|
||||
}
|
||||
]
|
||||
},
|
||||
phase_view_model: {
|
||||
status: 'lobby',
|
||||
round_number: 1,
|
||||
players_count: 2,
|
||||
constraints: {
|
||||
min_players_to_start: 2,
|
||||
max_players_mvp: 8,
|
||||
min_players_reached: true,
|
||||
max_players_allowed: true
|
||||
},
|
||||
host: {
|
||||
can_start_round: true,
|
||||
can_show_question: false,
|
||||
can_mix_answers: false,
|
||||
can_calculate_scores: false,
|
||||
can_reveal_scoreboard: false,
|
||||
can_start_next_round: false,
|
||||
can_finish_game: false
|
||||
},
|
||||
player: {
|
||||
can_join: true,
|
||||
can_submit_lie: false,
|
||||
can_submit_guess: false,
|
||||
can_view_final_result: false
|
||||
}
|
||||
}
|
||||
} as T;
|
||||
}
|
||||
|
||||
if (url === '/lobby/sessions/ABCD12/scoreboard') {
|
||||
return {
|
||||
session: { code: 'ABCD12', status: 'scoreboard', current_round: 1 },
|
||||
leaderboard: [
|
||||
{ id: 9, nickname: 'Maja', score: 200 },
|
||||
{ id: 10, nickname: 'Bo', score: 150 }
|
||||
]
|
||||
} as T;
|
||||
}
|
||||
|
||||
throw { status: 404, error: { error: 'Not found' } };
|
||||
});
|
||||
|
||||
const post = vi.fn<AngularHttpClientLike['post']>(async <T>(url: string, body: unknown) => {
|
||||
if (url === '/lobby/sessions/join') {
|
||||
expect(body).toEqual({ code: 'ABCD12', nickname: 'Maja' });
|
||||
return {
|
||||
player: { id: 9, nickname: 'Maja', session_token: 'session-token-1', score: 0 },
|
||||
session: { code: 'ABCD12', status: 'lobby' }
|
||||
} as T;
|
||||
}
|
||||
|
||||
if (url === '/lobby/sessions/ABCD12/rounds/start') {
|
||||
expect(body).toEqual({ category_slug: 'history' });
|
||||
return {
|
||||
session: { code: 'ABCD12', status: 'lie', current_round: 1 },
|
||||
round: { number: 1, category: { slug: 'history', name: 'History' } }
|
||||
} as T;
|
||||
}
|
||||
|
||||
if (url === '/lobby/sessions/ABCD12/questions/show') {
|
||||
expect(body).toEqual({});
|
||||
return {
|
||||
round_question: {
|
||||
id: 77,
|
||||
prompt: 'Q?',
|
||||
round_number: 1,
|
||||
shown_at: '2026-03-01T18:00:00Z',
|
||||
lie_deadline_at: '2026-03-01T18:00:30Z'
|
||||
},
|
||||
config: { lie_seconds: 30 }
|
||||
} as T;
|
||||
}
|
||||
|
||||
if (url === '/lobby/sessions/ABCD12/questions/77/answers/mix') {
|
||||
expect(body).toEqual({});
|
||||
return {
|
||||
session: { code: 'ABCD12', status: 'guess', current_round: 1 },
|
||||
round_question: { id: 77, round_number: 1 },
|
||||
answers: [{ text: 'A' }, { text: 'B' }]
|
||||
} as T;
|
||||
}
|
||||
|
||||
if (url === '/lobby/sessions/ABCD12/questions/77/scores/calculate') {
|
||||
expect(body).toEqual({});
|
||||
return {
|
||||
session: { code: 'ABCD12', status: 'reveal', current_round: 1 },
|
||||
round_question: { id: 77, round_number: 1 },
|
||||
events_created: 2,
|
||||
reveal: {
|
||||
round_question_id: 77,
|
||||
correct_answer: 'A',
|
||||
lies: [],
|
||||
guesses: []
|
||||
},
|
||||
leaderboard: [
|
||||
{ id: 9, nickname: 'Maja', score: 200 },
|
||||
{ id: 10, nickname: 'Bo', score: 150 }
|
||||
]
|
||||
} as T;
|
||||
}
|
||||
|
||||
if (url === '/lobby/sessions/ABCD12/rounds/next') {
|
||||
expect(body).toEqual({});
|
||||
return { session: { code: 'ABCD12', status: 'lie', current_round: 2 } } as T;
|
||||
}
|
||||
|
||||
if (url === '/lobby/sessions/ABCD12/finish') {
|
||||
expect(body).toEqual({});
|
||||
return {
|
||||
session: { code: 'ABCD12', status: 'finished', current_round: 2 },
|
||||
winner: { id: 9, nickname: 'Maja', score: 250 },
|
||||
leaderboard: [
|
||||
{ id: 9, nickname: 'Maja', score: 250 },
|
||||
{ id: 10, nickname: 'Bo', score: 150 }
|
||||
]
|
||||
} as T;
|
||||
}
|
||||
|
||||
if (url === '/lobby/sessions/ABCD12/questions/77/lies/submit') {
|
||||
expect(body).toEqual({ player_id: 9, session_token: 'session-token-1', text: 'my lie' });
|
||||
return {
|
||||
lie: {
|
||||
id: 501,
|
||||
player_id: 9,
|
||||
round_question_id: 77,
|
||||
text: 'my lie',
|
||||
created_at: '2026-03-01T18:00:05Z'
|
||||
},
|
||||
window: { lie_deadline_at: '2026-03-01T18:00:30Z' }
|
||||
} as T;
|
||||
}
|
||||
|
||||
if (url === '/lobby/sessions/ABCD12/questions/77/guesses/submit') {
|
||||
expect(body).toEqual({ player_id: 9, session_token: 'session-token-1', selected_text: 'B' });
|
||||
return {
|
||||
guess: {
|
||||
id: 601,
|
||||
player_id: 9,
|
||||
round_question_id: 77,
|
||||
selected_text: 'B',
|
||||
is_correct: false,
|
||||
fooled_player_id: null,
|
||||
created_at: '2026-03-01T18:00:15Z'
|
||||
},
|
||||
window: { guess_deadline_at: '2026-03-01T18:01:00Z' }
|
||||
} as T;
|
||||
}
|
||||
|
||||
throw { status: 404, error: { error: 'Not found' } };
|
||||
});
|
||||
|
||||
const client = createAngularApiClient({ get, post } as AngularHttpClientLike);
|
||||
|
||||
const session = await client.getSession(' abcd12 ');
|
||||
expect(session.ok).toBe(true);
|
||||
if (session.ok) {
|
||||
expect(session.data.session.code).toBe('ABCD12');
|
||||
expect(session.data.phase_view_model.host.can_start_next_round).toBe(false);
|
||||
expect(session.data.phase_view_model.player.can_submit_guess).toBe(false);
|
||||
expect(session.data.reveal?.correct_answer).toBe('A');
|
||||
expect(session.data.reveal?.guesses[0].fooled_player_nickname).toBe('Maja');
|
||||
}
|
||||
|
||||
expect((await client.joinSession({ code: ' abcd12 ', nickname: ' Maja ' })).ok).toBe(true);
|
||||
expect((await client.startRound(' abcd12 ', { category_slug: 'history' })).ok).toBe(true);
|
||||
expect((await client.showQuestion(' abcd12 ')).ok).toBe(true);
|
||||
expect((await client.mixAnswers(' abcd12 ', 77)).ok).toBe(true);
|
||||
expect((await client.calculateScores(' abcd12 ', 77)).ok).toBe(true);
|
||||
expect((await client.getScoreboard(' abcd12 ')).ok).toBe(true);
|
||||
expect((await client.startNextRound(' abcd12 ')).ok).toBe(true);
|
||||
expect((await client.finishGame(' abcd12 ')).ok).toBe(true);
|
||||
expect(
|
||||
(
|
||||
await client.submitLie(' abcd12 ', 77, {
|
||||
player_id: 9,
|
||||
session_token: 'session-token-1',
|
||||
text: 'my lie'
|
||||
})
|
||||
).ok
|
||||
).toBe(true);
|
||||
expect(
|
||||
(
|
||||
await client.submitGuess(' abcd12 ', 77, {
|
||||
player_id: 9,
|
||||
session_token: 'session-token-1',
|
||||
selected_text: 'B'
|
||||
})
|
||||
).ok
|
||||
).toBe(true);
|
||||
|
||||
expect(get).toHaveBeenNthCalledWith(1, '/lobby/sessions/ABCD12', { withCredentials: true });
|
||||
expect(get).toHaveBeenNthCalledWith(2, '/lobby/sessions/ABCD12/scoreboard', { withCredentials: true });
|
||||
|
||||
expect(post).toHaveBeenNthCalledWith(
|
||||
1,
|
||||
'/lobby/sessions/join',
|
||||
{ code: 'ABCD12', nickname: 'Maja' },
|
||||
{ withCredentials: true }
|
||||
);
|
||||
expect(post).toHaveBeenNthCalledWith(
|
||||
2,
|
||||
'/lobby/sessions/ABCD12/rounds/start',
|
||||
{ category_slug: 'history' },
|
||||
{ withCredentials: true }
|
||||
);
|
||||
expect(post).toHaveBeenNthCalledWith(3, '/lobby/sessions/ABCD12/questions/show', {}, { withCredentials: true });
|
||||
expect(post).toHaveBeenNthCalledWith(
|
||||
4,
|
||||
'/lobby/sessions/ABCD12/questions/77/answers/mix',
|
||||
{},
|
||||
{ withCredentials: true }
|
||||
);
|
||||
expect(post).toHaveBeenNthCalledWith(
|
||||
5,
|
||||
'/lobby/sessions/ABCD12/questions/77/scores/calculate',
|
||||
{},
|
||||
{ withCredentials: true }
|
||||
);
|
||||
expect(post).toHaveBeenNthCalledWith(6, '/lobby/sessions/ABCD12/rounds/next', {}, { withCredentials: true });
|
||||
expect(post).toHaveBeenNthCalledWith(7, '/lobby/sessions/ABCD12/finish', {}, { withCredentials: true });
|
||||
expect(post).toHaveBeenNthCalledWith(
|
||||
8,
|
||||
'/lobby/sessions/ABCD12/questions/77/lies/submit',
|
||||
{ player_id: 9, session_token: 'session-token-1', text: 'my lie' },
|
||||
{ withCredentials: true }
|
||||
);
|
||||
expect(post).toHaveBeenNthCalledWith(
|
||||
9,
|
||||
'/lobby/sessions/ABCD12/questions/77/guesses/submit',
|
||||
{ player_id: 9, session_token: 'session-token-1', selected_text: 'B' },
|
||||
{ withCredentials: true }
|
||||
);
|
||||
});
|
||||
});
|
||||
@@ -1,5 +0,0 @@
|
||||
.shell { font-family: Arial, sans-serif; margin: 1rem; }
|
||||
.shell__header { display: flex; flex-wrap: wrap; gap: 0.75rem; justify-content: space-between; align-items: center; border-bottom: 1px solid #ddd; padding-bottom: 0.75rem; }
|
||||
.shell__header nav { display: flex; gap: 0.75rem; }
|
||||
.shell__content { margin-top: 1rem; }
|
||||
.locale-picker { display: inline-flex; align-items: center; gap: 0.4rem; font-size: 0.95rem; }
|
||||
@@ -1,20 +0,0 @@
|
||||
<main class="shell">
|
||||
<header class="shell__header">
|
||||
<h1>{{ copy('app.title') }}</h1>
|
||||
<nav>
|
||||
<a routerLink="/host">{{ copy('app.host_nav') }}</a>
|
||||
<a routerLink="/player">{{ copy('app.player_nav') }}</a>
|
||||
</nav>
|
||||
<label class="locale-picker">
|
||||
{{ copy('app.language_label') }}
|
||||
<select [ngModel]="locale" (ngModelChange)="setLocale($event)">
|
||||
<option value="en">English</option>
|
||||
<option value="da">Dansk</option>
|
||||
</select>
|
||||
</label>
|
||||
</header>
|
||||
|
||||
<section class="shell__content" [attr.data-wpp-locale]="locale">
|
||||
<router-outlet></router-outlet>
|
||||
</section>
|
||||
</main>
|
||||
@@ -1,33 +0,0 @@
|
||||
import { Component, inject } from '@angular/core';
|
||||
import { FormsModule } from '@angular/forms';
|
||||
import { Router, RouterLink, RouterOutlet } from '@angular/router';
|
||||
|
||||
import { resolvePreferredLocale, setPreferredLocale, t } from './lobby-i18n';
|
||||
|
||||
@Component({
|
||||
selector: 'app-root',
|
||||
standalone: true,
|
||||
imports: [RouterOutlet, RouterLink, FormsModule],
|
||||
templateUrl: './app.component.html',
|
||||
styleUrl: './app.component.css',
|
||||
})
|
||||
export class AppComponent {
|
||||
private readonly router = inject(Router);
|
||||
|
||||
locale = resolvePreferredLocale();
|
||||
|
||||
constructor() {
|
||||
const shellRoute = document.body.dataset['wppShellRoute'];
|
||||
if (shellRoute?.startsWith('/host') || shellRoute?.startsWith('/player')) {
|
||||
void this.router.navigateByUrl(shellRoute);
|
||||
}
|
||||
}
|
||||
|
||||
copy(key: string): string {
|
||||
return t(key, this.locale);
|
||||
}
|
||||
|
||||
setLocale(locale: string): void {
|
||||
this.locale = setPreferredLocale(locale);
|
||||
}
|
||||
}
|
||||
@@ -1,15 +0,0 @@
|
||||
import { ApplicationConfig } from '@angular/core';
|
||||
import { provideRouter, withHashLocation } from '@angular/router';
|
||||
|
||||
import { routes } from './app.routes';
|
||||
import { createWppApiClient, WPP_API_CLIENT } from './wpp-api-client';
|
||||
|
||||
export const appConfig: ApplicationConfig = {
|
||||
providers: [
|
||||
provideRouter(routes, withHashLocation()),
|
||||
{
|
||||
provide: WPP_API_CLIENT,
|
||||
useFactory: () => createWppApiClient(),
|
||||
},
|
||||
],
|
||||
};
|
||||
@@ -1,49 +0,0 @@
|
||||
import { Routes } from '@angular/router';
|
||||
|
||||
import {
|
||||
hostRouteContextResolver,
|
||||
hostRouteGuard,
|
||||
playerRouteContextResolver,
|
||||
playerRouteGuard,
|
||||
} from './session-route-context';
|
||||
|
||||
export const routes: Routes = [
|
||||
{
|
||||
path: 'host',
|
||||
resolve: { routeContext: hostRouteContextResolver },
|
||||
canActivate: [hostRouteGuard],
|
||||
loadComponent: () => import('./features/host/host-shell.component').then((m) => m.HostShellComponent),
|
||||
},
|
||||
{
|
||||
path: 'host/:phase',
|
||||
resolve: { routeContext: hostRouteContextResolver },
|
||||
canActivate: [hostRouteGuard],
|
||||
loadComponent: () => import('./features/host/host-shell.component').then((m) => m.HostShellComponent),
|
||||
},
|
||||
{
|
||||
path: 'host/:phase/:context',
|
||||
resolve: { routeContext: hostRouteContextResolver },
|
||||
canActivate: [hostRouteGuard],
|
||||
loadComponent: () => import('./features/host/host-shell.component').then((m) => m.HostShellComponent),
|
||||
},
|
||||
{
|
||||
path: 'player',
|
||||
resolve: { routeContext: playerRouteContextResolver },
|
||||
canActivate: [playerRouteGuard],
|
||||
loadComponent: () => import('./features/player/player-shell.component').then((m) => m.PlayerShellComponent),
|
||||
},
|
||||
{
|
||||
path: 'player/:phase',
|
||||
resolve: { routeContext: playerRouteContextResolver },
|
||||
canActivate: [playerRouteGuard],
|
||||
loadComponent: () => import('./features/player/player-shell.component').then((m) => m.PlayerShellComponent),
|
||||
},
|
||||
{
|
||||
path: 'player/:phase/:context',
|
||||
resolve: { routeContext: playerRouteContextResolver },
|
||||
canActivate: [playerRouteGuard],
|
||||
loadComponent: () => import('./features/player/player-shell.component').then((m) => m.PlayerShellComponent),
|
||||
},
|
||||
{ path: '', pathMatch: 'full', redirectTo: 'player' },
|
||||
{ path: '**', redirectTo: 'player' },
|
||||
];
|
||||
@@ -1,300 +0,0 @@
|
||||
import { afterEach, describe, expect, it, vi } from 'vitest';
|
||||
|
||||
import { HostShellComponent } from './host-shell.component';
|
||||
|
||||
type FetchMock = ReturnType<typeof vi.fn>;
|
||||
|
||||
function jsonResponse(status: number, body: unknown) {
|
||||
return {
|
||||
ok: status >= 200 && status < 300,
|
||||
status,
|
||||
json: vi.fn().mockResolvedValue(body),
|
||||
} as unknown as Response;
|
||||
}
|
||||
|
||||
function sessionDetailPayload(
|
||||
status: string,
|
||||
options?: {
|
||||
roundQuestionId?: number | null;
|
||||
reveal?: {
|
||||
correct_answer: string;
|
||||
prompt?: string;
|
||||
lies?: Array<{ player_id: number; nickname: string; text: string; created_at?: string }>;
|
||||
guesses?: Array<{
|
||||
player_id: number;
|
||||
nickname: string;
|
||||
selected_text: string;
|
||||
is_correct: boolean;
|
||||
fooled_player_id: number | null;
|
||||
fooled_player_nickname?: string;
|
||||
created_at?: string;
|
||||
}>;
|
||||
} | null;
|
||||
}
|
||||
) {
|
||||
const roundQuestionId = options?.roundQuestionId ?? 41;
|
||||
|
||||
return {
|
||||
session: {
|
||||
code: 'ABCD12',
|
||||
status,
|
||||
host_id: 1,
|
||||
current_round: status === 'lobby' ? 2 : 1,
|
||||
players_count: 2,
|
||||
},
|
||||
round_question:
|
||||
roundQuestionId === null
|
||||
? null
|
||||
: {
|
||||
id: roundQuestionId,
|
||||
round_number: 1,
|
||||
prompt: 'Q?',
|
||||
shown_at: '2026-01-01T00:00:00Z',
|
||||
answers: [],
|
||||
},
|
||||
players: [
|
||||
{ id: 1, nickname: 'Host', score: 0, is_connected: true },
|
||||
{ id: 2, nickname: 'Mads', score: 120, is_connected: true },
|
||||
],
|
||||
reveal:
|
||||
options?.reveal === undefined || options?.reveal === null
|
||||
? null
|
||||
: {
|
||||
round_question_id: roundQuestionId,
|
||||
round_number: 1,
|
||||
prompt: options.reveal.prompt ?? 'Q?',
|
||||
correct_answer: options.reveal.correct_answer,
|
||||
lies: (options.reveal.lies ?? []).map((lie) => ({
|
||||
...lie,
|
||||
created_at: lie.created_at ?? '2026-01-01T00:00:05Z',
|
||||
})),
|
||||
guesses: (options.reveal.guesses ?? []).map((guess) => ({
|
||||
...guess,
|
||||
created_at: guess.created_at ?? '2026-01-01T00:00:10Z',
|
||||
})),
|
||||
},
|
||||
phase_view_model: {
|
||||
status,
|
||||
round_number: 1,
|
||||
players_count: 2,
|
||||
constraints: {
|
||||
min_players_to_start: 2,
|
||||
max_players_mvp: 8,
|
||||
min_players_reached: true,
|
||||
max_players_allowed: true,
|
||||
},
|
||||
host: {
|
||||
can_start_round: status === 'lobby',
|
||||
can_show_question: false,
|
||||
can_mix_answers: false,
|
||||
can_calculate_scores: false,
|
||||
can_reveal_scoreboard: false,
|
||||
can_start_next_round: status === 'scoreboard',
|
||||
can_finish_game: status === 'scoreboard',
|
||||
},
|
||||
player: {
|
||||
can_join: status === 'lobby',
|
||||
can_submit_lie: status === 'lie',
|
||||
can_submit_guess: status === 'guess',
|
||||
can_view_final_result: status === 'finished',
|
||||
},
|
||||
},
|
||||
};
|
||||
}
|
||||
|
||||
describe('HostShellComponent gameplay wiring', () => {
|
||||
afterEach(() => {
|
||||
vi.restoreAllMocks();
|
||||
});
|
||||
|
||||
it('runs startRound transition and refreshes session details', async () => {
|
||||
const fetchMock: FetchMock = vi
|
||||
.fn()
|
||||
.mockResolvedValueOnce(
|
||||
jsonResponse(201, {
|
||||
session: { code: 'ABCD12', status: 'lie', current_round: 1 },
|
||||
round: { number: 1, category: { slug: 'history', name: 'History' } },
|
||||
})
|
||||
)
|
||||
.mockResolvedValueOnce(jsonResponse(200, sessionDetailPayload('lie')));
|
||||
|
||||
vi.stubGlobal('fetch', fetchMock);
|
||||
|
||||
const component = new HostShellComponent();
|
||||
component.sessionCode = ' abcd12 ';
|
||||
component.categorySlug = ' history ';
|
||||
|
||||
await component.startRound();
|
||||
|
||||
expect(fetchMock).toHaveBeenNthCalledWith(
|
||||
1,
|
||||
'/lobby/sessions/ABCD12/rounds/start',
|
||||
expect.objectContaining({ method: 'POST', body: JSON.stringify({ category_slug: 'history' }) })
|
||||
);
|
||||
expect(fetchMock).toHaveBeenNthCalledWith(2, '/lobby/sessions/ABCD12', expect.objectContaining({ method: 'GET' }));
|
||||
expect(component.session?.session.status).toBe('lie');
|
||||
expect(component.roundQuestionId).toBe('41');
|
||||
expect(component.loading).toBe(false);
|
||||
});
|
||||
|
||||
it('hydrates canonical reveal payload in reveal phase', async () => {
|
||||
const fetchMock: FetchMock = vi.fn().mockResolvedValue(
|
||||
jsonResponse(
|
||||
200,
|
||||
sessionDetailPayload('reveal', {
|
||||
roundQuestionId: 77,
|
||||
reveal: {
|
||||
correct_answer: 'Mercury',
|
||||
lies: [{ player_id: 2, nickname: 'Mads', text: 'Venus' }],
|
||||
guesses: [
|
||||
{
|
||||
player_id: 3,
|
||||
nickname: 'Luna',
|
||||
selected_text: 'Venus',
|
||||
is_correct: false,
|
||||
fooled_player_id: 2,
|
||||
fooled_player_nickname: 'Mads',
|
||||
},
|
||||
],
|
||||
},
|
||||
})
|
||||
)
|
||||
);
|
||||
|
||||
vi.stubGlobal('fetch', fetchMock);
|
||||
|
||||
const component = new HostShellComponent();
|
||||
component.sessionCode = 'ABCD12';
|
||||
|
||||
await component.refreshSession();
|
||||
|
||||
expect(component.session?.reveal?.correct_answer).toBe('Mercury');
|
||||
expect(component.session?.reveal?.lies[0]).toMatchObject({ player_id: 2, nickname: 'Mads', text: 'Venus' });
|
||||
expect(component.session?.reveal?.guesses[0]).toMatchObject({
|
||||
player_id: 3,
|
||||
nickname: 'Luna',
|
||||
selected_text: 'Venus',
|
||||
fooled_player_id: 2,
|
||||
fooled_player_nickname: 'Mads',
|
||||
});
|
||||
});
|
||||
|
||||
it('runs next-round transition into canonical lie phase and clears prior final leaderboard state', async () => {
|
||||
const fetchMock: FetchMock = vi
|
||||
.fn()
|
||||
.mockResolvedValueOnce(jsonResponse(200, { session: { code: 'ABCD12', status: 'lie', current_round: 2 } }))
|
||||
.mockResolvedValueOnce(jsonResponse(200, sessionDetailPayload('lie', { roundQuestionId: 99 })));
|
||||
|
||||
vi.stubGlobal('fetch', fetchMock);
|
||||
|
||||
const component = new HostShellComponent();
|
||||
component.sessionCode = ' abcd12 ';
|
||||
component.finalLeaderboardPayload = '{"leaderboard":[{"nickname":"Old","score":1}]}' ;
|
||||
component.finalLeaderboard = [{ id: 9, nickname: 'Old', score: 1 }];
|
||||
|
||||
await component.startNextRound();
|
||||
|
||||
expect(fetchMock).toHaveBeenNthCalledWith(
|
||||
1,
|
||||
'/lobby/sessions/ABCD12/rounds/next',
|
||||
expect.objectContaining({ method: 'POST', body: JSON.stringify({}) })
|
||||
);
|
||||
expect(fetchMock).toHaveBeenNthCalledWith(2, '/lobby/sessions/ABCD12', expect.objectContaining({ method: 'GET' }));
|
||||
expect(component.session?.session.status).toBe('lie');
|
||||
expect(component.roundQuestionId).toBe('99');
|
||||
expect(component.finalLeaderboardPayload).toBe('');
|
||||
expect(component.finalLeaderboard).toEqual([]);
|
||||
expect(component.nextRoundError).toBe('');
|
||||
});
|
||||
|
||||
it('captures finish-game failure for retry and stores final leaderboard on success', async () => {
|
||||
const fetchMock: FetchMock = vi
|
||||
.fn()
|
||||
.mockResolvedValueOnce(jsonResponse(503, { error: 'Final leaderboard timeout' }))
|
||||
.mockResolvedValueOnce(
|
||||
jsonResponse(200, {
|
||||
session: { code: 'ABCD12', status: 'finished', current_round: 2 },
|
||||
winner: { id: 1, nickname: 'Luna', score: 320 },
|
||||
leaderboard: [
|
||||
{ id: 2, nickname: 'Mads', score: 120 },
|
||||
{ id: 1, nickname: 'Luna', score: 320 },
|
||||
],
|
||||
})
|
||||
)
|
||||
.mockResolvedValueOnce(jsonResponse(200, sessionDetailPayload('finished', { roundQuestionId: null })));
|
||||
|
||||
vi.stubGlobal('fetch', fetchMock);
|
||||
|
||||
const component = new HostShellComponent();
|
||||
component.sessionCode = 'ABCD12';
|
||||
|
||||
await component.finishGame();
|
||||
expect(component.finishError).toContain('Finish game failed: Final leaderboard timeout');
|
||||
|
||||
await component.finishGame();
|
||||
|
||||
expect(fetchMock).toHaveBeenNthCalledWith(
|
||||
2,
|
||||
'/lobby/sessions/ABCD12/finish',
|
||||
expect.objectContaining({ method: 'POST', body: JSON.stringify({}) })
|
||||
);
|
||||
expect(component.finishError).toBe('');
|
||||
expect(component.finalLeaderboardPayload).toContain('"status": "finished"');
|
||||
expect(component.finalWinner?.nickname).toBe('Luna');
|
||||
expect(component.finalLeaderboard.map((entry) => entry.nickname)).toEqual(['Luna', 'Mads']);
|
||||
});
|
||||
|
||||
it('guards next-round and finish actions when session code is missing', async () => {
|
||||
const fetchMock: FetchMock = vi.fn();
|
||||
vi.stubGlobal('fetch', fetchMock);
|
||||
|
||||
const component = new HostShellComponent();
|
||||
component.sessionCode = ' ';
|
||||
|
||||
await component.startNextRound();
|
||||
await component.finishGame();
|
||||
|
||||
expect(fetchMock).not.toHaveBeenCalled();
|
||||
expect(component.nextRoundError).toContain('Session code is required');
|
||||
expect(component.finishError).toContain('Session code is required');
|
||||
});
|
||||
|
||||
it('syncs host hash-route with latest phase after refresh without page reload', async () => {
|
||||
const fetchMock: FetchMock = vi.fn().mockResolvedValue(jsonResponse(200, sessionDetailPayload('guess', { roundQuestionId: 77 })));
|
||||
vi.stubGlobal('fetch', fetchMock);
|
||||
|
||||
const replaceState = vi.fn();
|
||||
vi.stubGlobal('window', {
|
||||
location: { hash: '#/host/lobby/ABCD12' },
|
||||
history: { state: null, replaceState },
|
||||
sessionStorage: { getItem: vi.fn().mockReturnValue(null), setItem: vi.fn() },
|
||||
});
|
||||
|
||||
const component = new HostShellComponent();
|
||||
component.sessionCode = 'ABCD12';
|
||||
|
||||
await component.refreshSession();
|
||||
|
||||
expect(replaceState).toHaveBeenCalledWith(null, '', '#/host/guess/ABCD12');
|
||||
expect(component.canStartRound).toBe(false);
|
||||
expect(component.canStartNextRound).toBe(false);
|
||||
expect(component.canFinishGame).toBe(false);
|
||||
});
|
||||
|
||||
it('uses phase_view_model to keep host action surface bound to round boundaries only', async () => {
|
||||
const component = new HostShellComponent();
|
||||
|
||||
expect(component.canStartRound).toBe(true);
|
||||
expect(component.canStartNextRound).toBe(false);
|
||||
expect(component.canFinishGame).toBe(false);
|
||||
|
||||
component.session = sessionDetailPayload('lie') as any;
|
||||
expect(component.canStartRound).toBe(false);
|
||||
expect(component.canStartNextRound).toBe(false);
|
||||
expect(component.canFinishGame).toBe(false);
|
||||
|
||||
component.session = sessionDetailPayload('scoreboard') as any;
|
||||
expect(component.canStartNextRound).toBe(true);
|
||||
expect(component.canFinishGame).toBe(true);
|
||||
});
|
||||
});
|
||||
@@ -1,290 +0,0 @@
|
||||
import { CommonModule } from '@angular/common';
|
||||
import { Component, OnDestroy, OnInit } from '@angular/core';
|
||||
import { FormsModule } from '@angular/forms';
|
||||
|
||||
import { createApiClient } from '../../../../../src/api/client';
|
||||
import type { FinishGameResponse, SessionDetailResponse } from '../../../../../src/api/types';
|
||||
import { createVerticalSliceController } from '../../../../../src/spa/vertical-slice';
|
||||
import { clientHasNoAudioOutput, resolvePreferredLocale, subscribeToLocaleChanges, t } from '../../lobby-i18n';
|
||||
|
||||
type SessionDetail = SessionDetailResponse;
|
||||
|
||||
type LeaderboardEntry = FinishGameResponse['leaderboard'][number];
|
||||
type LeaderboardResponse = FinishGameResponse;
|
||||
|
||||
@Component({
|
||||
selector: 'app-host-shell',
|
||||
standalone: true,
|
||||
imports: [CommonModule, FormsModule],
|
||||
template: `
|
||||
<h2>{{ copy('host.title') }}</h2>
|
||||
|
||||
<div class="panel" [attr.data-client-has-no-audio-output]="clientHasNoAudioOutput">
|
||||
<label>{{ copy('common.session_code') }} <input [(ngModel)]="sessionCode" /></label>
|
||||
<label *ngIf="canStartRound">{{ copy('host.category') }} <input [(ngModel)]="categorySlug" /></label>
|
||||
<button (click)="refreshSession()" [disabled]="loading">{{ copy('common.refresh') }}</button>
|
||||
<button *ngIf="canStartRound" (click)="startRound()" [disabled]="loading">{{ copy('host.start_round') }}</button>
|
||||
<button *ngIf="canStartNextRound || nextRoundError" (click)="startNextRound()" [disabled]="loading">{{ copy(nextRoundError ? 'host.retry_next_round' : 'host.start_next_round') }}</button>
|
||||
<button *ngIf="canFinishGame || finishError" (click)="finishGame()" [disabled]="loading">{{ copy(finishError ? 'host.retry_finish' : 'host.finish_game') }}</button>
|
||||
</div>
|
||||
|
||||
<p *ngIf="session" class="hint">{{ copy('host.audio_locale_hint') }}: {{ locale }}</p>
|
||||
<p *ngIf="error" class="error">{{ error }}</p>
|
||||
<p *ngIf="nextRoundError" class="error">{{ nextRoundError }}</p>
|
||||
<p *ngIf="finishError" class="error">{{ finishError }}</p>
|
||||
|
||||
<div *ngIf="session" class="panel">
|
||||
<p><strong>{{ copy('common.status') }}:</strong> {{ session.session.status }} · {{ copy('common.round') }} {{ session.session.current_round }}</p>
|
||||
<p><strong>{{ copy('common.round_question_id') }}:</strong> {{ roundQuestionId || '-' }}</p>
|
||||
<p *ngIf="session.round_question"><strong>{{ copy('common.prompt') }}:</strong> {{ session.round_question.prompt }}</p>
|
||||
<ul>
|
||||
<li *ngFor="let p of session.players">{{ p.nickname }}: {{ p.score }}</li>
|
||||
</ul>
|
||||
<div class="panel" *ngIf="session.reveal && (session.session.status === 'reveal' || session.session.status === 'scoreboard')">
|
||||
<h3>Reveal</h3>
|
||||
<p><strong>Korrekt svar:</strong> {{ session.reveal.correct_answer }}</p>
|
||||
<p><strong>Spørgsmål:</strong> {{ session.reveal.prompt }}</p>
|
||||
<div *ngIf="session.reveal.lies.length">
|
||||
<strong>Løgne</strong>
|
||||
<ul>
|
||||
<li *ngFor="let lie of session.reveal.lies">{{ lie.nickname }} løj: {{ lie.text }}</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div *ngIf="session.reveal.guesses.length">
|
||||
<strong>Gæt</strong>
|
||||
<ul>
|
||||
<li *ngFor="let guess of session.reveal.guesses">
|
||||
{{ guess.nickname }} valgte {{ guess.selected_text }}
|
||||
<span *ngIf="guess.is_correct">· korrekt</span>
|
||||
<span *ngIf="!guess.is_correct && guess.fooled_player_nickname">· narret af {{ guess.fooled_player_nickname }}</span>
|
||||
<span *ngIf="!guess.is_correct && !guess.fooled_player_nickname">· forkert</span>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
<div *ngIf="finalLeaderboard.length">
|
||||
<h3>{{ copy('host.final_leaderboard') }}</h3>
|
||||
<p *ngIf="finalWinner"><strong>{{ copy('host.winner') }}:</strong> {{ finalWinner.nickname }} ({{ finalWinner.score }} {{ copy('common.points_short') }})</p>
|
||||
<ol>
|
||||
<li *ngFor="let entry of finalLeaderboard">{{ entry.nickname }}: {{ entry.score }}</li>
|
||||
</ol>
|
||||
</div>
|
||||
<pre *ngIf="finalLeaderboardPayload">{{ finalLeaderboardPayload }}</pre>
|
||||
</div>
|
||||
`,
|
||||
})
|
||||
export class HostShellComponent implements OnInit, OnDestroy {
|
||||
locale = resolvePreferredLocale();
|
||||
readonly clientHasNoAudioOutput = clientHasNoAudioOutput;
|
||||
|
||||
sessionCode = '';
|
||||
categorySlug = 'general';
|
||||
roundQuestionId = '';
|
||||
loading = false;
|
||||
error = '';
|
||||
nextRoundError = '';
|
||||
finishError = '';
|
||||
finalLeaderboardPayload = '';
|
||||
finalLeaderboard: LeaderboardEntry[] = [];
|
||||
finalWinner: LeaderboardEntry | null = null;
|
||||
session: SessionDetail | null = null;
|
||||
|
||||
private readonly api = createApiClient();
|
||||
private readonly controller = createVerticalSliceController(this.api);
|
||||
private unsubscribeLocale: (() => void) | null = null;
|
||||
|
||||
ngOnInit(): void {
|
||||
this.unsubscribeLocale = subscribeToLocaleChanges((locale) => {
|
||||
this.locale = locale;
|
||||
});
|
||||
if (typeof window === 'undefined') {
|
||||
return;
|
||||
}
|
||||
|
||||
const hashRoute = window.location.hash.replace(/^#\/?/, '');
|
||||
const match = hashRoute.match(/^host(?:\/[^/]+)?(?:\/([^/?#]+))?/i);
|
||||
const codeFromRoute = match?.[1] ?? '';
|
||||
const storedCode = window.sessionStorage.getItem('wpp.host-session-code') ?? '';
|
||||
const candidate = codeFromRoute || storedCode;
|
||||
|
||||
if (!candidate) {
|
||||
return;
|
||||
}
|
||||
|
||||
this.sessionCode = this.normalizeCode(candidate);
|
||||
this.persistSessionCode(this.sessionCode);
|
||||
void this.refreshSession();
|
||||
}
|
||||
|
||||
ngOnDestroy(): void {
|
||||
this.unsubscribeLocale?.();
|
||||
this.unsubscribeLocale = null;
|
||||
}
|
||||
|
||||
get canStartRound(): boolean {
|
||||
return Boolean(this.session?.phase_view_model?.host?.can_start_round ?? !this.session);
|
||||
}
|
||||
|
||||
get canStartNextRound(): boolean {
|
||||
return Boolean(this.session?.phase_view_model?.host?.can_start_next_round);
|
||||
}
|
||||
|
||||
get canFinishGame(): boolean {
|
||||
return Boolean(this.session?.phase_view_model?.host?.can_finish_game);
|
||||
}
|
||||
|
||||
copy(key: string): string {
|
||||
return t(key, this.locale);
|
||||
}
|
||||
|
||||
private normalizeCode(value: string): string {
|
||||
return value.trim().toUpperCase();
|
||||
}
|
||||
|
||||
private persistSessionCode(code: string): void {
|
||||
if (typeof window !== 'undefined') {
|
||||
window.sessionStorage.setItem('wpp.host-session-code', code);
|
||||
}
|
||||
}
|
||||
|
||||
private async request<T>(path: string, method: 'GET' | 'POST', payload?: unknown): Promise<T> {
|
||||
const response = await fetch(path, {
|
||||
method,
|
||||
headers: {
|
||||
Accept: 'application/json',
|
||||
...(payload === undefined ? {} : { 'Content-Type': 'application/json' }),
|
||||
},
|
||||
...(payload === undefined ? {} : { body: JSON.stringify(payload) }),
|
||||
credentials: 'same-origin',
|
||||
});
|
||||
|
||||
const body = await response.json().catch(() => ({}));
|
||||
if (!response.ok) {
|
||||
throw new Error((body as { error?: string }).error ?? `HTTP ${response.status}`);
|
||||
}
|
||||
|
||||
return body as T;
|
||||
}
|
||||
|
||||
async refreshSession(): Promise<void> {
|
||||
this.loading = true;
|
||||
this.error = '';
|
||||
this.nextRoundError = '';
|
||||
this.finishError = '';
|
||||
try {
|
||||
const state = await this.controller.hydrateLobby(this.sessionCode);
|
||||
if (!state.session || state.errorMessage) {
|
||||
throw new Error(state.errorMessage ?? this.copy('common.unknown_error'));
|
||||
}
|
||||
this.session = state.session as SessionDetail;
|
||||
this.sessionCode = this.session.session.code;
|
||||
this.persistSessionCode(this.sessionCode);
|
||||
this.roundQuestionId = this.session.round_question?.id ? String(this.session.round_question.id) : '';
|
||||
if (this.session.session.status !== 'finished') {
|
||||
this.resetFinalLeaderboard();
|
||||
}
|
||||
this.syncRouteFromSession();
|
||||
} catch (error) {
|
||||
this.error = `${this.copy('host.session_refresh_failed')}: ${(error as Error).message}`;
|
||||
} finally {
|
||||
this.loading = false;
|
||||
}
|
||||
}
|
||||
|
||||
async startRound(): Promise<void> {
|
||||
await this.runAction(async () => {
|
||||
const state = await this.controller.startRound(this.sessionCode, this.categorySlug.trim());
|
||||
if (!state.session || state.errorMessage) {
|
||||
throw new Error(state.errorMessage ?? this.copy('common.unknown_error'));
|
||||
}
|
||||
this.session = state.session as SessionDetail;
|
||||
this.sessionCode = this.session.session.code;
|
||||
this.persistSessionCode(this.sessionCode);
|
||||
this.roundQuestionId = this.session.round_question?.id ? String(this.session.round_question.id) : '';
|
||||
this.resetFinalLeaderboard();
|
||||
this.syncRouteFromSession();
|
||||
});
|
||||
}
|
||||
|
||||
async startNextRound(): Promise<void> {
|
||||
this.loading = true;
|
||||
this.nextRoundError = '';
|
||||
this.error = '';
|
||||
try {
|
||||
const code = this.normalizeCode(this.sessionCode);
|
||||
if (!code) {
|
||||
throw new Error(this.copy('host.session_code_required'));
|
||||
}
|
||||
await this.request(`/lobby/sessions/${encodeURIComponent(code)}/rounds/next`, 'POST', {});
|
||||
this.resetFinalLeaderboard();
|
||||
await this.refreshSession();
|
||||
} catch (error) {
|
||||
this.nextRoundError = `${this.copy('host.next_round_failed')}: ${(error as Error).message}`;
|
||||
} finally {
|
||||
this.loading = false;
|
||||
}
|
||||
}
|
||||
|
||||
async finishGame(): Promise<void> {
|
||||
this.loading = true;
|
||||
this.finishError = '';
|
||||
this.error = '';
|
||||
try {
|
||||
const code = this.normalizeCode(this.sessionCode);
|
||||
if (!code) {
|
||||
throw new Error(this.copy('host.session_code_required'));
|
||||
}
|
||||
const payload = await this.request<LeaderboardResponse>(`/lobby/sessions/${encodeURIComponent(code)}/finish`, 'POST', {});
|
||||
this.finalLeaderboardPayload = JSON.stringify(payload, null, 2);
|
||||
this.finalLeaderboard = [...payload.leaderboard].sort((a, b) => {
|
||||
if (b.score !== a.score) {
|
||||
return b.score - a.score;
|
||||
}
|
||||
return a.nickname.localeCompare(b.nickname);
|
||||
});
|
||||
this.finalWinner = payload.winner ?? this.finalLeaderboard[0] ?? null;
|
||||
await this.refreshSession();
|
||||
} catch (error) {
|
||||
this.finishError = `${this.copy('host.finish_game_failed')}: ${(error as Error).message}`;
|
||||
} finally {
|
||||
this.loading = false;
|
||||
}
|
||||
}
|
||||
|
||||
private resetFinalLeaderboard(): void {
|
||||
this.finalLeaderboardPayload = '';
|
||||
this.finalLeaderboard = [];
|
||||
this.finalWinner = null;
|
||||
}
|
||||
|
||||
private syncRouteFromSession(): void {
|
||||
if (!this.session) {
|
||||
return;
|
||||
}
|
||||
|
||||
const phase = this.session.session.status || 'lobby';
|
||||
const code = this.normalizeCode(this.session.session.code || this.sessionCode);
|
||||
if (!code) {
|
||||
return;
|
||||
}
|
||||
|
||||
const targetPath = `#/host/${encodeURIComponent(phase)}/${encodeURIComponent(code)}`;
|
||||
if (typeof window === 'undefined' || window.location.hash === targetPath) {
|
||||
return;
|
||||
}
|
||||
|
||||
window.history.replaceState(window.history.state, '', targetPath);
|
||||
}
|
||||
|
||||
private async runAction(action: () => Promise<void>): Promise<void> {
|
||||
this.loading = true;
|
||||
this.error = '';
|
||||
try {
|
||||
await action();
|
||||
} catch (error) {
|
||||
this.error = (error as Error).message;
|
||||
} finally {
|
||||
this.loading = false;
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -1,640 +0,0 @@
|
||||
import { afterEach, describe, expect, it, vi } from 'vitest';
|
||||
|
||||
import lobbyCatalog from '../../../../../../shared/i18n/lobby.json';
|
||||
import { PlayerShellComponent } from './player-shell.component';
|
||||
|
||||
type FetchMock = ReturnType<typeof vi.fn>;
|
||||
|
||||
function jsonResponse(status: number, body: unknown) {
|
||||
return {
|
||||
ok: status >= 200 && status < 300,
|
||||
status,
|
||||
json: vi.fn().mockResolvedValue(body),
|
||||
} as unknown as Response;
|
||||
}
|
||||
|
||||
function sessionDetailPayload(
|
||||
status: string,
|
||||
options?: {
|
||||
answers?: string[];
|
||||
players?: Array<{ id: number; nickname: string; score: number }>;
|
||||
roundQuestionId?: number | null;
|
||||
reveal?: {
|
||||
correct_answer: string;
|
||||
prompt?: string;
|
||||
lies?: Array<{ player_id: number; nickname: string; text: string; created_at?: string }>;
|
||||
guesses?: Array<{
|
||||
player_id: number;
|
||||
nickname: string;
|
||||
selected_text: string;
|
||||
is_correct: boolean;
|
||||
fooled_player_id: number | null;
|
||||
fooled_player_nickname?: string;
|
||||
created_at?: string;
|
||||
}>;
|
||||
} | null;
|
||||
}
|
||||
) {
|
||||
const answers = options?.answers ?? [];
|
||||
const roundQuestionId = options?.roundQuestionId ?? 11;
|
||||
|
||||
return {
|
||||
session: {
|
||||
code: 'ABCD12',
|
||||
status,
|
||||
host_id: null,
|
||||
current_round: 1,
|
||||
players_count: (options?.players ?? []).length,
|
||||
},
|
||||
round_question:
|
||||
roundQuestionId === null
|
||||
? null
|
||||
: {
|
||||
id: roundQuestionId,
|
||||
round_number: 1,
|
||||
prompt: 'Q?',
|
||||
shown_at: '2026-01-01T00:00:00Z',
|
||||
answers: answers.map((text) => ({ text })),
|
||||
},
|
||||
players: (options?.players ?? []).map((player) => ({
|
||||
...player,
|
||||
is_connected: true,
|
||||
})),
|
||||
reveal:
|
||||
options?.reveal === undefined || options?.reveal === null
|
||||
? null
|
||||
: {
|
||||
round_question_id: roundQuestionId,
|
||||
round_number: 1,
|
||||
prompt: options.reveal.prompt ?? 'Q?',
|
||||
correct_answer: options.reveal.correct_answer,
|
||||
lies: (options.reveal.lies ?? []).map((lie) => ({
|
||||
...lie,
|
||||
created_at: lie.created_at ?? '2026-01-01T00:00:05Z',
|
||||
})),
|
||||
guesses: (options.reveal.guesses ?? []).map((guess) => ({
|
||||
...guess,
|
||||
created_at: guess.created_at ?? '2026-01-01T00:00:10Z',
|
||||
})),
|
||||
},
|
||||
phase_view_model: {
|
||||
status,
|
||||
round_number: 1,
|
||||
players_count: (options?.players ?? []).length,
|
||||
constraints: {
|
||||
min_players_to_start: 2,
|
||||
max_players_mvp: 8,
|
||||
min_players_reached: true,
|
||||
max_players_allowed: true,
|
||||
},
|
||||
host: {
|
||||
can_start_round: false,
|
||||
can_show_question: false,
|
||||
can_mix_answers: false,
|
||||
can_calculate_scores: false,
|
||||
can_reveal_scoreboard: false,
|
||||
can_start_next_round: false,
|
||||
can_finish_game: false,
|
||||
},
|
||||
player: {
|
||||
can_join: status === 'lobby',
|
||||
can_submit_lie: status === 'lie',
|
||||
can_submit_guess: status === 'guess',
|
||||
can_view_final_result: status === 'finished',
|
||||
},
|
||||
},
|
||||
};
|
||||
}
|
||||
|
||||
describe('PlayerShellComponent gameplay wiring', () => {
|
||||
afterEach(() => {
|
||||
vi.useRealTimers();
|
||||
vi.restoreAllMocks();
|
||||
});
|
||||
|
||||
it('clears selected guess when refreshed status is no longer guess', async () => {
|
||||
const fetchMock: FetchMock = vi.fn().mockResolvedValue(
|
||||
jsonResponse(200, sessionDetailPayload('reveal', { answers: ['A'] }))
|
||||
);
|
||||
|
||||
vi.stubGlobal('fetch', fetchMock);
|
||||
|
||||
const component = new PlayerShellComponent();
|
||||
component.sessionCode = 'abcd12';
|
||||
component.selectedGuess = 'A';
|
||||
|
||||
await component.refreshSession();
|
||||
|
||||
expect(fetchMock).toHaveBeenCalledWith(
|
||||
'/lobby/sessions/ABCD12',
|
||||
expect.objectContaining({ method: 'GET' })
|
||||
);
|
||||
expect(component.selectedGuess).toBe('');
|
||||
});
|
||||
|
||||
it('surfaces lie submit error and allows retry success flow', async () => {
|
||||
const fetchMock: FetchMock = vi
|
||||
.fn()
|
||||
.mockResolvedValueOnce(jsonResponse(500, { error: 'Temporary submit outage' }))
|
||||
.mockResolvedValueOnce(jsonResponse(201, { lie: { id: 1, player_id: 9, round_question_id: 11, text: 'my lie', created_at: '2026-01-01T00:00:01Z' }, window: { lie_deadline_at: '2026-01-01T00:00:45Z' } }))
|
||||
.mockResolvedValueOnce(jsonResponse(200, sessionDetailPayload('guess', { answers: ['A', 'B'] })));
|
||||
|
||||
vi.stubGlobal('fetch', fetchMock);
|
||||
|
||||
const component = new PlayerShellComponent();
|
||||
component.sessionCode = 'ABCD12';
|
||||
component.playerId = 9;
|
||||
component.sessionToken = 'token-1';
|
||||
component.lieText = 'my lie';
|
||||
component.session = {
|
||||
session: { code: 'ABCD12', status: 'lie', current_round: 1 },
|
||||
round_question: { id: 11, prompt: 'Q?', answers: [] },
|
||||
players: [],
|
||||
};
|
||||
|
||||
await component.submitLie();
|
||||
|
||||
expect(fetchMock).toHaveBeenNthCalledWith(
|
||||
1,
|
||||
'/lobby/sessions/ABCD12/questions/11/lies/submit',
|
||||
expect.objectContaining({
|
||||
method: 'POST',
|
||||
body: JSON.stringify({ player_id: 9, session_token: 'token-1', text: 'my lie' }),
|
||||
})
|
||||
);
|
||||
expect(component.submitError?.kind).toBe('lie');
|
||||
expect(component.submitError?.message).toContain('Lie submit failed: Temporary submit outage');
|
||||
|
||||
await component.submitLie();
|
||||
|
||||
expect(component.submitError).toBeNull();
|
||||
expect(component.session?.session.status).toBe('guess');
|
||||
expect(fetchMock).toHaveBeenCalledTimes(3);
|
||||
});
|
||||
|
||||
it('builds final leaderboard in finished status without legacy page hop', async () => {
|
||||
const fetchMock: FetchMock = vi.fn().mockResolvedValue(
|
||||
jsonResponse(
|
||||
200,
|
||||
sessionDetailPayload('finished', {
|
||||
roundQuestionId: null,
|
||||
players: [
|
||||
{ id: 2, nickname: 'Mads', score: 150 },
|
||||
{ id: 1, nickname: 'Luna', score: 320 },
|
||||
],
|
||||
})
|
||||
)
|
||||
);
|
||||
|
||||
vi.stubGlobal('fetch', fetchMock);
|
||||
|
||||
const component = new PlayerShellComponent();
|
||||
component.sessionCode = 'ABCD12';
|
||||
|
||||
await component.refreshSession();
|
||||
|
||||
expect(component.finalLeaderboard.map((entry) => entry.nickname)).toEqual(['Luna', 'Mads']);
|
||||
});
|
||||
|
||||
it('hydrates canonical reveal payload after guess -> reveal', async () => {
|
||||
const fetchMock: FetchMock = vi.fn().mockResolvedValue(
|
||||
jsonResponse(
|
||||
200,
|
||||
sessionDetailPayload('reveal', {
|
||||
answers: ['A', 'B'],
|
||||
reveal: {
|
||||
correct_answer: 'A',
|
||||
lies: [{ player_id: 3, nickname: 'Løgnhals', text: 'B' }],
|
||||
guesses: [
|
||||
{
|
||||
player_id: 9,
|
||||
nickname: 'Detektiv',
|
||||
selected_text: 'B',
|
||||
is_correct: false,
|
||||
fooled_player_id: 3,
|
||||
fooled_player_nickname: 'Løgnhals',
|
||||
},
|
||||
{
|
||||
player_id: 10,
|
||||
nickname: 'Sandhed',
|
||||
selected_text: 'A',
|
||||
is_correct: true,
|
||||
fooled_player_id: null,
|
||||
},
|
||||
],
|
||||
},
|
||||
})
|
||||
)
|
||||
);
|
||||
|
||||
vi.stubGlobal('fetch', fetchMock);
|
||||
|
||||
const component = new PlayerShellComponent();
|
||||
component.sessionCode = 'ABCD12';
|
||||
|
||||
await component.refreshSession();
|
||||
|
||||
expect(component.session?.reveal?.correct_answer).toBe('A');
|
||||
expect(component.session?.reveal?.lies[0]).toMatchObject({ player_id: 3, nickname: 'Løgnhals', text: 'B' });
|
||||
expect(component.session?.reveal?.guesses[0]).toMatchObject({
|
||||
player_id: 9,
|
||||
nickname: 'Detektiv',
|
||||
selected_text: 'B',
|
||||
is_correct: false,
|
||||
fooled_player_id: 3,
|
||||
fooled_player_nickname: 'Løgnhals',
|
||||
});
|
||||
expect(component.session?.reveal?.guesses[1]).toMatchObject({
|
||||
player_id: 10,
|
||||
nickname: 'Sandhed',
|
||||
selected_text: 'A',
|
||||
is_correct: true,
|
||||
fooled_player_id: null,
|
||||
});
|
||||
});
|
||||
|
||||
it('surfaces guess submit error and retries with selected answer payload', async () => {
|
||||
const fetchMock: FetchMock = vi
|
||||
.fn()
|
||||
.mockResolvedValueOnce(jsonResponse(503, { error: 'Guess queue busy' }))
|
||||
.mockResolvedValueOnce(jsonResponse(201, { guess: { id: 2, player_id: 9, round_question_id: 11, selected_text: 'B', is_correct: false, fooled_player_id: 3, created_at: '2026-01-01T00:00:10Z' }, window: { guess_deadline_at: '2026-01-01T00:01:30Z' } }))
|
||||
.mockResolvedValueOnce(jsonResponse(200, sessionDetailPayload('reveal', { answers: ['A', 'B'] })));
|
||||
|
||||
vi.stubGlobal('fetch', fetchMock);
|
||||
|
||||
const component = new PlayerShellComponent();
|
||||
component.sessionCode = ' abcd12 ';
|
||||
component.playerId = 9;
|
||||
component.sessionToken = 'token-1';
|
||||
component.selectedGuess = 'B';
|
||||
component.session = {
|
||||
session: { code: 'ABCD12', status: 'guess', current_round: 1 },
|
||||
round_question: { id: 11, prompt: 'Q?', answers: [{ text: 'A' }, { text: 'B' }] },
|
||||
players: [],
|
||||
};
|
||||
|
||||
await component.submitGuess();
|
||||
|
||||
expect(fetchMock).toHaveBeenNthCalledWith(
|
||||
1,
|
||||
'/lobby/sessions/ABCD12/questions/11/guesses/submit',
|
||||
expect.objectContaining({
|
||||
method: 'POST',
|
||||
body: JSON.stringify({ player_id: 9, session_token: 'token-1', selected_text: 'B' }),
|
||||
})
|
||||
);
|
||||
expect(component.submitError?.kind).toBe('guess');
|
||||
expect(component.submitError?.message).toContain('Guess submit failed: Guess queue busy');
|
||||
|
||||
await component.submitGuess();
|
||||
|
||||
expect(component.submitError).toBeNull();
|
||||
expect(component.session?.session.status).toBe('reveal');
|
||||
expect(component.selectedGuess).toBe('');
|
||||
expect(fetchMock).toHaveBeenCalledTimes(3);
|
||||
});
|
||||
|
||||
it('auto-refreshes player session to avoid host/player state desync between rounds', async () => {
|
||||
vi.useFakeTimers();
|
||||
|
||||
const fetchMock: FetchMock = vi
|
||||
.fn()
|
||||
.mockResolvedValueOnce(jsonResponse(200, sessionDetailPayload('scoreboard', { roundQuestionId: null })))
|
||||
.mockResolvedValueOnce(jsonResponse(200, sessionDetailPayload('lobby', { roundQuestionId: null })));
|
||||
|
||||
vi.stubGlobal('fetch', fetchMock);
|
||||
|
||||
const component = new PlayerShellComponent();
|
||||
component.sessionCode = 'ABCD12';
|
||||
|
||||
await component.refreshSession();
|
||||
expect(component.session?.session.status).toBe('scoreboard');
|
||||
|
||||
await vi.advanceTimersByTimeAsync(3100);
|
||||
|
||||
expect(fetchMock).toHaveBeenCalledTimes(2);
|
||||
expect(component.session?.session.status).toBe('lobby');
|
||||
|
||||
component.ngOnDestroy();
|
||||
});
|
||||
|
||||
it('enters reconnecting state when network request fails while online', async () => {
|
||||
vi.stubGlobal('navigator', { onLine: true });
|
||||
|
||||
const fetchMock: FetchMock = vi.fn().mockRejectedValueOnce(new TypeError('Failed to fetch'));
|
||||
vi.stubGlobal('fetch', fetchMock);
|
||||
|
||||
const component = new PlayerShellComponent();
|
||||
component.sessionCode = 'ABCD12';
|
||||
|
||||
await component.refreshSession();
|
||||
|
||||
expect(component.connectionState === 'reconnecting' || component.connectionState === 'online').toBe(true);
|
||||
expect(component.error).toContain('Session refresh failed:');
|
||||
});
|
||||
|
||||
it('uses offline state when browser reports disconnected network', async () => {
|
||||
vi.stubGlobal('navigator', { onLine: false });
|
||||
|
||||
const fetchMock: FetchMock = vi.fn().mockRejectedValue(new TypeError('Failed to fetch'));
|
||||
vi.stubGlobal('fetch', fetchMock);
|
||||
|
||||
const component = new PlayerShellComponent();
|
||||
component.sessionCode = 'ABCD12';
|
||||
|
||||
await component.refreshSession();
|
||||
|
||||
expect(component.connectionState).toBe('offline');
|
||||
expect(component.error).toContain('Session refresh failed');
|
||||
});
|
||||
|
||||
it('tracks loading transition message for join action', async () => {
|
||||
let resolveJoin: ((value: Response) => void) | null = null;
|
||||
const fetchMock: FetchMock = vi.fn().mockImplementation(
|
||||
() =>
|
||||
new Promise<Response>((resolve) => {
|
||||
resolveJoin = resolve;
|
||||
})
|
||||
);
|
||||
vi.stubGlobal('fetch', fetchMock);
|
||||
|
||||
const component = new PlayerShellComponent();
|
||||
component.sessionCode = 'ABCD12';
|
||||
component.nickname = 'Luna';
|
||||
|
||||
const joinPromise = component.joinSession();
|
||||
|
||||
expect(component.loading).toBe(true);
|
||||
expect(component.loadingMessage).toBe('Joining session… restoring your player state.');
|
||||
|
||||
resolveJoin?.(jsonResponse(201, sessionDetailPayload('lobby', { roundQuestionId: null })));
|
||||
await joinPromise;
|
||||
|
||||
expect(component.loading).toBe(false);
|
||||
expect(component.loadingTransition).toBeNull();
|
||||
});
|
||||
|
||||
it('returnToJoin clears persisted session context and transient state', () => {
|
||||
const values = new Map<string, string>();
|
||||
const localStorage = {
|
||||
getItem: vi.fn((key: string) => values.get(key) ?? null),
|
||||
setItem: vi.fn((key: string, value: string) => {
|
||||
values.set(key, value);
|
||||
}),
|
||||
removeItem: vi.fn((key: string) => {
|
||||
values.delete(key);
|
||||
}),
|
||||
};
|
||||
|
||||
vi.stubGlobal('window', {
|
||||
addEventListener: vi.fn(),
|
||||
removeEventListener: vi.fn(),
|
||||
localStorage,
|
||||
});
|
||||
|
||||
values.set('wpp.session-context', JSON.stringify({ sessionCode: 'ABCD12', playerId: 9, token: 'tok-1' }));
|
||||
|
||||
const component = new PlayerShellComponent();
|
||||
component.sessionCode = 'ABCD12';
|
||||
component.playerId = 9;
|
||||
component.sessionToken = 'tok-1';
|
||||
component.error = 'Session refresh failed';
|
||||
component.submitError = { kind: 'guess', message: 'Guess submit failed' };
|
||||
component.session = {
|
||||
session: { code: 'ABCD12', status: 'guess', current_round: 1 },
|
||||
round_question: { id: 11, prompt: 'Q?', answers: [{ text: 'A' }] },
|
||||
players: [],
|
||||
};
|
||||
|
||||
component.returnToJoin();
|
||||
|
||||
expect(component.playerId).toBe(0);
|
||||
expect(component.sessionToken).toBe('');
|
||||
expect(component.session).toBeNull();
|
||||
expect(component.error).toBe('');
|
||||
expect(component.submitError).toBeNull();
|
||||
expect(values.get('wpp.session-context')).toBeUndefined();
|
||||
});
|
||||
|
||||
it('syncs player hash-route with latest phase during periodic state sync', async () => {
|
||||
vi.useFakeTimers();
|
||||
|
||||
const fetchMock: FetchMock = vi
|
||||
.fn()
|
||||
.mockResolvedValueOnce(jsonResponse(200, sessionDetailPayload('scoreboard', { roundQuestionId: null })))
|
||||
.mockResolvedValueOnce(jsonResponse(200, sessionDetailPayload('lobby', { roundQuestionId: null })));
|
||||
|
||||
vi.stubGlobal('fetch', fetchMock);
|
||||
|
||||
const replaceState = vi.fn();
|
||||
const localStorage = { getItem: vi.fn().mockReturnValue(null), setItem: vi.fn(), removeItem: vi.fn() };
|
||||
vi.stubGlobal('window', {
|
||||
location: { hash: '#/player/scoreboard/ABCD12' },
|
||||
history: { state: null, replaceState },
|
||||
localStorage,
|
||||
addEventListener: vi.fn(),
|
||||
removeEventListener: vi.fn(),
|
||||
});
|
||||
|
||||
const component = new PlayerShellComponent();
|
||||
component.sessionCode = 'ABCD12';
|
||||
|
||||
await component.refreshSession();
|
||||
await vi.advanceTimersByTimeAsync(3100);
|
||||
|
||||
expect(replaceState).toHaveBeenCalledWith(null, '', '#/player/lobby/ABCD12');
|
||||
|
||||
component.ngOnDestroy();
|
||||
});
|
||||
|
||||
it('silences active media elements when secondary-device audio guard is installed', () => {
|
||||
const pauseAudio = vi.fn();
|
||||
const pauseVideo = vi.fn();
|
||||
const audioElement = { muted: false, pause: pauseAudio };
|
||||
const videoElement = { muted: false, pause: pauseVideo };
|
||||
const querySelectorAll = vi.fn().mockReturnValue([audioElement, videoElement]);
|
||||
|
||||
vi.stubGlobal('document', { querySelectorAll });
|
||||
vi.stubGlobal('window', {
|
||||
location: { hash: '', search: '' },
|
||||
history: { state: null, replaceState: vi.fn() },
|
||||
localStorage: { getItem: vi.fn().mockReturnValue('en'), setItem: vi.fn(), removeItem: vi.fn() },
|
||||
sessionStorage: { getItem: vi.fn().mockReturnValue(null), setItem: vi.fn(), removeItem: vi.fn() },
|
||||
HTMLMediaElement: { prototype: { play: vi.fn().mockResolvedValue(undefined) } },
|
||||
addEventListener: vi.fn(),
|
||||
removeEventListener: vi.fn(),
|
||||
});
|
||||
vi.stubGlobal('navigator', { language: 'en-US', onLine: true });
|
||||
|
||||
const component = new PlayerShellComponent();
|
||||
component.ngOnInit();
|
||||
|
||||
expect(querySelectorAll).toHaveBeenCalledWith('audio,video');
|
||||
expect(audioElement.muted).toBe(true);
|
||||
expect(videoElement.muted).toBe(true);
|
||||
expect(pauseAudio).toHaveBeenCalledTimes(1);
|
||||
expect(pauseVideo).toHaveBeenCalledTimes(1);
|
||||
|
||||
component.ngOnDestroy();
|
||||
});
|
||||
|
||||
it('installs secondary-device audio guard while player shell is mounted', async () => {
|
||||
const originalPlay = vi.fn().mockRejectedValue(new Error('original play'));
|
||||
const mediaPrototype = { play: originalPlay };
|
||||
|
||||
vi.stubGlobal('window', {
|
||||
location: { hash: '', search: '' },
|
||||
history: { state: null, replaceState: vi.fn() },
|
||||
localStorage: { getItem: vi.fn().mockReturnValue('en'), setItem: vi.fn(), removeItem: vi.fn() },
|
||||
sessionStorage: { getItem: vi.fn().mockReturnValue(null), setItem: vi.fn(), removeItem: vi.fn() },
|
||||
HTMLMediaElement: { prototype: mediaPrototype },
|
||||
addEventListener: vi.fn(),
|
||||
removeEventListener: vi.fn(),
|
||||
});
|
||||
vi.stubGlobal('navigator', { language: 'en-US', onLine: true });
|
||||
|
||||
const component = new PlayerShellComponent();
|
||||
component.ngOnInit();
|
||||
|
||||
const pause = vi.fn();
|
||||
const audioElement = { muted: false, defaultMuted: false, volume: 1, pause };
|
||||
|
||||
await expect(mediaPrototype.play.call(audioElement)).resolves.toBeUndefined();
|
||||
expect(audioElement.muted).toBe(true);
|
||||
expect(audioElement.defaultMuted).toBe(true);
|
||||
expect(audioElement.volume).toBe(0);
|
||||
expect(pause).toHaveBeenCalledTimes(1);
|
||||
|
||||
component.ngOnDestroy();
|
||||
|
||||
await expect(mediaPrototype.play()).rejects.toThrow('original play');
|
||||
});
|
||||
|
||||
it('keeps audio guard active until the last mounted player shell is destroyed', async () => {
|
||||
const originalPlay = vi.fn().mockRejectedValue(new Error('original play'));
|
||||
const mediaPrototype = { play: originalPlay };
|
||||
|
||||
vi.stubGlobal('window', {
|
||||
location: { hash: '', search: '' },
|
||||
history: { state: null, replaceState: vi.fn() },
|
||||
localStorage: { getItem: vi.fn().mockReturnValue('en'), setItem: vi.fn(), removeItem: vi.fn() },
|
||||
sessionStorage: { getItem: vi.fn().mockReturnValue(null), setItem: vi.fn(), removeItem: vi.fn() },
|
||||
HTMLMediaElement: { prototype: mediaPrototype },
|
||||
addEventListener: vi.fn(),
|
||||
removeEventListener: vi.fn(),
|
||||
});
|
||||
vi.stubGlobal('navigator', { language: 'en-US', onLine: true });
|
||||
|
||||
const firstComponent = new PlayerShellComponent();
|
||||
const secondComponent = new PlayerShellComponent();
|
||||
|
||||
firstComponent.ngOnInit();
|
||||
secondComponent.ngOnInit();
|
||||
|
||||
await expect(mediaPrototype.play()).resolves.toBeUndefined();
|
||||
|
||||
firstComponent.ngOnDestroy();
|
||||
await expect(mediaPrototype.play()).resolves.toBeUndefined();
|
||||
|
||||
secondComponent.ngOnDestroy();
|
||||
await expect(mediaPrototype.play()).rejects.toThrow('original play');
|
||||
});
|
||||
|
||||
it('does not trigger original media play during player-shell init path', () => {
|
||||
const originalPlay = vi.fn().mockResolvedValue(undefined);
|
||||
const mediaPrototype = { play: originalPlay };
|
||||
|
||||
vi.stubGlobal('window', {
|
||||
location: { hash: '', search: '' },
|
||||
history: { state: null, replaceState: vi.fn() },
|
||||
localStorage: { getItem: vi.fn().mockReturnValue('en'), setItem: vi.fn(), removeItem: vi.fn() },
|
||||
sessionStorage: { getItem: vi.fn().mockReturnValue(null), setItem: vi.fn(), removeItem: vi.fn() },
|
||||
HTMLMediaElement: { prototype: mediaPrototype },
|
||||
addEventListener: vi.fn(),
|
||||
removeEventListener: vi.fn(),
|
||||
});
|
||||
vi.stubGlobal('navigator', { language: 'en-US', onLine: true });
|
||||
|
||||
const component = new PlayerShellComponent();
|
||||
component.ngOnInit();
|
||||
|
||||
expect(originalPlay).not.toHaveBeenCalled();
|
||||
|
||||
component.ngOnDestroy();
|
||||
});
|
||||
|
||||
it('keeps primary-device playback untouched when no-audio capability is disabled', async () => {
|
||||
const originalPlay = vi.fn().mockResolvedValue(undefined);
|
||||
const mediaPrototype = { play: originalPlay };
|
||||
|
||||
vi.stubGlobal('window', {
|
||||
location: { hash: '', search: '' },
|
||||
history: { state: null, replaceState: vi.fn() },
|
||||
localStorage: { getItem: vi.fn().mockReturnValue('en'), setItem: vi.fn(), removeItem: vi.fn() },
|
||||
sessionStorage: { getItem: vi.fn().mockReturnValue(null), setItem: vi.fn(), removeItem: vi.fn() },
|
||||
HTMLMediaElement: { prototype: mediaPrototype },
|
||||
addEventListener: vi.fn(),
|
||||
removeEventListener: vi.fn(),
|
||||
});
|
||||
vi.stubGlobal('navigator', { language: 'en-US', onLine: true });
|
||||
|
||||
const component = new PlayerShellComponent();
|
||||
(component as any).clientHasNoAudioOutput = false;
|
||||
|
||||
component.ngOnInit();
|
||||
|
||||
await expect(mediaPrototype.play()).resolves.toBeUndefined();
|
||||
expect(mediaPrototype.play).toBe(originalPlay);
|
||||
expect((mediaPrototype as any).__wppSecondaryDeviceAudioGuard__).toBeUndefined();
|
||||
|
||||
component.ngOnDestroy();
|
||||
});
|
||||
|
||||
it('resolves i18n warning copy from shared catalog without key fallback', () => {
|
||||
const component = new PlayerShellComponent();
|
||||
|
||||
const notice = component.copy('player.audio_policy_notice');
|
||||
const expected = lobbyCatalog.frontend.ui.player.audio_policy_notice[component.locale];
|
||||
|
||||
expect(notice).toBe(expected);
|
||||
expect(notice).not.toBe('player.audio_policy_notice');
|
||||
});
|
||||
|
||||
it('gates template warning notice on the no-audio-output capability flag', () => {
|
||||
const templateSource = String((PlayerShellComponent as any).ɵcmp?.template);
|
||||
|
||||
expect(templateSource).toContain('clientHasNoAudioOutput');
|
||||
|
||||
const component = new PlayerShellComponent();
|
||||
expect(component.copy('player.audio_policy_notice')).not.toBe('player.audio_policy_notice');
|
||||
expect(component.clientHasNoAudioOutput).toBe(true);
|
||||
|
||||
(component as any).clientHasNoAudioOutput = false;
|
||||
expect(component.clientHasNoAudioOutput).toBe(false);
|
||||
});
|
||||
|
||||
it('keeps phone client controls phase-specific and low-complexity', () => {
|
||||
const component = new PlayerShellComponent();
|
||||
|
||||
expect(component.showJoinControls).toBe(true);
|
||||
expect(component.showLieControls).toBe(false);
|
||||
expect(component.showGuessControls).toBe(false);
|
||||
expect(component.showFinalLeaderboard).toBe(false);
|
||||
|
||||
component.session = sessionDetailPayload('lie') as any;
|
||||
component.playerId = 9;
|
||||
component.sessionToken = 'tok';
|
||||
expect(component.showJoinControls).toBe(false);
|
||||
expect(component.showLieControls).toBe(true);
|
||||
expect(component.showGuessControls).toBe(false);
|
||||
|
||||
component.session = sessionDetailPayload('guess', { answers: ['A', 'B'] }) as any;
|
||||
expect(component.showLieControls).toBe(false);
|
||||
expect(component.showGuessControls).toBe(true);
|
||||
|
||||
component.session = sessionDetailPayload('finished', { players: [{ id: 1, nickname: 'Luna', score: 8 }] }) as any;
|
||||
expect(component.showGuessControls).toBe(false);
|
||||
expect(component.showFinalLeaderboard).toBe(true);
|
||||
});
|
||||
|
||||
});
|
||||
@@ -1,600 +0,0 @@
|
||||
import { CommonModule } from '@angular/common';
|
||||
import { Component, OnDestroy, OnInit } from '@angular/core';
|
||||
import { FormsModule } from '@angular/forms';
|
||||
|
||||
import { createApiClient } from '../../../../../src/api/client';
|
||||
import type { SessionDetailResponse } from '../../../../../src/api/types';
|
||||
import { createSessionContextStore } from '../../../../../src/spa/session-context-store';
|
||||
import { createVerticalSliceController } from '../../../../../src/spa/vertical-slice';
|
||||
import { clientHasNoAudioOutput, resolvePreferredLocale, subscribeToLocaleChanges, t } from '../../lobby-i18n';
|
||||
|
||||
type SessionDetail = SessionDetailResponse;
|
||||
|
||||
type ConnectionState = 'online' | 'reconnecting' | 'offline';
|
||||
type LoadingTransition = 'refresh' | 'join' | 'submit-lie' | 'submit-guess' | null;
|
||||
|
||||
type GuardableMediaElement = {
|
||||
muted?: boolean;
|
||||
defaultMuted?: boolean;
|
||||
volume?: number;
|
||||
pause?: () => void;
|
||||
};
|
||||
|
||||
type MediaPrototypeWithGuardState = {
|
||||
play?: (this: GuardableMediaElement) => Promise<void>;
|
||||
__wppSecondaryDeviceAudioGuard__?: {
|
||||
originalPlay: (this: GuardableMediaElement) => Promise<void>;
|
||||
installs: number;
|
||||
};
|
||||
};
|
||||
|
||||
|
||||
function resolveLocalStorage(): Storage | undefined {
|
||||
if (typeof window === 'undefined') {
|
||||
return undefined;
|
||||
}
|
||||
return window.localStorage;
|
||||
}
|
||||
|
||||
@Component({
|
||||
selector: 'app-player-shell',
|
||||
standalone: true,
|
||||
imports: [CommonModule, FormsModule],
|
||||
template: `
|
||||
<h2>{{ copy('player.title') }}</h2>
|
||||
<p *ngIf="clientHasNoAudioOutput" class="hint">{{ copy('player.audio_policy_notice') }}</p>
|
||||
|
||||
<div class="panel" [attr.data-client-has-no-audio-output]="clientHasNoAudioOutput">
|
||||
<label>{{ copy('common.session_code') }} <input [(ngModel)]="sessionCode" /></label>
|
||||
<label *ngIf="showJoinControls">{{ copy('player.nickname') }} <input [(ngModel)]="nickname" /></label>
|
||||
<button (click)="refreshSession()" [disabled]="loading">{{ copy('common.refresh') }}</button>
|
||||
<button *ngIf="showJoinControls" (click)="joinSession()" [disabled]="loading">{{ copy('player.join') }}</button>
|
||||
</div>
|
||||
|
||||
<p *ngIf="connectionState === 'reconnecting'" class="error">
|
||||
{{ copy('player.reconnecting_text') }}
|
||||
<button type="button" (click)="retryReconnect()" [disabled]="loading">{{ copy('player.retry_now') }}</button>
|
||||
<button type="button" (click)="returnToJoin()" [disabled]="loading">{{ copy('common.back_to_join') }}</button>
|
||||
</p>
|
||||
<p *ngIf="connectionState === 'offline'" class="error">
|
||||
{{ copy('player.offline_text') }}
|
||||
<button type="button" (click)="retryReconnect()" [disabled]="loading">{{ copy('player.retry_now') }}</button>
|
||||
<button type="button" (click)="returnToJoin()" [disabled]="loading">{{ copy('common.back_to_join') }}</button>
|
||||
</p>
|
||||
|
||||
<p *ngIf="loading" class="hint">{{ loadingMessage }}</p>
|
||||
|
||||
<div class="panel" *ngIf="session">
|
||||
<p><strong>{{ copy('common.status') }}:</strong> {{ session.session.status }}</p>
|
||||
<p *ngIf="session.round_question"><strong>{{ copy('common.prompt') }}:</strong> {{ session.round_question.prompt }}</p>
|
||||
|
||||
<ng-container *ngIf="showLieControls">
|
||||
<label>{{ copy('player.lie_label') }} <input [(ngModel)]="lieText" [disabled]="loading" /></label>
|
||||
<button (click)="submitLie()" [disabled]="loading">{{ copy('player.submit_lie') }}</button>
|
||||
<button *ngIf="submitError?.kind === 'lie'" (click)="submitLie()" [disabled]="loading">{{ copy('player.retry_lie_submit') }}</button>
|
||||
</ng-container>
|
||||
|
||||
<ng-container *ngIf="showGuessControls">
|
||||
<div class="answers" *ngIf="session.round_question?.answers?.length">
|
||||
<button
|
||||
type="button"
|
||||
*ngFor="let answer of session.round_question?.answers"
|
||||
(click)="selectedGuess = answer.text"
|
||||
[class.active]="selectedGuess === answer.text"
|
||||
[disabled]="loading"
|
||||
>
|
||||
{{ answer.text }}
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<button (click)="submitGuess()" [disabled]="loading || !selectedGuess">{{ copy('player.submit_guess') }}</button>
|
||||
<button *ngIf="submitError?.kind === 'guess'" (click)="submitGuess()" [disabled]="loading">{{ copy('player.retry_guess_submit') }}</button>
|
||||
</ng-container>
|
||||
|
||||
<div class="panel" *ngIf="session.reveal && (session.session.status === 'reveal' || session.session.status === 'scoreboard')">
|
||||
<h3>Reveal</h3>
|
||||
<p><strong>Korrekt svar:</strong> {{ session.reveal.correct_answer }}</p>
|
||||
<p><strong>Spørgsmål:</strong> {{ session.reveal.prompt }}</p>
|
||||
<div *ngIf="session.reveal.lies.length">
|
||||
<strong>Løgne</strong>
|
||||
<ul>
|
||||
<li *ngFor="let lie of session.reveal.lies">{{ lie.nickname }} løj: {{ lie.text }}</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div *ngIf="session.reveal.guesses.length">
|
||||
<strong>Gæt</strong>
|
||||
<ul>
|
||||
<li *ngFor="let guess of session.reveal.guesses">
|
||||
{{ guess.nickname }} valgte {{ guess.selected_text }}
|
||||
<span *ngIf="guess.is_correct">· korrekt</span>
|
||||
<span *ngIf="!guess.is_correct && guess.fooled_player_nickname">· narret af {{ guess.fooled_player_nickname }}</span>
|
||||
<span *ngIf="!guess.is_correct && !guess.fooled_player_nickname">· forkert</span>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div *ngIf="showFinalLeaderboard && finalLeaderboard.length">
|
||||
<h3>{{ copy('player.final_leaderboard') }}</h3>
|
||||
<ol>
|
||||
<li *ngFor="let entry of finalLeaderboard">{{ entry.nickname }}: {{ entry.score }}</li>
|
||||
</ol>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<p *ngIf="error" class="error">{{ error }}</p>
|
||||
<p *ngIf="submitError" class="error">{{ submitError.message }}</p>
|
||||
|
||||
<div class="panel" *ngIf="error || submitError">
|
||||
<button type="button" (click)="retryReconnect()" [disabled]="loading">{{ copy('common.retry') }}</button>
|
||||
<button type="button" (click)="returnToJoin()" [disabled]="loading">{{ copy('common.back_to_join') }}</button>
|
||||
</div>
|
||||
`,
|
||||
})
|
||||
export class PlayerShellComponent implements OnInit, OnDestroy {
|
||||
locale = resolvePreferredLocale();
|
||||
readonly clientHasNoAudioOutput = clientHasNoAudioOutput;
|
||||
|
||||
sessionCode = '';
|
||||
nickname = '';
|
||||
playerId = 0;
|
||||
sessionToken = '';
|
||||
lieText = '';
|
||||
selectedGuess = '';
|
||||
loading = false;
|
||||
error = '';
|
||||
submitError: { kind: 'lie' | 'guess'; message: string } | null = null;
|
||||
session: SessionDetail | null = null;
|
||||
finalLeaderboard: Array<{ id: number; nickname: string; score: number }> = [];
|
||||
connectionState: ConnectionState = 'online';
|
||||
loadingTransition: LoadingTransition = null;
|
||||
|
||||
private readonly sessionContextStore = createSessionContextStore(resolveLocalStorage());
|
||||
private readonly controller = createVerticalSliceController(createApiClient(), this.sessionContextStore);
|
||||
private reconnectTimer: ReturnType<typeof setTimeout> | null = null;
|
||||
private stateSyncTimer: ReturnType<typeof setTimeout> | null = null;
|
||||
private unsubscribeLocale: (() => void) | null = null;
|
||||
private restoreAudioGuard: (() => void) | null = null;
|
||||
|
||||
constructor() {
|
||||
if (typeof navigator !== 'undefined' && !navigator.onLine) {
|
||||
this.connectionState = 'offline';
|
||||
}
|
||||
|
||||
if (typeof window !== 'undefined') {
|
||||
window.addEventListener('online', this.handleOnline);
|
||||
window.addEventListener('offline', this.handleOffline);
|
||||
}
|
||||
}
|
||||
|
||||
ngOnInit(): void {
|
||||
this.unsubscribeLocale = subscribeToLocaleChanges((locale) => {
|
||||
this.locale = locale;
|
||||
});
|
||||
this.installSecondaryDeviceAudioGuard();
|
||||
|
||||
const hashRoute = window.location.hash.replace(/^#\/?/, '');
|
||||
const match = hashRoute.match(/^player(?:\/[^/]+)?(?:\/([^/?#]+))?/i);
|
||||
const codeFromRoute = match?.[1] ?? '';
|
||||
|
||||
const persistedContext = this.sessionContextStore.get();
|
||||
if (persistedContext) {
|
||||
this.playerId = persistedContext.playerId;
|
||||
this.sessionToken = persistedContext.token;
|
||||
}
|
||||
|
||||
const candidate = codeFromRoute || persistedContext?.sessionCode || '';
|
||||
if (!candidate) {
|
||||
return;
|
||||
}
|
||||
|
||||
this.sessionCode = this.normalizeCode(candidate);
|
||||
void this.refreshSession();
|
||||
}
|
||||
|
||||
ngOnDestroy(): void {
|
||||
if (typeof window !== 'undefined') {
|
||||
window.removeEventListener('online', this.handleOnline);
|
||||
window.removeEventListener('offline', this.handleOffline);
|
||||
}
|
||||
this.clearReconnectTimer();
|
||||
this.clearStateSyncTimer();
|
||||
this.unsubscribeLocale?.();
|
||||
this.unsubscribeLocale = null;
|
||||
this.restoreAudioGuard?.();
|
||||
this.restoreAudioGuard = null;
|
||||
}
|
||||
|
||||
private readonly handleOnline = (): void => {
|
||||
this.connectionState = 'reconnecting';
|
||||
void this.retryReconnect();
|
||||
};
|
||||
|
||||
private readonly handleOffline = (): void => {
|
||||
this.connectionState = 'offline';
|
||||
this.clearReconnectTimer();
|
||||
this.clearStateSyncTimer();
|
||||
};
|
||||
|
||||
private clearReconnectTimer(): void {
|
||||
if (this.reconnectTimer) {
|
||||
clearTimeout(this.reconnectTimer);
|
||||
this.reconnectTimer = null;
|
||||
}
|
||||
}
|
||||
|
||||
private clearStateSyncTimer(): void {
|
||||
if (this.stateSyncTimer) {
|
||||
clearTimeout(this.stateSyncTimer);
|
||||
this.stateSyncTimer = null;
|
||||
}
|
||||
}
|
||||
|
||||
private installSecondaryDeviceAudioGuard(): void {
|
||||
if (!this.clientHasNoAudioOutput || typeof window === 'undefined') {
|
||||
return;
|
||||
}
|
||||
|
||||
this.silenceExistingMediaElements();
|
||||
|
||||
const mediaPrototype = (window as Window & { HTMLMediaElement?: { prototype?: MediaPrototypeWithGuardState } }).HTMLMediaElement
|
||||
?.prototype;
|
||||
|
||||
if (!mediaPrototype || typeof mediaPrototype.play !== 'function') {
|
||||
return;
|
||||
}
|
||||
|
||||
const guardState = mediaPrototype.__wppSecondaryDeviceAudioGuard__;
|
||||
if (guardState) {
|
||||
guardState.installs += 1;
|
||||
} else {
|
||||
const originalPlay = mediaPrototype.play;
|
||||
mediaPrototype.play = function mediaGuardedPlay(this: GuardableMediaElement): Promise<void> {
|
||||
this.muted = true;
|
||||
this.defaultMuted = true;
|
||||
if (typeof this.volume === 'number') {
|
||||
this.volume = 0;
|
||||
}
|
||||
this.pause?.();
|
||||
return Promise.resolve();
|
||||
};
|
||||
mediaPrototype.__wppSecondaryDeviceAudioGuard__ = {
|
||||
originalPlay,
|
||||
installs: 1,
|
||||
};
|
||||
}
|
||||
|
||||
this.restoreAudioGuard = () => {
|
||||
const currentState = mediaPrototype.__wppSecondaryDeviceAudioGuard__;
|
||||
if (!currentState) {
|
||||
return;
|
||||
}
|
||||
|
||||
currentState.installs -= 1;
|
||||
if (currentState.installs <= 0) {
|
||||
mediaPrototype.play = currentState.originalPlay;
|
||||
delete mediaPrototype.__wppSecondaryDeviceAudioGuard__;
|
||||
}
|
||||
};
|
||||
}
|
||||
|
||||
|
||||
private silenceExistingMediaElements(): void {
|
||||
if (typeof document === 'undefined' || typeof document.querySelectorAll !== 'function') {
|
||||
return;
|
||||
}
|
||||
|
||||
const activeElements = document.querySelectorAll('audio,video') as
|
||||
| NodeListOf<HTMLMediaElement>
|
||||
| GuardableMediaElement[]
|
||||
| undefined;
|
||||
|
||||
if (!activeElements || typeof (activeElements as { forEach?: unknown }).forEach !== 'function') {
|
||||
return;
|
||||
}
|
||||
|
||||
activeElements.forEach((element) => {
|
||||
element.muted = true;
|
||||
element.defaultMuted = true;
|
||||
if (typeof element.volume === 'number') {
|
||||
element.volume = 0;
|
||||
}
|
||||
element.pause?.();
|
||||
});
|
||||
}
|
||||
|
||||
private scheduleStateSync(): void {
|
||||
this.clearStateSyncTimer();
|
||||
|
||||
if (!this.sessionCode.trim() || this.connectionState !== 'online' || !this.session) {
|
||||
return;
|
||||
}
|
||||
|
||||
if (this.session.session.status === 'finished') {
|
||||
return;
|
||||
}
|
||||
|
||||
this.stateSyncTimer = setTimeout(() => {
|
||||
this.stateSyncTimer = null;
|
||||
if (this.loading || this.connectionState !== 'online') {
|
||||
this.scheduleStateSync();
|
||||
return;
|
||||
}
|
||||
void this.refreshSession();
|
||||
}, 3000);
|
||||
}
|
||||
|
||||
get showJoinControls(): boolean {
|
||||
if (!this.session) {
|
||||
return true;
|
||||
}
|
||||
return Boolean(this.session?.phase_view_model?.player?.can_join && !this.playerId && !this.sessionToken);
|
||||
}
|
||||
|
||||
get showLieControls(): boolean {
|
||||
return Boolean(this.session?.phase_view_model?.player?.can_submit_lie);
|
||||
}
|
||||
|
||||
get showGuessControls(): boolean {
|
||||
return Boolean(this.session?.phase_view_model?.player?.can_submit_guess);
|
||||
}
|
||||
|
||||
get showFinalLeaderboard(): boolean {
|
||||
return Boolean(this.session?.phase_view_model?.player?.can_view_final_result);
|
||||
}
|
||||
|
||||
get loadingMessage(): string {
|
||||
switch (this.loadingTransition) {
|
||||
case 'join':
|
||||
return this.copy('player.loading_join');
|
||||
case 'submit-lie':
|
||||
return this.copy('player.loading_submit_lie');
|
||||
case 'submit-guess':
|
||||
return this.copy('player.loading_submit_guess');
|
||||
case 'refresh':
|
||||
default:
|
||||
return this.copy('player.loading_refresh');
|
||||
}
|
||||
}
|
||||
|
||||
copy(key: string): string {
|
||||
return t(key, this.locale);
|
||||
}
|
||||
|
||||
private normalizeCode(value: string): string {
|
||||
return value.trim().toUpperCase();
|
||||
}
|
||||
|
||||
private toMessage(error: unknown): string {
|
||||
if (error instanceof Error && error.message) {
|
||||
return error.message;
|
||||
}
|
||||
return this.copy('common.unknown_error');
|
||||
}
|
||||
|
||||
private markOnline(): void {
|
||||
this.connectionState = 'online';
|
||||
this.clearReconnectTimer();
|
||||
this.scheduleStateSync();
|
||||
}
|
||||
|
||||
private markConnectionIssue(error: unknown): void {
|
||||
this.clearStateSyncTimer();
|
||||
|
||||
if (typeof navigator !== 'undefined' && !navigator.onLine) {
|
||||
this.connectionState = 'offline';
|
||||
return;
|
||||
}
|
||||
|
||||
const message = this.toMessage(error).toLowerCase();
|
||||
if (
|
||||
message.includes('fetch') ||
|
||||
message.includes('network') ||
|
||||
message.includes('failed to') ||
|
||||
message.includes('could not load lobby status') ||
|
||||
message.includes('session refresh failed')
|
||||
) {
|
||||
this.connectionState = 'reconnecting';
|
||||
this.scheduleReconnect();
|
||||
}
|
||||
}
|
||||
|
||||
private scheduleReconnect(): void {
|
||||
if (this.reconnectTimer || !this.sessionCode.trim()) {
|
||||
return;
|
||||
}
|
||||
|
||||
this.reconnectTimer = setTimeout(() => {
|
||||
this.reconnectTimer = null;
|
||||
void this.retryReconnect();
|
||||
}, 2000);
|
||||
}
|
||||
|
||||
async retryReconnect(): Promise<void> {
|
||||
if (!this.sessionCode.trim() || this.loading) {
|
||||
return;
|
||||
}
|
||||
|
||||
await this.refreshSession();
|
||||
}
|
||||
|
||||
returnToJoin(): void {
|
||||
this.loadingTransition = null;
|
||||
this.clearReconnectTimer();
|
||||
this.clearStateSyncTimer();
|
||||
this.connectionState = typeof navigator !== 'undefined' && !navigator.onLine ? 'offline' : 'online';
|
||||
this.session = null;
|
||||
this.finalLeaderboard = [];
|
||||
this.selectedGuess = '';
|
||||
this.lieText = '';
|
||||
this.submitError = null;
|
||||
this.error = '';
|
||||
this.playerId = 0;
|
||||
this.sessionToken = '';
|
||||
this.sessionContextStore.clear();
|
||||
}
|
||||
|
||||
private syncFinalLeaderboard(): void {
|
||||
if (!this.session || this.session.session.status !== 'finished') {
|
||||
this.finalLeaderboard = [];
|
||||
return;
|
||||
}
|
||||
|
||||
this.finalLeaderboard = [...this.session.players].sort((a, b) => {
|
||||
if (b.score !== a.score) {
|
||||
return b.score - a.score;
|
||||
}
|
||||
return a.nickname.localeCompare(b.nickname);
|
||||
});
|
||||
}
|
||||
|
||||
private syncRouteFromSession(): void {
|
||||
if (!this.session) {
|
||||
return;
|
||||
}
|
||||
|
||||
const phase = this.session.session.status || 'lobby';
|
||||
const code = this.normalizeCode(this.session.session.code || this.sessionCode);
|
||||
if (!code) {
|
||||
return;
|
||||
}
|
||||
|
||||
const targetPath = `#/player/${encodeURIComponent(phase)}/${encodeURIComponent(code)}`;
|
||||
if (typeof window === 'undefined' || window.location.hash === targetPath) {
|
||||
return;
|
||||
}
|
||||
|
||||
window.history.replaceState(window.history.state, '', targetPath);
|
||||
}
|
||||
|
||||
private async request<T>(path: string, method: 'GET' | 'POST', payload?: unknown): Promise<T> {
|
||||
const response = await fetch(path, {
|
||||
method,
|
||||
headers: {
|
||||
Accept: 'application/json',
|
||||
...(payload === undefined ? {} : { 'Content-Type': 'application/json' }),
|
||||
},
|
||||
...(payload === undefined ? {} : { body: JSON.stringify(payload) }),
|
||||
credentials: 'same-origin',
|
||||
});
|
||||
|
||||
const body = await response.json().catch(() => ({}));
|
||||
if (!response.ok) {
|
||||
throw new Error((body as { error?: string }).error ?? `HTTP ${response.status}`);
|
||||
}
|
||||
|
||||
return body as T;
|
||||
}
|
||||
|
||||
async refreshSession(): Promise<void> {
|
||||
this.loading = true;
|
||||
this.loadingTransition = 'refresh';
|
||||
this.error = '';
|
||||
try {
|
||||
const state = await this.controller.hydrateLobby(this.sessionCode);
|
||||
if (!state.session || state.errorMessage) {
|
||||
throw new Error(state.errorMessage ?? this.copy('common.unknown_error'));
|
||||
}
|
||||
this.session = state.session as SessionDetail;
|
||||
this.sessionCode = this.session.session.code;
|
||||
if (this.session.session.status !== 'guess') {
|
||||
this.selectedGuess = '';
|
||||
}
|
||||
this.syncFinalLeaderboard();
|
||||
this.syncRouteFromSession();
|
||||
this.markOnline();
|
||||
} catch (error) {
|
||||
this.error = `${this.copy('player.session_refresh_failed')}: ${this.toMessage(error)}`;
|
||||
this.markConnectionIssue(error);
|
||||
} finally {
|
||||
this.loading = false;
|
||||
this.loadingTransition = null;
|
||||
}
|
||||
}
|
||||
|
||||
async joinSession(): Promise<void> {
|
||||
this.loading = true;
|
||||
this.loadingTransition = 'join';
|
||||
this.error = '';
|
||||
try {
|
||||
const state = await this.controller.joinLobby(this.sessionCode, this.nickname);
|
||||
if (!state.session || state.errorMessage) {
|
||||
throw new Error(state.errorMessage ?? this.copy('common.unknown_error'));
|
||||
}
|
||||
this.session = state.session as SessionDetail;
|
||||
this.sessionCode = this.session.session.code;
|
||||
|
||||
const sessionContext = this.sessionContextStore.get();
|
||||
this.playerId = sessionContext?.playerId ?? 0;
|
||||
this.sessionToken = sessionContext?.token ?? '';
|
||||
if (this.session.session.status !== 'guess') {
|
||||
this.selectedGuess = '';
|
||||
}
|
||||
this.syncFinalLeaderboard();
|
||||
this.syncRouteFromSession();
|
||||
this.markOnline();
|
||||
} catch (error) {
|
||||
this.error = `${this.copy('player.join_failed')}: ${this.toMessage(error)}`;
|
||||
this.markConnectionIssue(error);
|
||||
} finally {
|
||||
this.loading = false;
|
||||
this.loadingTransition = null;
|
||||
}
|
||||
}
|
||||
|
||||
async submitLie(): Promise<void> {
|
||||
if (!this.session?.round_question?.id) {
|
||||
return;
|
||||
}
|
||||
this.loading = true;
|
||||
this.loadingTransition = 'submit-lie';
|
||||
this.submitError = null;
|
||||
try {
|
||||
await this.request(
|
||||
`/lobby/sessions/${encodeURIComponent(this.normalizeCode(this.sessionCode))}/questions/${this.session.round_question.id}/lies/submit`,
|
||||
'POST',
|
||||
{
|
||||
player_id: this.playerId,
|
||||
session_token: this.sessionToken,
|
||||
text: this.lieText,
|
||||
}
|
||||
);
|
||||
await this.refreshSession();
|
||||
this.markOnline();
|
||||
} catch (error) {
|
||||
this.submitError = { kind: 'lie', message: `${this.copy('player.lie_submit_failed')}: ${this.toMessage(error)}` };
|
||||
this.markConnectionIssue(error);
|
||||
} finally {
|
||||
this.loading = false;
|
||||
this.loadingTransition = null;
|
||||
}
|
||||
}
|
||||
|
||||
async submitGuess(): Promise<void> {
|
||||
if (!this.session?.round_question?.id || !this.selectedGuess) {
|
||||
return;
|
||||
}
|
||||
this.loading = true;
|
||||
this.loadingTransition = 'submit-guess';
|
||||
this.submitError = null;
|
||||
try {
|
||||
await this.request(
|
||||
`/lobby/sessions/${encodeURIComponent(this.normalizeCode(this.sessionCode))}/questions/${this.session.round_question.id}/guesses/submit`,
|
||||
'POST',
|
||||
{
|
||||
player_id: this.playerId,
|
||||
session_token: this.sessionToken,
|
||||
selected_text: this.selectedGuess,
|
||||
}
|
||||
);
|
||||
await this.refreshSession();
|
||||
this.markOnline();
|
||||
} catch (error) {
|
||||
this.submitError = { kind: 'guess', message: `${this.copy('player.guess_submit_failed')}: ${this.toMessage(error)}` };
|
||||
this.markConnectionIssue(error);
|
||||
} finally {
|
||||
this.loading = false;
|
||||
this.loadingTransition = null;
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -1,96 +0,0 @@
|
||||
import { describe, expect, it } from 'vitest';
|
||||
|
||||
import { deriveGameplayPhase, transitionGameplayPhase } from '../../../src/spa/gameplay-phase-machine';
|
||||
|
||||
describe('gameplay phase machine sync guards', () => {
|
||||
it('keeps explicit scoreboard status as scoreboard phase', () => {
|
||||
const phase = deriveGameplayPhase({
|
||||
session: {
|
||||
code: 'ABCD12',
|
||||
status: 'scoreboard',
|
||||
host_id: 1,
|
||||
current_round: 1,
|
||||
players_count: 2,
|
||||
},
|
||||
round_question: null,
|
||||
players: [],
|
||||
phase_view_model: {
|
||||
status: 'scoreboard',
|
||||
round_number: 1,
|
||||
players_count: 2,
|
||||
constraints: {
|
||||
min_players_to_start: 2,
|
||||
max_players_mvp: 8,
|
||||
min_players_reached: true,
|
||||
max_players_allowed: true,
|
||||
},
|
||||
host: {
|
||||
can_start_round: false,
|
||||
can_show_question: false,
|
||||
can_mix_answers: false,
|
||||
can_calculate_scores: false,
|
||||
can_reveal_scoreboard: false,
|
||||
can_start_next_round: true,
|
||||
can_finish_game: true,
|
||||
},
|
||||
player: {
|
||||
can_join: false,
|
||||
can_submit_lie: false,
|
||||
can_submit_guess: false,
|
||||
can_view_final_result: false,
|
||||
},
|
||||
},
|
||||
});
|
||||
|
||||
expect(phase).toBe('scoreboard');
|
||||
});
|
||||
|
||||
it('maps finished status to scoreboard phase fallback', () => {
|
||||
const phase = deriveGameplayPhase({
|
||||
session: {
|
||||
code: 'ABCD12',
|
||||
status: 'finished',
|
||||
host_id: 1,
|
||||
current_round: 1,
|
||||
players_count: 2,
|
||||
},
|
||||
round_question: null,
|
||||
players: [],
|
||||
phase_view_model: {
|
||||
status: 'finished',
|
||||
round_number: 1,
|
||||
players_count: 2,
|
||||
constraints: {
|
||||
min_players_to_start: 2,
|
||||
max_players_mvp: 8,
|
||||
min_players_reached: true,
|
||||
max_players_allowed: true,
|
||||
},
|
||||
host: {
|
||||
can_start_round: false,
|
||||
can_show_question: false,
|
||||
can_mix_answers: false,
|
||||
can_calculate_scores: false,
|
||||
can_reveal_scoreboard: false,
|
||||
can_start_next_round: false,
|
||||
can_finish_game: false,
|
||||
},
|
||||
player: {
|
||||
can_join: false,
|
||||
can_submit_lie: false,
|
||||
can_submit_guess: false,
|
||||
can_view_final_result: true,
|
||||
},
|
||||
},
|
||||
});
|
||||
|
||||
expect(phase).toBe('scoreboard');
|
||||
});
|
||||
|
||||
it('transitions reveal -> scoreboard on SCOREBOARD_READY', () => {
|
||||
expect(transitionGameplayPhase('reveal', 'SCOREBOARD_READY')).toEqual({
|
||||
phase: 'scoreboard',
|
||||
changed: true,
|
||||
});
|
||||
});
|
||||
});
|
||||
@@ -1,87 +0,0 @@
|
||||
import { afterEach, describe, expect, it, vi } from 'vitest';
|
||||
|
||||
import { HostShellComponent } from './features/host/host-shell.component';
|
||||
import { PlayerShellComponent } from './features/player/player-shell.component';
|
||||
import { setPreferredLocale } from './lobby-i18n';
|
||||
|
||||
function stubShellGlobals(initialLocale: string) {
|
||||
vi.stubGlobal('window', {
|
||||
location: { hash: '', search: '' },
|
||||
history: { state: null, replaceState: vi.fn() },
|
||||
localStorage: { getItem: vi.fn().mockReturnValue(initialLocale), setItem: vi.fn(), removeItem: vi.fn() },
|
||||
sessionStorage: { getItem: vi.fn().mockReturnValue(null), setItem: vi.fn(), removeItem: vi.fn() },
|
||||
addEventListener: vi.fn(),
|
||||
removeEventListener: vi.fn(),
|
||||
});
|
||||
vi.stubGlobal('navigator', { language: `${initialLocale}-US`, onLine: true });
|
||||
}
|
||||
|
||||
describe('i18n MVP flow smoke (host/player + audio policy)', () => {
|
||||
afterEach(() => {
|
||||
vi.restoreAllMocks();
|
||||
vi.unstubAllGlobals();
|
||||
});
|
||||
|
||||
it.each([
|
||||
{
|
||||
locale: 'en',
|
||||
hostRefresh: 'Refresh',
|
||||
hostStartRound: 'Start round',
|
||||
playerSubmitGuess: 'Submit guess',
|
||||
},
|
||||
{
|
||||
locale: 'da',
|
||||
hostRefresh: 'Opdatér',
|
||||
hostStartRound: 'Start runde',
|
||||
playerSubmitGuess: 'Send gæt',
|
||||
},
|
||||
])('resolves one host/player locale run for $locale', ({ locale, hostRefresh, hostStartRound, playerSubmitGuess }) => {
|
||||
stubShellGlobals(locale);
|
||||
|
||||
const host = new HostShellComponent();
|
||||
const player = new PlayerShellComponent();
|
||||
host.ngOnInit();
|
||||
player.ngOnInit();
|
||||
setPreferredLocale(locale);
|
||||
|
||||
expect(host.copy('common.refresh')).toBe(hostRefresh);
|
||||
expect(host.copy('game.host.start_round')).toBe(hostStartRound);
|
||||
expect(player.copy('game.player.submit_guess')).toBe(playerSubmitGuess);
|
||||
|
||||
player.ngOnDestroy();
|
||||
host.ngOnDestroy();
|
||||
});
|
||||
|
||||
it('keeps audio routing primary-only by guarding player playback without muting the host path', async () => {
|
||||
const originalPlay = vi.fn().mockRejectedValue(new Error('primary host playback'));
|
||||
const mediaPrototype = { play: originalPlay };
|
||||
|
||||
vi.stubGlobal('window', {
|
||||
location: { hash: '', search: '' },
|
||||
history: { state: null, replaceState: vi.fn() },
|
||||
localStorage: { getItem: vi.fn().mockReturnValue('en'), setItem: vi.fn(), removeItem: vi.fn() },
|
||||
sessionStorage: { getItem: vi.fn().mockReturnValue(null), setItem: vi.fn(), removeItem: vi.fn() },
|
||||
addEventListener: vi.fn(),
|
||||
removeEventListener: vi.fn(),
|
||||
HTMLMediaElement: { prototype: mediaPrototype },
|
||||
});
|
||||
vi.stubGlobal('navigator', { language: 'en-US', onLine: true });
|
||||
vi.stubGlobal('document', { querySelectorAll: vi.fn().mockReturnValue([]) });
|
||||
|
||||
const host = new HostShellComponent();
|
||||
host.ngOnInit();
|
||||
|
||||
await expect(mediaPrototype.play()).rejects.toThrow('primary host playback');
|
||||
|
||||
const player = new PlayerShellComponent();
|
||||
player.ngOnInit();
|
||||
|
||||
await expect(mediaPrototype.play()).resolves.toBeUndefined();
|
||||
|
||||
player.ngOnDestroy();
|
||||
|
||||
await expect(mediaPrototype.play()).rejects.toThrow('primary host playback');
|
||||
|
||||
host.ngOnDestroy();
|
||||
});
|
||||
});
|
||||
@@ -1,137 +0,0 @@
|
||||
import { afterEach, describe, expect, it, vi } from 'vitest';
|
||||
|
||||
type StorageLike = {
|
||||
getItem: (key: string) => string | null;
|
||||
setItem: (key: string, value: string) => void;
|
||||
};
|
||||
|
||||
function storageMock(initial: Record<string, string> = {}): StorageLike {
|
||||
const data = new Map<string, string>(Object.entries(initial));
|
||||
return {
|
||||
getItem: vi.fn((key: string) => data.get(key) ?? null),
|
||||
setItem: vi.fn((key: string, value: string) => {
|
||||
data.set(key, value);
|
||||
}),
|
||||
};
|
||||
}
|
||||
|
||||
describe('lobby i18n locale propagation', () => {
|
||||
afterEach(() => {
|
||||
vi.restoreAllMocks();
|
||||
vi.unstubAllGlobals();
|
||||
vi.resetModules();
|
||||
});
|
||||
|
||||
it('notifies subscribers immediately and on locale changes', async () => {
|
||||
const localStorage = storageMock({ 'wpp.locale': 'en' });
|
||||
vi.stubGlobal('window', {
|
||||
location: { search: '' },
|
||||
localStorage,
|
||||
});
|
||||
vi.stubGlobal('navigator', { language: 'en-US' });
|
||||
|
||||
const i18n = await import('./lobby-i18n');
|
||||
|
||||
const updates: string[] = [];
|
||||
const unsubscribe = i18n.subscribeToLocaleChanges((locale) => updates.push(locale));
|
||||
|
||||
expect(updates).toEqual(['en']);
|
||||
|
||||
i18n.setPreferredLocale('da');
|
||||
expect(updates).toEqual(['en', 'da']);
|
||||
|
||||
unsubscribe();
|
||||
i18n.setPreferredLocale('en');
|
||||
expect(updates).toEqual(['en', 'da']);
|
||||
});
|
||||
|
||||
it('prefers backend-provided shell locale over browser defaults', async () => {
|
||||
vi.stubGlobal('window', {
|
||||
location: { search: '' },
|
||||
localStorage: storageMock(),
|
||||
});
|
||||
vi.stubGlobal('document', {
|
||||
body: { dataset: { wppLocale: 'da' } },
|
||||
querySelector: vi.fn(() => null),
|
||||
});
|
||||
vi.stubGlobal('navigator', { language: 'en-US' });
|
||||
|
||||
const i18n = await import('./lobby-i18n');
|
||||
|
||||
expect(i18n.resolvePreferredLocale()).toBe('da');
|
||||
});
|
||||
|
||||
it('falls back to default en translation when da key is intentionally missing', async () => {
|
||||
vi.stubGlobal('window', {
|
||||
location: { search: '' },
|
||||
localStorage: storageMock({ 'wpp.locale': 'da' }),
|
||||
});
|
||||
vi.stubGlobal('navigator', { language: 'da-DK' });
|
||||
|
||||
const i18n = await import('./lobby-i18n');
|
||||
const catalogModule = await import('../../../../shared/i18n/lobby.json');
|
||||
const catalog = catalogModule.default as {
|
||||
frontend: {
|
||||
ui: {
|
||||
common: {
|
||||
refresh: {
|
||||
en?: string;
|
||||
da?: string;
|
||||
};
|
||||
};
|
||||
};
|
||||
};
|
||||
};
|
||||
|
||||
const originalDa = catalog.frontend.ui.common.refresh.da;
|
||||
catalog.frontend.ui.common.refresh.da = undefined;
|
||||
|
||||
try {
|
||||
expect(i18n.t('common.refresh', 'da')).toBe(catalog.frontend.ui.common.refresh.en);
|
||||
} finally {
|
||||
catalog.frontend.ui.common.refresh.da = originalDa;
|
||||
}
|
||||
});
|
||||
|
||||
it('resolves baseline shell/game keys from shared namespaces', async () => {
|
||||
vi.stubGlobal('window', {
|
||||
location: { search: '' },
|
||||
localStorage: storageMock({ 'wpp.locale': 'da' }),
|
||||
});
|
||||
vi.stubGlobal('navigator', { language: 'da-DK' });
|
||||
|
||||
const i18n = await import('./lobby-i18n');
|
||||
|
||||
const baselineKeys = [
|
||||
'lobby.shell.title',
|
||||
'lobby.shell.host_nav',
|
||||
'lobby.shell.player_nav',
|
||||
'lobby.shell.language_label',
|
||||
'common.refresh',
|
||||
'common.session_code',
|
||||
'game.host.title',
|
||||
'game.host.start_round',
|
||||
'game.player.title',
|
||||
'game.player.submit_guess',
|
||||
] as const;
|
||||
|
||||
for (const key of baselineKeys) {
|
||||
const value = i18n.t(key, 'da');
|
||||
expect(value).toBeTypeOf('string');
|
||||
expect(value.length).toBeGreaterThan(0);
|
||||
expect(value).not.toBe(key);
|
||||
}
|
||||
});
|
||||
|
||||
it('exposes primary-only audio routing policy to clients', async () => {
|
||||
vi.stubGlobal('window', {
|
||||
location: { search: '' },
|
||||
localStorage: storageMock({ 'wpp.locale': 'en' }),
|
||||
});
|
||||
vi.stubGlobal('navigator', { language: 'en-US' });
|
||||
|
||||
const i18n = await import('./lobby-i18n');
|
||||
|
||||
expect(i18n.clientHasNoAudioOutput).toBe(true);
|
||||
});
|
||||
});
|
||||
@@ -1,74 +0,0 @@
|
||||
import {
|
||||
DEFAULT_LOCALE,
|
||||
LOBBY_I18N_CATALOG,
|
||||
normalizeLocale,
|
||||
type SupportedLocale,
|
||||
translateCatalogPath,
|
||||
} from '../../../shared/i18n/lobby-loader';
|
||||
|
||||
let activeLocale: SupportedLocale | null = null;
|
||||
const localeSubscribers = new Set<(locale: SupportedLocale) => void>();
|
||||
|
||||
export { normalizeLocale };
|
||||
|
||||
export function resolvePreferredLocale(): SupportedLocale {
|
||||
if (activeLocale) {
|
||||
return activeLocale;
|
||||
}
|
||||
|
||||
if (typeof window === 'undefined') {
|
||||
activeLocale = DEFAULT_LOCALE;
|
||||
return activeLocale;
|
||||
}
|
||||
|
||||
const rootLocale =
|
||||
typeof document !== 'undefined' ? document.querySelector<HTMLElement>('app-root')?.dataset?.['wppLocale'] : null;
|
||||
const shellLocale = typeof document !== 'undefined' ? document.body?.dataset?.['wppLocale'] : null;
|
||||
const queryLocale = new URLSearchParams(window.location?.search ?? '').get('lang');
|
||||
const storedLocale = window.localStorage?.getItem?.('wpp.locale');
|
||||
const browserLocale = typeof navigator !== 'undefined' ? navigator.language : '';
|
||||
|
||||
activeLocale = normalizeLocale(rootLocale || shellLocale || queryLocale || storedLocale || browserLocale || DEFAULT_LOCALE);
|
||||
return activeLocale;
|
||||
}
|
||||
|
||||
export function setPreferredLocale(locale: string): SupportedLocale {
|
||||
const normalized = normalizeLocale(locale);
|
||||
activeLocale = normalized;
|
||||
if (typeof window !== 'undefined') {
|
||||
window.localStorage?.setItem?.('wpp.locale', normalized);
|
||||
}
|
||||
|
||||
for (const subscriber of localeSubscribers) {
|
||||
subscriber(normalized);
|
||||
}
|
||||
|
||||
return normalized;
|
||||
}
|
||||
|
||||
export function subscribeToLocaleChanges(callback: (locale: SupportedLocale) => void): () => void {
|
||||
localeSubscribers.add(callback);
|
||||
callback(resolvePreferredLocale());
|
||||
return () => {
|
||||
localeSubscribers.delete(callback);
|
||||
};
|
||||
}
|
||||
|
||||
function resolveCatalogPath(key: string): string {
|
||||
if (key.startsWith('lobby.shell.')) {
|
||||
return key.replace(/^lobby\.shell\./, 'app.');
|
||||
}
|
||||
if (key.startsWith('game.host.')) {
|
||||
return key.replace(/^game\.host\./, 'host.');
|
||||
}
|
||||
if (key.startsWith('game.player.')) {
|
||||
return key.replace(/^game\.player\./, 'player.');
|
||||
}
|
||||
return key;
|
||||
}
|
||||
|
||||
export function t(key: string, locale: string): string {
|
||||
return translateCatalogPath(LOBBY_I18N_CATALOG.frontend.ui as Record<string, unknown>, resolveCatalogPath(key), locale);
|
||||
}
|
||||
|
||||
export const clientHasNoAudioOutput = Boolean(LOBBY_I18N_CATALOG.frontend.capabilities.client_has_no_audio_output);
|
||||
@@ -1,105 +0,0 @@
|
||||
import { afterEach, describe, expect, it, vi } from 'vitest';
|
||||
|
||||
import { hostRouteContextResolver, playerRouteContextResolver, resolveSessionCode } from './session-route-context';
|
||||
|
||||
type RouteLike = {
|
||||
paramMap: { get: (key: string) => string | null };
|
||||
queryParamMap: { get: (key: string) => string | null };
|
||||
};
|
||||
|
||||
function route(params: Record<string, string | null>, query: Record<string, string | null> = {}): RouteLike {
|
||||
return {
|
||||
paramMap: { get: (key: string) => params[key] ?? null },
|
||||
queryParamMap: { get: (key: string) => query[key] ?? null },
|
||||
};
|
||||
}
|
||||
|
||||
function storageMock(initial: Record<string, string> = {}): Storage {
|
||||
const data = new Map<string, string>(Object.entries(initial));
|
||||
|
||||
return {
|
||||
getItem: vi.fn((key: string) => data.get(key) ?? null),
|
||||
setItem: vi.fn((key: string, value: string) => {
|
||||
data.set(key, value);
|
||||
}),
|
||||
removeItem: vi.fn((key: string) => {
|
||||
data.delete(key);
|
||||
}),
|
||||
clear: vi.fn(() => {
|
||||
data.clear();
|
||||
}),
|
||||
key: vi.fn((index: number) => Array.from(data.keys())[index] ?? null),
|
||||
get length() {
|
||||
return data.size;
|
||||
},
|
||||
} as unknown as Storage;
|
||||
}
|
||||
|
||||
function setWindow(localStorage: Storage, sessionStorage: Storage): void {
|
||||
vi.stubGlobal('window', { localStorage, sessionStorage });
|
||||
}
|
||||
|
||||
describe('session route context', () => {
|
||||
afterEach(() => {
|
||||
vi.restoreAllMocks();
|
||||
});
|
||||
|
||||
it('resolves player code from persisted session context when route has no code', () => {
|
||||
setWindow(
|
||||
storageMock({ 'wpp.session-context': JSON.stringify({ sessionCode: 'ab12', playerId: 7, token: 'tok' }) }),
|
||||
storageMock()
|
||||
);
|
||||
|
||||
expect(resolveSessionCode(route({}, {}) as never, 'player')).toBe('AB12');
|
||||
});
|
||||
|
||||
it('resolves host code from session query string', () => {
|
||||
setWindow(storageMock(), storageMock());
|
||||
|
||||
expect(resolveSessionCode(route({}, { session: 'qwe9' }) as never, 'host')).toBe('QWE9');
|
||||
});
|
||||
|
||||
it('player resolver emits player id/token when context matches route session', () => {
|
||||
setWindow(
|
||||
storageMock({ 'wpp.session-context': JSON.stringify({ sessionCode: 'AB12', playerId: 5, token: 'tok-5' }) }),
|
||||
storageMock()
|
||||
);
|
||||
|
||||
expect(playerRouteContextResolver(route({ context: 'ab12' }) as never, {} as never)).toEqual({
|
||||
sessionCode: 'AB12',
|
||||
playerId: 5,
|
||||
token: 'tok-5',
|
||||
locale: 'en',
|
||||
});
|
||||
});
|
||||
|
||||
it('host resolver stores normalized host session code for refresh bootstrap', () => {
|
||||
const sessionStorage = storageMock();
|
||||
setWindow(storageMock(), sessionStorage);
|
||||
|
||||
expect(hostRouteContextResolver(route({ context: 'ab12' }) as never, {} as never)).toEqual({
|
||||
sessionCode: 'AB12',
|
||||
playerId: null,
|
||||
token: null,
|
||||
locale: 'en',
|
||||
});
|
||||
expect(sessionStorage.setItem).toHaveBeenCalledWith('wpp.host-session-code', 'AB12');
|
||||
});
|
||||
|
||||
it('resolvers normalize and expose locale from lang query param', () => {
|
||||
setWindow(storageMock(), storageMock());
|
||||
|
||||
expect(hostRouteContextResolver(route({}, { lang: 'da-DK' }) as never, {} as never).locale).toBe('da');
|
||||
expect(playerRouteContextResolver(route({}, { lang: 'EN' }) as never, {} as never).locale).toBe('en');
|
||||
});
|
||||
|
||||
it('does not reset persisted preferred locale when lang query param is absent', () => {
|
||||
const localStorage = storageMock({ 'wpp.locale': 'da' });
|
||||
setWindow(localStorage, storageMock());
|
||||
|
||||
expect(hostRouteContextResolver(route({}, { lang: 'da' }) as never, {} as never).locale).toBe('da');
|
||||
expect(hostRouteContextResolver(route({}, {}) as never, {} as never).locale).toBe('da');
|
||||
expect(localStorage.setItem).toHaveBeenCalledTimes(1);
|
||||
expect(localStorage.setItem).toHaveBeenCalledWith('wpp.locale', 'da');
|
||||
});
|
||||
});
|
||||
@@ -1,156 +0,0 @@
|
||||
import { inject } from '@angular/core';
|
||||
import { type ActivatedRouteSnapshot, type CanActivateFn, type ResolveFn, Router, type UrlTree } from '@angular/router';
|
||||
|
||||
import { createSessionContextStore } from '../../../src/spa/session-context-store';
|
||||
import { normalizeLocale, resolvePreferredLocale, setPreferredLocale } from './lobby-i18n';
|
||||
|
||||
export interface RouteSessionContext {
|
||||
sessionCode: string | null;
|
||||
playerId: number | null;
|
||||
token: string | null;
|
||||
locale: string;
|
||||
}
|
||||
|
||||
const HOST_STORAGE_KEY = 'wpp.host-session-code';
|
||||
|
||||
function normalizeCode(value: string): string {
|
||||
return value.trim().toUpperCase();
|
||||
}
|
||||
|
||||
function isCodeLike(value: string | null | undefined): value is string {
|
||||
return !!value && /^[A-Za-z0-9]{4,12}$/.test(value.trim());
|
||||
}
|
||||
|
||||
function hasPlayerSessionContext(sessionCode: string): boolean {
|
||||
const context = createSessionContextStore(window.localStorage).get();
|
||||
if (!context) {
|
||||
return false;
|
||||
}
|
||||
|
||||
return (
|
||||
isCodeLike(context.sessionCode) &&
|
||||
normalizeCode(context.sessionCode) === normalizeCode(sessionCode) &&
|
||||
Number.isInteger(context.playerId) &&
|
||||
context.playerId > 0 &&
|
||||
!!context.token.trim()
|
||||
);
|
||||
}
|
||||
|
||||
export function resolveSessionCode(route: ActivatedRouteSnapshot, mode: 'host' | 'player'): string | null {
|
||||
const contextParam = route.paramMap.get('context');
|
||||
const queryCode = route.queryParamMap.get('session');
|
||||
|
||||
if (isCodeLike(contextParam)) {
|
||||
return normalizeCode(contextParam);
|
||||
}
|
||||
if (isCodeLike(queryCode)) {
|
||||
return normalizeCode(queryCode);
|
||||
}
|
||||
|
||||
if (mode === 'player') {
|
||||
const persisted = createSessionContextStore(window.localStorage).get()?.sessionCode;
|
||||
if (isCodeLike(persisted)) {
|
||||
return normalizeCode(persisted);
|
||||
}
|
||||
return null;
|
||||
}
|
||||
|
||||
const stored = window.sessionStorage.getItem(HOST_STORAGE_KEY);
|
||||
if (isCodeLike(stored)) {
|
||||
return normalizeCode(stored);
|
||||
}
|
||||
|
||||
return null;
|
||||
}
|
||||
|
||||
function resolveRouteLocale(route: ActivatedRouteSnapshot): string {
|
||||
const langParam = route.queryParamMap.get('lang');
|
||||
if (langParam !== null) {
|
||||
const locale = normalizeLocale(langParam);
|
||||
setPreferredLocale(locale);
|
||||
return locale;
|
||||
}
|
||||
|
||||
return resolvePreferredLocale();
|
||||
}
|
||||
|
||||
async function sessionExists(code: string): Promise<boolean> {
|
||||
const response = await fetch(`/lobby/sessions/${encodeURIComponent(code)}`, {
|
||||
method: 'GET',
|
||||
headers: { Accept: 'application/json' },
|
||||
credentials: 'same-origin',
|
||||
});
|
||||
|
||||
return response.ok;
|
||||
}
|
||||
|
||||
async function requireSessionContext(route: ActivatedRouteSnapshot, mode: 'host' | 'player'): Promise<boolean> {
|
||||
const phase = route.paramMap.get('phase');
|
||||
const code = resolveSessionCode(route, mode);
|
||||
|
||||
if (!phase) {
|
||||
if (mode === 'host' && code) {
|
||||
window.sessionStorage.setItem(HOST_STORAGE_KEY, code);
|
||||
}
|
||||
return true;
|
||||
}
|
||||
|
||||
if (!code) {
|
||||
return false;
|
||||
}
|
||||
|
||||
if (mode === 'player' && !hasPlayerSessionContext(code)) {
|
||||
return false;
|
||||
}
|
||||
|
||||
const ok = await sessionExists(code);
|
||||
if (!ok) {
|
||||
return false;
|
||||
}
|
||||
|
||||
if (mode === 'host') {
|
||||
window.sessionStorage.setItem(HOST_STORAGE_KEY, code);
|
||||
}
|
||||
|
||||
return true;
|
||||
}
|
||||
|
||||
async function guard(mode: 'host' | 'player', route: ActivatedRouteSnapshot): Promise<boolean | UrlTree> {
|
||||
const router = inject(Router);
|
||||
const allowed = await requireSessionContext(route, mode);
|
||||
if (allowed) {
|
||||
return true;
|
||||
}
|
||||
|
||||
return router.createUrlTree([`/${mode}`]);
|
||||
}
|
||||
|
||||
export const hostRouteGuard: CanActivateFn = (route) => guard('host', route);
|
||||
|
||||
export const playerRouteGuard: CanActivateFn = (route) => guard('player', route);
|
||||
|
||||
export const hostRouteContextResolver: ResolveFn<RouteSessionContext> = (route) => {
|
||||
const code = resolveSessionCode(route, 'host');
|
||||
const locale = resolveRouteLocale(route);
|
||||
if (code) {
|
||||
window.sessionStorage.setItem(HOST_STORAGE_KEY, code);
|
||||
}
|
||||
return { sessionCode: code, playerId: null, token: null, locale };
|
||||
};
|
||||
|
||||
export const playerRouteContextResolver: ResolveFn<RouteSessionContext> = (route) => {
|
||||
const code = resolveSessionCode(route, 'player');
|
||||
const locale = resolveRouteLocale(route);
|
||||
const context = createSessionContextStore(window.localStorage).get();
|
||||
|
||||
if (!code || !context || normalizeCode(context.sessionCode) !== code) {
|
||||
return { sessionCode: code, playerId: null, token: null, locale };
|
||||
}
|
||||
|
||||
return {
|
||||
sessionCode: code,
|
||||
playerId: Number.isInteger(context.playerId) && context.playerId > 0 ? context.playerId : null,
|
||||
token: context.token.trim() || null,
|
||||
locale,
|
||||
};
|
||||
};
|
||||
@@ -1,43 +0,0 @@
|
||||
import { describe, expect, it, vi } from 'vitest';
|
||||
|
||||
import { createWppApiClient } from './wpp-api-client';
|
||||
|
||||
function jsonResponse(status: number, body: unknown) {
|
||||
return {
|
||||
ok: status >= 200 && status < 300,
|
||||
status,
|
||||
json: vi.fn().mockResolvedValue(body),
|
||||
} as unknown as Response;
|
||||
}
|
||||
|
||||
describe('WPP Angular API client skeleton', () => {
|
||||
it('normalizes host/player API calls through fetch transport', async () => {
|
||||
const fetchMock = vi
|
||||
.fn()
|
||||
.mockResolvedValueOnce(jsonResponse(200, { session: { code: 'ABCD12', status: 'lobby', host_id: 1, current_round: 1, players_count: 1 }, players: [], round_question: null, phase_view_model: { status: 'lobby', round_number: 1, players_count: 1, constraints: { min_players_to_start: 2, max_players_mvp: 8, min_players_reached: false, max_players_allowed: true }, host: { can_start_round: false, can_show_question: false, can_mix_answers: false, can_calculate_scores: false, can_reveal_scoreboard: false, can_start_next_round: false, can_finish_game: false }, player: { can_join: true, can_submit_lie: false, can_submit_guess: false, can_view_final_result: false } } }))
|
||||
.mockResolvedValueOnce(jsonResponse(201, { player: { id: 1, nickname: 'Luna', session_token: 'tok', score: 0 }, session: { code: 'ABCD12', status: 'lobby' } }));
|
||||
|
||||
const client = createWppApiClient(fetchMock);
|
||||
|
||||
const session = await client.getSession(' abcd12 ');
|
||||
const joined = await client.joinSession({ code: ' abcd12 ', nickname: ' Luna ' });
|
||||
|
||||
expect(session.ok).toBe(true);
|
||||
expect(joined.ok).toBe(true);
|
||||
|
||||
expect(fetchMock).toHaveBeenNthCalledWith(
|
||||
1,
|
||||
'/lobby/sessions/ABCD12',
|
||||
expect.objectContaining({ method: 'GET', credentials: 'same-origin' })
|
||||
);
|
||||
expect(fetchMock).toHaveBeenNthCalledWith(
|
||||
2,
|
||||
'/lobby/sessions/join',
|
||||
expect.objectContaining({
|
||||
method: 'POST',
|
||||
credentials: 'same-origin',
|
||||
body: JSON.stringify({ code: 'ABCD12', nickname: 'Luna' }),
|
||||
})
|
||||
);
|
||||
});
|
||||
});
|
||||
@@ -1,58 +0,0 @@
|
||||
import { InjectionToken } from '@angular/core';
|
||||
|
||||
import {
|
||||
createAngularApiClient,
|
||||
type AngularApiClient,
|
||||
type AngularHttpClientLike,
|
||||
} from '../../../src/api/angular-client';
|
||||
|
||||
export const WPP_API_CLIENT = new InjectionToken<AngularApiClient>('WPP_API_CLIENT');
|
||||
|
||||
export interface FetchLike {
|
||||
(input: string, init?: RequestInit): Promise<Response>;
|
||||
}
|
||||
|
||||
export function createFetchHttpClient(fetchImpl: FetchLike): AngularHttpClientLike {
|
||||
return {
|
||||
async get<T>(url: string): Promise<T> {
|
||||
const response = await fetchImpl(url, {
|
||||
method: 'GET',
|
||||
headers: { Accept: 'application/json' },
|
||||
credentials: 'same-origin',
|
||||
});
|
||||
const payload = await response.json().catch(() => ({}));
|
||||
if (!response.ok) {
|
||||
throw {
|
||||
status: response.status,
|
||||
message: (payload as { error?: string }).error ?? `HTTP ${response.status}`,
|
||||
error: payload,
|
||||
};
|
||||
}
|
||||
return payload as T;
|
||||
},
|
||||
async post<T>(url: string, body: unknown): Promise<T> {
|
||||
const response = await fetchImpl(url, {
|
||||
method: 'POST',
|
||||
headers: {
|
||||
Accept: 'application/json',
|
||||
'Content-Type': 'application/json',
|
||||
},
|
||||
body: JSON.stringify(body),
|
||||
credentials: 'same-origin',
|
||||
});
|
||||
const payload = await response.json().catch(() => ({}));
|
||||
if (!response.ok) {
|
||||
throw {
|
||||
status: response.status,
|
||||
message: (payload as { error?: string }).error ?? `HTTP ${response.status}`,
|
||||
error: payload,
|
||||
};
|
||||
}
|
||||
return payload as T;
|
||||
},
|
||||
};
|
||||
}
|
||||
|
||||
export function createWppApiClient(fetchImpl: FetchLike = fetch.bind(globalThis)): AngularApiClient {
|
||||
return createAngularApiClient(createFetchHttpClient(fetchImpl));
|
||||
}
|
||||
@@ -1,12 +0,0 @@
|
||||
<!doctype html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8" />
|
||||
<title>WPP Angular Shell</title>
|
||||
<base href="/" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||
</head>
|
||||
<body>
|
||||
<app-root></app-root>
|
||||
</body>
|
||||
</html>
|
||||
@@ -1,7 +0,0 @@
|
||||
import { bootstrapApplication } from '@angular/platform-browser';
|
||||
import { AppComponent } from './app/app.component';
|
||||
import { appConfig } from './app/app.config';
|
||||
|
||||
bootstrapApplication(AppComponent, appConfig).catch((error) => {
|
||||
console.error(error);
|
||||
});
|
||||
@@ -1,4 +0,0 @@
|
||||
html, body {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
@@ -1 +0,0 @@
|
||||
import '@angular/compiler';
|
||||
@@ -1,9 +0,0 @@
|
||||
{
|
||||
"extends": "./tsconfig.json",
|
||||
"compilerOptions": {
|
||||
"outDir": "./out-tsc/app",
|
||||
"types": []
|
||||
},
|
||||
"files": ["src/main.ts"],
|
||||
"include": ["src/**/*.d.ts"]
|
||||
}
|
||||
@@ -1,22 +0,0 @@
|
||||
{
|
||||
"compileOnSave": false,
|
||||
"compilerOptions": {
|
||||
"strict": true,
|
||||
"skipLibCheck": true,
|
||||
"isolatedModules": true,
|
||||
"esModuleInterop": true,
|
||||
"sourceMap": true,
|
||||
"declaration": false,
|
||||
"experimentalDecorators": true,
|
||||
"moduleResolution": "bundler",
|
||||
"importHelpers": true,
|
||||
"target": "ES2022",
|
||||
"module": "ES2022",
|
||||
"lib": ["ES2022", "dom"]
|
||||
},
|
||||
"angularCompilerOptions": {
|
||||
"strictInjectionParameters": true,
|
||||
"strictInputAccessModifiers": true,
|
||||
"strictTemplates": true
|
||||
}
|
||||
}
|
||||
@@ -1,8 +0,0 @@
|
||||
import { defineConfig } from 'vitest/config';
|
||||
|
||||
export default defineConfig({
|
||||
test: {
|
||||
include: ['src/**/*.spec.ts'],
|
||||
setupFiles: ['src/test-setup.ts'],
|
||||
},
|
||||
});
|
||||
1454
frontend/package-lock.json
generated
1454
frontend/package-lock.json
generated
File diff suppressed because it is too large
Load Diff
@@ -1,15 +0,0 @@
|
||||
{
|
||||
"name": "wpp-frontend-api-client-baseline",
|
||||
"private": true,
|
||||
"version": "0.1.0",
|
||||
"type": "module",
|
||||
"scripts": {
|
||||
"test": "vitest run",
|
||||
"build": "tsc --noEmit"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@types/node": "^22.13.10",
|
||||
"typescript": "^5.7.3",
|
||||
"vitest": "^2.1.9"
|
||||
}
|
||||
}
|
||||
@@ -1,74 +0,0 @@
|
||||
import lobbyCatalog from '../../../shared/i18n/lobby.json';
|
||||
|
||||
export type LobbyCatalog = typeof lobbyCatalog;
|
||||
export type SupportedLocale = LobbyCatalog['locales']['supported'][number];
|
||||
|
||||
export const LOBBY_I18N_CATALOG = lobbyCatalog;
|
||||
export const DEFAULT_LOCALE = lobbyCatalog.locales.default as SupportedLocale;
|
||||
export const SUPPORTED_LOCALES = lobbyCatalog.locales.supported as readonly SupportedLocale[];
|
||||
|
||||
export function normalizeLocale(rawLocale?: string | null): SupportedLocale {
|
||||
const locale = (rawLocale ?? '').trim().toLowerCase().replace(/_/g, '-');
|
||||
if ((SUPPORTED_LOCALES as readonly string[]).includes(locale)) {
|
||||
return locale as SupportedLocale;
|
||||
}
|
||||
|
||||
const shortLocale = locale.split('-')[0] ?? '';
|
||||
if ((SUPPORTED_LOCALES as readonly string[]).includes(shortLocale)) {
|
||||
return shortLocale as SupportedLocale;
|
||||
}
|
||||
|
||||
return DEFAULT_LOCALE;
|
||||
}
|
||||
|
||||
export function translateCatalogPath(
|
||||
root: Record<string, unknown>,
|
||||
keyPath: string,
|
||||
locale: string,
|
||||
fallback = DEFAULT_LOCALE,
|
||||
): string {
|
||||
const normalizedLocale = normalizeLocale(locale);
|
||||
const segments = keyPath.split('.');
|
||||
|
||||
let cursor: unknown = root;
|
||||
for (const segment of segments) {
|
||||
if (!cursor || typeof cursor !== 'object' || !(segment in (cursor as Record<string, unknown>))) {
|
||||
return keyPath;
|
||||
}
|
||||
cursor = (cursor as Record<string, unknown>)[segment];
|
||||
}
|
||||
|
||||
if (!cursor || typeof cursor !== 'object') {
|
||||
return keyPath;
|
||||
}
|
||||
|
||||
const translations = cursor as Record<string, string>;
|
||||
return translations[normalizedLocale] ?? translations[fallback] ?? keyPath;
|
||||
}
|
||||
|
||||
export function collectLocaleParityIssues(
|
||||
node: unknown,
|
||||
locales: readonly string[] = SUPPORTED_LOCALES,
|
||||
path = '',
|
||||
): string[] {
|
||||
if (!node || typeof node !== 'object') {
|
||||
return [];
|
||||
}
|
||||
|
||||
const record = node as Record<string, unknown>;
|
||||
const keys = Object.keys(record);
|
||||
const isTranslationLeaf = keys.length > 0 && locales.every((locale) => locale in record);
|
||||
|
||||
if (isTranslationLeaf) {
|
||||
const issues: string[] = [];
|
||||
for (const locale of locales) {
|
||||
const value = record[locale];
|
||||
if (typeof value !== 'string' || !value.trim()) {
|
||||
issues.push(`${path || '<root>'} missing non-empty '${locale}' translation`);
|
||||
}
|
||||
}
|
||||
return issues;
|
||||
}
|
||||
|
||||
return keys.flatMap((key) => collectLocaleParityIssues(record[key], locales, path ? `${path}.${key}` : key));
|
||||
}
|
||||
@@ -1,262 +0,0 @@
|
||||
import {
|
||||
mapCalculateScoresResponse,
|
||||
mapFinishGameResponse,
|
||||
mapHealthResponse,
|
||||
mapJoinSessionResponse,
|
||||
mapMixAnswersResponse,
|
||||
mapScoreboardResponse,
|
||||
mapSessionDetailResponse,
|
||||
mapShowQuestionResponse,
|
||||
mapStartNextRoundResponse,
|
||||
mapStartRoundResponse,
|
||||
mapSubmitGuessResponse,
|
||||
mapSubmitLieResponse
|
||||
} from './mappers';
|
||||
import type {
|
||||
ApiFailure,
|
||||
ApiResult,
|
||||
CalculateScoresResponse,
|
||||
FinishGameResponse,
|
||||
HealthResponse,
|
||||
JoinSessionRequest,
|
||||
JoinSessionResponse,
|
||||
MixAnswersResponse,
|
||||
ScoreboardResponse,
|
||||
SessionDetailResponse,
|
||||
ShowQuestionResponse,
|
||||
StartNextRoundResponse,
|
||||
StartRoundRequest,
|
||||
StartRoundResponse,
|
||||
SubmitGuessRequest,
|
||||
SubmitGuessResponse,
|
||||
SubmitLieRequest,
|
||||
SubmitLieResponse
|
||||
} from './types';
|
||||
|
||||
export interface AngularHttpError {
|
||||
status?: number;
|
||||
message?: string;
|
||||
error?: unknown;
|
||||
}
|
||||
|
||||
export interface AngularHttpClientLike {
|
||||
get<T>(url: string, options?: { withCredentials?: boolean }): Promise<T>;
|
||||
post<T>(url: string, body: unknown, options?: { withCredentials?: boolean }): Promise<T>;
|
||||
}
|
||||
|
||||
export interface AngularApiClient {
|
||||
health(): Promise<ApiResult<HealthResponse>>;
|
||||
getSession(code: string): Promise<ApiResult<SessionDetailResponse>>;
|
||||
joinSession(payload: JoinSessionRequest): Promise<ApiResult<JoinSessionResponse>>;
|
||||
startRound(code: string, payload: StartRoundRequest): Promise<ApiResult<StartRoundResponse>>;
|
||||
showQuestion(code: string): Promise<ApiResult<ShowQuestionResponse>>;
|
||||
mixAnswers(code: string, roundQuestionId: number): Promise<ApiResult<MixAnswersResponse>>;
|
||||
calculateScores(code: string, roundQuestionId: number): Promise<ApiResult<CalculateScoresResponse>>;
|
||||
getScoreboard(code: string): Promise<ApiResult<ScoreboardResponse>>;
|
||||
startNextRound(code: string): Promise<ApiResult<StartNextRoundResponse>>;
|
||||
finishGame(code: string): Promise<ApiResult<FinishGameResponse>>;
|
||||
submitLie(code: string, roundQuestionId: number, payload: SubmitLieRequest): Promise<ApiResult<SubmitLieResponse>>;
|
||||
submitGuess(
|
||||
code: string,
|
||||
roundQuestionId: number,
|
||||
payload: SubmitGuessRequest
|
||||
): Promise<ApiResult<SubmitGuessResponse>>;
|
||||
}
|
||||
|
||||
function toFailure(error: unknown): ApiFailure {
|
||||
const candidate = (error ?? {}) as AngularHttpError;
|
||||
const status = typeof candidate.status === 'number' ? candidate.status : 0;
|
||||
const payload = candidate.error;
|
||||
|
||||
if (status === 0) {
|
||||
return {
|
||||
kind: 'network',
|
||||
status: 0,
|
||||
message: candidate.message ?? 'Network error while contacting API'
|
||||
};
|
||||
}
|
||||
|
||||
return {
|
||||
kind: 'http',
|
||||
status,
|
||||
message: candidate.message ?? `HTTP ${status}`,
|
||||
...(payload === undefined ? {} : { payload })
|
||||
};
|
||||
}
|
||||
|
||||
function normalizeCode(code: string): string {
|
||||
return code.trim().toUpperCase();
|
||||
}
|
||||
|
||||
function normalizeBaseUrl(baseUrl: string): string {
|
||||
return baseUrl.endsWith('/') ? baseUrl.slice(0, -1) : baseUrl;
|
||||
}
|
||||
|
||||
function buildUrl(baseUrl: string, path: string): string {
|
||||
return `${normalizeBaseUrl(baseUrl)}${path}`;
|
||||
}
|
||||
|
||||
async function wrap<T>(call: () => Promise<unknown>, mapper: (payload: unknown) => T): Promise<ApiResult<T>> {
|
||||
let payload: unknown;
|
||||
try {
|
||||
payload = await call();
|
||||
} catch (error: unknown) {
|
||||
return {
|
||||
ok: false,
|
||||
status: typeof (error as AngularHttpError)?.status === 'number' ? (error as AngularHttpError).status! : 0,
|
||||
error: toFailure(error)
|
||||
};
|
||||
}
|
||||
|
||||
try {
|
||||
return { ok: true, status: 200, data: mapper(payload) };
|
||||
} catch (error: unknown) {
|
||||
return {
|
||||
ok: false,
|
||||
status: 200,
|
||||
error: {
|
||||
kind: 'parse',
|
||||
status: 200,
|
||||
message: error instanceof Error ? error.message : 'Invalid API response contract',
|
||||
payload
|
||||
}
|
||||
};
|
||||
}
|
||||
}
|
||||
|
||||
export function createAngularApiClient(http: AngularHttpClientLike, baseUrl = ''): AngularApiClient {
|
||||
return {
|
||||
health: () =>
|
||||
wrap(() => http.get<HealthResponse>(buildUrl(baseUrl, '/healthz'), { withCredentials: true }), mapHealthResponse),
|
||||
getSession: (code: string) =>
|
||||
wrap(
|
||||
() =>
|
||||
http.get<SessionDetailResponse>(buildUrl(baseUrl, `/lobby/sessions/${encodeURIComponent(normalizeCode(code))}`), {
|
||||
withCredentials: true
|
||||
}),
|
||||
mapSessionDetailResponse
|
||||
),
|
||||
joinSession: (payload: JoinSessionRequest) =>
|
||||
wrap(
|
||||
() =>
|
||||
http.post<JoinSessionResponse>(
|
||||
buildUrl(baseUrl, '/lobby/sessions/join'),
|
||||
{
|
||||
code: normalizeCode(payload.code),
|
||||
nickname: payload.nickname.trim()
|
||||
},
|
||||
{ withCredentials: true }
|
||||
),
|
||||
mapJoinSessionResponse
|
||||
),
|
||||
startRound: (code: string, payload: StartRoundRequest) =>
|
||||
wrap(
|
||||
() =>
|
||||
http.post<StartRoundResponse>(
|
||||
buildUrl(baseUrl, `/lobby/sessions/${encodeURIComponent(normalizeCode(code))}/rounds/start`),
|
||||
payload,
|
||||
{ withCredentials: true }
|
||||
),
|
||||
mapStartRoundResponse
|
||||
),
|
||||
showQuestion: (code: string) =>
|
||||
wrap(
|
||||
() =>
|
||||
http.post<ShowQuestionResponse>(
|
||||
buildUrl(baseUrl, `/lobby/sessions/${encodeURIComponent(normalizeCode(code))}/questions/show`),
|
||||
{},
|
||||
{ withCredentials: true }
|
||||
),
|
||||
mapShowQuestionResponse
|
||||
),
|
||||
mixAnswers: (code: string, roundQuestionId: number) =>
|
||||
wrap(
|
||||
() =>
|
||||
http.post<MixAnswersResponse>(
|
||||
buildUrl(
|
||||
baseUrl,
|
||||
`/lobby/sessions/${encodeURIComponent(normalizeCode(code))}/questions/${roundQuestionId}/answers/mix`
|
||||
),
|
||||
{},
|
||||
{ withCredentials: true }
|
||||
),
|
||||
mapMixAnswersResponse
|
||||
),
|
||||
calculateScores: (code: string, roundQuestionId: number) =>
|
||||
wrap(
|
||||
() =>
|
||||
http.post<CalculateScoresResponse>(
|
||||
buildUrl(
|
||||
baseUrl,
|
||||
`/lobby/sessions/${encodeURIComponent(normalizeCode(code))}/questions/${roundQuestionId}/scores/calculate`
|
||||
),
|
||||
{},
|
||||
{ withCredentials: true }
|
||||
),
|
||||
mapCalculateScoresResponse
|
||||
),
|
||||
getScoreboard: (code: string) =>
|
||||
wrap(
|
||||
() =>
|
||||
http.get<ScoreboardResponse>(
|
||||
buildUrl(baseUrl, `/lobby/sessions/${encodeURIComponent(normalizeCode(code))}/scoreboard`),
|
||||
{ withCredentials: true }
|
||||
),
|
||||
mapScoreboardResponse
|
||||
),
|
||||
startNextRound: (code: string) =>
|
||||
wrap(
|
||||
() =>
|
||||
http.post<StartNextRoundResponse>(
|
||||
buildUrl(baseUrl, `/lobby/sessions/${encodeURIComponent(normalizeCode(code))}/rounds/next`),
|
||||
{},
|
||||
{ withCredentials: true }
|
||||
),
|
||||
mapStartNextRoundResponse
|
||||
),
|
||||
finishGame: (code: string) =>
|
||||
wrap(
|
||||
() =>
|
||||
http.post<FinishGameResponse>(
|
||||
buildUrl(baseUrl, `/lobby/sessions/${encodeURIComponent(normalizeCode(code))}/finish`),
|
||||
{},
|
||||
{ withCredentials: true }
|
||||
),
|
||||
mapFinishGameResponse
|
||||
),
|
||||
submitLie: (code: string, roundQuestionId: number, payload: SubmitLieRequest) =>
|
||||
wrap(
|
||||
() =>
|
||||
http.post<SubmitLieResponse>(
|
||||
buildUrl(
|
||||
baseUrl,
|
||||
`/lobby/sessions/${encodeURIComponent(normalizeCode(code))}/questions/${roundQuestionId}/lies/submit`
|
||||
),
|
||||
{
|
||||
player_id: payload.player_id,
|
||||
session_token: payload.session_token,
|
||||
text: payload.text
|
||||
},
|
||||
{ withCredentials: true }
|
||||
),
|
||||
mapSubmitLieResponse
|
||||
),
|
||||
submitGuess: (code: string, roundQuestionId: number, payload: SubmitGuessRequest) =>
|
||||
wrap(
|
||||
() =>
|
||||
http.post<SubmitGuessResponse>(
|
||||
buildUrl(
|
||||
baseUrl,
|
||||
`/lobby/sessions/${encodeURIComponent(normalizeCode(code))}/questions/${roundQuestionId}/guesses/submit`
|
||||
),
|
||||
{
|
||||
player_id: payload.player_id,
|
||||
session_token: payload.session_token,
|
||||
selected_text: payload.selected_text
|
||||
},
|
||||
{ withCredentials: true }
|
||||
),
|
||||
mapSubmitGuessResponse
|
||||
)
|
||||
};
|
||||
}
|
||||
@@ -1,198 +0,0 @@
|
||||
import {
|
||||
mapCalculateScoresResponse,
|
||||
mapFinishGameResponse,
|
||||
mapHealthResponse,
|
||||
mapJoinSessionResponse,
|
||||
mapMixAnswersResponse,
|
||||
mapScoreboardResponse,
|
||||
mapSessionDetailResponse,
|
||||
mapShowQuestionResponse,
|
||||
mapStartNextRoundResponse,
|
||||
mapStartRoundResponse,
|
||||
mapSubmitGuessResponse,
|
||||
mapSubmitLieResponse
|
||||
} from './mappers';
|
||||
import type {
|
||||
ApiResult,
|
||||
CalculateScoresResponse,
|
||||
FinishGameResponse,
|
||||
HealthResponse,
|
||||
JoinSessionRequest,
|
||||
JoinSessionResponse,
|
||||
MixAnswersResponse,
|
||||
ScoreboardResponse,
|
||||
SessionDetailResponse,
|
||||
ShowQuestionResponse,
|
||||
StartNextRoundResponse,
|
||||
StartRoundRequest,
|
||||
StartRoundResponse,
|
||||
SubmitGuessRequest,
|
||||
SubmitGuessResponse,
|
||||
SubmitLieRequest,
|
||||
SubmitLieResponse
|
||||
} from './types';
|
||||
|
||||
export interface ApiClient {
|
||||
health(): Promise<ApiResult<HealthResponse>>;
|
||||
getSession(code: string): Promise<ApiResult<SessionDetailResponse>>;
|
||||
joinSession(payload: JoinSessionRequest): Promise<ApiResult<JoinSessionResponse>>;
|
||||
startRound(code: string, payload: StartRoundRequest): Promise<ApiResult<StartRoundResponse>>;
|
||||
showQuestion(code: string): Promise<ApiResult<ShowQuestionResponse>>;
|
||||
mixAnswers(code: string, roundQuestionId: number): Promise<ApiResult<MixAnswersResponse>>;
|
||||
calculateScores(code: string, roundQuestionId: number): Promise<ApiResult<CalculateScoresResponse>>;
|
||||
getScoreboard(code: string): Promise<ApiResult<ScoreboardResponse>>;
|
||||
startNextRound(code: string): Promise<ApiResult<StartNextRoundResponse>>;
|
||||
finishGame(code: string): Promise<ApiResult<FinishGameResponse>>;
|
||||
submitLie(code: string, roundQuestionId: number, payload: SubmitLieRequest): Promise<ApiResult<SubmitLieResponse>>;
|
||||
submitGuess(code: string, roundQuestionId: number, payload: SubmitGuessRequest): Promise<ApiResult<SubmitGuessResponse>>;
|
||||
}
|
||||
|
||||
export function createApiClient(baseUrl = '', fetchImpl: typeof fetch = fetch): ApiClient {
|
||||
async function request<T>(
|
||||
path: string,
|
||||
method: 'GET' | 'POST',
|
||||
mapper: (payload: unknown) => T,
|
||||
payload?: unknown
|
||||
): Promise<ApiResult<T>> {
|
||||
let response: Response;
|
||||
try {
|
||||
response = await fetchImpl(`${baseUrl}${path}`, {
|
||||
method,
|
||||
headers: {
|
||||
Accept: 'application/json',
|
||||
...(payload === undefined ? {} : { 'Content-Type': 'application/json' })
|
||||
},
|
||||
...(payload === undefined ? {} : { body: JSON.stringify(payload) })
|
||||
});
|
||||
} catch {
|
||||
return {
|
||||
ok: false,
|
||||
status: 0,
|
||||
error: { kind: 'network', status: 0, message: 'Network error while contacting API' }
|
||||
};
|
||||
}
|
||||
|
||||
let responsePayload: unknown;
|
||||
try {
|
||||
responsePayload = await response.json();
|
||||
} catch {
|
||||
return {
|
||||
ok: false,
|
||||
status: response.status,
|
||||
error: { kind: 'parse', status: response.status, message: 'Invalid JSON response from API' }
|
||||
};
|
||||
}
|
||||
|
||||
if (!response.ok) {
|
||||
return {
|
||||
ok: false,
|
||||
status: response.status,
|
||||
error: {
|
||||
kind: 'http',
|
||||
status: response.status,
|
||||
message: `HTTP ${response.status}`,
|
||||
payload: responsePayload
|
||||
}
|
||||
};
|
||||
}
|
||||
|
||||
try {
|
||||
return { ok: true, status: response.status, data: mapper(responsePayload) };
|
||||
} catch (error) {
|
||||
return {
|
||||
ok: false,
|
||||
status: response.status,
|
||||
error: {
|
||||
kind: 'parse',
|
||||
status: response.status,
|
||||
message: error instanceof Error ? error.message : 'Invalid API response contract',
|
||||
payload: responsePayload
|
||||
}
|
||||
};
|
||||
}
|
||||
}
|
||||
|
||||
const normalizeCode = (value: string): string => value.trim().toUpperCase();
|
||||
|
||||
return {
|
||||
health: () => request<HealthResponse>('/healthz', 'GET', mapHealthResponse),
|
||||
getSession: (code: string) =>
|
||||
request<SessionDetailResponse>(
|
||||
`/lobby/sessions/${encodeURIComponent(normalizeCode(code))}`,
|
||||
'GET',
|
||||
mapSessionDetailResponse
|
||||
),
|
||||
joinSession: (payload: JoinSessionRequest) =>
|
||||
request<JoinSessionResponse>(
|
||||
'/lobby/sessions/join',
|
||||
'POST',
|
||||
mapJoinSessionResponse,
|
||||
{
|
||||
code: normalizeCode(payload.code),
|
||||
nickname: payload.nickname.trim()
|
||||
}
|
||||
),
|
||||
startRound: (code: string, payload: StartRoundRequest) =>
|
||||
request<StartRoundResponse>(
|
||||
`/lobby/sessions/${encodeURIComponent(normalizeCode(code))}/rounds/start`,
|
||||
'POST',
|
||||
mapStartRoundResponse,
|
||||
payload
|
||||
),
|
||||
showQuestion: (code: string) =>
|
||||
request<ShowQuestionResponse>(
|
||||
`/lobby/sessions/${encodeURIComponent(normalizeCode(code))}/questions/show`,
|
||||
'POST',
|
||||
mapShowQuestionResponse,
|
||||
{}
|
||||
),
|
||||
mixAnswers: (code: string, roundQuestionId: number) =>
|
||||
request<MixAnswersResponse>(
|
||||
`/lobby/sessions/${encodeURIComponent(normalizeCode(code))}/questions/${roundQuestionId}/answers/mix`,
|
||||
'POST',
|
||||
mapMixAnswersResponse,
|
||||
{}
|
||||
),
|
||||
calculateScores: (code: string, roundQuestionId: number) =>
|
||||
request<CalculateScoresResponse>(
|
||||
`/lobby/sessions/${encodeURIComponent(normalizeCode(code))}/questions/${roundQuestionId}/scores/calculate`,
|
||||
'POST',
|
||||
mapCalculateScoresResponse,
|
||||
{}
|
||||
),
|
||||
getScoreboard: (code: string) =>
|
||||
request<ScoreboardResponse>(
|
||||
`/lobby/sessions/${encodeURIComponent(normalizeCode(code))}/scoreboard`,
|
||||
'GET',
|
||||
mapScoreboardResponse
|
||||
),
|
||||
startNextRound: (code: string) =>
|
||||
request<StartNextRoundResponse>(
|
||||
`/lobby/sessions/${encodeURIComponent(normalizeCode(code))}/rounds/next`,
|
||||
'POST',
|
||||
mapStartNextRoundResponse,
|
||||
{}
|
||||
),
|
||||
finishGame: (code: string) =>
|
||||
request<FinishGameResponse>(
|
||||
`/lobby/sessions/${encodeURIComponent(normalizeCode(code))}/finish`,
|
||||
'POST',
|
||||
mapFinishGameResponse,
|
||||
{}
|
||||
),
|
||||
submitLie: (code: string, roundQuestionId: number, payload: SubmitLieRequest) =>
|
||||
request<SubmitLieResponse>(
|
||||
`/lobby/sessions/${encodeURIComponent(normalizeCode(code))}/questions/${roundQuestionId}/lies/submit`,
|
||||
'POST',
|
||||
mapSubmitLieResponse,
|
||||
payload
|
||||
),
|
||||
submitGuess: (code: string, roundQuestionId: number, payload: SubmitGuessRequest) =>
|
||||
request<SubmitGuessResponse>(
|
||||
`/lobby/sessions/${encodeURIComponent(normalizeCode(code))}/questions/${roundQuestionId}/guesses/submit`,
|
||||
'POST',
|
||||
mapSubmitGuessResponse,
|
||||
payload
|
||||
)
|
||||
};
|
||||
}
|
||||
@@ -1,420 +0,0 @@
|
||||
import type {
|
||||
CalculateScoresResponse,
|
||||
FinishGameResponse,
|
||||
HealthResponse,
|
||||
JoinSessionResponse,
|
||||
MixAnswersResponse,
|
||||
ScoreboardResponse,
|
||||
SessionDetailResponse,
|
||||
ShowQuestionResponse,
|
||||
StartNextRoundResponse,
|
||||
StartRoundResponse,
|
||||
SubmitGuessResponse,
|
||||
SubmitLieResponse
|
||||
} from './types';
|
||||
|
||||
function isRecord(value: unknown): value is Record<string, unknown> {
|
||||
return typeof value === 'object' && value !== null;
|
||||
}
|
||||
|
||||
function isBoolean(value: unknown): value is boolean {
|
||||
return typeof value === 'boolean';
|
||||
}
|
||||
|
||||
function isNumber(value: unknown): value is number {
|
||||
return typeof value === 'number' && Number.isFinite(value);
|
||||
}
|
||||
|
||||
function isString(value: unknown): value is string {
|
||||
return typeof value === 'string';
|
||||
}
|
||||
|
||||
function asRecord(value: unknown, path: string): Record<string, unknown> {
|
||||
if (!isRecord(value)) {
|
||||
throw new Error(`Invalid API contract: expected object at ${path}`);
|
||||
}
|
||||
return value;
|
||||
}
|
||||
|
||||
function readString(record: Record<string, unknown>, key: string, path: string): string {
|
||||
const value = record[key];
|
||||
if (!isString(value)) {
|
||||
throw new Error(`Invalid API contract: expected string at ${path}.${key}`);
|
||||
}
|
||||
return value;
|
||||
}
|
||||
|
||||
function readNumber(record: Record<string, unknown>, key: string, path: string): number {
|
||||
const value = record[key];
|
||||
if (!isNumber(value)) {
|
||||
throw new Error(`Invalid API contract: expected number at ${path}.${key}`);
|
||||
}
|
||||
return value;
|
||||
}
|
||||
|
||||
function readBoolean(record: Record<string, unknown>, key: string, path: string): boolean {
|
||||
const value = record[key];
|
||||
if (!isBoolean(value)) {
|
||||
throw new Error(`Invalid API contract: expected boolean at ${path}.${key}`);
|
||||
}
|
||||
return value;
|
||||
}
|
||||
|
||||
function readNullableNumber(record: Record<string, unknown>, key: string, path: string): number | null {
|
||||
const value = record[key];
|
||||
if (value === undefined || value === null) {
|
||||
return null;
|
||||
}
|
||||
if (!isNumber(value)) {
|
||||
throw new Error(`Invalid API contract: expected number|null at ${path}.${key}`);
|
||||
}
|
||||
return value;
|
||||
}
|
||||
|
||||
export function mapHealthResponse(payload: unknown): HealthResponse {
|
||||
const root = asRecord(payload, 'health');
|
||||
return {
|
||||
ok: readBoolean(root, 'ok', 'health'),
|
||||
service: readString(root, 'service', 'health')
|
||||
};
|
||||
}
|
||||
|
||||
function mapSessionDetail(payload: unknown): SessionDetailResponse {
|
||||
const root = asRecord(payload, 'session_detail');
|
||||
const session = asRecord(root.session, 'session_detail.session');
|
||||
const players = root.players;
|
||||
if (!Array.isArray(players)) {
|
||||
throw new Error('Invalid API contract: expected array at session_detail.players');
|
||||
}
|
||||
|
||||
const roundQuestionRaw = root.round_question;
|
||||
let roundQuestion: SessionDetailResponse['round_question'] = null;
|
||||
if (roundQuestionRaw !== null) {
|
||||
const roundQuestionRecord = asRecord(roundQuestionRaw, 'session_detail.round_question');
|
||||
const answersRaw = roundQuestionRecord.answers;
|
||||
if (!Array.isArray(answersRaw)) {
|
||||
throw new Error('Invalid API contract: expected array at session_detail.round_question.answers');
|
||||
}
|
||||
|
||||
roundQuestion = {
|
||||
id: readNumber(roundQuestionRecord, 'id', 'session_detail.round_question'),
|
||||
round_number: readNumber(roundQuestionRecord, 'round_number', 'session_detail.round_question'),
|
||||
prompt: readString(roundQuestionRecord, 'prompt', 'session_detail.round_question'),
|
||||
shown_at: readString(roundQuestionRecord, 'shown_at', 'session_detail.round_question'),
|
||||
answers: answersRaw.map((answer, index) => {
|
||||
const answerRecord = asRecord(answer, `session_detail.round_question.answers[${index}]`);
|
||||
return { text: readString(answerRecord, 'text', `session_detail.round_question.answers[${index}]`) };
|
||||
})
|
||||
};
|
||||
}
|
||||
|
||||
const phase = asRecord(root.phase_view_model, 'session_detail.phase_view_model');
|
||||
const constraints = asRecord(phase.constraints, 'session_detail.phase_view_model.constraints');
|
||||
const host = asRecord(phase.host, 'session_detail.phase_view_model.host');
|
||||
const player = asRecord(phase.player, 'session_detail.phase_view_model.player');
|
||||
|
||||
const revealRaw = root.reveal;
|
||||
let reveal: SessionDetailResponse['reveal'] = null;
|
||||
if (revealRaw !== null && revealRaw !== undefined) {
|
||||
const revealRecord = asRecord(revealRaw, 'session_detail.reveal');
|
||||
const liesRaw = revealRecord.lies;
|
||||
const guessesRaw = revealRecord.guesses;
|
||||
if (!Array.isArray(liesRaw)) {
|
||||
throw new Error('Invalid API contract: expected array at session_detail.reveal.lies');
|
||||
}
|
||||
if (!Array.isArray(guessesRaw)) {
|
||||
throw new Error('Invalid API contract: expected array at session_detail.reveal.guesses');
|
||||
}
|
||||
|
||||
reveal = {
|
||||
round_question_id: readNumber(revealRecord, 'round_question_id', 'session_detail.reveal'),
|
||||
round_number: readNumber(revealRecord, 'round_number', 'session_detail.reveal'),
|
||||
prompt: readString(revealRecord, 'prompt', 'session_detail.reveal'),
|
||||
correct_answer: readString(revealRecord, 'correct_answer', 'session_detail.reveal'),
|
||||
lies: liesRaw.map((lie, index) => {
|
||||
const record = asRecord(lie, `session_detail.reveal.lies[${index}]`);
|
||||
return {
|
||||
player_id: readNumber(record, 'player_id', `session_detail.reveal.lies[${index}]`),
|
||||
nickname: readString(record, 'nickname', `session_detail.reveal.lies[${index}]`),
|
||||
text: readString(record, 'text', `session_detail.reveal.lies[${index}]`),
|
||||
created_at: readString(record, 'created_at', `session_detail.reveal.lies[${index}]`)
|
||||
};
|
||||
}),
|
||||
guesses: guessesRaw.map((guess, index) => {
|
||||
const path = `session_detail.reveal.guesses[${index}]`;
|
||||
const record = asRecord(guess, path);
|
||||
const fooledPlayerId = readNullableNumber(record, 'fooled_player_id', path);
|
||||
const fooledPlayerNickname = record.fooled_player_nickname;
|
||||
if (fooledPlayerId === null) {
|
||||
if (fooledPlayerNickname !== undefined) {
|
||||
throw new Error(`Invalid API contract: expected ${path}.fooled_player_nickname to be omitted when fooled_player_id is null`);
|
||||
}
|
||||
} else if (!isString(fooledPlayerNickname)) {
|
||||
throw new Error(`Invalid API contract: expected string at ${path}.fooled_player_nickname when fooled_player_id is set`);
|
||||
}
|
||||
return {
|
||||
player_id: readNumber(record, 'player_id', path),
|
||||
nickname: readString(record, 'nickname', path),
|
||||
selected_text: readString(record, 'selected_text', path),
|
||||
is_correct: readBoolean(record, 'is_correct', path),
|
||||
fooled_player_id: fooledPlayerId,
|
||||
...(fooledPlayerNickname === undefined ? {} : { fooled_player_nickname: fooledPlayerNickname }),
|
||||
created_at: readString(record, 'created_at', path)
|
||||
};
|
||||
})
|
||||
};
|
||||
}
|
||||
|
||||
return {
|
||||
session: {
|
||||
code: readString(session, 'code', 'session_detail.session'),
|
||||
status: readString(session, 'status', 'session_detail.session'),
|
||||
host_id: (() => {
|
||||
const hostId = session.host_id;
|
||||
if (hostId === null) {
|
||||
return null;
|
||||
}
|
||||
if (!isNumber(hostId)) {
|
||||
throw new Error('Invalid API contract: expected number|null at session_detail.session.host_id');
|
||||
}
|
||||
return hostId;
|
||||
})(),
|
||||
current_round: readNumber(session, 'current_round', 'session_detail.session'),
|
||||
players_count: readNumber(session, 'players_count', 'session_detail.session')
|
||||
},
|
||||
players: players.map((item, index) => {
|
||||
const record = asRecord(item, `session_detail.players[${index}]`);
|
||||
return {
|
||||
id: readNumber(record, 'id', `session_detail.players[${index}]`),
|
||||
nickname: readString(record, 'nickname', `session_detail.players[${index}]`),
|
||||
score: readNumber(record, 'score', `session_detail.players[${index}]`),
|
||||
is_connected: readBoolean(record, 'is_connected', `session_detail.players[${index}]`)
|
||||
};
|
||||
}),
|
||||
round_question: roundQuestion,
|
||||
reveal,
|
||||
phase_view_model: {
|
||||
status: readString(phase, 'status', 'session_detail.phase_view_model'),
|
||||
round_number: readNumber(phase, 'round_number', 'session_detail.phase_view_model'),
|
||||
players_count: readNumber(phase, 'players_count', 'session_detail.phase_view_model'),
|
||||
constraints: {
|
||||
min_players_to_start: readNumber(constraints, 'min_players_to_start', 'session_detail.phase_view_model.constraints'),
|
||||
max_players_mvp: readNumber(constraints, 'max_players_mvp', 'session_detail.phase_view_model.constraints'),
|
||||
min_players_reached: readBoolean(constraints, 'min_players_reached', 'session_detail.phase_view_model.constraints'),
|
||||
max_players_allowed: readBoolean(constraints, 'max_players_allowed', 'session_detail.phase_view_model.constraints')
|
||||
},
|
||||
host: {
|
||||
can_start_round: readBoolean(host, 'can_start_round', 'session_detail.phase_view_model.host'),
|
||||
can_show_question: readBoolean(host, 'can_show_question', 'session_detail.phase_view_model.host'),
|
||||
can_mix_answers: readBoolean(host, 'can_mix_answers', 'session_detail.phase_view_model.host'),
|
||||
can_calculate_scores: readBoolean(host, 'can_calculate_scores', 'session_detail.phase_view_model.host'),
|
||||
can_reveal_scoreboard: readBoolean(host, 'can_reveal_scoreboard', 'session_detail.phase_view_model.host'),
|
||||
can_start_next_round: readBoolean(host, 'can_start_next_round', 'session_detail.phase_view_model.host'),
|
||||
can_finish_game: readBoolean(host, 'can_finish_game', 'session_detail.phase_view_model.host')
|
||||
},
|
||||
player: {
|
||||
can_join: readBoolean(player, 'can_join', 'session_detail.phase_view_model.player'),
|
||||
can_submit_lie: readBoolean(player, 'can_submit_lie', 'session_detail.phase_view_model.player'),
|
||||
can_submit_guess: readBoolean(player, 'can_submit_guess', 'session_detail.phase_view_model.player'),
|
||||
can_view_final_result: readBoolean(player, 'can_view_final_result', 'session_detail.phase_view_model.player')
|
||||
}
|
||||
}
|
||||
};
|
||||
}
|
||||
|
||||
export function mapSessionDetailResponse(payload: unknown): SessionDetailResponse {
|
||||
return mapSessionDetail(payload);
|
||||
}
|
||||
|
||||
export function mapJoinSessionResponse(payload: unknown): JoinSessionResponse {
|
||||
const root = asRecord(payload, 'join_session');
|
||||
const player = asRecord(root.player, 'join_session.player');
|
||||
const session = asRecord(root.session, 'join_session.session');
|
||||
|
||||
return {
|
||||
player: {
|
||||
id: readNumber(player, 'id', 'join_session.player'),
|
||||
nickname: readString(player, 'nickname', 'join_session.player'),
|
||||
session_token: readString(player, 'session_token', 'join_session.player'),
|
||||
score: readNumber(player, 'score', 'join_session.player')
|
||||
},
|
||||
session: {
|
||||
code: readString(session, 'code', 'join_session.session'),
|
||||
status: readString(session, 'status', 'join_session.session')
|
||||
}
|
||||
};
|
||||
}
|
||||
|
||||
export function mapStartRoundResponse(payload: unknown): StartRoundResponse {
|
||||
const root = asRecord(payload, 'start_round');
|
||||
const session = asRecord(root.session, 'start_round.session');
|
||||
const round = asRecord(root.round, 'start_round.round');
|
||||
const category = asRecord(round.category, 'start_round.round.category');
|
||||
|
||||
return {
|
||||
session: {
|
||||
code: readString(session, 'code', 'start_round.session'),
|
||||
status: readString(session, 'status', 'start_round.session'),
|
||||
current_round: readNumber(session, 'current_round', 'start_round.session')
|
||||
},
|
||||
round: {
|
||||
number: readNumber(round, 'number', 'start_round.round'),
|
||||
category: {
|
||||
slug: readString(category, 'slug', 'start_round.round.category'),
|
||||
name: readString(category, 'name', 'start_round.round.category')
|
||||
}
|
||||
}
|
||||
};
|
||||
}
|
||||
|
||||
function mapLeaderboardEntry(payload: unknown, path: string): { id: number; nickname: string; score: number } {
|
||||
const record = asRecord(payload, path);
|
||||
return {
|
||||
id: readNumber(record, 'id', path),
|
||||
nickname: readString(record, 'nickname', path),
|
||||
score: readNumber(record, 'score', path)
|
||||
};
|
||||
}
|
||||
|
||||
function mapSessionState(payload: unknown, path: string): { code: string; status: string; current_round: number } {
|
||||
const session = asRecord(payload, path);
|
||||
return {
|
||||
code: readString(session, 'code', path),
|
||||
status: readString(session, 'status', path),
|
||||
current_round: readNumber(session, 'current_round', path)
|
||||
};
|
||||
}
|
||||
|
||||
export function mapShowQuestionResponse(payload: unknown): ShowQuestionResponse {
|
||||
const root = asRecord(payload, 'show_question');
|
||||
const roundQuestion = asRecord(root.round_question, 'show_question.round_question');
|
||||
const config = asRecord(root.config, 'show_question.config');
|
||||
|
||||
return {
|
||||
round_question: {
|
||||
id: readNumber(roundQuestion, 'id', 'show_question.round_question'),
|
||||
prompt: readString(roundQuestion, 'prompt', 'show_question.round_question'),
|
||||
round_number: readNumber(roundQuestion, 'round_number', 'show_question.round_question'),
|
||||
shown_at: readString(roundQuestion, 'shown_at', 'show_question.round_question'),
|
||||
lie_deadline_at: readString(roundQuestion, 'lie_deadline_at', 'show_question.round_question')
|
||||
},
|
||||
config: {
|
||||
lie_seconds: readNumber(config, 'lie_seconds', 'show_question.config')
|
||||
}
|
||||
};
|
||||
}
|
||||
|
||||
export function mapMixAnswersResponse(payload: unknown): MixAnswersResponse {
|
||||
const root = asRecord(payload, 'mix_answers');
|
||||
const roundQuestion = asRecord(root.round_question, 'mix_answers.round_question');
|
||||
const answersRaw = root.answers;
|
||||
if (!Array.isArray(answersRaw)) {
|
||||
throw new Error('Invalid API contract: expected array at mix_answers.answers');
|
||||
}
|
||||
|
||||
return {
|
||||
session: mapSessionState(root.session, 'mix_answers.session'),
|
||||
round_question: {
|
||||
id: readNumber(roundQuestion, 'id', 'mix_answers.round_question'),
|
||||
round_number: readNumber(roundQuestion, 'round_number', 'mix_answers.round_question')
|
||||
},
|
||||
answers: answersRaw.map((answer, index) => {
|
||||
const record = asRecord(answer, `mix_answers.answers[${index}]`);
|
||||
return { text: readString(record, 'text', `mix_answers.answers[${index}]`) };
|
||||
})
|
||||
};
|
||||
}
|
||||
|
||||
export function mapCalculateScoresResponse(payload: unknown): CalculateScoresResponse {
|
||||
const root = asRecord(payload, 'calculate_scores');
|
||||
const roundQuestion = asRecord(root.round_question, 'calculate_scores.round_question');
|
||||
const leaderboardRaw = root.leaderboard;
|
||||
if (!Array.isArray(leaderboardRaw)) {
|
||||
throw new Error('Invalid API contract: expected array at calculate_scores.leaderboard');
|
||||
}
|
||||
|
||||
return {
|
||||
session: mapSessionState(root.session, 'calculate_scores.session'),
|
||||
round_question: {
|
||||
id: readNumber(roundQuestion, 'id', 'calculate_scores.round_question'),
|
||||
round_number: readNumber(roundQuestion, 'round_number', 'calculate_scores.round_question')
|
||||
},
|
||||
events_created: readNumber(root, 'events_created', 'calculate_scores'),
|
||||
leaderboard: leaderboardRaw.map((entry, index) => mapLeaderboardEntry(entry, `calculate_scores.leaderboard[${index}]`))
|
||||
};
|
||||
}
|
||||
|
||||
export function mapScoreboardResponse(payload: unknown): ScoreboardResponse {
|
||||
const root = asRecord(payload, 'scoreboard');
|
||||
const leaderboardRaw = root.leaderboard;
|
||||
if (!Array.isArray(leaderboardRaw)) {
|
||||
throw new Error('Invalid API contract: expected array at scoreboard.leaderboard');
|
||||
}
|
||||
|
||||
return {
|
||||
session: mapSessionState(root.session, 'scoreboard.session'),
|
||||
leaderboard: leaderboardRaw.map((entry, index) => mapLeaderboardEntry(entry, `scoreboard.leaderboard[${index}]`))
|
||||
};
|
||||
}
|
||||
|
||||
export function mapStartNextRoundResponse(payload: unknown): StartNextRoundResponse {
|
||||
const root = asRecord(payload, 'start_next_round');
|
||||
return { session: mapSessionState(root.session, 'start_next_round.session') };
|
||||
}
|
||||
|
||||
export function mapFinishGameResponse(payload: unknown): FinishGameResponse {
|
||||
const root = asRecord(payload, 'finish_game');
|
||||
const leaderboardRaw = root.leaderboard;
|
||||
if (!Array.isArray(leaderboardRaw)) {
|
||||
throw new Error('Invalid API contract: expected array at finish_game.leaderboard');
|
||||
}
|
||||
|
||||
const winnerRaw = root.winner;
|
||||
|
||||
return {
|
||||
session: mapSessionState(root.session, 'finish_game.session'),
|
||||
winner: winnerRaw === null ? null : mapLeaderboardEntry(winnerRaw, 'finish_game.winner'),
|
||||
leaderboard: leaderboardRaw.map((entry, index) => mapLeaderboardEntry(entry, `finish_game.leaderboard[${index}]`))
|
||||
};
|
||||
}
|
||||
|
||||
export function mapSubmitLieResponse(payload: unknown): SubmitLieResponse {
|
||||
const root = asRecord(payload, 'submit_lie');
|
||||
const lie = asRecord(root.lie, 'submit_lie.lie');
|
||||
const window = asRecord(root.window, 'submit_lie.window');
|
||||
|
||||
return {
|
||||
lie: {
|
||||
id: readNumber(lie, 'id', 'submit_lie.lie'),
|
||||
player_id: readNumber(lie, 'player_id', 'submit_lie.lie'),
|
||||
round_question_id: readNumber(lie, 'round_question_id', 'submit_lie.lie'),
|
||||
text: readString(lie, 'text', 'submit_lie.lie'),
|
||||
created_at: readString(lie, 'created_at', 'submit_lie.lie')
|
||||
},
|
||||
window: {
|
||||
lie_deadline_at: readString(window, 'lie_deadline_at', 'submit_lie.window')
|
||||
}
|
||||
};
|
||||
}
|
||||
|
||||
export function mapSubmitGuessResponse(payload: unknown): SubmitGuessResponse {
|
||||
const root = asRecord(payload, 'submit_guess');
|
||||
const guess = asRecord(root.guess, 'submit_guess.guess');
|
||||
const window = asRecord(root.window, 'submit_guess.window');
|
||||
const fooledPlayerId = readNullableNumber(guess, 'fooled_player_id', 'submit_guess.guess');
|
||||
|
||||
return {
|
||||
guess: {
|
||||
id: readNumber(guess, 'id', 'submit_guess.guess'),
|
||||
player_id: readNumber(guess, 'player_id', 'submit_guess.guess'),
|
||||
round_question_id: readNumber(guess, 'round_question_id', 'submit_guess.guess'),
|
||||
selected_text: readString(guess, 'selected_text', 'submit_guess.guess'),
|
||||
is_correct: readBoolean(guess, 'is_correct', 'submit_guess.guess'),
|
||||
fooled_player_id: fooledPlayerId,
|
||||
created_at: readString(guess, 'created_at', 'submit_guess.guess')
|
||||
},
|
||||
window: {
|
||||
guess_deadline_at: readString(window, 'guess_deadline_at', 'submit_guess.window')
|
||||
}
|
||||
};
|
||||
}
|
||||
@@ -1,249 +0,0 @@
|
||||
export interface HealthResponse {
|
||||
ok: boolean;
|
||||
service: string;
|
||||
}
|
||||
|
||||
export interface SessionSummary {
|
||||
code: string;
|
||||
status: string;
|
||||
host_id: number | null;
|
||||
current_round: number;
|
||||
players_count: number;
|
||||
}
|
||||
|
||||
export interface SessionPlayer {
|
||||
id: number;
|
||||
nickname: string;
|
||||
score: number;
|
||||
is_connected: boolean;
|
||||
}
|
||||
|
||||
export interface SessionAnswer {
|
||||
text: string;
|
||||
}
|
||||
|
||||
export interface SessionRoundQuestion {
|
||||
id: number;
|
||||
round_number: number;
|
||||
prompt: string;
|
||||
shown_at: string;
|
||||
answers: SessionAnswer[];
|
||||
}
|
||||
|
||||
export interface PhaseViewModel {
|
||||
status: string;
|
||||
round_number: number;
|
||||
players_count: number;
|
||||
constraints: {
|
||||
min_players_to_start: number;
|
||||
max_players_mvp: number;
|
||||
min_players_reached: boolean;
|
||||
max_players_allowed: boolean;
|
||||
};
|
||||
host: {
|
||||
can_start_round: boolean;
|
||||
can_show_question: boolean;
|
||||
can_mix_answers: boolean;
|
||||
can_calculate_scores: boolean;
|
||||
can_reveal_scoreboard: boolean;
|
||||
can_start_next_round: boolean;
|
||||
can_finish_game: boolean;
|
||||
};
|
||||
player: {
|
||||
can_join: boolean;
|
||||
can_submit_lie: boolean;
|
||||
can_submit_guess: boolean;
|
||||
can_view_final_result: boolean;
|
||||
};
|
||||
}
|
||||
|
||||
export interface RevealLie {
|
||||
player_id: number;
|
||||
nickname: string;
|
||||
text: string;
|
||||
created_at: string;
|
||||
}
|
||||
|
||||
export interface RevealGuess {
|
||||
player_id: number;
|
||||
nickname: string;
|
||||
selected_text: string;
|
||||
is_correct: boolean;
|
||||
fooled_player_id: number | null;
|
||||
fooled_player_nickname?: string;
|
||||
created_at: string;
|
||||
}
|
||||
|
||||
export interface RevealPayload {
|
||||
round_question_id: number;
|
||||
round_number: number;
|
||||
prompt: string;
|
||||
correct_answer: string;
|
||||
lies: RevealLie[];
|
||||
guesses: RevealGuess[];
|
||||
}
|
||||
|
||||
export interface SessionDetailResponse {
|
||||
session: SessionSummary;
|
||||
players: SessionPlayer[];
|
||||
round_question: SessionRoundQuestion | null;
|
||||
reveal: RevealPayload | null;
|
||||
phase_view_model: PhaseViewModel;
|
||||
}
|
||||
|
||||
export interface JoinSessionRequest {
|
||||
code: string;
|
||||
nickname: string;
|
||||
}
|
||||
|
||||
export interface JoinSessionResponse {
|
||||
player: {
|
||||
id: number;
|
||||
nickname: string;
|
||||
session_token: string;
|
||||
score: number;
|
||||
};
|
||||
session: {
|
||||
code: string;
|
||||
status: string;
|
||||
};
|
||||
}
|
||||
|
||||
export interface StartRoundRequest {
|
||||
category_slug: string;
|
||||
}
|
||||
|
||||
export interface StartRoundResponse {
|
||||
session: {
|
||||
code: string;
|
||||
status: string;
|
||||
current_round: number;
|
||||
};
|
||||
round: {
|
||||
number: number;
|
||||
category: {
|
||||
slug: string;
|
||||
name: string;
|
||||
};
|
||||
};
|
||||
}
|
||||
|
||||
export interface ShowQuestionResponse {
|
||||
round_question: {
|
||||
id: number;
|
||||
prompt: string;
|
||||
round_number: number;
|
||||
shown_at: string;
|
||||
lie_deadline_at: string;
|
||||
};
|
||||
config: {
|
||||
lie_seconds: number;
|
||||
};
|
||||
}
|
||||
|
||||
export interface MixAnswersResponse {
|
||||
session: {
|
||||
code: string;
|
||||
status: string;
|
||||
current_round: number;
|
||||
};
|
||||
round_question: {
|
||||
id: number;
|
||||
round_number: number;
|
||||
};
|
||||
answers: Array<{ text: string }>;
|
||||
}
|
||||
|
||||
export interface CalculateScoresResponse {
|
||||
session: {
|
||||
code: string;
|
||||
status: string;
|
||||
current_round: number;
|
||||
};
|
||||
round_question: {
|
||||
id: number;
|
||||
round_number: number;
|
||||
};
|
||||
events_created: number;
|
||||
leaderboard: Array<{ id: number; nickname: string; score: number }>;
|
||||
}
|
||||
|
||||
export interface ScoreboardResponse {
|
||||
session: {
|
||||
code: string;
|
||||
status: string;
|
||||
current_round: number;
|
||||
};
|
||||
leaderboard: Array<{ id: number; nickname: string; score: number }>;
|
||||
}
|
||||
|
||||
export interface StartNextRoundResponse {
|
||||
session: {
|
||||
code: string;
|
||||
status: string;
|
||||
current_round: number;
|
||||
};
|
||||
}
|
||||
|
||||
export interface FinishGameResponse {
|
||||
session: {
|
||||
code: string;
|
||||
status: string;
|
||||
current_round: number;
|
||||
};
|
||||
winner: { id: number; nickname: string; score: number } | null;
|
||||
leaderboard: Array<{ id: number; nickname: string; score: number }>;
|
||||
}
|
||||
|
||||
export interface SubmitLieRequest {
|
||||
player_id: number;
|
||||
session_token: string;
|
||||
text: string;
|
||||
}
|
||||
|
||||
export interface SubmitLieResponse {
|
||||
lie: {
|
||||
id: number;
|
||||
player_id: number;
|
||||
round_question_id: number;
|
||||
text: string;
|
||||
created_at: string;
|
||||
};
|
||||
window: {
|
||||
lie_deadline_at: string;
|
||||
};
|
||||
}
|
||||
|
||||
export interface SubmitGuessRequest {
|
||||
player_id: number;
|
||||
session_token: string;
|
||||
selected_text: string;
|
||||
}
|
||||
|
||||
export interface SubmitGuessResponse {
|
||||
guess: {
|
||||
id: number;
|
||||
player_id: number;
|
||||
round_question_id: number;
|
||||
selected_text: string;
|
||||
is_correct: boolean;
|
||||
fooled_player_id: number | null;
|
||||
created_at: string;
|
||||
};
|
||||
window: {
|
||||
guess_deadline_at: string;
|
||||
};
|
||||
}
|
||||
|
||||
export type ApiErrorKind = 'network' | 'http' | 'parse';
|
||||
|
||||
export interface ApiFailure {
|
||||
kind: ApiErrorKind;
|
||||
message: string;
|
||||
status: number;
|
||||
payload?: unknown;
|
||||
}
|
||||
|
||||
export type ApiResult<T> =
|
||||
| { ok: true; status: number; data: T }
|
||||
| { ok: false; status: number; error: ApiFailure };
|
||||
@@ -1,58 +0,0 @@
|
||||
import type { SessionDetailResponse } from '../api/types';
|
||||
|
||||
export type GameplayPhase = 'lie' | 'guess' | 'reveal' | 'scoreboard';
|
||||
|
||||
export type GameplayPhaseEvent =
|
||||
| 'LIES_LOCKED'
|
||||
| 'GUESSES_LOCKED'
|
||||
| 'SCOREBOARD_READY'
|
||||
| 'NEXT_ROUND';
|
||||
|
||||
export interface GameplayTransitionResult {
|
||||
phase: GameplayPhase;
|
||||
changed: boolean;
|
||||
}
|
||||
|
||||
const TRANSITIONS: Record<GameplayPhase, Partial<Record<GameplayPhaseEvent, GameplayPhase>>> = {
|
||||
lie: {
|
||||
LIES_LOCKED: 'guess'
|
||||
},
|
||||
guess: {
|
||||
GUESSES_LOCKED: 'reveal'
|
||||
},
|
||||
reveal: {
|
||||
SCOREBOARD_READY: 'scoreboard'
|
||||
},
|
||||
scoreboard: {
|
||||
NEXT_ROUND: 'lie'
|
||||
}
|
||||
};
|
||||
|
||||
export function transitionGameplayPhase(phase: GameplayPhase, event: GameplayPhaseEvent): GameplayTransitionResult {
|
||||
const next = TRANSITIONS[phase][event] ?? phase;
|
||||
return {
|
||||
phase: next,
|
||||
changed: next !== phase
|
||||
};
|
||||
}
|
||||
|
||||
export function allowedGameplayEvents(phase: GameplayPhase): GameplayPhaseEvent[] {
|
||||
return Object.keys(TRANSITIONS[phase]) as GameplayPhaseEvent[];
|
||||
}
|
||||
|
||||
export function deriveGameplayPhase(session: SessionDetailResponse | null): GameplayPhase | null {
|
||||
const status = session?.session.status;
|
||||
if (!status) {
|
||||
return null;
|
||||
}
|
||||
|
||||
if (status === 'lie' || status === 'guess' || status === 'reveal' || status === 'scoreboard') {
|
||||
return status;
|
||||
}
|
||||
|
||||
if (status === 'finished') {
|
||||
return 'scoreboard';
|
||||
}
|
||||
|
||||
return null;
|
||||
}
|
||||
@@ -1,48 +0,0 @@
|
||||
import { DEFAULT_LOCALE, LOBBY_I18N_CATALOG, normalizeLocale } from '../../shared/i18n/lobby-loader';
|
||||
|
||||
const frontendErrors = LOBBY_I18N_CATALOG.frontend.errors;
|
||||
const backendToFrontendErrorKeys = LOBBY_I18N_CATALOG.contract.backend_to_frontend_error_keys as Record<
|
||||
string,
|
||||
keyof typeof frontendErrors
|
||||
>;
|
||||
|
||||
type FrontendErrorKey = keyof typeof frontendErrors;
|
||||
|
||||
function isFrontendErrorKey(value: string): value is FrontendErrorKey {
|
||||
return value in frontendErrors;
|
||||
}
|
||||
|
||||
export function lobbyMessage(key: FrontendErrorKey, locale?: string): string {
|
||||
const resolvedLocale = normalizeLocale(locale);
|
||||
const translations = frontendErrors[key] as Record<string, string>;
|
||||
|
||||
if (translations[resolvedLocale]) {
|
||||
return translations[resolvedLocale];
|
||||
}
|
||||
if (translations[DEFAULT_LOCALE]) {
|
||||
return translations[DEFAULT_LOCALE];
|
||||
}
|
||||
|
||||
return key;
|
||||
}
|
||||
|
||||
export function lobbyMessageFromApiPayload(payload: unknown, fallbackKey: FrontendErrorKey, locale?: string): string {
|
||||
if (!payload || typeof payload !== 'object') {
|
||||
return lobbyMessage(fallbackKey, locale);
|
||||
}
|
||||
|
||||
const record = payload as Record<string, unknown>;
|
||||
const code = typeof record.error_code === 'string' ? record.error_code : '';
|
||||
const payloadLocale = typeof record.locale === 'string' ? record.locale : locale;
|
||||
const mappedKey = code ? backendToFrontendErrorKeys[code] : undefined;
|
||||
|
||||
if (mappedKey && isFrontendErrorKey(mappedKey)) {
|
||||
return lobbyMessage(mappedKey, payloadLocale);
|
||||
}
|
||||
|
||||
if (isFrontendErrorKey(code)) {
|
||||
return lobbyMessage(code, payloadLocale);
|
||||
}
|
||||
|
||||
return lobbyMessage(fallbackKey, payloadLocale);
|
||||
}
|
||||
@@ -1,123 +0,0 @@
|
||||
export interface SessionContext {
|
||||
sessionCode: string;
|
||||
playerId: number;
|
||||
token: string;
|
||||
}
|
||||
|
||||
export interface SessionContextInput {
|
||||
sessionCode: string;
|
||||
playerId: number;
|
||||
token: string;
|
||||
}
|
||||
|
||||
export interface SessionContextStore {
|
||||
get(): SessionContext | null;
|
||||
set(input: SessionContextInput): SessionContext;
|
||||
clear(): void;
|
||||
}
|
||||
|
||||
export interface StorageLike {
|
||||
getItem(key: string): string | null;
|
||||
setItem(key: string, value: string): void;
|
||||
removeItem(key: string): void;
|
||||
}
|
||||
|
||||
const DEFAULT_STORAGE_KEY = 'wpp.session-context';
|
||||
|
||||
function normalizeSessionCode(value: string): string {
|
||||
return value.trim().toUpperCase();
|
||||
}
|
||||
|
||||
function normalizeToken(value: string): string {
|
||||
return value.trim();
|
||||
}
|
||||
|
||||
function toContext(input: SessionContextInput): SessionContext {
|
||||
const sessionCode = normalizeSessionCode(input.sessionCode);
|
||||
const token = normalizeToken(input.token);
|
||||
|
||||
if (!sessionCode) {
|
||||
throw new Error('sessionCode is required');
|
||||
}
|
||||
if (!Number.isInteger(input.playerId) || input.playerId <= 0) {
|
||||
throw new Error('playerId must be a positive integer');
|
||||
}
|
||||
if (!token) {
|
||||
throw new Error('token is required');
|
||||
}
|
||||
|
||||
return {
|
||||
sessionCode,
|
||||
playerId: input.playerId,
|
||||
token
|
||||
};
|
||||
}
|
||||
|
||||
function safeParse(raw: string): SessionContext | null {
|
||||
try {
|
||||
const data = JSON.parse(raw) as Partial<SessionContextInput>;
|
||||
if (typeof data.sessionCode !== 'string' || typeof data.playerId !== 'number' || typeof data.token !== 'string') {
|
||||
return null;
|
||||
}
|
||||
return toContext({
|
||||
sessionCode: data.sessionCode,
|
||||
playerId: data.playerId,
|
||||
token: data.token
|
||||
});
|
||||
} catch {
|
||||
return null;
|
||||
}
|
||||
}
|
||||
|
||||
export function createSessionContextStore(storage?: StorageLike, storageKey = DEFAULT_STORAGE_KEY): SessionContextStore {
|
||||
let current: SessionContext | null = null;
|
||||
|
||||
function getFromStorage(): SessionContext | null {
|
||||
if (!storage) {
|
||||
return null;
|
||||
}
|
||||
|
||||
const raw = storage.getItem(storageKey);
|
||||
if (!raw) {
|
||||
return null;
|
||||
}
|
||||
|
||||
const parsed = safeParse(raw);
|
||||
if (!parsed) {
|
||||
storage.removeItem(storageKey);
|
||||
return null;
|
||||
}
|
||||
|
||||
return parsed;
|
||||
}
|
||||
|
||||
return {
|
||||
get(): SessionContext | null {
|
||||
if (current) {
|
||||
return { ...current };
|
||||
}
|
||||
|
||||
const fromStorage = getFromStorage();
|
||||
if (fromStorage) {
|
||||
current = fromStorage;
|
||||
return { ...current };
|
||||
}
|
||||
|
||||
return null;
|
||||
},
|
||||
set(input: SessionContextInput): SessionContext {
|
||||
const normalized = toContext(input);
|
||||
current = normalized;
|
||||
if (storage) {
|
||||
storage.setItem(storageKey, JSON.stringify(normalized));
|
||||
}
|
||||
return { ...normalized };
|
||||
},
|
||||
clear(): void {
|
||||
current = null;
|
||||
if (storage) {
|
||||
storage.removeItem(storageKey);
|
||||
}
|
||||
}
|
||||
};
|
||||
}
|
||||
@@ -1,146 +0,0 @@
|
||||
import type { ApiClient } from '../api/client';
|
||||
import type { SessionDetailResponse } from '../api/types';
|
||||
import {
|
||||
createSessionContextStore,
|
||||
type SessionContext,
|
||||
type SessionContextInput,
|
||||
type SessionContextStore as PersistedSessionContextStore
|
||||
} from './session-context-store';
|
||||
import { deriveGameplayPhase, type GameplayPhase } from './gameplay-phase-machine';
|
||||
import { lobbyMessage, lobbyMessageFromApiPayload } from './lobby-i18n';
|
||||
|
||||
export type AsyncState = 'idle' | 'loading' | 'success' | 'error';
|
||||
|
||||
export type SessionContextStore = Pick<PersistedSessionContextStore, 'get' | 'set'>;
|
||||
|
||||
export interface VerticalSliceState {
|
||||
sessionCode: string;
|
||||
session: SessionDetailResponse | null;
|
||||
gameplayPhase: GameplayPhase | null;
|
||||
joinState: AsyncState;
|
||||
startRoundState: AsyncState;
|
||||
loadingSession: boolean;
|
||||
errorMessage: string | null;
|
||||
}
|
||||
|
||||
export interface VerticalSliceController {
|
||||
getState(): VerticalSliceState;
|
||||
hydrateLobby(sessionCode: string): Promise<VerticalSliceState>;
|
||||
joinLobby(sessionCode: string, nickname: string): Promise<VerticalSliceState>;
|
||||
startRound(sessionCode: string, categorySlug: string): Promise<VerticalSliceState>;
|
||||
}
|
||||
|
||||
export function createVerticalSliceController(
|
||||
api: ApiClient,
|
||||
sessionContextStore: SessionContextStore = createSessionContextStore()
|
||||
): VerticalSliceController {
|
||||
const persistedContext = sessionContextStore.get();
|
||||
|
||||
const state: VerticalSliceState = {
|
||||
sessionCode: persistedContext?.sessionCode ?? '',
|
||||
session: null,
|
||||
gameplayPhase: null,
|
||||
joinState: 'idle',
|
||||
startRoundState: 'idle',
|
||||
loadingSession: false,
|
||||
errorMessage: null
|
||||
};
|
||||
|
||||
const normalizeCode = (value: string): string => value.trim().toUpperCase();
|
||||
|
||||
async function hydrateLobby(sessionCode: string): Promise<VerticalSliceState> {
|
||||
state.loadingSession = true;
|
||||
state.errorMessage = null;
|
||||
|
||||
const normalizedRequestedCode = normalizeCode(sessionCode);
|
||||
const fallbackCode = normalizeCode(state.sessionCode || persistedContext?.sessionCode || '');
|
||||
state.sessionCode = normalizedRequestedCode || fallbackCode;
|
||||
|
||||
if (!state.sessionCode) {
|
||||
state.loadingSession = false;
|
||||
state.errorMessage = lobbyMessage('session_code_required');
|
||||
return { ...state };
|
||||
}
|
||||
|
||||
const result = await api.getSession(state.sessionCode);
|
||||
state.loadingSession = false;
|
||||
|
||||
if (!result.ok) {
|
||||
state.errorMessage = lobbyMessageFromApiPayload(result.error.payload, 'session_fetch_failed');
|
||||
state.gameplayPhase = null;
|
||||
return { ...state };
|
||||
}
|
||||
|
||||
state.session = result.data;
|
||||
state.gameplayPhase = deriveGameplayPhase(result.data);
|
||||
state.sessionCode = normalizeCode(result.data.session.code);
|
||||
|
||||
if (persistedContext && state.sessionCode === normalizeCode(persistedContext.sessionCode)) {
|
||||
sessionContextStore.set({ ...persistedContext, sessionCode: state.sessionCode });
|
||||
}
|
||||
|
||||
return { ...state };
|
||||
}
|
||||
|
||||
async function joinLobby(sessionCode: string, nickname: string): Promise<VerticalSliceState> {
|
||||
state.joinState = 'loading';
|
||||
state.errorMessage = null;
|
||||
|
||||
const normalizedRequestedCode = normalizeCode(sessionCode);
|
||||
const fallbackCode = normalizeCode(state.sessionCode || persistedContext?.sessionCode || '');
|
||||
const requestCode = normalizedRequestedCode || fallbackCode;
|
||||
|
||||
const join = await api.joinSession({ code: requestCode, nickname });
|
||||
if (!join.ok) {
|
||||
state.joinState = 'error';
|
||||
state.errorMessage = lobbyMessageFromApiPayload(join.error.payload, 'join_failed');
|
||||
return { ...state };
|
||||
}
|
||||
|
||||
state.joinState = 'success';
|
||||
state.sessionCode = normalizeCode(join.data.session.code || requestCode);
|
||||
|
||||
const nextContext: SessionContextInput = {
|
||||
sessionCode: state.sessionCode,
|
||||
playerId: join.data.player.id,
|
||||
token: join.data.player.session_token
|
||||
};
|
||||
sessionContextStore.set(nextContext);
|
||||
|
||||
return hydrateLobby(state.sessionCode);
|
||||
}
|
||||
|
||||
async function startRound(sessionCode: string, categorySlug: string): Promise<VerticalSliceState> {
|
||||
state.startRoundState = 'loading';
|
||||
state.errorMessage = null;
|
||||
|
||||
const normalizedRequestedCode = normalizeCode(sessionCode);
|
||||
const fallbackCode = normalizeCode(state.sessionCode || persistedContext?.sessionCode || '');
|
||||
const codeToUse = normalizedRequestedCode || fallbackCode;
|
||||
|
||||
if (!codeToUse) {
|
||||
state.startRoundState = 'error';
|
||||
state.errorMessage = lobbyMessage('session_code_required');
|
||||
return { ...state };
|
||||
}
|
||||
|
||||
const start = await api.startRound(codeToUse, { category_slug: categorySlug });
|
||||
if (!start.ok) {
|
||||
state.startRoundState = 'error';
|
||||
state.errorMessage = lobbyMessageFromApiPayload(start.error.payload, 'start_round_failed');
|
||||
return { ...state };
|
||||
}
|
||||
|
||||
state.startRoundState = 'success';
|
||||
return hydrateLobby(codeToUse);
|
||||
}
|
||||
|
||||
return {
|
||||
getState: () => ({ ...state }),
|
||||
hydrateLobby,
|
||||
joinLobby,
|
||||
startRound
|
||||
};
|
||||
}
|
||||
|
||||
export type { SessionContext };
|
||||
@@ -1,739 +0,0 @@
|
||||
import { describe, expect, it, vi } from 'vitest';
|
||||
|
||||
import { createAngularApiClient, type AngularHttpClientLike } from '../src/api/angular-client';
|
||||
import { mapSessionDetailResponse, mapSubmitGuessResponse } from '../src/api/mappers';
|
||||
|
||||
describe('createAngularApiClient', () => {
|
||||
it('reads health and session detail using Django-compatible endpoints', async () => {
|
||||
const get = vi.fn<AngularHttpClientLike['get']>(async <T>(url: string) => {
|
||||
if (url === '/healthz') {
|
||||
return { ok: true, service: 'partyhub' } as T;
|
||||
}
|
||||
|
||||
if (url === '/lobby/sessions/ABCD12') {
|
||||
return {
|
||||
session: { code: 'ABCD12', status: 'lobby', host_id: 1, current_round: 1, players_count: 2 },
|
||||
players: [
|
||||
{ id: 2, nickname: 'Maja', score: 0, is_connected: true },
|
||||
{ id: 3, nickname: 'Bo', score: 0, is_connected: false }
|
||||
],
|
||||
round_question: null,
|
||||
phase_view_model: {
|
||||
status: 'lobby',
|
||||
round_number: 1,
|
||||
players_count: 2,
|
||||
constraints: {
|
||||
min_players_to_start: 2,
|
||||
max_players_mvp: 8,
|
||||
min_players_reached: true,
|
||||
max_players_allowed: true
|
||||
},
|
||||
host: {
|
||||
can_start_round: true,
|
||||
can_show_question: false,
|
||||
can_mix_answers: false,
|
||||
can_calculate_scores: false,
|
||||
can_reveal_scoreboard: false,
|
||||
can_start_next_round: false,
|
||||
can_finish_game: false
|
||||
},
|
||||
player: {
|
||||
can_join: true,
|
||||
can_submit_lie: false,
|
||||
can_submit_guess: false,
|
||||
can_view_final_result: false
|
||||
}
|
||||
}
|
||||
} as T;
|
||||
}
|
||||
|
||||
throw { status: 404, error: { error: 'Not found' } };
|
||||
});
|
||||
|
||||
const post = vi.fn<AngularHttpClientLike['post']>(async <T>(url: string, body: unknown) => {
|
||||
if (url === '/lobby/sessions/join') {
|
||||
expect(body).toEqual({ code: 'ABCD12', nickname: 'Maja' });
|
||||
return {
|
||||
player: { id: 9, nickname: 'Maja', session_token: 'token-1', score: 0 },
|
||||
session: { code: 'ABCD12', status: 'lobby' }
|
||||
} as T;
|
||||
}
|
||||
|
||||
if (url === '/lobby/sessions/ABCD12/rounds/start') {
|
||||
expect(body).toEqual({ category_slug: 'history' });
|
||||
return {
|
||||
session: { code: 'ABCD12', status: 'lie', current_round: 1 },
|
||||
round: { number: 1, category: { slug: 'history', name: 'History' } }
|
||||
} as T;
|
||||
}
|
||||
|
||||
throw { status: 404, error: { error: 'Not found' } };
|
||||
});
|
||||
|
||||
const http = { get, post };
|
||||
const client = createAngularApiClient(http as AngularHttpClientLike);
|
||||
|
||||
const health = await client.health();
|
||||
expect(health.ok).toBe(true);
|
||||
if (health.ok) {
|
||||
expect(health.data.ok).toBe(true);
|
||||
expect(health.data.service).toBe('partyhub');
|
||||
}
|
||||
|
||||
const session = await client.getSession(' abcd12 ');
|
||||
expect(session.ok).toBe(true);
|
||||
if (session.ok) {
|
||||
expect(session.data.session.code).toBe('ABCD12');
|
||||
expect(session.data.session.host_id).toBe(1);
|
||||
expect(session.data.phase_view_model.host.can_start_round).toBe(true);
|
||||
}
|
||||
|
||||
const join = await client.joinSession({ code: ' abcd12 ', nickname: ' Maja ' });
|
||||
expect(join.ok).toBe(true);
|
||||
|
||||
const start = await client.startRound(' abcd12 ', { category_slug: 'history' });
|
||||
expect(start.ok).toBe(true);
|
||||
|
||||
expect(get).toHaveBeenNthCalledWith(1, '/healthz', { withCredentials: true });
|
||||
expect(get).toHaveBeenNthCalledWith(2, '/lobby/sessions/ABCD12', { withCredentials: true });
|
||||
expect(post).toHaveBeenNthCalledWith(
|
||||
1,
|
||||
'/lobby/sessions/join',
|
||||
{ code: 'ABCD12', nickname: 'Maja' },
|
||||
{ withCredentials: true }
|
||||
);
|
||||
expect(post).toHaveBeenNthCalledWith(
|
||||
2,
|
||||
'/lobby/sessions/ABCD12/rounds/start',
|
||||
{ category_slug: 'history' },
|
||||
{ withCredentials: true }
|
||||
);
|
||||
});
|
||||
|
||||
it('normalizes baseUrl with trailing slash to keep Django endpoint paths canonical', async () => {
|
||||
const get = vi.fn<AngularHttpClientLike['get']>(async <T>(url: string) => {
|
||||
if (url === '/api/healthz') {
|
||||
return { ok: true, service: 'partyhub' } as T;
|
||||
}
|
||||
if (url === '/api/lobby/sessions/ABCD12') {
|
||||
return {
|
||||
session: { code: 'ABCD12', status: 'lobby', host_id: 1, current_round: 1, players_count: 2 },
|
||||
players: [],
|
||||
round_question: null,
|
||||
phase_view_model: {
|
||||
status: 'lobby',
|
||||
round_number: 1,
|
||||
players_count: 2,
|
||||
constraints: {
|
||||
min_players_to_start: 2,
|
||||
max_players_mvp: 8,
|
||||
min_players_reached: true,
|
||||
max_players_allowed: true
|
||||
},
|
||||
host: {
|
||||
can_start_round: true,
|
||||
can_show_question: false,
|
||||
can_mix_answers: false,
|
||||
can_calculate_scores: false,
|
||||
can_reveal_scoreboard: false,
|
||||
can_start_next_round: false,
|
||||
can_finish_game: false
|
||||
},
|
||||
player: {
|
||||
can_join: true,
|
||||
can_submit_lie: false,
|
||||
can_submit_guess: false,
|
||||
can_view_final_result: false
|
||||
}
|
||||
}
|
||||
} as T;
|
||||
}
|
||||
throw { status: 404, error: { error: 'Not found' } };
|
||||
});
|
||||
|
||||
const post = vi.fn<AngularHttpClientLike['post']>(async <T>(url: string) => {
|
||||
if (url === '/api/lobby/sessions/join') {
|
||||
return {
|
||||
player: { id: 9, nickname: 'Maja', session_token: 'token-1', score: 0 },
|
||||
session: { code: 'ABCD12', status: 'lobby' }
|
||||
} as T;
|
||||
}
|
||||
if (url === '/api/lobby/sessions/ABCD12/rounds/start') {
|
||||
return {
|
||||
session: { code: 'ABCD12', status: 'lie', current_round: 1 },
|
||||
round: { number: 1, category: { slug: 'history', name: 'History' } }
|
||||
} as T;
|
||||
}
|
||||
throw { status: 404, error: { error: 'Not found' } };
|
||||
});
|
||||
|
||||
const client = createAngularApiClient({ get, post } as AngularHttpClientLike, '/api/');
|
||||
|
||||
await client.health();
|
||||
await client.getSession('abcd12');
|
||||
await client.joinSession({ code: 'abcd12', nickname: 'Maja' });
|
||||
await client.startRound('abcd12', { category_slug: 'history' });
|
||||
|
||||
expect(get).toHaveBeenNthCalledWith(1, '/api/healthz', { withCredentials: true });
|
||||
expect(get).toHaveBeenNthCalledWith(2, '/api/lobby/sessions/ABCD12', { withCredentials: true });
|
||||
expect(post).toHaveBeenNthCalledWith(
|
||||
1,
|
||||
'/api/lobby/sessions/join',
|
||||
{ code: 'ABCD12', nickname: 'Maja' },
|
||||
{ withCredentials: true }
|
||||
);
|
||||
expect(post).toHaveBeenNthCalledWith(
|
||||
2,
|
||||
'/api/lobby/sessions/ABCD12/rounds/start',
|
||||
{ category_slug: 'history' },
|
||||
{ withCredentials: true }
|
||||
);
|
||||
});
|
||||
|
||||
it('returns parse error when successful payload breaks typed contract', async () => {
|
||||
const http = {
|
||||
get: vi.fn<AngularHttpClientLike['get']>(async <T>() => ({ ok: true } as T)),
|
||||
post: vi.fn<AngularHttpClientLike['post']>(async <T>() => ({ ok: true } as T))
|
||||
};
|
||||
|
||||
const client = createAngularApiClient(http as AngularHttpClientLike);
|
||||
const session = await client.getSession('ABCD12');
|
||||
|
||||
expect(session.ok).toBe(false);
|
||||
if (!session.ok) {
|
||||
expect(session.status).toBe(200);
|
||||
expect(session.error.kind).toBe('parse');
|
||||
expect(session.error.message).toContain('Invalid API contract');
|
||||
}
|
||||
});
|
||||
|
||||
it('keeps canonical reveal payload stable when session detail is already in scoreboard phase', async () => {
|
||||
const get = vi.fn<AngularHttpClientLike['get']>(async <T>(url: string) => {
|
||||
if (url === '/lobby/sessions/ABCD12') {
|
||||
return {
|
||||
session: { code: 'ABCD12', status: 'scoreboard', host_id: 1, current_round: 1, players_count: 2 },
|
||||
players: [
|
||||
{ id: 2, nickname: 'Maja', score: 10, is_connected: true },
|
||||
{ id: 3, nickname: 'Bo', score: 7, is_connected: true }
|
||||
],
|
||||
round_question: {
|
||||
id: 77,
|
||||
round_number: 1,
|
||||
prompt: 'Q?',
|
||||
shown_at: '2026-03-01T18:00:00Z',
|
||||
answers: [{ text: 'A' }, { text: 'B' }]
|
||||
},
|
||||
reveal: {
|
||||
round_question_id: 77,
|
||||
round_number: 1,
|
||||
prompt: 'Q?',
|
||||
correct_answer: 'A',
|
||||
lies: [{ player_id: 2, nickname: 'Maja', text: 'B', created_at: '2026-03-01T18:00:05Z' }],
|
||||
guesses: [
|
||||
{
|
||||
player_id: 3,
|
||||
nickname: 'Bo',
|
||||
selected_text: 'B',
|
||||
is_correct: false,
|
||||
fooled_player_id: 2,
|
||||
fooled_player_nickname: 'Maja',
|
||||
created_at: '2026-03-01T18:00:15Z'
|
||||
}
|
||||
]
|
||||
},
|
||||
phase_view_model: {
|
||||
status: 'scoreboard',
|
||||
round_number: 1,
|
||||
players_count: 2,
|
||||
constraints: {
|
||||
min_players_to_start: 2,
|
||||
max_players_mvp: 8,
|
||||
min_players_reached: true,
|
||||
max_players_allowed: true
|
||||
},
|
||||
host: {
|
||||
can_start_round: false,
|
||||
can_show_question: false,
|
||||
can_mix_answers: false,
|
||||
can_calculate_scores: false,
|
||||
can_reveal_scoreboard: false,
|
||||
can_start_next_round: true,
|
||||
can_finish_game: true
|
||||
},
|
||||
player: {
|
||||
can_join: true,
|
||||
can_submit_lie: false,
|
||||
can_submit_guess: false,
|
||||
can_view_final_result: false
|
||||
}
|
||||
}
|
||||
} as T;
|
||||
}
|
||||
throw { status: 404, error: { error: 'Not found' } };
|
||||
});
|
||||
|
||||
const client = createAngularApiClient({ get, post: vi.fn() } as unknown as AngularHttpClientLike);
|
||||
const session = await client.getSession('abcd12');
|
||||
|
||||
expect(session.ok).toBe(true);
|
||||
if (session.ok) {
|
||||
expect(session.data.session.status).toBe('scoreboard');
|
||||
expect(session.data.reveal?.guesses[0].fooled_player_nickname).toBe('Maja');
|
||||
expect(session.data.phase_view_model.host.can_start_next_round).toBe(true);
|
||||
expect(session.data.phase_view_model.host.can_finish_game).toBe(true);
|
||||
}
|
||||
});
|
||||
|
||||
it('normalizes omitted fooled_player_id to null in canonical reveal payloads', async () => {
|
||||
const get = vi.fn<AngularHttpClientLike['get']>(async <T>(url: string) => {
|
||||
if (url === '/lobby/sessions/ABCD12') {
|
||||
return {
|
||||
session: { code: 'ABCD12', status: 'reveal', host_id: 1, current_round: 1, players_count: 2 },
|
||||
players: [
|
||||
{ id: 2, nickname: 'Maja', score: 10, is_connected: true },
|
||||
{ id: 3, nickname: 'Bo', score: 7, is_connected: true }
|
||||
],
|
||||
round_question: {
|
||||
id: 77,
|
||||
round_number: 1,
|
||||
prompt: 'Q?',
|
||||
shown_at: '2026-03-01T18:00:00Z',
|
||||
answers: [{ text: 'A' }, { text: 'B' }]
|
||||
},
|
||||
reveal: {
|
||||
round_question_id: 77,
|
||||
round_number: 1,
|
||||
prompt: 'Q?',
|
||||
correct_answer: 'A',
|
||||
lies: [],
|
||||
guesses: [
|
||||
{
|
||||
player_id: 3,
|
||||
nickname: 'Bo',
|
||||
selected_text: 'A',
|
||||
is_correct: true,
|
||||
created_at: '2026-03-01T18:00:15Z'
|
||||
}
|
||||
]
|
||||
},
|
||||
phase_view_model: {
|
||||
status: 'reveal',
|
||||
round_number: 1,
|
||||
players_count: 2,
|
||||
constraints: {
|
||||
min_players_to_start: 2,
|
||||
max_players_mvp: 8,
|
||||
min_players_reached: true,
|
||||
max_players_allowed: true
|
||||
},
|
||||
host: {
|
||||
can_start_round: false,
|
||||
can_show_question: false,
|
||||
can_mix_answers: false,
|
||||
can_calculate_scores: false,
|
||||
can_reveal_scoreboard: true,
|
||||
can_start_next_round: false,
|
||||
can_finish_game: false
|
||||
},
|
||||
player: {
|
||||
can_join: true,
|
||||
can_submit_lie: false,
|
||||
can_submit_guess: false,
|
||||
can_view_final_result: false
|
||||
}
|
||||
}
|
||||
} as T;
|
||||
}
|
||||
throw { status: 404, error: { error: 'Not found' } };
|
||||
});
|
||||
|
||||
const post = vi.fn<AngularHttpClientLike['post']>(async <T>(url: string, body: unknown) => {
|
||||
if (url === '/lobby/sessions/ABCD12/questions/77/guesses/submit') {
|
||||
expect(body).toEqual({ player_id: 9, session_token: 'tok', selected_text: 'A' });
|
||||
return {
|
||||
guess: {
|
||||
id: 200,
|
||||
player_id: 9,
|
||||
round_question_id: 77,
|
||||
selected_text: 'A',
|
||||
is_correct: false,
|
||||
created_at: '2026-03-01T16:01:00Z'
|
||||
},
|
||||
window: { guess_deadline_at: '2026-03-01T16:01:30Z' }
|
||||
} as T;
|
||||
}
|
||||
throw { status: 404, error: { error: 'Not found' } };
|
||||
});
|
||||
|
||||
const client = createAngularApiClient({ get, post } as AngularHttpClientLike);
|
||||
const session = await client.getSession('abcd12');
|
||||
|
||||
expect(session.ok).toBe(true);
|
||||
if (session.ok) {
|
||||
expect(session.data.reveal?.guesses[0].fooled_player_id).toBeNull();
|
||||
expect(session.data.reveal?.guesses[0]).not.toHaveProperty('fooled_player_nickname');
|
||||
}
|
||||
|
||||
const submitGuess = await client.submitGuess('ABCD12', 77, {
|
||||
player_id: 9,
|
||||
session_token: 'tok',
|
||||
selected_text: 'A'
|
||||
});
|
||||
expect(submitGuess.ok).toBe(true);
|
||||
if (submitGuess.ok) {
|
||||
expect(submitGuess.data.guess.fooled_player_id).toBeNull();
|
||||
}
|
||||
});
|
||||
|
||||
it('maps omitted fooled_player_id to null in submit guess mapper payloads', () => {
|
||||
const mapped = mapSubmitGuessResponse({
|
||||
guess: {
|
||||
id: 200,
|
||||
player_id: 9,
|
||||
round_question_id: 77,
|
||||
selected_text: 'A',
|
||||
is_correct: false,
|
||||
created_at: '2026-03-01T16:01:00Z'
|
||||
},
|
||||
window: { guess_deadline_at: '2026-03-01T16:01:30Z' }
|
||||
});
|
||||
|
||||
expect(mapped.guess.fooled_player_id).toBeNull();
|
||||
});
|
||||
|
||||
it('keeps fooled_player_nickname omitted when canonical reveal payload omits fooled player refs', () => {
|
||||
const mapped = mapSessionDetailResponse({
|
||||
session: { code: 'ABCD12', status: 'reveal', host_id: 1, current_round: 1, players_count: 2 },
|
||||
players: [
|
||||
{ id: 2, nickname: 'Maja', score: 10, is_connected: true },
|
||||
{ id: 3, nickname: 'Bo', score: 7, is_connected: true }
|
||||
],
|
||||
round_question: {
|
||||
id: 77,
|
||||
round_number: 1,
|
||||
prompt: 'Q?',
|
||||
shown_at: '2026-03-01T18:00:00Z',
|
||||
answers: [{ text: 'A' }, { text: 'B' }]
|
||||
},
|
||||
reveal: {
|
||||
round_question_id: 77,
|
||||
round_number: 1,
|
||||
prompt: 'Q?',
|
||||
correct_answer: 'A',
|
||||
lies: [],
|
||||
guesses: [
|
||||
{
|
||||
player_id: 3,
|
||||
nickname: 'Bo',
|
||||
selected_text: 'A',
|
||||
is_correct: true,
|
||||
created_at: '2026-03-01T18:00:15Z'
|
||||
}
|
||||
]
|
||||
},
|
||||
phase_view_model: {
|
||||
status: 'reveal',
|
||||
round_number: 1,
|
||||
players_count: 2,
|
||||
constraints: {
|
||||
min_players_to_start: 2,
|
||||
max_players_mvp: 8,
|
||||
min_players_reached: true,
|
||||
max_players_allowed: true
|
||||
},
|
||||
host: {
|
||||
can_start_round: false,
|
||||
can_show_question: false,
|
||||
can_mix_answers: false,
|
||||
can_calculate_scores: false,
|
||||
can_reveal_scoreboard: true,
|
||||
can_start_next_round: false,
|
||||
can_finish_game: false
|
||||
},
|
||||
player: {
|
||||
can_join: true,
|
||||
can_submit_lie: false,
|
||||
can_submit_guess: false,
|
||||
can_view_final_result: false
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
expect(mapped.reveal?.guesses[0].fooled_player_id).toBeNull();
|
||||
expect(mapped.reveal?.guesses[0]).not.toHaveProperty('fooled_player_nickname');
|
||||
});
|
||||
|
||||
it('rejects canonical reveal payloads that include fooled_player_nickname without fooled_player_id', () => {
|
||||
expect(() =>
|
||||
mapSessionDetailResponse({
|
||||
session: { code: 'ABCD12', status: 'reveal', host_id: 1, current_round: 1, players_count: 2 },
|
||||
players: [
|
||||
{ id: 2, nickname: 'Maja', score: 10, is_connected: true },
|
||||
{ id: 3, nickname: 'Bo', score: 7, is_connected: true }
|
||||
],
|
||||
round_question: {
|
||||
id: 77,
|
||||
round_number: 1,
|
||||
prompt: 'Q?',
|
||||
shown_at: '2026-03-01T18:00:00Z',
|
||||
answers: [{ text: 'A' }, { text: 'B' }]
|
||||
},
|
||||
reveal: {
|
||||
round_question_id: 77,
|
||||
round_number: 1,
|
||||
prompt: 'Q?',
|
||||
correct_answer: 'A',
|
||||
lies: [],
|
||||
guesses: [
|
||||
{
|
||||
player_id: 3,
|
||||
nickname: 'Bo',
|
||||
selected_text: 'A',
|
||||
is_correct: true,
|
||||
fooled_player_nickname: 'Maja',
|
||||
created_at: '2026-03-01T18:00:15Z'
|
||||
}
|
||||
]
|
||||
},
|
||||
phase_view_model: {
|
||||
status: 'reveal',
|
||||
round_number: 1,
|
||||
players_count: 2,
|
||||
constraints: {
|
||||
min_players_to_start: 2,
|
||||
max_players_mvp: 8,
|
||||
min_players_reached: true,
|
||||
max_players_allowed: true
|
||||
},
|
||||
host: {
|
||||
can_start_round: false,
|
||||
can_show_question: false,
|
||||
can_mix_answers: false,
|
||||
can_calculate_scores: false,
|
||||
can_reveal_scoreboard: true,
|
||||
can_start_next_round: false,
|
||||
can_finish_game: false
|
||||
},
|
||||
player: {
|
||||
can_join: true,
|
||||
can_submit_lie: false,
|
||||
can_submit_guess: false,
|
||||
can_view_final_result: false
|
||||
}
|
||||
}
|
||||
})
|
||||
).toThrow('fooled_player_nickname to be omitted when fooled_player_id is null');
|
||||
});
|
||||
|
||||
it('rejects canonical reveal payloads that omit fooled_player_nickname when fooled_player_id is set', () => {
|
||||
expect(() =>
|
||||
mapSessionDetailResponse({
|
||||
session: { code: 'ABCD12', status: 'reveal', host_id: 1, current_round: 1, players_count: 2 },
|
||||
players: [
|
||||
{ id: 2, nickname: 'Maja', score: 10, is_connected: true },
|
||||
{ id: 3, nickname: 'Bo', score: 7, is_connected: true }
|
||||
],
|
||||
round_question: {
|
||||
id: 77,
|
||||
round_number: 1,
|
||||
prompt: 'Q?',
|
||||
shown_at: '2026-03-01T18:00:00Z',
|
||||
answers: [{ text: 'A' }, { text: 'B' }]
|
||||
},
|
||||
reveal: {
|
||||
round_question_id: 77,
|
||||
round_number: 1,
|
||||
prompt: 'Q?',
|
||||
correct_answer: 'A',
|
||||
lies: [],
|
||||
guesses: [
|
||||
{
|
||||
player_id: 3,
|
||||
nickname: 'Bo',
|
||||
selected_text: 'B',
|
||||
is_correct: false,
|
||||
fooled_player_id: 2,
|
||||
created_at: '2026-03-01T18:00:15Z'
|
||||
}
|
||||
]
|
||||
},
|
||||
phase_view_model: {
|
||||
status: 'reveal',
|
||||
round_number: 1,
|
||||
players_count: 2,
|
||||
constraints: {
|
||||
min_players_to_start: 2,
|
||||
max_players_mvp: 8,
|
||||
min_players_reached: true,
|
||||
max_players_allowed: true
|
||||
},
|
||||
host: {
|
||||
can_start_round: false,
|
||||
can_show_question: false,
|
||||
can_mix_answers: false,
|
||||
can_calculate_scores: false,
|
||||
can_reveal_scoreboard: true,
|
||||
can_start_next_round: false,
|
||||
can_finish_game: false
|
||||
},
|
||||
player: {
|
||||
can_join: true,
|
||||
can_submit_lie: false,
|
||||
can_submit_guess: false,
|
||||
can_view_final_result: false
|
||||
}
|
||||
}
|
||||
})
|
||||
).toThrow('fooled_player_nickname when fooled_player_id is set');
|
||||
});
|
||||
|
||||
it('maps host/player gameplay endpoints through typed response mappers', async () => {
|
||||
const get = vi.fn<AngularHttpClientLike['get']>(async <T>(url: string) => {
|
||||
if (url === '/lobby/sessions/ABCD12/scoreboard') {
|
||||
return {
|
||||
session: { code: 'ABCD12', status: 'scoreboard', current_round: 1 },
|
||||
leaderboard: [
|
||||
{ id: 2, nickname: 'Maja', score: 11 },
|
||||
{ id: 3, nickname: 'Bo', score: 7 }
|
||||
]
|
||||
} as T;
|
||||
}
|
||||
throw { status: 404, error: { error: 'Not found' } };
|
||||
});
|
||||
|
||||
const post = vi.fn<AngularHttpClientLike['post']>(async <T>(url: string, body: unknown) => {
|
||||
if (url === '/lobby/sessions/ABCD12/questions/show') {
|
||||
expect(body).toEqual({});
|
||||
return {
|
||||
round_question: {
|
||||
id: 77,
|
||||
prompt: 'Prompt?',
|
||||
round_number: 1,
|
||||
shown_at: '2026-03-01T16:00:00Z',
|
||||
lie_deadline_at: '2026-03-01T16:00:30Z'
|
||||
},
|
||||
config: { lie_seconds: 30 }
|
||||
} as T;
|
||||
}
|
||||
if (url === '/lobby/sessions/ABCD12/questions/77/answers/mix') {
|
||||
expect(body).toEqual({});
|
||||
return {
|
||||
session: { code: 'ABCD12', status: 'guess', current_round: 1 },
|
||||
round_question: { id: 77, round_number: 1 },
|
||||
answers: [{ text: 'A' }, { text: 'B' }]
|
||||
} as T;
|
||||
}
|
||||
if (url === '/lobby/sessions/ABCD12/questions/77/scores/calculate') {
|
||||
expect(body).toEqual({});
|
||||
return {
|
||||
session: { code: 'ABCD12', status: 'scoreboard', current_round: 1 },
|
||||
round_question: { id: 77, round_number: 1 },
|
||||
events_created: 3,
|
||||
leaderboard: [{ id: 2, nickname: 'Maja', score: 11 }]
|
||||
} as T;
|
||||
}
|
||||
if (url === '/lobby/sessions/ABCD12/rounds/next') {
|
||||
expect(body).toEqual({});
|
||||
return { session: { code: 'ABCD12', status: 'lie', current_round: 2 } } as T;
|
||||
}
|
||||
if (url === '/lobby/sessions/ABCD12/finish') {
|
||||
expect(body).toEqual({});
|
||||
return {
|
||||
session: { code: 'ABCD12', status: 'finished', current_round: 2 },
|
||||
winner: { id: 2, nickname: 'Maja', score: 15 },
|
||||
leaderboard: [{ id: 2, nickname: 'Maja', score: 15 }]
|
||||
} as T;
|
||||
}
|
||||
if (url === '/lobby/sessions/ABCD12/questions/77/lies/submit') {
|
||||
expect(body).toEqual({ player_id: 9, session_token: 'tok', text: 'my lie' });
|
||||
return {
|
||||
lie: {
|
||||
id: 100,
|
||||
player_id: 9,
|
||||
round_question_id: 77,
|
||||
text: 'my lie',
|
||||
created_at: '2026-03-01T16:00:10Z'
|
||||
},
|
||||
window: { lie_deadline_at: '2026-03-01T16:00:30Z' }
|
||||
} as T;
|
||||
}
|
||||
if (url === '/lobby/sessions/ABCD12/questions/77/guesses/submit') {
|
||||
expect(body).toEqual({ player_id: 9, session_token: 'tok', selected_text: 'A' });
|
||||
return {
|
||||
guess: {
|
||||
id: 200,
|
||||
player_id: 9,
|
||||
round_question_id: 77,
|
||||
selected_text: 'A',
|
||||
is_correct: false,
|
||||
fooled_player_id: 3,
|
||||
created_at: '2026-03-01T16:01:00Z'
|
||||
},
|
||||
window: { guess_deadline_at: '2026-03-01T16:01:30Z' }
|
||||
} as T;
|
||||
}
|
||||
|
||||
throw { status: 404, error: { error: 'Not found' } };
|
||||
});
|
||||
|
||||
const client = createAngularApiClient({ get, post } as AngularHttpClientLike);
|
||||
|
||||
const showQuestion = await client.showQuestion('abcd12');
|
||||
expect(showQuestion.ok).toBe(true);
|
||||
|
||||
const mixAnswers = await client.mixAnswers('abcd12', 77);
|
||||
expect(mixAnswers.ok).toBe(true);
|
||||
|
||||
const calculateScores = await client.calculateScores('abcd12', 77);
|
||||
expect(calculateScores.ok).toBe(true);
|
||||
|
||||
const scoreboard = await client.getScoreboard('abcd12');
|
||||
expect(scoreboard.ok).toBe(true);
|
||||
|
||||
const nextRound = await client.startNextRound('abcd12');
|
||||
expect(nextRound.ok).toBe(true);
|
||||
|
||||
const finish = await client.finishGame('abcd12');
|
||||
expect(finish.ok).toBe(true);
|
||||
|
||||
const submitLie = await client.submitLie('abcd12', 77, { player_id: 9, session_token: 'tok', text: 'my lie' });
|
||||
expect(submitLie.ok).toBe(true);
|
||||
|
||||
const submitGuess = await client.submitGuess('abcd12', 77, {
|
||||
player_id: 9,
|
||||
session_token: 'tok',
|
||||
selected_text: 'A'
|
||||
});
|
||||
expect(submitGuess.ok).toBe(true);
|
||||
});
|
||||
|
||||
it('maps HttpErrorResponse-style failures to ApiResult errors', async () => {
|
||||
const http = {
|
||||
get: vi.fn<AngularHttpClientLike['get']>(async () => {
|
||||
throw { status: 503, message: 'Service unavailable', error: { error: 'maintenance' } };
|
||||
}),
|
||||
post: vi.fn<AngularHttpClientLike['post']>(async () => {
|
||||
throw { status: 403, message: 'Forbidden', error: { error: 'Only host can start round' } };
|
||||
})
|
||||
};
|
||||
|
||||
const client = createAngularApiClient(http as AngularHttpClientLike);
|
||||
const health = await client.health();
|
||||
|
||||
expect(health.ok).toBe(false);
|
||||
if (!health.ok) {
|
||||
expect(health.status).toBe(503);
|
||||
expect(health.error.kind).toBe('http');
|
||||
expect(health.error.payload).toEqual({ error: 'maintenance' });
|
||||
expect(health.error.message).toContain('Service unavailable');
|
||||
}
|
||||
|
||||
const start = await client.startRound('ABCD12', { category_slug: 'history' });
|
||||
expect(start.ok).toBe(false);
|
||||
if (!start.ok) {
|
||||
expect(start.status).toBe(403);
|
||||
expect(start.error.kind).toBe('http');
|
||||
expect(start.error.payload).toEqual({ error: 'Only host can start round' });
|
||||
}
|
||||
});
|
||||
});
|
||||
@@ -1,166 +0,0 @@
|
||||
import { afterAll, beforeAll, describe, expect, it } from 'vitest';
|
||||
import { AddressInfo } from 'node:net';
|
||||
import { createServer, type IncomingMessage, type Server, type ServerResponse } from 'node:http';
|
||||
import { createApiClient } from '../src/api/client';
|
||||
|
||||
let server: Server;
|
||||
let baseUrl: string;
|
||||
|
||||
beforeAll(async () => {
|
||||
server = createServer(async (req: IncomingMessage, res: ServerResponse) => {
|
||||
if (req.url === '/healthz') {
|
||||
res.writeHead(200, { 'content-type': 'application/json' });
|
||||
res.end(JSON.stringify({ ok: true, service: 'weirsoe-party-protocol' }));
|
||||
return;
|
||||
}
|
||||
|
||||
if (req.url === '/lobby/sessions/ABCD12' && req.method === 'GET') {
|
||||
res.writeHead(200, { 'content-type': 'application/json' });
|
||||
res.end(
|
||||
JSON.stringify({
|
||||
session: { code: 'ABCD12', status: 'lobby', host_id: 1, current_round: 1, players_count: 3 },
|
||||
players: [],
|
||||
round_question: null,
|
||||
phase_view_model: {
|
||||
status: 'lobby',
|
||||
round_number: 1,
|
||||
players_count: 3,
|
||||
constraints: {
|
||||
min_players_to_start: 3,
|
||||
max_players_mvp: 5,
|
||||
min_players_reached: true,
|
||||
max_players_allowed: true
|
||||
},
|
||||
host: {
|
||||
can_start_round: true,
|
||||
can_show_question: false,
|
||||
can_mix_answers: false,
|
||||
can_calculate_scores: false,
|
||||
can_reveal_scoreboard: false,
|
||||
can_start_next_round: false,
|
||||
can_finish_game: false
|
||||
},
|
||||
player: {
|
||||
can_join: true,
|
||||
can_submit_lie: false,
|
||||
can_submit_guess: false,
|
||||
can_view_final_result: false
|
||||
}
|
||||
}
|
||||
})
|
||||
);
|
||||
return;
|
||||
}
|
||||
|
||||
if (req.url === '/lobby/sessions/join' && req.method === 'POST') {
|
||||
res.writeHead(201, { 'content-type': 'application/json' });
|
||||
res.end(
|
||||
JSON.stringify({
|
||||
player: { id: 9, nickname: 'Maja', session_token: 'token-1', score: 0 },
|
||||
session: { code: 'ABCD12', status: 'lobby' }
|
||||
})
|
||||
);
|
||||
return;
|
||||
}
|
||||
|
||||
if (req.url === '/lobby/sessions/ABCD12/rounds/start' && req.method === 'POST') {
|
||||
res.writeHead(201, { 'content-type': 'application/json' });
|
||||
res.end(
|
||||
JSON.stringify({
|
||||
session: { code: 'ABCD12', status: 'lie', current_round: 1 },
|
||||
round: { number: 1, category: { slug: 'history', name: 'History' } }
|
||||
})
|
||||
);
|
||||
return;
|
||||
}
|
||||
|
||||
if (req.url === '/lobby/sessions/BADMAP' && req.method === 'GET') {
|
||||
res.writeHead(200, { 'content-type': 'application/json' });
|
||||
res.end(JSON.stringify({ session: { code: 'BADMAP' } }));
|
||||
return;
|
||||
}
|
||||
|
||||
if (req.url?.startsWith('/lobby/sessions/')) {
|
||||
res.writeHead(404, { 'content-type': 'application/json' });
|
||||
res.end(JSON.stringify({ error: 'Session not found' }));
|
||||
return;
|
||||
}
|
||||
|
||||
res.writeHead(500, { 'content-type': 'application/json' });
|
||||
res.end(JSON.stringify({ error: 'unexpected route' }));
|
||||
});
|
||||
|
||||
await new Promise<void>((resolve) => server.listen(0, '127.0.0.1', () => resolve()));
|
||||
const { port } = server.address() as AddressInfo;
|
||||
baseUrl = `http://127.0.0.1:${port}`;
|
||||
});
|
||||
|
||||
afterAll(async () => {
|
||||
await new Promise<void>((resolve, reject) =>
|
||||
server.close((err?: Error) => (err ? reject(err) : resolve()))
|
||||
);
|
||||
});
|
||||
|
||||
describe('createApiClient', () => {
|
||||
it('reads health + session detail through typed wrappers', async () => {
|
||||
const client = createApiClient(baseUrl);
|
||||
|
||||
const health = await client.health();
|
||||
expect(health.ok).toBe(true);
|
||||
|
||||
const session = await client.getSession('abcd12');
|
||||
expect(session.ok).toBe(true);
|
||||
if (session.ok) {
|
||||
expect(session.data.session.code).toBe('ABCD12');
|
||||
expect(session.data.phase_view_model.host.can_start_round).toBe(true);
|
||||
}
|
||||
});
|
||||
|
||||
it('supports join + start round writes for lobby vertical slice', async () => {
|
||||
const client = createApiClient(baseUrl);
|
||||
|
||||
const join = await client.joinSession({ code: 'abcd12', nickname: 'Maja' });
|
||||
expect(join.ok).toBe(true);
|
||||
|
||||
const start = await client.startRound('abcd12', { category_slug: 'history' });
|
||||
expect(start.ok).toBe(true);
|
||||
if (start.ok) {
|
||||
expect(start.data.session.status).toBe('lie');
|
||||
}
|
||||
});
|
||||
|
||||
it('returns parse error when response violates typed contract', async () => {
|
||||
const client = createApiClient(baseUrl);
|
||||
|
||||
const invalid = await client.getSession('badmap');
|
||||
expect(invalid.ok).toBe(false);
|
||||
if (!invalid.ok) {
|
||||
expect(invalid.status).toBe(200);
|
||||
expect(invalid.error.kind).toBe('parse');
|
||||
expect(invalid.error.message).toContain('Invalid API contract');
|
||||
}
|
||||
});
|
||||
|
||||
it('returns consistent HTTP error shape for 4xx/5xx', async () => {
|
||||
const client = createApiClient(baseUrl);
|
||||
|
||||
const missing = await client.getSession('missing');
|
||||
expect(missing.ok).toBe(false);
|
||||
if (!missing.ok) {
|
||||
expect(missing.status).toBe(404);
|
||||
expect(missing.error.kind).toBe('http');
|
||||
expect(missing.error.payload).toEqual({ error: 'Session not found' });
|
||||
}
|
||||
});
|
||||
|
||||
it('returns consistent network error shape', async () => {
|
||||
const client = createApiClient('http://127.0.0.1:9');
|
||||
|
||||
const health = await client.health();
|
||||
expect(health.ok).toBe(false);
|
||||
if (!health.ok) {
|
||||
expect(health.error.kind).toBe('network');
|
||||
expect(health.status).toBe(0);
|
||||
}
|
||||
});
|
||||
});
|
||||
@@ -1,108 +0,0 @@
|
||||
import { describe, expect, it } from 'vitest';
|
||||
import {
|
||||
allowedGameplayEvents,
|
||||
deriveGameplayPhase,
|
||||
transitionGameplayPhase,
|
||||
type GameplayPhase
|
||||
} from '../src/spa/gameplay-phase-machine';
|
||||
|
||||
describe('gameplay phase machine skeleton', () => {
|
||||
it('supports canonical phase progression lie -> guess -> reveal -> scoreboard -> lie', () => {
|
||||
let phase: GameplayPhase = 'lie';
|
||||
|
||||
phase = transitionGameplayPhase(phase, 'LIES_LOCKED').phase;
|
||||
expect(phase).toBe('guess');
|
||||
|
||||
phase = transitionGameplayPhase(phase, 'GUESSES_LOCKED').phase;
|
||||
expect(phase).toBe('reveal');
|
||||
|
||||
phase = transitionGameplayPhase(phase, 'SCOREBOARD_READY').phase;
|
||||
expect(phase).toBe('scoreboard');
|
||||
|
||||
phase = transitionGameplayPhase(phase, 'NEXT_ROUND').phase;
|
||||
expect(phase).toBe('lie');
|
||||
});
|
||||
|
||||
it('keeps state unchanged for invalid transition events', () => {
|
||||
const transition = transitionGameplayPhase('lie', 'NEXT_ROUND');
|
||||
expect(transition.phase).toBe('lie');
|
||||
expect(transition.changed).toBe(false);
|
||||
});
|
||||
|
||||
it('exposes allowed events per phase', () => {
|
||||
expect(allowedGameplayEvents('guess')).toEqual(['GUESSES_LOCKED']);
|
||||
expect(allowedGameplayEvents('scoreboard')).toEqual(['NEXT_ROUND']);
|
||||
});
|
||||
|
||||
it('derives gameplay phase from session detail status', () => {
|
||||
expect(
|
||||
deriveGameplayPhase({
|
||||
session: { code: 'ABCD12', status: 'lie', host_id: 1, current_round: 1, players_count: 3 },
|
||||
players: [],
|
||||
round_question: null,
|
||||
reveal: null,
|
||||
phase_view_model: {
|
||||
status: 'lie',
|
||||
round_number: 1,
|
||||
players_count: 3,
|
||||
constraints: {
|
||||
min_players_to_start: 3,
|
||||
max_players_mvp: 5,
|
||||
min_players_reached: true,
|
||||
max_players_allowed: true
|
||||
},
|
||||
host: {
|
||||
can_start_round: false,
|
||||
can_show_question: true,
|
||||
can_mix_answers: true,
|
||||
can_calculate_scores: false,
|
||||
can_reveal_scoreboard: false,
|
||||
can_start_next_round: false,
|
||||
can_finish_game: false
|
||||
},
|
||||
player: {
|
||||
can_join: false,
|
||||
can_submit_lie: true,
|
||||
can_submit_guess: false,
|
||||
can_view_final_result: false
|
||||
}
|
||||
}
|
||||
})
|
||||
).toBe('lie');
|
||||
|
||||
expect(
|
||||
deriveGameplayPhase({
|
||||
session: { code: 'ABCD12', status: 'finished', host_id: 1, current_round: 1, players_count: 3 },
|
||||
players: [],
|
||||
round_question: null,
|
||||
reveal: null,
|
||||
phase_view_model: {
|
||||
status: 'finished',
|
||||
round_number: 1,
|
||||
players_count: 3,
|
||||
constraints: {
|
||||
min_players_to_start: 3,
|
||||
max_players_mvp: 5,
|
||||
min_players_reached: true,
|
||||
max_players_allowed: true
|
||||
},
|
||||
host: {
|
||||
can_start_round: false,
|
||||
can_show_question: false,
|
||||
can_mix_answers: false,
|
||||
can_calculate_scores: false,
|
||||
can_reveal_scoreboard: false,
|
||||
can_start_next_round: false,
|
||||
can_finish_game: false
|
||||
},
|
||||
player: {
|
||||
can_join: false,
|
||||
can_submit_lie: false,
|
||||
can_submit_guess: false,
|
||||
can_view_final_result: true
|
||||
}
|
||||
}
|
||||
})
|
||||
).toBe('scoreboard');
|
||||
});
|
||||
});
|
||||
@@ -1,68 +0,0 @@
|
||||
import { describe, expect, it } from 'vitest';
|
||||
|
||||
import lobbyCatalog from '../../shared/i18n/lobby.json';
|
||||
import { lobbyMessage, lobbyMessageFromApiPayload } from '../src/spa/lobby-i18n';
|
||||
|
||||
describe('shared i18n keyspace contract', () => {
|
||||
it('keeps en as default and da/en matrix for frontend error keys', () => {
|
||||
expect(lobbyCatalog.locales.default).toBe('en');
|
||||
expect(lobbyCatalog.locales.supported).toEqual(expect.arrayContaining(['en', 'da']));
|
||||
|
||||
for (const [key, translations] of Object.entries(lobbyCatalog.frontend.errors)) {
|
||||
expect(translations.en, `${key} missing en`).toBeTruthy();
|
||||
expect(translations.da, `${key} missing da`).toBeTruthy();
|
||||
}
|
||||
});
|
||||
|
||||
it('keeps backend error-code keyspace aligned with shared backend→frontend map and backend translations', () => {
|
||||
for (const [code, backendKey] of Object.entries(lobbyCatalog.backend.error_codes)) {
|
||||
const frontendKey =
|
||||
lobbyCatalog.contract.backend_to_frontend_error_keys[
|
||||
code as keyof typeof lobbyCatalog.contract.backend_to_frontend_error_keys
|
||||
];
|
||||
|
||||
expect(lobbyCatalog.backend.errors[backendKey as keyof typeof lobbyCatalog.backend.errors]).toBeDefined();
|
||||
expect(frontendKey, `missing frontend mapping for ${code}`).toBeTruthy();
|
||||
expect(lobbyCatalog.frontend.errors[frontendKey as keyof typeof lobbyCatalog.frontend.errors]).toBeDefined();
|
||||
}
|
||||
|
||||
for (const [key, translations] of Object.entries(lobbyCatalog.backend.errors)) {
|
||||
expect(translations.en, `${key} missing en`).toBeTruthy();
|
||||
expect(translations.da, `${key} missing da`).toBeTruthy();
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
describe('lobbyMessage locale handling', () => {
|
||||
it('uses english by default and falls back to default for unsupported locale', () => {
|
||||
expect(lobbyMessage('session_code_required')).toBe('Session code is required.');
|
||||
expect(lobbyMessage('session_code_required', 'fr')).toBe('Session code is required.');
|
||||
});
|
||||
|
||||
it('resolves locale from api payload and maps known backend error codes directly', () => {
|
||||
expect(
|
||||
lobbyMessageFromApiPayload(
|
||||
{ error_code: 'session_not_found', locale: 'da' },
|
||||
'join_failed',
|
||||
),
|
||||
).toBe('Sessionskoden er ugyldig, eller sessionen findes ikke længere.');
|
||||
});
|
||||
|
||||
it('uses shared backend→frontend key-map at runtime even when fallback key differs', () => {
|
||||
expect(
|
||||
lobbyMessageFromApiPayload(
|
||||
{ error_code: 'session_not_joinable', locale: 'da' },
|
||||
'start_round_failed',
|
||||
),
|
||||
).toBe('Kunne ikke joine. Tjek kode eller kaldenavn og prøv igen.');
|
||||
});
|
||||
|
||||
it('falls back to caller-provided fallback key for unknown backend error codes', () => {
|
||||
expect(
|
||||
lobbyMessageFromApiPayload(
|
||||
{ error_code: 'unknown_backend_key', locale: 'da' },
|
||||
'join_failed',
|
||||
),
|
||||
).toBe('Kunne ikke joine. Tjek kode eller kaldenavn og prøv igen.');
|
||||
});
|
||||
});
|
||||
@@ -1,38 +0,0 @@
|
||||
import { describe, expect, it } from 'vitest';
|
||||
|
||||
import {
|
||||
collectLocaleParityIssues,
|
||||
LOBBY_I18N_CATALOG,
|
||||
normalizeLocale,
|
||||
SUPPORTED_LOCALES,
|
||||
translateCatalogPath,
|
||||
} from '../shared/i18n/lobby-loader';
|
||||
|
||||
describe('shared lobby i18n loader parity', () => {
|
||||
it('keeps da/en translation parity in shared keyspace', () => {
|
||||
const issues = collectLocaleParityIssues(LOBBY_I18N_CATALOG, SUPPORTED_LOCALES);
|
||||
expect(issues).toEqual([]);
|
||||
});
|
||||
|
||||
it('normalizes browser-style locale tags to supported keyspace locales', () => {
|
||||
expect(normalizeLocale('da-DK')).toBe('da');
|
||||
expect(normalizeLocale('da_DK')).toBe('da');
|
||||
expect(normalizeLocale('en-US')).toBe('en');
|
||||
expect(normalizeLocale('en_US')).toBe('en');
|
||||
expect(normalizeLocale('fr-FR')).toBe('en');
|
||||
});
|
||||
|
||||
it('resolves shared frontend ui keys with fallback-safe behavior', () => {
|
||||
expect(
|
||||
translateCatalogPath(LOBBY_I18N_CATALOG.frontend.ui as Record<string, unknown>, 'host.start_round', 'da-DK'),
|
||||
).toBe('Start runde');
|
||||
|
||||
expect(
|
||||
translateCatalogPath(LOBBY_I18N_CATALOG.frontend.ui as Record<string, unknown>, 'app.language_label', 'en-US'),
|
||||
).toBe('Language');
|
||||
|
||||
expect(
|
||||
translateCatalogPath(LOBBY_I18N_CATALOG.frontend.ui as Record<string, unknown>, 'host.non_existing_key', 'da'),
|
||||
).toBe('host.non_existing_key');
|
||||
});
|
||||
});
|
||||
@@ -1,56 +0,0 @@
|
||||
import { describe, expect, it } from 'vitest';
|
||||
import { createSessionContextStore, type StorageLike } from '../src/spa/session-context-store';
|
||||
|
||||
function makeMemoryStorage(seed?: Record<string, string>): StorageLike {
|
||||
const memory = new Map<string, string>(Object.entries(seed ?? {}));
|
||||
return {
|
||||
getItem: (key: string) => memory.get(key) ?? null,
|
||||
setItem: (key: string, value: string) => {
|
||||
memory.set(key, value);
|
||||
},
|
||||
removeItem: (key: string) => {
|
||||
memory.delete(key);
|
||||
}
|
||||
};
|
||||
}
|
||||
|
||||
describe('session context store', () => {
|
||||
it('normalizes and persists sessionCode/playerId/token', () => {
|
||||
const storage = makeMemoryStorage();
|
||||
const store = createSessionContextStore(storage, 'ctx');
|
||||
|
||||
const value = store.set({ sessionCode: ' abcd12 ', playerId: 12, token: ' token-1 ' });
|
||||
expect(value).toEqual({ sessionCode: 'ABCD12', playerId: 12, token: 'token-1' });
|
||||
|
||||
expect(store.get()).toEqual({ sessionCode: 'ABCD12', playerId: 12, token: 'token-1' });
|
||||
expect(storage.getItem('ctx')).toBe('{"sessionCode":"ABCD12","playerId":12,"token":"token-1"}');
|
||||
});
|
||||
|
||||
it('loads from storage and clears invalid payloads', () => {
|
||||
const storage = makeMemoryStorage({ ctx: '{"sessionCode":"","playerId":0,"token":""}' });
|
||||
const store = createSessionContextStore(storage, 'ctx');
|
||||
|
||||
expect(store.get()).toBeNull();
|
||||
expect(storage.getItem('ctx')).toBeNull();
|
||||
});
|
||||
|
||||
it('supports clear()', () => {
|
||||
const storage = makeMemoryStorage();
|
||||
const store = createSessionContextStore(storage, 'ctx');
|
||||
|
||||
store.set({ sessionCode: 'ABCD12', playerId: 3, token: 'token-3' });
|
||||
store.clear();
|
||||
|
||||
expect(store.get()).toBeNull();
|
||||
expect(storage.getItem('ctx')).toBeNull();
|
||||
});
|
||||
|
||||
it('rejects invalid context writes', () => {
|
||||
const store = createSessionContextStore();
|
||||
expect(() => store.set({ sessionCode: '', playerId: 1, token: 'token-1' })).toThrow('sessionCode is required');
|
||||
expect(() => store.set({ sessionCode: 'ABCD12', playerId: 0, token: 'token-1' })).toThrow(
|
||||
'playerId must be a positive integer'
|
||||
);
|
||||
expect(() => store.set({ sessionCode: 'ABCD12', playerId: 2, token: ' ' })).toThrow('token is required');
|
||||
});
|
||||
});
|
||||
@@ -1,236 +0,0 @@
|
||||
import { describe, expect, it, vi } from 'vitest';
|
||||
import {
|
||||
createVerticalSliceController,
|
||||
type SessionContext,
|
||||
type SessionContextStore
|
||||
} from '../src/spa/vertical-slice';
|
||||
import type { ApiClient } from '../src/api/client';
|
||||
|
||||
function makeApiMock(overrides?: Partial<ApiClient>): ApiClient {
|
||||
const base: ApiClient = {
|
||||
health: vi.fn(),
|
||||
getSession: vi.fn().mockResolvedValue({
|
||||
ok: true,
|
||||
status: 200,
|
||||
data: {
|
||||
session: { code: 'ABCD12', status: 'lobby', host_id: 1, current_round: 1, players_count: 3 },
|
||||
players: [],
|
||||
round_question: null,
|
||||
reveal: null,
|
||||
phase_view_model: {
|
||||
status: 'lobby',
|
||||
round_number: 1,
|
||||
players_count: 3,
|
||||
constraints: {
|
||||
min_players_to_start: 3,
|
||||
max_players_mvp: 5,
|
||||
min_players_reached: true,
|
||||
max_players_allowed: true
|
||||
},
|
||||
host: {
|
||||
can_start_round: true,
|
||||
can_show_question: false,
|
||||
can_mix_answers: false,
|
||||
can_calculate_scores: false,
|
||||
can_reveal_scoreboard: false,
|
||||
can_start_next_round: false,
|
||||
can_finish_game: false
|
||||
},
|
||||
player: {
|
||||
can_join: true,
|
||||
can_submit_lie: false,
|
||||
can_submit_guess: false,
|
||||
can_view_final_result: false
|
||||
}
|
||||
}
|
||||
}
|
||||
}),
|
||||
joinSession: vi.fn().mockResolvedValue({
|
||||
ok: true,
|
||||
status: 201,
|
||||
data: { player: { id: 9, nickname: 'Maja', session_token: 'token-1', score: 0 }, session: { code: 'ABCD12', status: 'lobby' } }
|
||||
}),
|
||||
startRound: vi.fn().mockResolvedValue({
|
||||
ok: true,
|
||||
status: 201,
|
||||
data: {
|
||||
session: { code: 'ABCD12', status: 'lie', current_round: 1 },
|
||||
round: { number: 1, category: { slug: 'history', name: 'History' } }
|
||||
}
|
||||
}),
|
||||
showQuestion: vi.fn(),
|
||||
mixAnswers: vi.fn(),
|
||||
calculateScores: vi.fn(),
|
||||
getScoreboard: vi.fn(),
|
||||
startNextRound: vi.fn(),
|
||||
finishGame: vi.fn(),
|
||||
submitLie: vi.fn(),
|
||||
submitGuess: vi.fn()
|
||||
};
|
||||
|
||||
return { ...base, ...overrides };
|
||||
}
|
||||
|
||||
function makeSessionContextStore(initial: SessionContext | null = null): SessionContextStore {
|
||||
let value = initial;
|
||||
return {
|
||||
get: vi.fn(() => value),
|
||||
set: vi.fn((next: SessionContext) => {
|
||||
value = next;
|
||||
return next;
|
||||
})
|
||||
};
|
||||
}
|
||||
|
||||
describe('vertical slice controller: lobby -> join -> start round', () => {
|
||||
it('uses createSessionContextStore by default (no manual injection)', async () => {
|
||||
vi.resetModules();
|
||||
const defaultStore = {
|
||||
get: vi.fn(() => null),
|
||||
set: vi.fn((next: SessionContext) => next),
|
||||
clear: vi.fn()
|
||||
};
|
||||
|
||||
vi.doMock('../src/spa/session-context-store', async () => {
|
||||
const actual = await vi.importActual<typeof import('../src/spa/session-context-store')>('../src/spa/session-context-store');
|
||||
return {
|
||||
...actual,
|
||||
createSessionContextStore: vi.fn(() => defaultStore)
|
||||
};
|
||||
});
|
||||
|
||||
const { createVerticalSliceController: createControllerWithMock } = await import('../src/spa/vertical-slice');
|
||||
const api = makeApiMock();
|
||||
const controller = createControllerWithMock(api);
|
||||
|
||||
await controller.joinLobby('ABCD12', 'Maja');
|
||||
|
||||
expect(defaultStore.set).toHaveBeenCalledWith({
|
||||
sessionCode: 'ABCD12',
|
||||
playerId: 9,
|
||||
token: 'token-1'
|
||||
});
|
||||
|
||||
vi.doUnmock('../src/spa/session-context-store');
|
||||
vi.resetModules();
|
||||
});
|
||||
|
||||
it('tracks loading and success state for join + start flow', async () => {
|
||||
const api = makeApiMock();
|
||||
const controller = createVerticalSliceController(api);
|
||||
|
||||
const beforeJoinPromise = controller.joinLobby('abcd12', 'Maja');
|
||||
expect(controller.getState().joinState).toBe('loading');
|
||||
await beforeJoinPromise;
|
||||
|
||||
const postJoin = controller.getState();
|
||||
expect(postJoin.joinState).toBe('success');
|
||||
expect(postJoin.session?.session.code).toBe('ABCD12');
|
||||
|
||||
const beforeStartPromise = controller.startRound('abcd12', 'history');
|
||||
expect(controller.getState().startRoundState).toBe('loading');
|
||||
await beforeStartPromise;
|
||||
|
||||
const postStart = controller.getState();
|
||||
expect(postStart.startRoundState).toBe('success');
|
||||
});
|
||||
|
||||
it('persists session context after join and syncs normalized session code', async () => {
|
||||
const api = makeApiMock();
|
||||
const sessionContextStore = makeSessionContextStore();
|
||||
const controller = createVerticalSliceController(api, sessionContextStore);
|
||||
|
||||
await controller.joinLobby('abcd12', 'Maja');
|
||||
|
||||
expect(sessionContextStore.set).toHaveBeenCalledWith({
|
||||
sessionCode: 'ABCD12',
|
||||
playerId: 9,
|
||||
token: 'token-1'
|
||||
});
|
||||
expect(controller.getState().sessionCode).toBe('ABCD12');
|
||||
});
|
||||
|
||||
it('uses stored session code as fallback for join + hydrate flow when input code is empty', async () => {
|
||||
const api = makeApiMock();
|
||||
const sessionContextStore = makeSessionContextStore({
|
||||
sessionCode: 'wxyz99',
|
||||
playerId: 5,
|
||||
token: 'token-old'
|
||||
});
|
||||
const controller = createVerticalSliceController(api, sessionContextStore);
|
||||
|
||||
await controller.joinLobby(' ', 'Maja');
|
||||
|
||||
expect(api.joinSession).toHaveBeenCalledWith({ code: 'WXYZ99', nickname: 'Maja' });
|
||||
expect(api.getSession).toHaveBeenCalledWith('ABCD12');
|
||||
});
|
||||
|
||||
it('surfaces a friendly error when join fails', async () => {
|
||||
const api = makeApiMock({
|
||||
joinSession: vi.fn().mockResolvedValue({
|
||||
ok: false,
|
||||
status: 404,
|
||||
error: { kind: 'http', status: 404, message: 'HTTP 404', payload: { error: 'Session not found', error_code: 'session_not_found' } }
|
||||
})
|
||||
});
|
||||
|
||||
const controller = createVerticalSliceController(api);
|
||||
await controller.joinLobby('missing', 'Maja');
|
||||
|
||||
const state = controller.getState();
|
||||
expect(state.joinState).toBe('error');
|
||||
expect(state.errorMessage).toBe('Session code is invalid or the session no longer exists.');
|
||||
});
|
||||
|
||||
it('surfaces a friendly error when round start fails', async () => {
|
||||
const api = makeApiMock({
|
||||
startRound: vi.fn().mockResolvedValue({
|
||||
ok: false,
|
||||
status: 400,
|
||||
error: { kind: 'http', status: 400, message: 'HTTP 400', payload: { error: 'Round can only be started from lobby', error_code: 'round_start_invalid_phase' } }
|
||||
})
|
||||
});
|
||||
|
||||
const controller = createVerticalSliceController(api);
|
||||
await controller.startRound('ABCD12', 'history');
|
||||
|
||||
const state = controller.getState();
|
||||
expect(state.startRoundState).toBe('error');
|
||||
expect(state.errorMessage).toBe('Could not start round. Refresh the lobby and try again.');
|
||||
});
|
||||
|
||||
it('shows local validation error and avoids API call when hydrating without any session code', async () => {
|
||||
const api = makeApiMock();
|
||||
const controller = createVerticalSliceController(api, makeSessionContextStore(null));
|
||||
|
||||
await controller.hydrateLobby(' ');
|
||||
|
||||
const state = controller.getState();
|
||||
expect(state.errorMessage).toBe('Session code is required.');
|
||||
expect(state.loadingSession).toBe(false);
|
||||
expect(api.getSession).not.toHaveBeenCalled();
|
||||
});
|
||||
|
||||
it('shows local validation error and avoids API call when starting round without any session code', async () => {
|
||||
const api = makeApiMock();
|
||||
const controller = createVerticalSliceController(api, makeSessionContextStore(null));
|
||||
|
||||
await controller.startRound(' ', 'history');
|
||||
|
||||
const state = controller.getState();
|
||||
expect(state.startRoundState).toBe('error');
|
||||
expect(state.errorMessage).toBe('Session code is required.');
|
||||
expect(api.startRound).not.toHaveBeenCalled();
|
||||
});
|
||||
|
||||
it('uses joined session code when starting round without a reload', async () => {
|
||||
const api = makeApiMock();
|
||||
const controller = createVerticalSliceController(api);
|
||||
|
||||
await controller.joinLobby(' abcd12 ', 'Maja');
|
||||
await controller.startRound('', 'history');
|
||||
|
||||
expect(api.startRound).toHaveBeenCalledWith('ABCD12', { category_slug: 'history' });
|
||||
expect(controller.getState().sessionCode).toBe('ABCD12');
|
||||
});
|
||||
});
|
||||
@@ -1,13 +0,0 @@
|
||||
{
|
||||
"compilerOptions": {
|
||||
"target": "ES2022",
|
||||
"module": "ES2022",
|
||||
"moduleResolution": "bundler",
|
||||
"resolveJsonModule": true,
|
||||
"strict": true,
|
||||
"skipLibCheck": true,
|
||||
"lib": ["ES2022", "DOM"],
|
||||
"types": ["vitest/globals", "node"]
|
||||
},
|
||||
"include": ["src", "tests", "../shared/i18n/*.json"]
|
||||
}
|
||||
@@ -1,8 +0,0 @@
|
||||
import { defineConfig } from 'vitest/config';
|
||||
|
||||
export default defineConfig({
|
||||
test: {
|
||||
include: ['tests/**/*.test.ts'],
|
||||
exclude: ['**/node_modules/**']
|
||||
}
|
||||
});
|
||||
@@ -1,18 +0,0 @@
|
||||
# Generated by Django 6.0.2 on 2026-03-13 16:05
|
||||
|
||||
from django.db import migrations, models
|
||||
|
||||
|
||||
class Migration(migrations.Migration):
|
||||
|
||||
dependencies = [
|
||||
('fupogfakta', '0004_player_session_token'),
|
||||
]
|
||||
|
||||
operations = [
|
||||
migrations.AlterField(
|
||||
model_name='gamesession',
|
||||
name='status',
|
||||
field=models.CharField(choices=[('lobby', 'Lobby'), ('lie', 'Løgnfase'), ('guess', 'Gættefase'), ('reveal', 'Reveal'), ('scoreboard', 'Scoreboard'), ('finished', 'Afsluttet')], default='lobby', max_length=16),
|
||||
),
|
||||
]
|
||||
@@ -1,26 +0,0 @@
|
||||
from django.db import migrations, models
|
||||
|
||||
|
||||
class Migration(migrations.Migration):
|
||||
dependencies = [
|
||||
("fupogfakta", "0004_player_session_token"),
|
||||
]
|
||||
|
||||
operations = [
|
||||
migrations.AlterField(
|
||||
model_name="gamesession",
|
||||
name="status",
|
||||
field=models.CharField(
|
||||
choices=[
|
||||
("lobby", "Lobby"),
|
||||
("lie", "Løgnfase"),
|
||||
("guess", "Gættefase"),
|
||||
("reveal", "Reveal"),
|
||||
("scoreboard", "Scoreboard"),
|
||||
("finished", "Afsluttet"),
|
||||
],
|
||||
default="lobby",
|
||||
max_length=16,
|
||||
),
|
||||
),
|
||||
]
|
||||
@@ -1,10 +0,0 @@
|
||||
from django.db import migrations
|
||||
|
||||
|
||||
class Migration(migrations.Migration):
|
||||
dependencies = [
|
||||
("fupogfakta", "0005_alter_gamesession_status"),
|
||||
("fupogfakta", "0005_gamesession_scoreboard_status"),
|
||||
]
|
||||
|
||||
operations = []
|
||||
@@ -42,7 +42,6 @@ class GameSession(models.Model):
|
||||
LIE = "lie", "Løgnfase"
|
||||
GUESS = "guess", "Gættefase"
|
||||
REVEAL = "reveal", "Reveal"
|
||||
SCOREBOARD = "scoreboard", "Scoreboard"
|
||||
FINISHED = "finished", "Afsluttet"
|
||||
|
||||
host = models.ForeignKey(User, on_delete=models.PROTECT, related_name="hosted_sessions")
|
||||
|
||||
@@ -22,11 +22,7 @@ Forventet:
|
||||
- service er active
|
||||
- healthz returnerer JSON med ok=true
|
||||
|
||||
Smoke-suite skriver nu et gameplay-artifact som JSON under `/opt/wpp-staging/app/artifacts/smoke/` (kan overrides via `ARTIFACT_DIR`/`ARTIFACT_FILE`).
|
||||
|
||||
Efter deploy validerer scriptet, at `DB_ENGINE` ikke er `django.db.backends.sqlite3` før migrations køres.
|
||||
|
||||
Deploy-scriptet bruger en release-candidate mappe og promoverer først til `/opt/wpp-staging/app` efter succesfuld `migrate`. Det reducerer schema/code drift ved afbrudte deploys (issue #130) og understøtter release-readiness gate (issue #90).
|
||||
Efter deploy vil scriptet også verificere at `DB_ENGINE` ikke er `django.db.backends.sqlite3` før migrations køres.
|
||||
|
||||
## Deploy (canonical execution context)
|
||||
Deploy skal altid køres via Proxmox host over SSH (ikke fra lokal coder-shell med direkte sudo pct).
|
||||
|
||||
@@ -9,88 +9,42 @@ PROXMOX_HOST="${PROXMOX_HOST:-proxmox-lan}"
|
||||
echo "[deploy] host=${PROXMOX_HOST} CT_ID=${CT_ID} REF=${REF_NAME}"
|
||||
|
||||
echo "[deploy] extracting source + installing deps + migrate + restart"
|
||||
ssh "${PROXMOX_HOST}" sudo -n /usr/sbin/pct exec "${CT_ID}" -- bash -s -- "${ARCHIVE_URL}" <<'REMOTE'
|
||||
set -euo pipefail
|
||||
|
||||
ARCHIVE_URL="$1"
|
||||
RELEASES_DIR=/opt/wpp-staging/releases
|
||||
CANDIDATE_DIR="${RELEASES_DIR}/src"
|
||||
APP_DIR=/opt/wpp-staging/app
|
||||
|
||||
install -d -m 0755 -o wpp -g wpp "${RELEASES_DIR}" "${APP_DIR}"
|
||||
mkdir -p "${CANDIDATE_DIR}"
|
||||
cd "${RELEASES_DIR}"
|
||||
curl -fsSL "${ARCHIVE_URL}" -o app.tar.gz
|
||||
rm -rf "${CANDIDATE_DIR}" && mkdir -p "${CANDIDATE_DIR}"
|
||||
tar -xzf app.tar.gz -C "${CANDIDATE_DIR}" --strip-components=1
|
||||
|
||||
# Ensure deploy artifact copied as root does not leave candidate tree non-writable for wpp.
|
||||
chown -R wpp:wpp "${CANDIDATE_DIR}"
|
||||
# Staging must not run on SQLite (issue #133). Remove bundled sqlite artifact from candidate.
|
||||
rm -f "${CANDIDATE_DIR}/db.sqlite3"
|
||||
cd "${CANDIDATE_DIR}"
|
||||
|
||||
# Load staging env before any manage.py call (issue #133 follow-up).
|
||||
ENV_LOADED=0
|
||||
for ENV_FILE in \
|
||||
/opt/wpp-staging/.env.staging \
|
||||
/opt/wpp-staging/.env \
|
||||
/opt/wpp-staging/env/wpp_staging.env \
|
||||
/opt/wpp-staging/secrets/wpp_staging.env
|
||||
do
|
||||
if [ -f "${ENV_FILE}" ]; then
|
||||
set -a
|
||||
. "${ENV_FILE}"
|
||||
set +a
|
||||
echo "[deploy] loaded staging env: ${ENV_FILE}"
|
||||
ENV_LOADED=1
|
||||
break
|
||||
fi
|
||||
done
|
||||
if [ "${ENV_LOADED}" -ne 1 ]; then
|
||||
echo "[deploy] ERROR: no staging env file found"
|
||||
exit 1
|
||||
fi
|
||||
|
||||
ssh "${PROXMOX_HOST}" "sudo -n /usr/sbin/pct exec ${CT_ID} -- bash -lc \"set -euo pipefail
|
||||
mkdir -p /opt/wpp-staging/releases/src
|
||||
cd /opt/wpp-staging/releases
|
||||
curl -fsSL \\\"${ARCHIVE_URL}\\\" -o app.tar.gz
|
||||
rm -rf src && mkdir src
|
||||
tar -xzf app.tar.gz -C src --strip-components=1
|
||||
rm -rf /opt/wpp-staging/app/*
|
||||
cp -a src/. /opt/wpp-staging/app/
|
||||
# Ensure deploy artifact copied as root does not leave app tree non-writable for wpp.
|
||||
chown -R wpp:wpp /opt/wpp-staging/app
|
||||
# Staging must not run on SQLite (issue #133). Remove bundled sqlite artifact.
|
||||
rm -f /opt/wpp-staging/app/db.sqlite3
|
||||
cd /opt/wpp-staging/app
|
||||
runuser -u wpp -- python3 -m venv .venv
|
||||
runuser -u wpp -- .venv/bin/pip install -U pip >/dev/null
|
||||
runuser -u wpp -- .venv/bin/pip install -r requirements.txt >/dev/null
|
||||
runuser -u wpp -- .venv/bin/python manage.py shell -c "from django.conf import settings; import sys; engine = settings.DATABASES['default']['ENGINE']; print(f'DB_ENGINE={engine}'); sys.exit(0 if engine != 'django.db.backends.sqlite3' else 1)"
|
||||
runuser -u wpp -- .venv/bin/python manage.py migrate --noinput
|
||||
|
||||
# Promote candidate only after migrations succeed (issue #130): avoid code/schema drift after failed deploy.
|
||||
# Use find instead of rm "${APP_DIR}"/* to reliably remove dotfiles between deploys.
|
||||
find "${APP_DIR}" -mindepth 1 -maxdepth 1 -exec rm -rf -- {} +
|
||||
cp -a "${CANDIDATE_DIR}"/. "${APP_DIR}/"
|
||||
chown -R wpp:wpp "${APP_DIR}"
|
||||
runuser -u wpp -- test -w "${APP_DIR}"
|
||||
|
||||
systemctl restart wpp-staging.service
|
||||
|
||||
HEALTH_URL="http://127.0.0.1:8000/healthz"
|
||||
MAX_ATTEMPTS=7
|
||||
SLEEP_SECONDS=1
|
||||
ATTEMPT=1
|
||||
|
||||
until curl -fsS "${HEALTH_URL}" >/dev/null; do
|
||||
if [ "${ATTEMPT}" -ge "${MAX_ATTEMPTS}" ]; then
|
||||
echo "[deploy] ERROR: health check failed after ${MAX_ATTEMPTS} attempts: ${HEALTH_URL}" >&2
|
||||
echo "[deploy] service status (wpp-staging.service):" >&2
|
||||
systemctl --no-pager --full status wpp-staging.service >&2 || true
|
||||
echo "[deploy] recent service logs (wpp-staging.service):" >&2
|
||||
journalctl --no-pager -u wpp-staging.service -n 80 >&2 || true
|
||||
exit 1
|
||||
fi
|
||||
|
||||
echo "[deploy] health check not ready (attempt ${ATTEMPT}/${MAX_ATTEMPTS}); retrying in ${SLEEP_SECONDS}s"
|
||||
sleep "${SLEEP_SECONDS}"
|
||||
ATTEMPT=$((ATTEMPT + 1))
|
||||
if [ "${SLEEP_SECONDS}" -lt 8 ]; then
|
||||
SLEEP_SECONDS=$((SLEEP_SECONDS * 2))
|
||||
STAGING_ENV_FILE=\"\"
|
||||
for candidate in \
|
||||
/opt/wpp-staging/app/infra/staging/.env.staging \
|
||||
/opt/wpp-staging/app/infra/env/.env.staging \
|
||||
/opt/wpp-staging/.env.staging; do
|
||||
if [ -f \"\$candidate\" ]; then
|
||||
STAGING_ENV_FILE=\"\$candidate\"
|
||||
break
|
||||
fi
|
||||
done
|
||||
|
||||
echo "[deploy] health check passed: ${HEALTH_URL}"
|
||||
REMOTE
|
||||
if [ -z \"\$STAGING_ENV_FILE\" ]; then
|
||||
echo \"[deploy] ERROR: staging env file not found (.env.staging)\" >&2
|
||||
exit 1
|
||||
fi
|
||||
set -a
|
||||
. \"\$STAGING_ENV_FILE\"
|
||||
set +a
|
||||
runuser -u wpp -- .venv/bin/python manage.py shell -c \"from django.conf import settings; import sys; engine = settings.DATABASES['default']['ENGINE']; print(f'DB_ENGINE={engine}'); sys.exit(0 if engine != 'django.db.backends.sqlite3' else 1)\"
|
||||
runuser -u wpp -- .venv/bin/python manage.py migrate --noinput
|
||||
systemctl restart wpp-staging.service
|
||||
curl -fsS http://127.0.0.1:8000/healthz\""
|
||||
|
||||
echo "[deploy] OK: staging deploy complete for CT ${CT_ID} (${REF_NAME})"
|
||||
|
||||
@@ -50,30 +50,10 @@ PY
|
||||
echo "[smoke] healthz check: ${BASE_URL}/healthz"
|
||||
curl -fsS "${BASE_URL}/healthz" >/dev/null || { SMOKE_FAIL_MESSAGE="healthz check failed" fail "healthz check failed"; }
|
||||
|
||||
ENV_FILE="${ENV_FILE:-/etc/wpp/staging.env}"
|
||||
|
||||
run_manage() {
|
||||
local cmd="$1"
|
||||
(
|
||||
cd "${APP_DIR}"
|
||||
if [[ -f "${ENV_FILE}" ]]; then
|
||||
set -a
|
||||
# shellcheck disable=SC1090
|
||||
source "${ENV_FILE}"
|
||||
set +a
|
||||
fi
|
||||
.venv/bin/python manage.py ${cmd}
|
||||
)
|
||||
}
|
||||
|
||||
echo "[smoke] migration consistency check"
|
||||
run_manage "migrate --check --noinput" || { SMOKE_FAIL_MESSAGE="schema drift: unapplied migrations in staging" fail "schema drift: unapplied migrations in staging"; }
|
||||
|
||||
ARTIFACT_DIR="${ARTIFACT_DIR:-${APP_DIR}/artifacts/smoke}"
|
||||
ARTIFACT_FILE="${ARTIFACT_FILE:-${ARTIFACT_DIR}/smoke-$(date -u +%Y%m%dT%H%M%SZ).json}"
|
||||
|
||||
echo "[smoke] gameplay flow via management command"
|
||||
run_manage "smoke_staging --artifact ${ARTIFACT_FILE}" || { SMOKE_FAIL_MESSAGE="manage.py smoke_staging failed" fail "manage.py smoke_staging failed"; }
|
||||
(
|
||||
cd "${APP_DIR}"
|
||||
.venv/bin/python manage.py smoke_staging
|
||||
) || { SMOKE_FAIL_MESSAGE="manage.py smoke_staging failed" fail "manage.py smoke_staging failed"; }
|
||||
|
||||
echo "[smoke] artifact: ${ARTIFACT_FILE}"
|
||||
echo "[smoke] OK"
|
||||
|
||||
@@ -1,6 +0,0 @@
|
||||
from django.conf import settings
|
||||
|
||||
|
||||
def use_spa_ui() -> bool:
|
||||
"""Central read-point for SPA cutover flag."""
|
||||
return bool(getattr(settings, "USE_SPA_UI", False))
|
||||
100
lobby/i18n.py
100
lobby/i18n.py
@@ -1,100 +0,0 @@
|
||||
import logging
|
||||
|
||||
from django.http import HttpRequest, JsonResponse
|
||||
from django.utils.translation import get_language_from_request
|
||||
|
||||
from partyhub.i18n_bootstrap import locale_config, shared_i18n_catalog
|
||||
|
||||
LOGGER = logging.getLogger(__name__)
|
||||
|
||||
|
||||
def lobby_i18n_catalog() -> dict:
|
||||
return shared_i18n_catalog()
|
||||
|
||||
|
||||
def i18n_locale_config() -> tuple[str, tuple[str, ...]]:
|
||||
return locale_config()
|
||||
|
||||
|
||||
def lobby_i18n_errors() -> dict:
|
||||
return shared_i18n_catalog().get("backend", {}).get("error_codes", {})
|
||||
|
||||
|
||||
def lobby_i18n_error_messages() -> dict:
|
||||
return shared_i18n_catalog().get("backend", {}).get("errors", {})
|
||||
|
||||
|
||||
def resolve_error_key(code: str) -> str:
|
||||
resolved = lobby_i18n_errors().get(code)
|
||||
if isinstance(resolved, str) and resolved:
|
||||
return resolved
|
||||
|
||||
LOGGER.warning("i18n error code missing in shared catalog", extra={"code": code})
|
||||
return code
|
||||
|
||||
|
||||
def _quality_value(language_candidate: str) -> float | None:
|
||||
for parameter in language_candidate.split(";")[1:]:
|
||||
key, separator, value = parameter.partition("=")
|
||||
if separator and key.strip().lower() == "q":
|
||||
try:
|
||||
return float(value.strip())
|
||||
except ValueError:
|
||||
return None
|
||||
return None
|
||||
|
||||
|
||||
def resolve_locale(request: HttpRequest) -> str:
|
||||
default_locale, supported_locales = i18n_locale_config()
|
||||
|
||||
accept_language = request.META.get("HTTP_ACCEPT_LANGUAGE") or ""
|
||||
ranked_candidates: list[tuple[float, int, str]] = []
|
||||
for index, candidate in enumerate(accept_language.split(",")):
|
||||
quality = _quality_value(candidate)
|
||||
if quality is not None and quality <= 0:
|
||||
continue
|
||||
|
||||
tag = candidate.split(";", 1)[0]
|
||||
normalized = tag.strip().replace("_", "-").split("-", 1)[0].lower()
|
||||
if normalized not in supported_locales:
|
||||
continue
|
||||
|
||||
ranked_candidates.append((quality if quality is not None else 1.0, index, normalized))
|
||||
|
||||
if ranked_candidates:
|
||||
ranked_candidates.sort(key=lambda entry: (-entry[0], entry[1]))
|
||||
return ranked_candidates[0][2]
|
||||
|
||||
requested = (get_language_from_request(request) or "").replace("_", "-").split("-", 1)[0].lower()
|
||||
if requested in supported_locales:
|
||||
return requested
|
||||
return default_locale
|
||||
|
||||
|
||||
def resolve_error_message(*, key: str, locale: str) -> str:
|
||||
default_locale, _supported_locales = i18n_locale_config()
|
||||
translations = lobby_i18n_error_messages().get(key)
|
||||
if not isinstance(translations, dict):
|
||||
LOGGER.warning("i18n key missing in shared catalog", extra={"key": key, "locale": locale})
|
||||
return key
|
||||
|
||||
if locale in translations and translations[locale]:
|
||||
return translations[locale]
|
||||
if default_locale in translations and translations[default_locale]:
|
||||
return translations[default_locale]
|
||||
|
||||
LOGGER.warning("i18n translation missing for key", extra={"key": key, "locale": locale})
|
||||
return key
|
||||
|
||||
|
||||
def api_error(request: HttpRequest, *, code: str, status: int) -> JsonResponse:
|
||||
locale = resolve_locale(request)
|
||||
key = resolve_error_key(code)
|
||||
return JsonResponse(
|
||||
{
|
||||
"error": resolve_error_message(key=key, locale=locale),
|
||||
"error_code": code,
|
||||
"locale": locale,
|
||||
},
|
||||
status=status,
|
||||
)
|
||||
@@ -1,6 +1,4 @@
|
||||
import json
|
||||
from datetime import datetime, timezone
|
||||
from pathlib import Path
|
||||
|
||||
from django.contrib.auth import get_user_model
|
||||
from django.core.management.base import BaseCommand, CommandError
|
||||
@@ -12,12 +10,6 @@ from fupogfakta.models import Category, GameSession, Player, Question, RoundQues
|
||||
class Command(BaseCommand):
|
||||
help = "Run minimal staging smoke flow for lobby gameplay"
|
||||
|
||||
def add_arguments(self, parser):
|
||||
parser.add_argument(
|
||||
"--artifact",
|
||||
help="Optional path to write smoke result artifact as JSON",
|
||||
)
|
||||
|
||||
def handle(self, *args, **options):
|
||||
GameSession.objects.all().delete()
|
||||
Player.objects.all().delete()
|
||||
@@ -70,85 +62,57 @@ class Command(BaseCommand):
|
||||
if start_res.status_code != 201:
|
||||
raise CommandError(f"start_round failed: {start_res.status_code}")
|
||||
|
||||
round_question_id = start_res.json()["round_question"]["id"]
|
||||
show_res = host_client.post(f"/lobby/sessions/{code}/questions/show", content_type="application/json")
|
||||
if show_res.status_code != 201:
|
||||
raise CommandError(f"show_question failed: {show_res.status_code}")
|
||||
|
||||
round_question_id = show_res.json()["round_question"]["id"]
|
||||
|
||||
answers = []
|
||||
for player in players:
|
||||
nick = player["nickname"]
|
||||
lie_res = Client().post(
|
||||
f"/lobby/sessions/{code}/questions/{round_question_id}/lies/submit",
|
||||
data=json.dumps(
|
||||
{
|
||||
"player_id": player["id"],
|
||||
"session_token": player["session_token"],
|
||||
"text": f"Lie from {nick}",
|
||||
}
|
||||
),
|
||||
data=json.dumps({"player_id": player["id"], "text": f"Lie from {nick}"}),
|
||||
content_type="application/json",
|
||||
)
|
||||
if lie_res.status_code != 201:
|
||||
raise CommandError(f"submit_lie failed for {nick}: {lie_res.status_code}")
|
||||
if lie_res.json().get("answers"):
|
||||
answers = lie_res.json()["answers"]
|
||||
|
||||
if not answers:
|
||||
detail_res = host_client.get(f"/lobby/sessions/{code}")
|
||||
if detail_res.status_code != 200:
|
||||
raise CommandError(f"session_detail after lies failed: {detail_res.status_code}")
|
||||
answers = detail_res.json().get("round_question", {}).get("answers", [])
|
||||
mix_res = host_client.post(
|
||||
f"/lobby/sessions/{code}/questions/{round_question_id}/answers/mix",
|
||||
content_type="application/json",
|
||||
)
|
||||
if mix_res.status_code != 200:
|
||||
raise CommandError(f"mix_answers failed: {mix_res.status_code}")
|
||||
|
||||
answers = mix_res.json().get("answers", [])
|
||||
if not answers:
|
||||
raise CommandError("canonical lie->guess transition returned empty answers")
|
||||
raise CommandError("mix_answers returned empty answers")
|
||||
|
||||
for player in players:
|
||||
nick = player["nickname"]
|
||||
selected = next((a for a in answers if a.get("player_id") != player["id"]), answers[0])
|
||||
guess_res = Client().post(
|
||||
f"/lobby/sessions/{code}/questions/{round_question_id}/guesses/submit",
|
||||
data=json.dumps(
|
||||
{
|
||||
"player_id": player["id"],
|
||||
"session_token": player["session_token"],
|
||||
"selected_text": selected["text"],
|
||||
}
|
||||
),
|
||||
data=json.dumps({"player_id": player["id"], "selected_text": selected["text"]}),
|
||||
content_type="application/json",
|
||||
)
|
||||
if guess_res.status_code != 201:
|
||||
raise CommandError(f"submit_guess failed for {nick}: {guess_res.status_code}")
|
||||
|
||||
detail_res = host_client.get(f"/lobby/sessions/{code}")
|
||||
if detail_res.status_code != 200:
|
||||
raise CommandError(f"session_detail after guesses failed: {detail_res.status_code}")
|
||||
if detail_res.json()["session"]["status"] != GameSession.Status.SCOREBOARD:
|
||||
raise CommandError("canonical guess->reveal->scoreboard transition did not reach scoreboard")
|
||||
calc_res = host_client.post(
|
||||
f"/lobby/sessions/{code}/questions/{round_question_id}/scores/calculate",
|
||||
content_type="application/json",
|
||||
)
|
||||
if calc_res.status_code != 200:
|
||||
raise CommandError(f"calculate_scores failed: {calc_res.status_code}")
|
||||
|
||||
board_res = host_client.get(f"/lobby/sessions/{code}/scoreboard")
|
||||
if board_res.status_code != 200:
|
||||
raise CommandError(f"reveal_scoreboard failed: {board_res.status_code}")
|
||||
|
||||
finish_res = host_client.post(f"/lobby/sessions/{code}/finish", content_type="application/json")
|
||||
if finish_res.status_code != 200:
|
||||
raise CommandError(f"finish_game failed: {finish_res.status_code}")
|
||||
|
||||
artifact_path = options.get("artifact")
|
||||
if artifact_path:
|
||||
artifact = {
|
||||
"ok": True,
|
||||
"command": "smoke_staging",
|
||||
"generated_at": datetime.now(timezone.utc).isoformat(),
|
||||
"session_code": code,
|
||||
"players": [player["nickname"] for player in players],
|
||||
"round_question_id": round_question_id,
|
||||
"steps": [
|
||||
"create_session",
|
||||
"join_players",
|
||||
"start_round",
|
||||
"submit_lies",
|
||||
"auto_guess_transition",
|
||||
"submit_guesses",
|
||||
"auto_reveal_to_scoreboard",
|
||||
"finish_game",
|
||||
],
|
||||
}
|
||||
output_path = Path(artifact_path)
|
||||
output_path.parent.mkdir(parents=True, exist_ok=True)
|
||||
output_path.write_text(json.dumps(artifact, indent=2) + "\n", encoding="utf-8")
|
||||
|
||||
self.stdout.write(self.style.SUCCESS(f"Smoke flow OK for session {code}"))
|
||||
|
||||
@@ -1,16 +1,5 @@
|
||||
<!doctype html>
|
||||
<html lang="da"><head><meta charset="utf-8"><meta name="viewport" content="width=device-width, initial-scale=1"><title>WPP Host</title>
|
||||
<style>
|
||||
.critical-card { margin: 10px 0 12px; padding: 10px; border-radius: 10px; border: 1px solid #cbd5e1; background: #f8fafc; }
|
||||
.critical-card h2 { margin: 0 0 6px; font-size: 1rem; }
|
||||
.critical-card p { margin: 0; color: #334155; }
|
||||
.skeleton-line { position: relative; overflow: hidden; height: 12px; border-radius: 999px; margin-top: 8px; background: #e2e8f0; }
|
||||
.skeleton-line:first-of-type { margin-top: 4px; }
|
||||
.skeleton-line.short { width: 60%; }
|
||||
.skeleton-line::after { content: ""; position: absolute; inset: 0; transform: translateX(-100%); background: linear-gradient(90deg, rgba(226,232,240,0) 0%, rgba(255,255,255,0.85) 45%, rgba(226,232,240,0) 100%); animation: wppShimmer 1.2s infinite; }
|
||||
@keyframes wppShimmer { to { transform: translateX(100%); } }
|
||||
</style>
|
||||
</head>
|
||||
<html lang="da"><head><meta charset="utf-8"><meta name="viewport" content="width=device-width, initial-scale=1"><title>WPP Host</title></head>
|
||||
<body>
|
||||
<h1>Host panel (MVP)</h1>
|
||||
<p>Kræver login som host-bruger.</p>
|
||||
@@ -24,10 +13,14 @@
|
||||
<p id="categoryGuardHint">Kategori er kun redigérbar i lobby-fasen.</p>
|
||||
|
||||
<p id="phaseStatus">Fase: ukendt (opdatér session-status).</p>
|
||||
<p id="roundQuestionStatus">Aktiv round question: afventer session-status.</p>
|
||||
<p id="roundQuestionGuardHint">Round question-id styres server-side i canonical flow og er kun read-only kontekst for host.</p>
|
||||
<button id="nextRoundBtn" onclick="nextRound()" disabled>3) Næste runde</button>
|
||||
<button id="finishGameBtn" onclick="finishGame()" disabled>4) Afslut spil</button>
|
||||
<button id="showQuestionBtn" onclick="showQuestion()" disabled>3) Vis spørgsmål</button>
|
||||
<input id="roundQuestionId" placeholder="Round question id">
|
||||
<p id="roundQuestionGuardHint">Round question-id kan kun redigeres i lie/guess/reveal-faser.</p>
|
||||
<button id="mixAnswersBtn" onclick="mixAnswers()" disabled>4) Mix svar</button>
|
||||
<button id="calcScoresBtn" onclick="calcScores()" disabled>5) Beregn score</button>
|
||||
<button id="showScoreboardBtn" onclick="showScoreboard()" disabled>6) Scoreboard</button>
|
||||
<button id="nextRoundBtn" onclick="nextRound()" disabled>7) Næste runde</button>
|
||||
<button id="finishGameBtn" onclick="finishGame()" disabled>8) Afslut spil</button>
|
||||
<p id="hostActionHint">Angiv sessionkode for at aktivere host-actions.</p>
|
||||
<p id="hostErrorHint">Ingen fejl.</p>
|
||||
<button id="sessionDetailBtn" onclick="sessionDetail()">Session-status</button>
|
||||
@@ -35,28 +28,8 @@
|
||||
<button id="autoRefreshToggleBtn" onclick="toggleAutoRefresh()">Auto-refresh: OFF</button>
|
||||
<p id="autoRefreshHint">Auto-refresh er slået fra.</p>
|
||||
<p id="lastRefreshStatus">Session-data ikke opdateret endnu.</p>
|
||||
<div id="hostShellErrorBoundary" style="display:none;margin:8px 0 10px;padding:8px 10px;border-radius:8px;border:1px solid #b91c1c;background:#fee2e2;color:#7f1d1d;">Der opstod en kritisk fejl i app-skallen.
|
||||
<button id="hostRecoverRetryBtn" type="button" onclick="recoverHostShell('retry')">Prøv gendan</button>
|
||||
<button id="hostRecoverReloadBtn" type="button" onclick="recoverHostShell('reload')">Genindlæs siden</button>
|
||||
</div>
|
||||
<section id="hostCriticalSkeleton" class="critical-card" aria-live="polite">
|
||||
<h2>Indlæser host-overblik…</h2>
|
||||
<div class="skeleton-line"></div>
|
||||
<div class="skeleton-line"></div>
|
||||
<div class="skeleton-line short"></div>
|
||||
</section>
|
||||
<section id="hostCriticalView" class="critical-card" style="display:none" aria-live="polite">
|
||||
<h2>Host-overblik</h2>
|
||||
<p id="hostCriticalPhase">Fase: afventer</p>
|
||||
<p id="hostCriticalPlayers">Spillere: afventer</p>
|
||||
<p id="hostCriticalRound">Aktiv round question: afventer</p>
|
||||
</section>
|
||||
<pre id="out">Ready.</pre>
|
||||
{{ lobby_i18n|json_script:"wppHostI18n" }}
|
||||
<pre id="out">Klar.</pre>
|
||||
<script>
|
||||
var WPP_HOST_LOCALE="{{ shell_locale|default:'en'|escapejs }}";
|
||||
var WPP_HOST_I18N=JSON.parse(document.getElementById("wppHostI18n").textContent||"{}");
|
||||
function hostCopy(path,fallback){var node=WPP_HOST_I18N;var parts=(path||"").split(".");for(var i=0;i<parts.length;i++){if(!node||typeof node!=="object"){return fallback||path;}node=node[parts[i]];}if(node&&typeof node==="object"){if(node[WPP_HOST_LOCALE]){return node[WPP_HOST_LOCALE];}if(node.en){return node.en;}}return typeof node==="string"?node:(fallback||path);}
|
||||
var currentSessionStatus="";
|
||||
var autoRefreshEnabled=false;
|
||||
var autoRefreshTimer=null;
|
||||
@@ -64,61 +37,42 @@ var hostActionInFlight=false;
|
||||
var lastRefreshAtLabel="";
|
||||
var lastRefreshFailed=false;
|
||||
var sessionDetailInFlight=false;
|
||||
var hostShellRouteHint="";
|
||||
var HOST_SHELL_ROUTES={lobby:"lobby",lie:"lie",guess:"guess",reveal:"reveal",scoreboard:"scoreboard",finished:"finished"};
|
||||
var hostShellFatalError=false;
|
||||
var hostShellRecoverInFlight=false;
|
||||
var hostCriticalHydrated=false;
|
||||
function setHostCriticalLoading(isLoading){var skeleton=document.getElementById("hostCriticalSkeleton");var view=document.getElementById("hostCriticalView");if(!skeleton||!view){return;}skeleton.style.display=isLoading?"block":"none";view.style.display=isLoading?"none":"block";}
|
||||
function hydrateHostCriticalView(data){var session=(data&&data.session)||{};var phaseEl=document.getElementById("hostCriticalPhase");var playersEl=document.getElementById("hostCriticalPlayers");var roundEl=document.getElementById("hostCriticalRound");var roundStatus=document.getElementById("roundQuestionStatus");var roundQuestionId=(data&&data.round_question&&data.round_question.id)?String(data.round_question.id):"";if(phaseEl){phaseEl.textContent="Fase: "+phaseLabel(currentSessionStatus||session.status||"");}
|
||||
if(playersEl){playersEl.textContent="Spillere: "+(typeof session.players_count==="number"?session.players_count:"ukendt");}
|
||||
if(roundEl){roundEl.textContent="Aktiv round question: "+(roundQuestionId||"ikke valgt");}
|
||||
if(roundStatus){roundStatus.textContent="Aktiv round question: "+(roundQuestionId||"afventer session-status.");}
|
||||
hostCriticalHydrated=true;
|
||||
setHostCriticalLoading(false);
|
||||
}
|
||||
function csrf(){var m=document.cookie.match(/csrftoken=([^;]+)/);return m?m[1]:"";}
|
||||
function updateHostShellErrorBoundary(){var panel=document.getElementById("hostShellErrorBoundary");var retryBtn=document.getElementById("hostRecoverRetryBtn");var reloadBtn=document.getElementById("hostRecoverReloadBtn");if(!panel||!retryBtn||!reloadBtn){return;}panel.style.display=hostShellFatalError?"block":"none";retryBtn.disabled=hostShellRecoverInFlight||sessionDetailInFlight||!code();reloadBtn.disabled=hostShellRecoverInFlight;}
|
||||
function setHostShellFatalError(detail){hostShellFatalError=true;var out=document.getElementById("out");if(out){out.textContent=JSON.stringify({status:0,data:{error:"host_shell_runtime_error",detail:detail||"Ukendt runtime-fejl"}},null,2);}var hint=document.getElementById("hostErrorHint");if(hint){hint.textContent="Fejl: Kritisk app-fejl. Brug recover-handlingerne for at fortsætte.";}updateHostShellErrorBoundary();}
|
||||
function clearHostShellFatalError(){hostShellFatalError=false;hostShellRecoverInFlight=false;updateHostShellErrorBoundary();}
|
||||
function recoverHostShell(mode){if(hostShellRecoverInFlight){return Promise.resolve({error:"recover_in_flight"});}hostShellRecoverInFlight=true;updateHostShellErrorBoundary();if(mode==="reload"){window.location.reload();return Promise.resolve({ok:true});}if(!code()){hostShellRecoverInFlight=false;updateHostShellErrorBoundary();return Promise.resolve({error:"missing_session_code"});}return sessionDetail().then(function(result){clearHostShellFatalError();return result;}).catch(function(err){hostShellRecoverInFlight=false;updateHostShellErrorBoundary();throw err;});}
|
||||
function code(){return document.getElementById("code").value.trim().toUpperCase();}
|
||||
function saveHostContext(){try{localStorage.setItem("wppHostContext",JSON.stringify({code:code(),session_status:currentSessionStatus||"",auto_refresh:autoRefreshEnabled}));}catch(_e){}}
|
||||
function restoreHostContext(){try{var raw=localStorage.getItem("wppHostContext");if(!raw){return false;}var ctx=JSON.parse(raw);if(ctx.code){document.getElementById("code").value=(ctx.code||"").toUpperCase();}if(ctx.session_status){currentSessionStatus=ctx.session_status;}autoRefreshEnabled=!!ctx.auto_refresh;updateAutoRefreshUi();return !!ctx.code;}catch(_e){return false;}}
|
||||
function phaseLabel(status){if(status==="lobby"){return"Lobby";}if(status==="lie"){return"Lie";}if(status==="guess"){return"Guess";}if(status==="reveal"){return"Reveal";}if(status==="scoreboard"){return"Scoreboard";}if(status==="finished"){return"Finished";}return"Unknown";}
|
||||
function hostShellRouteFromPath(){var marker="/lobby/ui/host";var path=(window.location.pathname||"").toLowerCase();var idx=path.indexOf(marker);if(idx===-1){return"";}var remainder=path.slice(idx+marker.length).replace(/^\/+|\/+$/g,"");if(!remainder){return"";}var route=remainder.split("/")[0];return HOST_SHELL_ROUTES[route]?route:"";}
|
||||
function expectedHostShellRoute(){return HOST_SHELL_ROUTES[currentSessionStatus]||"";}
|
||||
function syncHostShellRoute(){var currentRoute=hostShellRouteFromPath();var expectedRoute=expectedHostShellRoute();if(!currentRoute||!expectedRoute){hostShellRouteHint="";return;}if(currentRoute===expectedRoute){hostShellRouteHint="";return;}var nextPath="/lobby/ui/host/"+expectedRoute;window.history.replaceState(null,"",nextPath);hostShellRouteHint="Deep-link route guard: omdirigeret fra /"+currentRoute+" til /"+expectedRoute+" for fase "+phaseLabel(currentSessionStatus)+".";}
|
||||
function rq(){return document.getElementById("roundQuestionId").value.trim();}
|
||||
|
||||
function saveHostContext(){try{localStorage.setItem("wppHostContext",JSON.stringify({code:code(),round_question_id:rq(),session_status:currentSessionStatus||"",auto_refresh:autoRefreshEnabled}));}catch(_e){}}
|
||||
function restoreHostContext(){try{var raw=localStorage.getItem("wppHostContext");if(!raw){return false;}var ctx=JSON.parse(raw);if(ctx.code){document.getElementById("code").value=(ctx.code||"").toUpperCase();}if(ctx.round_question_id){document.getElementById("roundQuestionId").value=ctx.round_question_id;}if(ctx.session_status){currentSessionStatus=ctx.session_status;}autoRefreshEnabled=!!ctx.auto_refresh;updateAutoRefreshUi();return !!ctx.code;}catch(_e){return false;}}
|
||||
function phaseLabel(status){if(status==="lobby"){return"Lobby";}if(status==="lie"){return"Løgn";}if(status==="guess"){return"Gæt";}if(status==="reveal"){return"Reveal";}if(status==="finished"){return"Afsluttet";}return"Ukendt";}
|
||||
function updateAutoRefreshUi(){var btn=document.getElementById("autoRefreshToggleBtn");var hint=document.getElementById("autoRefreshHint");if(btn){btn.textContent="Auto-refresh: "+(autoRefreshEnabled?"ON":"OFF");btn.disabled=hostActionInFlight||sessionDetailInFlight||!code();}if(!hint){return;}if(hostActionInFlight){hint.textContent="Auto-refresh-lås: afvent aktiv host-handling.";return;}if(sessionDetailInFlight){hint.textContent="Auto-refresh-lås: afvent aktiv session-opdatering.";return;}if(!autoRefreshEnabled){hint.textContent="Auto-refresh er slået fra.";return;}if(!code()){hint.textContent="Auto-refresh venter: angiv sessionkode.";return;}if(currentSessionStatus==="finished"){hint.textContent="Auto-refresh stoppet: spillet er afsluttet.";return;}hint.textContent="Auto-refresh aktiv (10s) for lobby-status.";}
|
||||
function stopAutoRefresh(reason){autoRefreshEnabled=false;if(autoRefreshTimer){clearInterval(autoRefreshTimer);autoRefreshTimer=null;}if(reason){var hint=document.getElementById("autoRefreshHint");if(hint){hint.textContent=reason;}}updateAutoRefreshUi();saveHostContext();}
|
||||
function startAutoRefresh(){if(!code()){updateAutoRefreshUi();return;}autoRefreshEnabled=true;if(autoRefreshTimer){clearInterval(autoRefreshTimer);}autoRefreshTimer=setInterval(function(){if(!code()||sessionDetailInFlight){return;}if(currentSessionStatus==="finished"){stopAutoRefresh("Auto-refresh stoppet: spillet er afsluttet.");return;}sessionDetail();},10000);updateAutoRefreshUi();saveHostContext();}
|
||||
function toggleAutoRefresh(){if(hostActionInFlight||sessionDetailInFlight||!code()){updateAutoRefreshUi();return;}if(autoRefreshEnabled){stopAutoRefresh();return;}startAutoRefresh();}
|
||||
function formatTimeLabel(dateObj){return dateObj.toLocaleTimeString(WPP_HOST_LOCALE,{hour12:false});}
|
||||
function formatTimeLabel(dateObj){return dateObj.toLocaleTimeString("da-DK",{hour12:false});}
|
||||
function markSessionRefresh(status){if(status>=200&&status<300){lastRefreshAtLabel=formatTimeLabel(new Date());lastRefreshFailed=false;}else{lastRefreshFailed=true;}updateLastRefreshStatus();}
|
||||
function updateLastRefreshStatus(){var el=document.getElementById("lastRefreshStatus");if(!el){return;}if(!lastRefreshAtLabel){el.textContent=lastRefreshFailed?"Session-data kan være forældet (ingen succesfuld opdatering endnu).":"Session-data ikke opdateret endnu.";return;}if(lastRefreshFailed){el.textContent="Session-data kan være forældet (seneste succes: "+lastRefreshAtLabel+").";return;}el.textContent="Sidst opdateret: "+lastRefreshAtLabel+".";}
|
||||
function normalizeApiError(data){if(!data||typeof data!=="object"){return"";}return (data.error_code||data.error||"").toString();}
|
||||
function mapUiErrorMessage(errorKey){if(!errorKey){return"";}var key=errorKey.toLowerCase();if(WPP_HOST_I18N&&WPP_HOST_I18N.backend&&WPP_HOST_I18N.backend.errors&&WPP_HOST_I18N.backend.errors[key]){return hostCopy("backend.errors."+key,"Action failed. Refresh state and retry.");}if(key.indexOf("session")!==-1){return hostCopy("backend.errors.session_not_found_or_closed","Session code is invalid, or session no longer exists.");}return hostCopy("backend.errors.generic_action_failed_retry","Action failed. Refresh state and retry.");}
|
||||
function mapUiErrorMessage(errorKey){if(!errorKey){return"";}var key=errorKey.toLowerCase();if(key.indexOf("phase")!==-1){return"Ugyldig fase for handlingen. Opdatér session-status og prøv igen.";}if(key.indexOf("token")!==-1||key.indexOf("auth")!==-1){return"Session-token er ugyldig eller udløbet. Rejoin sessionen og prøv igen.";}if(key.indexOf("round")!==-1||key.indexOf("question")!==-1||key.indexOf("state")!==-1){return"Runde-kontekst matcher ikke længere. Opdatér session-status før næste handling.";}if(key.indexOf("session")!==-1){return"Sessionkoden er ugyldig eller sessionen findes ikke længere.";}return"Handling fejlede. Opdatér session-status og prøv igen.";}
|
||||
function updateErrorHint(status,data){var el=document.getElementById("hostErrorHint");if(!el){return;}if(status>=200&&status<300){el.textContent="Ingen fejl.";return;}var errKey=normalizeApiError(data);el.textContent="Fejl: "+mapUiErrorMessage(errKey)+" ("+(errKey||("http_"+status))+")";}
|
||||
function updateCreateSessionState(){var btn=document.getElementById("createSessionBtn");var hint=document.getElementById("createSessionHint");if(btn){btn.disabled=hostActionInFlight||sessionDetailInFlight;}if(!hint){return;}if(hostActionInFlight){hint.textContent="Opret session er låst mens en host-handling kører.";return;}if(sessionDetailInFlight){hint.textContent="Opret session er låst mens session-opdatering kører.";return;}hint.textContent="Opret session er klar.";}function updateSessionDetailState(){var btn=document.getElementById("sessionDetailBtn");var hint=document.getElementById("sessionDetailHint");var codeInput=document.getElementById("code");if(btn){btn.disabled=sessionDetailInFlight||hostActionInFlight||!code();}if(codeInput){codeInput.readOnly=sessionDetailInFlight||hostActionInFlight;}if(!hint){return;}if(sessionDetailInFlight){hint.textContent="Opdaterer session-status…";return;}if(hostActionInFlight){hint.textContent="Session-opdatering er låst mens en host-handling kører.";return;}if(!code()){hint.textContent="Angiv sessionkode for at opdatere session-status.";updateHostShellErrorBoundary();return;}hint.textContent="Session-opdatering klar.";updateHostShellErrorBoundary();}
|
||||
function updateCreateSessionState(){var btn=document.getElementById("createSessionBtn");var hint=document.getElementById("createSessionHint");if(btn){btn.disabled=hostActionInFlight||sessionDetailInFlight;}if(!hint){return;}if(hostActionInFlight){hint.textContent="Opret session er låst mens en host-handling kører.";return;}if(sessionDetailInFlight){hint.textContent="Opret session er låst mens session-opdatering kører.";return;}hint.textContent="Opret session er klar.";}function updateSessionDetailState(){var btn=document.getElementById("sessionDetailBtn");var hint=document.getElementById("sessionDetailHint");var codeInput=document.getElementById("code");if(btn){btn.disabled=sessionDetailInFlight||hostActionInFlight||!code();}if(codeInput){codeInput.readOnly=sessionDetailInFlight||hostActionInFlight;}if(!hint){return;}if(sessionDetailInFlight){hint.textContent="Opdaterer session-status…";return;}if(hostActionInFlight){hint.textContent="Session-opdatering er låst mens en host-handling kører.";return;}if(!code()){hint.textContent="Angiv sessionkode for at opdatere session-status.";return;}hint.textContent="Session-opdatering klar.";}
|
||||
|
||||
function updatePhaseStatus(){var el=document.getElementById("phaseStatus");syncHostShellRoute();if(!el){return;}if(!currentSessionStatus){el.textContent="Fase: ukendt (opdatér session-status).";return;}el.textContent="Fase: "+phaseLabel(currentSessionStatus)+" ("+currentSessionStatus+")";}
|
||||
function updatePhaseStatus(){var el=document.getElementById("phaseStatus");if(!el){return;}if(!currentSessionStatus){el.textContent="Fase: ukendt (opdatér session-status).";return;}el.textContent="Fase: "+phaseLabel(currentSessionStatus)+" ("+currentSessionStatus+")";}
|
||||
function syncStartRoundGuard(data){var btn=document.getElementById("startRoundBtn");var hint=document.getElementById("startRoundHint");var status=document.getElementById("playerCountStatus");if(!btn||!hint||!status){return;}var count=(data&&data.session&&typeof data.session.players_count==="number")?data.session.players_count:null;var phase=currentSessionStatus||"";if(phase&&phase!=="lobby"){btn.disabled=true;status.textContent=count===null?"Spillere i session: ukendt":"Spillere i session: "+count;hint.textContent="Start runde er kun tilladt i lobby-fasen.";return;}if(count===null){btn.disabled=true;status.textContent="Spillere i session: ukendt";hint.textContent="Opdatér session-status for at validere 3-5 spillere.";return;}status.textContent="Spillere i session: "+count;if(count<3){btn.disabled=true;hint.textContent="Mangler spillere: kræver mindst 3 for at starte runde.";return;}if(count>5){btn.disabled=true;hint.textContent="For mange spillere: maks 5 i MVP før runde-start.";return;}btn.disabled=false;hint.textContent="Klar: spillerantal er indenfor 3-5 til runde-start.";}
|
||||
|
||||
function updateHostActionState(){updateCreateSessionState();var hasCode=!!code();var phase=currentSessionStatus||"";var nextRoundBtn=document.getElementById("nextRoundBtn");var finishGameBtn=document.getElementById("finishGameBtn");var roundQuestionGuardHint=document.getElementById("roundQuestionGuardHint");var categorySelect=document.getElementById("category");var categoryGuardHint=document.getElementById("categoryGuardHint");var hint=document.getElementById("hostActionHint");if(nextRoundBtn){nextRoundBtn.disabled=hostActionInFlight||sessionDetailInFlight||!hasCode||phase!=="scoreboard";}if(finishGameBtn){finishGameBtn.disabled=hostActionInFlight||sessionDetailInFlight||!hasCode||phase!=="scoreboard";}if(roundQuestionGuardHint){if(hostActionInFlight){roundQuestionGuardHint.textContent="Round question-id er låst mens en handling kører.";}else if(sessionDetailInFlight){roundQuestionGuardHint.textContent="Round question-id er låst mens session-opdatering kører.";}else if(!hasCode){roundQuestionGuardHint.textContent="Angiv sessionkode for at se aktiv round question.";}else if(!phase){roundQuestionGuardHint.textContent="Opdatér session-status for round question-kontekst.";}else{roundQuestionGuardHint.textContent="Round question-id styres server-side i canonical flow og er read-only i fase: "+phaseLabel(phase)+".";}}if(categorySelect){categorySelect.disabled=hostActionInFlight||sessionDetailInFlight||!hasCode||phase!=="lobby";}if(categoryGuardHint){if(hostActionInFlight){categoryGuardHint.textContent="Kategori er midlertidigt låst mens en handling kører.";}else if(sessionDetailInFlight){categoryGuardHint.textContent="Kategori er låst mens session-opdatering kører.";}else if(!hasCode){categoryGuardHint.textContent="Angiv sessionkode for at låse kategori til lobby-fasen.";}else if(phase==="lobby"){categoryGuardHint.textContent="Kategori kan vælges i lobby-fasen.";}else if(!phase){categoryGuardHint.textContent="Opdatér session-status for at validere kategori-lås.";}else{categoryGuardHint.textContent="Kategori er låst udenfor lobby-fasen.";}}if(!hint){return;}if(hostActionInFlight){hint.textContent="Handling kører… afvent svar før næste klik.";return;}if(sessionDetailInFlight){hint.textContent="Host-actions er låst mens session-opdatering kører.";return;}if(!hasCode){hint.textContent="Angiv sessionkode for at aktivere host-actions.";return;}if(!phase){hint.textContent="Opdatér session-status for fasebaserede host-actions.";return;}if(phase==="finished"){hint.textContent="Spillet er afsluttet: gameplay-actions er låst.";return;}if(phase==="scoreboard"){hint.textContent="Host-actions er klar: vælg næste runde eller afslut spillet.";return;}if(hostShellRouteHint){hint.textContent=hostShellRouteHint;return;}hint.textContent="Mid-round faseskift er server-styrede i canonical flow. Host monitorerer kun fremdrift i fase: "+phaseLabel(phase)+".";}
|
||||
async function api(path,method,payload){var o={method:method||"GET",headers:{"Accept":"application/json"}};if(payload!==null){o.headers["Content-Type"]="application/json";o.headers["X-CSRFToken"]=csrf();o.body=JSON.stringify(payload);}var r=await fetch(path,o);var d=await r.json().catch(function(){return {};});var isSessionDetailRead=(method||"GET")==="GET"&&/^\/lobby\/sessions\/[A-Z0-9]+$/.test(path);if(isSessionDetailRead){markSessionRefresh(r.status);}document.getElementById("out").textContent=JSON.stringify({status:r.status,data:d},null,2);if(d.session&&d.session.code){document.getElementById("code").value=d.session.code;}if(d.session&&d.session.status){currentSessionStatus=d.session.status;}if(d.session){hydrateHostCriticalView(d);}updateErrorHint(r.status,d);updatePhaseStatus();syncStartRoundGuard(d);updateHostActionState();if(currentSessionStatus==="finished"&&autoRefreshEnabled){stopAutoRefresh("Auto-refresh stoppet: spillet er afsluttet.");}else{updateAutoRefreshUi();}if(hostShellFatalError){clearHostShellFatalError();}saveHostContext();return d;}
|
||||
|
||||
function updateHostActionState(){updateCreateSessionState();var hasCode=!!code();var hasRound=!!rq();var phase=currentSessionStatus||"";var showQuestionBtn=document.getElementById("showQuestionBtn");var mixAnswersBtn=document.getElementById("mixAnswersBtn");var calcScoresBtn=document.getElementById("calcScoresBtn");var showScoreboardBtn=document.getElementById("showScoreboardBtn");var nextRoundBtn=document.getElementById("nextRoundBtn");var finishGameBtn=document.getElementById("finishGameBtn");var roundQuestionInput=document.getElementById("roundQuestionId");var roundQuestionGuardHint=document.getElementById("roundQuestionGuardHint");var categorySelect=document.getElementById("category");var categoryGuardHint=document.getElementById("categoryGuardHint");var hint=document.getElementById("hostActionHint");if(showQuestionBtn){showQuestionBtn.disabled=hostActionInFlight||sessionDetailInFlight||!hasCode||phase!=="lie";}if(showScoreboardBtn){showScoreboardBtn.disabled=hostActionInFlight||sessionDetailInFlight||!hasCode||phase!=="reveal";}if(nextRoundBtn){nextRoundBtn.disabled=hostActionInFlight||sessionDetailInFlight||!hasCode||phase!=="reveal";}if(finishGameBtn){finishGameBtn.disabled=hostActionInFlight||sessionDetailInFlight||!hasCode||phase!=="reveal";}if(mixAnswersBtn){mixAnswersBtn.disabled=hostActionInFlight||sessionDetailInFlight||!hasCode||!hasRound||(phase!=="lie"&&phase!=="guess");}if(calcScoresBtn){calcScoresBtn.disabled=hostActionInFlight||sessionDetailInFlight||!hasCode||!hasRound||phase!=="guess";}var canEditRoundQuestion=!!hasCode&&(phase==="lie"||phase==="guess"||phase==="reveal");if(roundQuestionInput){roundQuestionInput.disabled=hostActionInFlight||sessionDetailInFlight||!canEditRoundQuestion;}if(roundQuestionGuardHint){if(hostActionInFlight){roundQuestionGuardHint.textContent="Round question-id er låst mens en handling kører.";}else if(sessionDetailInFlight){roundQuestionGuardHint.textContent="Round question-id er låst mens session-opdatering kører.";}else if(!hasCode){roundQuestionGuardHint.textContent="Angiv sessionkode for at redigere round question-id.";}else if(!phase){roundQuestionGuardHint.textContent="Opdatér session-status for round question-id.";}else if(canEditRoundQuestion){roundQuestionGuardHint.textContent="Round question-id kan redigeres i fase: "+phaseLabel(phase)+".";}else{roundQuestionGuardHint.textContent="Round question-id er låst i fase: "+phaseLabel(phase)+".";}}if(categorySelect){categorySelect.disabled=hostActionInFlight||sessionDetailInFlight||!hasCode||phase!=="lobby";}if(categoryGuardHint){if(hostActionInFlight){categoryGuardHint.textContent="Kategori er midlertidigt låst mens en handling kører.";}else if(sessionDetailInFlight){categoryGuardHint.textContent="Kategori er låst mens session-opdatering kører.";}else if(!hasCode){categoryGuardHint.textContent="Angiv sessionkode for at låse kategori til lobby-fasen.";}else if(phase==="lobby"){categoryGuardHint.textContent="Kategori kan vælges i lobby-fasen.";}else if(!phase){categoryGuardHint.textContent="Opdatér session-status for at validere kategori-lås.";}else{categoryGuardHint.textContent="Kategori er låst udenfor lobby-fasen.";}}if(!hint){return;}if(hostActionInFlight){hint.textContent="Handling kører… afvent svar før næste klik.";return;}if(sessionDetailInFlight){hint.textContent="Host-actions er låst mens session-opdatering kører.";return;}if(!hasCode){hint.textContent="Angiv sessionkode for at aktivere host-actions.";return;}if(!phase){hint.textContent="Opdatér session-status for fasebaserede host-actions.";return;}if(phase==="finished"){hint.textContent="Spillet er afsluttet: gameplay-actions er låst.";return;}if((phase==="lie"||phase==="guess")&&!hasRound){hint.textContent="Round question id mangler: mix/beregn score er låst.";return;}hint.textContent="Host-actions er klar for fase: "+phaseLabel(phase)+".";}
|
||||
async function api(path,method,payload){var o={method:method||"GET",headers:{"Accept":"application/json"}};if(payload!==null){o.headers["Content-Type"]="application/json";o.headers["X-CSRFToken"]=csrf();o.body=JSON.stringify(payload);}var r=await fetch(path,o);var d=await r.json().catch(function(){return {};});var isSessionDetailRead=(method||"GET")==="GET"&&/^\/lobby\/sessions\/[A-Z0-9]+$/.test(path);if(isSessionDetailRead){markSessionRefresh(r.status);}document.getElementById("out").textContent=JSON.stringify({status:r.status,data:d},null,2);if(d.session&&d.session.code){document.getElementById("code").value=d.session.code;}if(d.session&&d.session.status){currentSessionStatus=d.session.status;}if(d.round_question&&d.round_question.id){document.getElementById("roundQuestionId").value=d.round_question.id;}updateErrorHint(r.status,d);updatePhaseStatus();syncStartRoundGuard(d);updateHostActionState();if(currentSessionStatus==="finished"&&autoRefreshEnabled){stopAutoRefresh("Auto-refresh stoppet: spillet er afsluttet.");}else{updateAutoRefreshUi();}saveHostContext();return d;}
|
||||
function withHostActionLock(fn){if(hostActionInFlight){return Promise.resolve({error:"host_action_in_flight"});}hostActionInFlight=true;updateHostActionState();return Promise.resolve().then(fn).finally(function(){hostActionInFlight=false;updateHostActionState();});}
|
||||
function createSession(){return withHostActionLock(function(){return api("/lobby/sessions/create","POST",{});});}
|
||||
function sessionDetail(){if(!code()){updateSessionDetailState();return Promise.resolve({error:"missing_session_code"});}if(sessionDetailInFlight){return Promise.resolve({error:"session_detail_in_flight"});}sessionDetailInFlight=true;updateSessionDetailState();return api("/lobby/sessions/"+code(),"GET",null).finally(function(){sessionDetailInFlight=false;updateSessionDetailState();});}
|
||||
function startRound(){if(document.getElementById("startRoundBtn").disabled){return Promise.resolve({error:"not_enough_players_client_guard"});}return withHostActionLock(function(){return api("/lobby/sessions/"+code()+"/rounds/start","POST",{category_slug:document.getElementById("category").value});});}
|
||||
function showQuestion(){return withHostActionLock(function(){return api("/lobby/sessions/"+code()+"/questions/show","POST",{});});}
|
||||
function mixAnswers(){return withHostActionLock(function(){return api("/lobby/sessions/"+code()+"/questions/"+rq()+"/answers/mix","POST",{});});}
|
||||
function calcScores(){return withHostActionLock(function(){return api("/lobby/sessions/"+code()+"/questions/"+rq()+"/scores/calculate","POST",{});});}
|
||||
function showScoreboard(){return withHostActionLock(function(){return api("/lobby/sessions/"+code()+"/scoreboard","GET",null);});}
|
||||
function nextRound(){return withHostActionLock(function(){return api("/lobby/sessions/"+code()+"/rounds/next","POST",{});});}
|
||||
function finishGame(){return withHostActionLock(function(){return api("/lobby/sessions/"+code()+"/finish","POST",{});});}
|
||||
["code"].forEach(function(fieldId){var field=document.getElementById(fieldId);if(!field){return;}field.addEventListener("input",function(){syncStartRoundGuard(null);updateHostActionState();updateSessionDetailState();saveHostContext();});field.addEventListener("change",function(){syncStartRoundGuard(null);updateHostActionState();updateSessionDetailState();saveHostContext();});});
|
||||
["code","roundQuestionId"].forEach(function(fieldId){var field=document.getElementById(fieldId);if(!field){return;}field.addEventListener("input",function(){syncStartRoundGuard(null);updateHostActionState();updateSessionDetailState();saveHostContext();});field.addEventListener("change",function(){syncStartRoundGuard(null);updateHostActionState();updateSessionDetailState();saveHostContext();});});
|
||||
|
||||
window.addEventListener("error",function(event){setHostShellFatalError((event&&event.message)||"Ukendt runtime-fejl");});
|
||||
window.addEventListener("unhandledrejection",function(event){var reason=event&&event.reason;var detail=(reason&&reason.message)||String(reason||"Unhandled promise rejection");setHostShellFatalError(detail);});
|
||||
setHostCriticalLoading(true);
|
||||
updatePhaseStatus();syncHostShellRoute();syncStartRoundGuard(null);updateHostActionState();updateCreateSessionState();updateSessionDetailState();updateAutoRefreshUi();updateLastRefreshStatus();updateHostShellErrorBoundary();
|
||||
if(restoreHostContext()){updatePhaseStatus();syncHostShellRoute();if(autoRefreshEnabled){startAutoRefresh();}sessionDetail();}else{saveHostContext();setTimeout(function(){if(!hostCriticalHydrated){hydrateHostCriticalView({session:{status:currentSessionStatus,players_count:null}});}},350);}
|
||||
updatePhaseStatus();syncStartRoundGuard(null);updateHostActionState();updateCreateSessionState();updateSessionDetailState();updateAutoRefreshUi();updateLastRefreshStatus();
|
||||
if(restoreHostContext()){updatePhaseStatus();if(autoRefreshEnabled){startAutoRefresh();}sessionDetail();}else{saveHostContext();}
|
||||
</script>
|
||||
</body></html>
|
||||
|
||||
@@ -9,22 +9,8 @@
|
||||
#joinStatus { margin: 6px 0 10px; font-size: 0.95rem; color: #333; }
|
||||
#contextLockHint { margin: 6px 0 10px; font-size: 0.95rem; color: #333; }
|
||||
#phaseStatus { margin: 6px 0 10px; font-size: 0.95rem; color: #333; }
|
||||
#connectionBanner { margin: 8px 0 10px; padding: 8px 10px; border-radius: 8px; border: 1px solid #b91c1c; background: #fee2e2; color: #7f1d1d; display: none; }
|
||||
#connectionBanner button { margin-left: 8px; border: 1px solid #991b1b; background: #fff; color: #7f1d1d; border-radius: 6px; padding: 4px 8px; cursor: pointer; }
|
||||
#connectionBanner button[disabled] { opacity: 0.55; cursor: not-allowed; }
|
||||
#playerShellErrorBoundary { margin: 8px 0 10px; padding: 8px 10px; border-radius: 8px; border: 1px solid #b91c1c; background: #fee2e2; color: #7f1d1d; display: none; }
|
||||
#playerShellErrorBoundary button { margin-left: 8px; border: 1px solid #991b1b; background: #fff; color: #7f1d1d; border-radius: 6px; padding: 4px 8px; cursor: pointer; }
|
||||
#playerShellErrorBoundary button[disabled] { opacity: 0.55; cursor: not-allowed; }
|
||||
#lieStatus.locked { color: #0a5f2d; font-weight: 600; }
|
||||
#guessStatus.locked { color: #0a5f2d; font-weight: 600; }
|
||||
.critical-card { margin: 10px 0 12px; padding: 10px; border-radius: 10px; border: 1px solid #cbd5e1; background: #f8fafc; }
|
||||
.critical-card h2 { margin: 0 0 6px; font-size: 1rem; }
|
||||
.critical-card p { margin: 0; color: #334155; }
|
||||
.skeleton-line { position: relative; overflow: hidden; height: 12px; border-radius: 999px; margin-top: 8px; background: #e2e8f0; }
|
||||
.skeleton-line:first-of-type { margin-top: 4px; }
|
||||
.skeleton-line.short { width: 60%; }
|
||||
.skeleton-line::after { content: ""; position: absolute; inset: 0; transform: translateX(-100%); background: linear-gradient(90deg, rgba(226,232,240,0) 0%, rgba(255,255,255,0.85) 45%, rgba(226,232,240,0) 100%); animation: wppShimmer 1.2s infinite; }
|
||||
@keyframes wppShimmer { to { transform: translateX(100%); } }
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
@@ -52,29 +38,8 @@
|
||||
<p id="playerLastRefreshStatus">Session-data ikke opdateret endnu.</p>
|
||||
<p id="phaseStatus">Fase: ukendt (opdatér session-status).</p>
|
||||
<p id="playerErrorHint">Ingen fejl.</p>
|
||||
<div id="connectionBanner">Forbindelsen til serveren blev afbrudt.<button id="connectionRetryBtn" type="button" onclick="retryConnection()">Prøv igen</button></div>
|
||||
<div id="playerShellErrorBoundary">Der opstod en kritisk fejl i app-skallen.
|
||||
<button id="playerRecoverRetryBtn" type="button" onclick="recoverPlayerShell('retry')">Prøv gendan</button>
|
||||
<button id="playerRecoverReloadBtn" type="button" onclick="recoverPlayerShell('reload')">Genindlæs siden</button>
|
||||
</div>
|
||||
<section id="playerCriticalSkeleton" class="critical-card" aria-live="polite">
|
||||
<h2>Indlæser spiller-overblik…</h2>
|
||||
<div class="skeleton-line"></div>
|
||||
<div class="skeleton-line"></div>
|
||||
<div class="skeleton-line short"></div>
|
||||
</section>
|
||||
<section id="playerCriticalView" class="critical-card" style="display:none" aria-live="polite">
|
||||
<h2>Spiller-overblik</h2>
|
||||
<p id="playerCriticalPhase">Fase: afventer</p>
|
||||
<p id="playerCriticalRound">Round question: afventer</p>
|
||||
<p id="playerCriticalJoin">Join-status: afventer</p>
|
||||
</section>
|
||||
<pre id="out">Ready.</pre>
|
||||
{{ lobby_i18n|json_script:"wppPlayerI18n" }}
|
||||
<pre id="out">Klar.</pre>
|
||||
<script>
|
||||
var WPP_PLAYER_LOCALE="{{ shell_locale|default:'en'|escapejs }}";
|
||||
var WPP_PLAYER_I18N=JSON.parse(document.getElementById("wppPlayerI18n").textContent||"{}");
|
||||
function playerCopy(path,fallback){var node=WPP_PLAYER_I18N;var parts=(path||"").split(".");for(var i=0;i<parts.length;i++){if(!node||typeof node!=="object"){return fallback||path;}node=node[parts[i]];}if(node&&typeof node==="object"){if(node[WPP_PLAYER_LOCALE]){return node[WPP_PLAYER_LOCALE];}if(node.en){return node.en;}}return typeof node==="string"?node:(fallback||path);}
|
||||
var availableAnswers=[];
|
||||
var guessSubmitted=false;
|
||||
var lieSubmitted=false;
|
||||
@@ -88,28 +53,10 @@ var playerAutoRefreshTimer=null;
|
||||
var sessionDetailInFlight=false;
|
||||
var playerLastRefreshAtLabel="";
|
||||
var playerLastRefreshFailed=false;
|
||||
var connectionLost=false;
|
||||
var connectionRetryInFlight=false;
|
||||
var playerShellFatalError=false;
|
||||
var playerShellRecoverInFlight=false;
|
||||
var playerCriticalHydrated=false;
|
||||
function silencePlayerMediaElements(){if(typeof document==="undefined"||typeof document.querySelectorAll!=="function"){return;}var elements=document.querySelectorAll("audio,video");if(!elements||typeof elements.forEach!=="function"){return;}elements.forEach(function(element){if(!element){return;}element.muted=true;if(typeof element.pause==="function"){element.pause();}});}
|
||||
function installSecondaryDeviceAudioGuard(){if(typeof window==="undefined"){return;}silencePlayerMediaElements();var mediaProto=window.HTMLMediaElement&&window.HTMLMediaElement.prototype;if(!mediaProto||typeof mediaProto.play!=="function"){return;}if(mediaProto.__wppSecondaryDeviceAudioGuardInstalled){return;}mediaProto.__wppSecondaryDeviceAudioGuardInstalled=true;mediaProto.__wppSecondaryDeviceAudioGuardOriginalPlay=mediaProto.play;mediaProto.play=function(){return Promise.resolve();};}
|
||||
function setPlayerCriticalLoading(isLoading){var skeleton=document.getElementById("playerCriticalSkeleton");var view=document.getElementById("playerCriticalView");if(!skeleton||!view){return;}skeleton.style.display=isLoading?"block":"none";view.style.display=isLoading?"none":"block";}
|
||||
function hydratePlayerCriticalView(data){var phaseEl=document.getElementById("playerCriticalPhase");var roundEl=document.getElementById("playerCriticalRound");var joinEl=document.getElementById("playerCriticalJoin");if(phaseEl){phaseEl.textContent="Fase: "+phaseLabel(currentSessionStatus||((data&&data.session&&data.session.status)||""));}
|
||||
if(roundEl){roundEl.textContent="Round question: "+(rq()||"afventer");}
|
||||
if(joinEl){joinEl.textContent="Join-status: "+(isPlayerContextLocked()?"låst/aktiv":"ikke låst");}
|
||||
playerCriticalHydrated=true;
|
||||
setPlayerCriticalLoading(false);
|
||||
}
|
||||
function code(){return document.getElementById("code").value.trim().toUpperCase();}
|
||||
function updatePlayerShellErrorBoundary(){var panel=document.getElementById("playerShellErrorBoundary");var retryBtn=document.getElementById("playerRecoverRetryBtn");var reloadBtn=document.getElementById("playerRecoverReloadBtn");if(!panel||!retryBtn||!reloadBtn){return;}panel.style.display=playerShellFatalError?"block":"none";retryBtn.disabled=playerShellRecoverInFlight||sessionDetailInFlight||joinInFlight||!code();reloadBtn.disabled=playerShellRecoverInFlight;}
|
||||
function setPlayerShellFatalError(detail){playerShellFatalError=true;var out=document.getElementById("out");if(out){out.textContent=JSON.stringify({status:0,data:{error:"player_shell_runtime_error",detail:detail||"Ukendt runtime-fejl"}},null,2);}var hint=document.getElementById("playerErrorHint");if(hint){hint.textContent="Fejl: Kritisk app-fejl. Brug recover-handlingerne for at fortsætte.";}updatePlayerShellErrorBoundary();}
|
||||
function clearPlayerShellFatalError(){playerShellFatalError=false;playerShellRecoverInFlight=false;updatePlayerShellErrorBoundary();}
|
||||
function recoverPlayerShell(mode){if(playerShellRecoverInFlight){return Promise.resolve({error:"recover_in_flight"});}playerShellRecoverInFlight=true;updatePlayerShellErrorBoundary();if(mode==="reload"){window.location.reload();return Promise.resolve({ok:true});}if(!code()){playerShellRecoverInFlight=false;updatePlayerShellErrorBoundary();return Promise.resolve({error:"missing_session_code"});}return sessionDetail().then(function(result){clearPlayerShellFatalError();return result;}).catch(function(err){playerShellRecoverInFlight=false;updatePlayerShellErrorBoundary();throw err;});}
|
||||
function pid(){return document.getElementById("playerId").value.trim();}
|
||||
function rq(){return document.getElementById("roundQuestionId").value.trim();}
|
||||
function phaseLabel(status){if(status==="lobby"){return"Lobby";}if(status==="lie"){return"Lie";}if(status==="guess"){return"Guess";}if(status==="reveal"){return"Reveal";}if(status==="scoreboard"){return"Scoreboard";}if(status==="finished"){return"Finished";}return"Unknown";}
|
||||
function phaseLabel(status){if(status==="lobby"){return"Lobby";}if(status==="lie"){return"Løgn";}if(status==="guess"){return"Gæt";}if(status==="reveal"){return"Reveal";}if(status==="finished"){return"Afsluttet";}return"Ukendt";}
|
||||
function updatePhaseStatus(){var el=document.getElementById("phaseStatus");if(!el){return;}if(!currentSessionStatus){el.textContent="Fase: ukendt (opdatér session-status).";return;}el.textContent="Fase: "+phaseLabel(currentSessionStatus)+" ("+currentSessionStatus+")";}
|
||||
function savePlayerContext(){try{localStorage.setItem(PLAYER_CONTEXT_KEY,JSON.stringify({code:code(),nickname:document.getElementById("nickname").value.trim(),player_id:pid(),session_token:document.getElementById("sessionToken").value.trim(),round_question_id:rq(),auto_refresh:playerAutoRefreshEnabled}));}catch(_e){}}
|
||||
function loadPlayerContext(){try{var raw=localStorage.getItem(PLAYER_CONTEXT_KEY);if(!raw){return null;}return JSON.parse(raw);}catch(_e){return null;}}
|
||||
@@ -122,19 +69,17 @@ function resetRoundContextForManualChange(){document.getElementById("roundQuesti
|
||||
function updateContextLockState(){var locked=isPlayerContextLocked()||joinInFlight;var codeField=document.getElementById("code");var nicknameField=document.getElementById("nickname");var playerIdField=document.getElementById("playerId");var tokenField=document.getElementById("sessionToken");if(codeField){codeField.readOnly=locked;}if(nicknameField){nicknameField.readOnly=locked;}if(playerIdField){playerIdField.readOnly=locked;}if(tokenField){tokenField.readOnly=true;}var hint=document.getElementById("contextLockHint");if(!hint){return;}if(joinInFlight){hint.textContent="Låser kontekst…";return;}if(locked){hint.textContent="Spillerkontekst er låst efter join.";return;}hint.textContent="Kontekst er ikke låst endnu.";}
|
||||
function canAttemptJoin(){return !!(code()&&document.getElementById("nickname").value.trim());}
|
||||
function normalizeApiError(data){if(!data||typeof data!=="object"){return"";}return (data.error_code||data.error||"").toString();}
|
||||
function mapUiErrorMessage(errorKey){if(!errorKey){return"";}var key=errorKey.toLowerCase();if(WPP_PLAYER_I18N&&WPP_PLAYER_I18N.backend&&WPP_PLAYER_I18N.backend.errors&&WPP_PLAYER_I18N.backend.errors[key]){return playerCopy("backend.errors."+key,"Action failed. Refresh state and retry.");}if(key.indexOf("session")!==-1){return playerCopy("backend.errors.session_not_found_or_closed","Session code is invalid, or session no longer exists.");}return playerCopy("backend.errors.generic_action_failed_retry","Action failed. Refresh state and retry.");}
|
||||
function formatTimeLabel(dateObj){return dateObj.toLocaleTimeString(WPP_PLAYER_LOCALE,{hour12:false});}
|
||||
function mapUiErrorMessage(errorKey){if(!errorKey){return"";}var key=errorKey.toLowerCase();if(key.indexOf("phase")!==-1){return"Ugyldig fase for handlingen. Opdatér session-status og prøv igen.";}if(key.indexOf("token")!==-1||key.indexOf("auth")!==-1){return"Session-token er ugyldig eller udløbet. Rejoin sessionen og prøv igen.";}if(key.indexOf("round")!==-1||key.indexOf("question")!==-1||key.indexOf("state")!==-1){return"Runde-kontekst matcher ikke længere. Opdatér session-status før næste handling.";}if(key.indexOf("session")!==-1){return"Sessionkoden er ugyldig eller sessionen findes ikke længere.";}return"Handling fejlede. Opdatér session-status og prøv igen.";}
|
||||
function formatTimeLabel(dateObj){return dateObj.toLocaleTimeString("da-DK",{hour12:false});}
|
||||
function markPlayerSessionRefresh(status){if(status>=200&&status<300){playerLastRefreshAtLabel=formatTimeLabel(new Date());playerLastRefreshFailed=false;}else{playerLastRefreshFailed=true;}updatePlayerLastRefreshStatus();}
|
||||
function updatePlayerLastRefreshStatus(){var el=document.getElementById("playerLastRefreshStatus");if(!el){return;}if(!playerLastRefreshAtLabel){el.textContent=playerLastRefreshFailed?"Session-data kan være forældet (ingen succesfuld opdatering endnu).":"Session-data ikke opdateret endnu.";return;}if(playerLastRefreshFailed){el.textContent="Session-data kan være forældet (seneste succes: "+playerLastRefreshAtLabel+").";return;}el.textContent="Sidst opdateret: "+playerLastRefreshAtLabel+".";}
|
||||
function updatePlayerAutoRefreshUi(){var btn=document.getElementById("playerAutoRefreshToggleBtn");var hint=document.getElementById("playerAutoRefreshHint");if(btn){btn.textContent="Auto-refresh: "+(playerAutoRefreshEnabled?"ON":"OFF");btn.disabled=sessionDetailInFlight||joinInFlight||!code();}if(!hint){return;}if(sessionDetailInFlight){hint.textContent="Auto-refresh-lås: afvent aktiv session-opdatering.";return;}if(joinInFlight){hint.textContent="Auto-refresh-lås: afvent aktiv join.";return;}if(!code()){hint.textContent="Auto-refresh kræver sessionkode.";return;}if(!playerAutoRefreshEnabled){hint.textContent="Auto-refresh er slået fra.";return;}if(currentSessionStatus==="finished"){hint.textContent="Auto-refresh stoppet: spillet er afsluttet.";return;}hint.textContent="Auto-refresh aktiv (10s) for spillerstatus.";}
|
||||
function stopPlayerAutoRefresh(reason){playerAutoRefreshEnabled=false;if(playerAutoRefreshTimer){clearInterval(playerAutoRefreshTimer);playerAutoRefreshTimer=null;}if(reason){var hint=document.getElementById("playerAutoRefreshHint");if(hint){hint.textContent=reason;}}updatePlayerAutoRefreshUi();savePlayerContext();}
|
||||
function startPlayerAutoRefresh(){if(!code()){updatePlayerAutoRefreshUi();return;}playerAutoRefreshEnabled=true;if(playerAutoRefreshTimer){clearInterval(playerAutoRefreshTimer);}playerAutoRefreshTimer=setInterval(function(){if(!code()||sessionDetailInFlight){return;}if(currentSessionStatus==="finished"){stopPlayerAutoRefresh("Auto-refresh stoppet: spillet er afsluttet.");return;}sessionDetail().catch(function(){});},10000);updatePlayerAutoRefreshUi();savePlayerContext();}
|
||||
function startPlayerAutoRefresh(){if(!code()){updatePlayerAutoRefreshUi();return;}playerAutoRefreshEnabled=true;if(playerAutoRefreshTimer){clearInterval(playerAutoRefreshTimer);}playerAutoRefreshTimer=setInterval(function(){if(!code()||sessionDetailInFlight){return;}if(currentSessionStatus==="finished"){stopPlayerAutoRefresh("Auto-refresh stoppet: spillet er afsluttet.");return;}sessionDetail();},10000);updatePlayerAutoRefreshUi();savePlayerContext();}
|
||||
function togglePlayerAutoRefresh(){if(joinInFlight){updatePlayerAutoRefreshUi();return;}if(playerAutoRefreshEnabled){stopPlayerAutoRefresh();return;}startPlayerAutoRefresh();}
|
||||
function updateConnectionBanner(){var banner=document.getElementById("connectionBanner");var retryBtn=document.getElementById("connectionRetryBtn");if(!banner||!retryBtn){return;}banner.style.display=connectionLost?"block":"none";retryBtn.disabled=connectionRetryInFlight||sessionDetailInFlight||joinInFlight||!code();}
|
||||
function setConnectionLost(isLost){connectionLost=!!isLost;updateConnectionBanner();}
|
||||
function updatePlayerErrorHint(status,data){var el=document.getElementById("playerErrorHint");if(!el){return;}if(status>=200&&status<300){el.textContent="Ingen fejl.";setConnectionLost(false);return;}var errKey=normalizeApiError(data);el.textContent="Fejl: "+mapUiErrorMessage(errKey)+" ("+(errKey||("http_"+status))+")";}
|
||||
function updateSessionDetailState(){var btn=document.getElementById("sessionDetailBtn");var hint=document.getElementById("sessionRefreshHint");var submitInFlight=lieSubmitInFlight||guessSubmitInFlight;if(btn){btn.disabled=sessionDetailInFlight||joinInFlight||submitInFlight||!code();}if(!hint){updatePlayerAutoRefreshUi();updateConnectionBanner();return;}if(sessionDetailInFlight){hint.textContent="Opdaterer session-status…";updatePlayerAutoRefreshUi();updateConnectionBanner();return;}if(joinInFlight){hint.textContent="Session-opdatering er låst mens join kører.";updatePlayerAutoRefreshUi();updateConnectionBanner();return;}if(submitInFlight){hint.textContent="Session-opdatering er låst mens submit kører.";updatePlayerAutoRefreshUi();updateConnectionBanner();return;}if(!code()){hint.textContent="Angiv sessionkode for at opdatere session-status.";updatePlayerAutoRefreshUi();updateConnectionBanner();updatePlayerShellErrorBoundary();return;}hint.textContent="Session-opdatering klar.";updatePlayerAutoRefreshUi();updateConnectionBanner();updatePlayerShellErrorBoundary();}
|
||||
function updateJoinState(){var btn=document.getElementById("joinBtn");var status=document.getElementById("joinStatus");var joined=!!(pid()&&document.getElementById("sessionToken").value.trim());var canJoin=canAttemptJoin();if(btn){btn.disabled=joinInFlight||sessionDetailInFlight||joined||!canJoin;}if(!status){updateContextLockState();updateConnectionBanner();return;}if(joinInFlight){status.textContent="Joiner…";updateContextLockState();updateConnectionBanner();return;}if(sessionDetailInFlight&&!joined){status.textContent="Afvent aktiv session-opdatering før join.";updateContextLockState();updateConnectionBanner();return;}if(joined){status.textContent="Join gennemført.";updateContextLockState();updateConnectionBanner();return;}if(!canJoin){status.textContent="Udfyld kode og nickname for at join.";updateContextLockState();updateConnectionBanner();return;}status.textContent="Klar til join.";updateContextLockState();updateConnectionBanner();}
|
||||
function updatePlayerErrorHint(status,data){var el=document.getElementById("playerErrorHint");if(!el){return;}if(status>=200&&status<300){el.textContent="Ingen fejl.";return;}var errKey=normalizeApiError(data);el.textContent="Fejl: "+mapUiErrorMessage(errKey)+" ("+(errKey||("http_"+status))+")";}
|
||||
function updateSessionDetailState(){var btn=document.getElementById("sessionDetailBtn");var hint=document.getElementById("sessionRefreshHint");var submitInFlight=lieSubmitInFlight||guessSubmitInFlight;if(btn){btn.disabled=sessionDetailInFlight||joinInFlight||submitInFlight||!code();}if(!hint){updatePlayerAutoRefreshUi();return;}if(sessionDetailInFlight){hint.textContent="Opdaterer session-status…";updatePlayerAutoRefreshUi();return;}if(joinInFlight){hint.textContent="Session-opdatering er låst mens join kører.";updatePlayerAutoRefreshUi();return;}if(submitInFlight){hint.textContent="Session-opdatering er låst mens submit kører.";updatePlayerAutoRefreshUi();return;}if(!code()){hint.textContent="Angiv sessionkode for at opdatere session-status.";updatePlayerAutoRefreshUi();return;}hint.textContent="Session-opdatering klar.";updatePlayerAutoRefreshUi();}
|
||||
function updateJoinState(){var btn=document.getElementById("joinBtn");var status=document.getElementById("joinStatus");var joined=!!(pid()&&document.getElementById("sessionToken").value.trim());var canJoin=canAttemptJoin();if(btn){btn.disabled=joinInFlight||sessionDetailInFlight||joined||!canJoin;}if(!status){updateContextLockState();return;}if(joinInFlight){status.textContent="Joiner…";updateContextLockState();return;}if(sessionDetailInFlight&&!joined){status.textContent="Afvent aktiv session-opdatering før join.";updateContextLockState();return;}if(joined){status.textContent="Join gennemført.";updateContextLockState();return;}if(!canJoin){status.textContent="Udfyld kode og nickname for at join.";updateContextLockState();return;}status.textContent="Klar til join.";updateContextLockState();}
|
||||
|
||||
function guessStorageKey(){var c=code();var p=pid();var q=rq();if(!c||!p||!q){return "";}return ["wppGuess",c,p,q].join(":");}
|
||||
function lieStorageKey(){var c=code();var p=pid();var q=rq();if(!c||!p||!q){return "";}return ["wppLie",c,p,q].join(":");}
|
||||
@@ -149,26 +94,19 @@ function updateGuessSubmitState(){var selected=document.getElementById("guessTex
|
||||
function setGuess(text,submitted){document.getElementById("guessText").value=text||"";if(typeof submitted==="boolean"){guessSubmitted=submitted;}var buttons=document.querySelectorAll("#answerOptions button");buttons.forEach(function(btn){btn.classList.toggle("active",btn.dataset.answer===text);});updateGuessSubmitState();
|
||||
updateJoinState();}
|
||||
function renderAnswerOptions(roundQuestion){var wrap=document.getElementById("answerOptions");wrap.innerHTML="";availableAnswers=[];guessSubmitted=false;setGuess("",false);lieSubmitted=false;setLieState("",false);if(!roundQuestion||!Array.isArray(roundQuestion.answers)){updateGuessSubmitState();updateLieSubmitState();return;}roundQuestion.answers.forEach(function(item){if(!item||!item.text){return;}availableAnswers.push(item.text);var btn=document.createElement("button");btn.type="button";btn.dataset.answer=item.text;btn.textContent=item.text;btn.onclick=function(){if(guessSubmitted){return;}setGuess(item.text,false);persistGuessState(item.text,false);};wrap.appendChild(btn);});var saved=loadGuessState();if(saved&&availableAnswers.indexOf(saved.selected_text)!==-1){setGuess(saved.selected_text,!!saved.submitted);}updateGuessSubmitState();}
|
||||
async function api(path,method,payload){var o={method:method||"GET",headers:{"Accept":"application/json"}};if(payload!==null){o.headers["Content-Type"]="application/json";o.body=JSON.stringify(payload);}try{var r=await fetch(path,o);var d=await r.json().catch(function(){return {};});var isSessionDetailRead=(method||"GET")==="GET"&&/^\/lobby\/sessions\/[A-Z0-9]+$/.test(path);if(isSessionDetailRead){markPlayerSessionRefresh(r.status);}document.getElementById("out").textContent=JSON.stringify({status:r.status,data:d},null,2);if(d.player&&d.player.id){document.getElementById("playerId").value=d.player.id;}if(d.player&&d.player.session_token){document.getElementById("sessionToken").value=d.player.session_token;}if(d.round_question&&d.round_question.id){document.getElementById("roundQuestionId").value=d.round_question.id;}if(d.session&&d.session.status){currentSessionStatus=d.session.status;}if(d.round_question){renderAnswerOptions(d.round_question);var savedLie=loadLieState();if(savedLie){setLieState(savedLie.text||"",!!savedLie.submitted);}}else{document.getElementById("roundQuestionId").value="";renderAnswerOptions(null);}if(d.guess&&d.guess.round_question_id){document.getElementById("roundQuestionId").value=d.guess.round_question_id;setGuess(d.guess.selected_text||"",true);persistGuessState(d.guess.selected_text||"",true);}hydratePlayerCriticalView(d);updateRoundContextHint();updatePlayerErrorHint(r.status,d);updatePhaseStatus();updateLieSubmitState();updateGuessSubmitState();if(currentSessionStatus==="finished"&&playerAutoRefreshEnabled){stopPlayerAutoRefresh("Auto-refresh stoppet: spillet er afsluttet.");}else{updatePlayerAutoRefreshUi();}if(playerShellFatalError){clearPlayerShellFatalError();}savePlayerContext();return d;}catch(err){setConnectionLost(true);if((method||"GET")==="GET"&&/^\/lobby\/sessions\/[A-Z0-9]+$/.test(path)){markPlayerSessionRefresh(0);}document.getElementById("out").textContent=JSON.stringify({status:0,data:{error:"connection_lost",detail:"Kunne ikke kontakte serveren."}},null,2);document.getElementById("playerErrorHint").textContent="Fejl: Mistede forbindelsen til serveren. Prøv igen.";updateSessionDetailState();throw err;}}
|
||||
async function api(path,method,payload){var o={method:method||"GET",headers:{"Accept":"application/json"}};if(payload!==null){o.headers["Content-Type"]="application/json";o.body=JSON.stringify(payload);}var r=await fetch(path,o);var d=await r.json().catch(function(){return {};});var isSessionDetailRead=(method||"GET")==="GET"&&/^\/lobby\/sessions\/[A-Z0-9]+$/.test(path);if(isSessionDetailRead){markPlayerSessionRefresh(r.status);}document.getElementById("out").textContent=JSON.stringify({status:r.status,data:d},null,2);if(d.player&&d.player.id){document.getElementById("playerId").value=d.player.id;}if(d.player&&d.player.session_token){document.getElementById("sessionToken").value=d.player.session_token;}if(d.round_question&&d.round_question.id){document.getElementById("roundQuestionId").value=d.round_question.id;}if(d.session&&d.session.status){currentSessionStatus=d.session.status;}if(d.round_question){renderAnswerOptions(d.round_question);var savedLie=loadLieState();if(savedLie){setLieState(savedLie.text||"",!!savedLie.submitted);}}else{document.getElementById("roundQuestionId").value="";renderAnswerOptions(null);}if(d.guess&&d.guess.round_question_id){document.getElementById("roundQuestionId").value=d.guess.round_question_id;setGuess(d.guess.selected_text||"",true);persistGuessState(d.guess.selected_text||"",true);}updateRoundContextHint();updatePlayerErrorHint(r.status,d);updatePhaseStatus();updateLieSubmitState();updateGuessSubmitState();if(currentSessionStatus==="finished"&&playerAutoRefreshEnabled){stopPlayerAutoRefresh("Auto-refresh stoppet: spillet er afsluttet.");}else{updatePlayerAutoRefreshUi();}savePlayerContext();return d;}
|
||||
function joinSession(){if(joinInFlight){return Promise.resolve({error:"join_in_flight"});}if(!canAttemptJoin()){updateJoinState();return Promise.resolve({error:"missing_join_input"});}if(pid()&&document.getElementById("sessionToken").value.trim()){updateJoinState();return Promise.resolve({error:"already_joined_client"});}joinInFlight=true;updateJoinState();updatePlayerAutoRefreshUi();return api("/lobby/sessions/join","POST",{code:code(),nickname:document.getElementById("nickname").value.trim()}).then(function(d){joinInFlight=false;if(d&&d.player&&d.player.id){updateJoinState();updatePlayerAutoRefreshUi();return d;}updateJoinState();updatePlayerAutoRefreshUi();document.getElementById("joinStatus").textContent="Join fejlede – prøv igen.";return d;}).catch(function(err){joinInFlight=false;updateJoinState();updatePlayerAutoRefreshUi();document.getElementById("joinStatus").textContent="Join fejlede – prøv igen.";throw err;});}
|
||||
function sessionDetail(){if(!code()){updateSessionDetailState();return Promise.resolve({error:"missing_session_code"});}if(sessionDetailInFlight){return Promise.resolve({error:"session_detail_in_flight"});}sessionDetailInFlight=true;updateSessionDetailState();return api("/lobby/sessions/"+code(),"GET",null).finally(function(){sessionDetailInFlight=false;updateSessionDetailState();});}
|
||||
function retryConnection(){if(connectionRetryInFlight||!code()){updateConnectionBanner();return Promise.resolve({error:"retry_unavailable"});}connectionRetryInFlight=true;updateConnectionBanner();return sessionDetail().then(function(result){setConnectionLost(false);return result;}).finally(function(){connectionRetryInFlight=false;updateConnectionBanner();});}
|
||||
function submitLie(){if(lieSubmitted){return Promise.resolve({error:"lie_already_submitted_client"});}if(lieSubmitInFlight){return Promise.resolve({error:"lie_submit_in_flight"});}if(!hasSubmitContext()){updateLieSubmitState();return Promise.resolve({error:"missing_submit_context"});}var text=(document.getElementById("lieText").value||"").trim();if(!text){updateLieSubmitState();return Promise.resolve({error:"empty_lie_text"});}lieSubmitInFlight=true;updateLieSubmitState();return api("/lobby/sessions/"+code()+"/questions/"+rq()+"/lies/submit","POST",{player_id:parseInt(pid(),10),session_token:document.getElementById("sessionToken").value,text:text}).then(function(d){if(d&&d.lie&&d.lie.id){lieSubmitted=true;persistLieState(text,true);}return d;}).finally(function(){lieSubmitInFlight=false;updateLieSubmitState();});}
|
||||
document.getElementById("lieText").addEventListener("input",function(){if(!lieSubmitted){updateLieSubmitState();persistLieState(document.getElementById("lieText").value,false);}});updateLieSubmitState();
|
||||
function submitGuess(){if(guessSubmitted){return Promise.resolve({error:"guess_already_submitted_client"});}if(guessSubmitInFlight){return Promise.resolve({error:"guess_submit_in_flight"});}if(!hasSubmitContext()){updateGuessSubmitState();document.getElementById("out").textContent=JSON.stringify({status:400,data:{error:"Join først for at aktivere gæt"}},null,2);return Promise.resolve({error:"missing_submit_context"});}var selected=document.getElementById("guessText").value;if(availableAnswers.indexOf(selected)===-1){document.getElementById("out").textContent=JSON.stringify({status:400,data:{error:"Vælg et af de viste svarmuligheder"}},null,2);return Promise.resolve({error:"invalid_client_guess"});}guessSubmitInFlight=true;updateGuessSubmitState();return api("/lobby/sessions/"+code()+"/questions/"+rq()+"/guesses/submit","POST",{player_id:parseInt(pid(),10),session_token:document.getElementById("sessionToken").value,selected_text:selected}).finally(function(){guessSubmitInFlight=false;updateGuessSubmitState();});}
|
||||
["code","nickname","playerId","sessionToken","roundQuestionId"].forEach(function(fieldId){var field=document.getElementById(fieldId);if(!field){return;}field.addEventListener("input",function(){if(fieldId!=="roundQuestionId"){resetRoundContextForManualChange();}updateLieSubmitState();updateGuessSubmitState();updateJoinState();updateSessionDetailState();savePlayerContext();});field.addEventListener("change",function(){if(fieldId!=="roundQuestionId"){resetRoundContextForManualChange();}updateLieSubmitState();updateGuessSubmitState();updateJoinState();updateSessionDetailState();savePlayerContext();});});
|
||||
window.addEventListener("error",function(event){setPlayerShellFatalError((event&&event.message)||"Ukendt runtime-fejl");});
|
||||
window.addEventListener("unhandledrejection",function(event){var reason=event&&event.reason;var detail=(reason&&reason.message)||String(reason||"Unhandled promise rejection");setPlayerShellFatalError(detail);});
|
||||
installSecondaryDeviceAudioGuard();
|
||||
setPlayerCriticalLoading(true);
|
||||
updatePhaseStatus();
|
||||
updateGuessSubmitState();
|
||||
updateJoinState();
|
||||
updatePlayerAutoRefreshUi();
|
||||
updatePlayerLastRefreshStatus();
|
||||
updateRoundContextHint();
|
||||
updateConnectionBanner();
|
||||
updatePlayerShellErrorBoundary();
|
||||
if(restorePlayerContext()){if(playerAutoRefreshEnabled){startPlayerAutoRefresh();}sessionDetail().catch(function(){});}else{savePlayerContext();setTimeout(function(){if(!playerCriticalHydrated){hydratePlayerCriticalView({session:{status:currentSessionStatus}});}},350);}
|
||||
if(restorePlayerContext()){if(playerAutoRefreshEnabled){startPlayerAutoRefresh();}sessionDetail();}else{savePlayerContext();}
|
||||
</script>
|
||||
</body></html>
|
||||
|
||||
Some files were not shown because too many files have changed in this diff Show More
Reference in New Issue
Block a user