4 Commits

Author SHA1 Message Date
davide 5621830803 feat(controller): aggiunge modal formazione a inizio set
Dopo la conferma di un set finito appare automaticamente un secondo
modal "FORMAZIONE SET N" con gli input (resettati a 1-6) per
registrare la formazione del set successivo. Al click INIZIA vengono
inviati setFormazione per home e guest, e la formazione viene
archiviata in formInizioSet (e quindi nel DB a fine partita via
strisce[].formInizio).

Se la conferma del set conclude la partita, il modal formazione viene
chiuso automaticamente non appena lo stato con partitaFinita arriva
dal server
2026-02-21 19:16:27 +01:00
davide b3faf06477 test: aggiunge copertura completa per le nuove funzionalità
- Nuovo db.test.js: 11 test per salvaPartita, getPartite, getPartita
  (isolamento con DB in memoria via vi.stubEnv + vi.resetModules)
- gameState.test.js: test per confermaSet, formInizioSet, partitaFinita,
  checkVittoriaPartita e guardie setFinito/partitaFinita; fix di 6 test
  pre-esistenti non allineati con la logica striscia aggiornata
- websocket.test.js: mock di db.js e 4 test per il salvataggio automatico
  su DB al termine della partita
- server-utils.test.js: 2 test aggiuntivi per storicoPort
- ControllerPage.test.js: 4 test per l'overlay di fine set (setFinito)
- DisplayPage.test.js: 4 test per l'overlay di fine partita (partitaFinita)
2026-02-21 18:59:50 +01:00
davide 1df239ed3d feat: salva partite su SQLite e aggiunge storico in dev
- Aggiunge src/db.js con better-sqlite3: tabella partite con nomi,
  modalità, set, formazione di partenza per set, punteggi e vincitore
- Salvataggio automatico al termine della partita (websocket-handler.js)
- Aggiunge formInizioSet in gameState per tracciare la formazione
  iniziale di ogni set
- Aggiunge storico.html: pagina vanilla dark-theme con lista partite
  espandibili (set, punteggio, formazioni)
- Aggiunge server storico su porta 3002 in dev (vite-plugin-websocket.js)
- Aggiunge endpoint /api/partite su displayApp (server.js)
- Migliora banner di avvio con URL storico locale e da rete
- Migliora log WebSocket: connessione aperta, ruolo unregistered, client rimanenti
- Aggiorna .gitignore: ignora tutta la cartella data/
2026-02-21 18:36:58 +01:00
davide d9e1ac751f feat(partita): storico strisce multi-set, conferma fine set e avviso fine partita
- sp.strisce[] archivia la striscia di ogni set completato
- fine set rilevata automaticamente: controller mostra modale di conferma
- confermaSet salva il set, incrementa il contatore e prepara il successivo
- fine partita rilevata da checkVittoriaPartita(): display mostra overlay con
  vincitore e punteggio set; incPunt bloccato
- decPunt pulisce setFinito (undo dell'ultimo punto di vittoria)
- resetta azzera strisce[], setFinito e partitaFinita
2026-02-21 17:49:19 +01:00
34 changed files with 4072 additions and 1582 deletions
-11
View File
@@ -1,11 +0,0 @@
node_modules
dist
dev-dist
.segnapunti
tests
playwright-report
test-results
*.md
.git
.gitignore
.vscode
+3 -2
View File
@@ -13,8 +13,6 @@ currentCommit.txt
node_modules
dist
dist-ssr
dev-dist
.segnapunti
*.local
# Editor directories and files
@@ -37,3 +35,6 @@ dev-dist
# Vitest
coverage/
# Database SQLite
data/
-29
View File
@@ -7,35 +7,6 @@ e questo progetto aderisce al [Versionamento Semantico](https://semver.org/lang/
---
## [2.0.0] - 2026-05-12
### Aggiunto
- Architettura client-server con WebSocket: server Express (`server.js`) + handler (`src/websocket-handler.js`) come unica fonte di verità; display e controller sono client separati sincronizzati in tempo reale
- Interfaccia display (`/display`) e controller (`/controller`) su porta singola `:3000`
- Robustezza connessione WebSocket: reconnect automatico con backoff esponenziale, indicatore stato connessione sul display
- Supporto query parameter `?wsHost=` per scenari WSL2 / development remoto
- Validazione cambi giocatori già in formazione lato client
- Sintesi vocale inoltrata dal controller al display via WebSocket
- Dialog set vinto sul controller al raggiungimento dei 25 punti: mostra il vincitore, permette di annullare l'ultimo punto (INDIETRO) o avanzare al set successivo con reset automatico formazioni
- Struttura striscia ottimizzata: array di set `[{ serv, r[] }]` che registra la sequenza dei punti e preserva la storia di tutti i set; elimina `storicoServizio`
- Persistenza stato su `.segnapunti/state.json`: salvato ad ogni azione, ricaricato all'avvio del server
- Suite di test completa: unit (Vitest), integration, component (Vue Test Utils + Happy-DOM), stress (50+ client), E2E (Playwright su Chromium, Firefox, Mobile Chrome)
- Dockerfile multi-stage (builder + runtime minimale) e docker-compose con volume per persistenza stato; immagine pubblicata su registro Gitea
### Modificato
- `applyAction` usa `structuredClone` al posto di `JSON.parse/stringify`
- Calcolo cambio palla deduplicato in `applyAction`
- Undo punto (`decPunt`) ricostruisce il servizio precedente dalla storia `r[]`
- `nuovoSet` come azione dedicata per la progressione regolare tra set
### Rimosso
- Terminal controller CLI (`cli.js`)
- Dipendenze inutilizzate: `wave-ui`, `vue-router`, `concurrently`
- Script npm ridondanti: `preview`, `start`, `cli`, `cli:dev`
- Asset template Vite: `vite.svg`, `vue.svg`, `serve.png`
---
## [1.0.0] - 2026-02-10
Rilascio iniziale di **Segnapunti Anto**, un'applicazione web Progressive Web App (PWA) professionale per il tracciamento in tempo reale dei punteggi durante partite di pallavolo.
-62
View File
@@ -1,62 +0,0 @@
# CLAUDE.md
This file provides guidance to Claude Code (claude.ai/code) when working with code in this repository.
## Project Purpose
**Segnapunti Anto** is a real-time volleyball scoreboard PWA. An Express/WebSocket server hosts the game state; two separate web interfaces — a **display** (public scoreboard) and a **controller** (operator panel) — stay in sync via WebSocket.
## Commands
```bash
npm run dev # Vite dev server — display: :5173/display, controller: :5173/controller
npm run serve # Build + run production — display: :3000/display, controller: :3000/controller
npm run test # Vitest watch mode
npm run test:all # All Vitest suites once (unit, integration, component, stress)
npm run test:unit # Unit + integration only
npm run test:component # Vue component tests
npm run test:stress # Load tests (50+ concurrent clients)
npm run test:e2e # Playwright E2E (requires servers to be running via npm run serve)
npm run test:e2e:ui # Playwright with interactive UI
```
## Architecture
```
Controller (Vue) ──WebSocket──┐
Display (Vue) ──WebSocket──┤── websocket-handler.js ── gameState.js
│ │
│ └── persist.js ── .segnapunti/state.json
```
All game logic lives in `src/gameState.js` as three pure functions:
- `createInitialState()` — returns the initial state
- `applyAction(state, action)` — immutable reducer (deep-clones via `structuredClone`)
- `checkVittoria(state)` — volleyball win conditions (25-point sets with 2-point margin, 15-point final set)
`src/websocket-handler.js` receives actions, validates that the sender is a registered controller (not just a display), calls `applyAction`, broadcasts the new state to all clients, then calls `onStateChange` to persist state to disk.
`server.js` (Express) serves both interfaces on port 3000: `/display``dist/index.html`, `/controller``dist/controller.html`. Single WebSocket endpoint at `/ws`.
In development, `vite-plugin-websocket.js` embeds the WebSocket server inside the Vite dev server with URL rewrite middleware for `/display` and `/controller`.
## Key Design Constraints
- **All game rules on the server** — clients are pure UI; the server is the source of truth.
- **Role-based WebSocket** — clients register as `display` or `controller`; only controllers may send actions.
- **Immutable state** — `applyAction` never mutates; always returns a new state object.
- **Single-controller intent** — the design targets one active controller and one display; no conflict resolution exists for simultaneous controllers.
- **Persistent state** — `src/persist.js` saves state to `.segnapunti/state.json` after every action and loads it on server startup.
## Test Layout
| Suite | Path | Runner |
|-------|------|--------|
| Unit | `tests/unit/` | Vitest + Node |
| Integration | `tests/integration/` | Vitest + Node |
| Component | `tests/component/` | Vitest + Happy-DOM |
| Stress | `tests/stress/` | Vitest + Node |
| E2E | `tests/e2e/` | Playwright (Chromium, Firefox, Mobile Chrome) |
E2E tests run serially (`workers: 1`) to avoid WebSocket state races. Run `npm run serve` before `npm run test:e2e`.
+12 -16
View File
@@ -1,22 +1,18 @@
# Stage 1: build frontend
FROM node:20-alpine AS builder
WORKDIR /app
COPY package*.json ./
RUN npm ci
WORKDIR /usr/src/app
# Copia tutto
COPY . .
RUN npm run build
# Stage 2: runtime
FROM node:20-alpine
WORKDIR /app
ENV NODE_ENV=production PORT=3000
# Aggiunge GIT ma serve solo se si vuole evidenziare un hash del commit
RUN apk add git
COPY package*.json ./
RUN npm ci --omit=dev
# aggiunge l'ultima versione di node
RUN npm install -g npm@latest
# Installa tutte le dipendenze del progetto
RUN npm install
COPY server.js ./
COPY src/gameState.js src/websocket-handler.js src/server-utils.js src/persist.js ./src/
COPY --from=builder /app/dist ./dist
# Qui fa partire il comando...
# Per adesso è dev perchè non ho capito bene il tutto... (Attilio)
CMD ["npm", "run", "serve"]
EXPOSE 3000
CMD ["node", "server.js"]
+167 -174
View File
@@ -1,215 +1,208 @@
# Segnapunti
# Segnapunti Anto
![Version](https://img.shields.io/badge/versione-2.0.0-blue)
![Node](https://img.shields.io/badge/node-%3E%3D18-green)
![Docker](https://img.shields.io/badge/docker-ready-2496ED?logo=docker&logoColor=white)
![License](https://img.shields.io/badge/licenza-privata-lightgrey)
Segnapunti digitale in tempo reale per partite di pallavolo. Un server centrale gestisce lo stato della partita; un **display** mostra il tabellone pubblico e un **controller** (smartphone o tablet) permette all'operatore di gestire punti, formazioni e cambi.
Applicazione web **Progressive Web App (PWA)** per tracciare i punteggi di partite di pallavolo in tempo reale.
---
## Indice
## Panoramica
- [Architettura](#architettura)
- [Guida utente](#guida-utente)
- [Funzionalità](#funzionalità)
- [Shortcuts tastiera](#shortcuts-tastiera)
- [Deploy con Docker](#deploy-con-docker)
- [Sviluppo](#sviluppo)
- [Test](#test)
**Segnapunti Anto** e un'applicazione digitale per il tracciamento del punteggio durante partite di pallavolo, ottimizzata per tablet e smartphone.
L'app e composta da due interfacce:
- **Display** (tabellone pubblico)
- **Controller** (pannello operatore)
Le due interfacce condividono lo stato in tempo reale tramite WebSocket.
### Funzionalita Principali
- **Gestione partita in tempo reale**
- Tracciamento punti home/guest
- Gestione set
- Indicatore servizio
- Storico punti (striscia)
- Blocchi logici quando il set e gia vinto
- **Regole pallavolo integrate**
- Set normali: vittoria a 25 con almeno 2 punti di scarto
- Set decisivo: vittoria a 15 con almeno 2 punti di scarto
- Modalita partita `2/3` o `3/5`
- **Formazioni e cambi**
- Gestione formazione a 6 giocatori
- Rotazione automatica al cambio palla
- Dialog cambi con validazioni (`IN -> OUT`)
- **Controlli e personalizzazione**
- Configurazione nomi squadre
- Toggle ordine squadre (inverti)
- Toggle visualizzazione punteggio/formazioni
- Toggle striscia storico
- Sintesi vocale punteggio (Web Speech API)
---
## Architettura
## Requisiti
```
Controller (smartphone) ──WebSocket──┐
├── Server Node.js ── gameState.js
Display (schermo) ──WebSocket──┘ │
└── .segnapunti/state.json
```
### Requisiti di Sistema
Il server è l'unica fonte di verità. Ogni azione del controller viene elaborata e trasmessa in broadcast a tutti i client connessi. Lo stato viene salvato su disco ad ogni azione e ricaricato all'avvio, sopravvivendo ai riavvii del server.
#### Per Sviluppo
- **Sistema Operativo**: Linux, macOS, Windows
- **Node.js**: `>= 18.19.0` (consigliato `20 LTS`)
- **npm**: `>= 9`
- **RAM**: minimo 2GB (consigliato 4GB)
| Percorso | Ruolo |
|---|---|
| `http://<host>:3000/display` | Tabellone pubblico — sola lettura |
| `http://<host>:3000/controller` | Pannello operatore — gestione partita |
| `ws://<host>:3000/ws` | WebSocket endpoint |
#### Per Esecuzione Test E2E
- Browser Playwright installati (`chromium`, `firefox`)
- Su Linux, eventuali dipendenze sistema per browser headless
---
## Guida utente
### Scenario tipico: schermo fisso + smartphone operatore
#### 1. Avvia il server
Comandi utili:
```bash
docker compose up -d
node -v
npm -v
npx playwright install chromium firefox
# Linux, se necessario:
# npx playwright install --with-deps chromium firefox
```
All'avvio il terminale mostra gli URL locali e di rete.
### Requisiti Browser (Utente Finale)
#### 2. Apri il display
| Requisito | Dettaglio | Necessita |
|-----------|-----------|-----------|
| JavaScript ES6+ | Moduli, async/await | Obbligatorio |
| WebSocket | Sincronizzazione stato live | Obbligatorio |
| Service Worker API | Supporto PWA offline | Consigliato |
| Web Speech API | Annunci vocali | Opzionale |
Collega il PC/server allo schermo via HDMI e apri il browser a schermo intero:
### Browser Testati e Supportati
```
http://localhost:3000/display
```
Se il display è su un dispositivo separato nella stessa rete:
```
http://<IP-del-server>:3000/display
```
> **Trovare l'IP:** il server lo stampa all'avvio. In alternativa usa `ip a` su Linux.
#### 3. Apri il controller sullo smartphone
Connetti il telefono alla stessa rete Wi-Fi e apri:
```
http://<IP-del-server>:3000/controller
```
> **Installazione come app:** nel browser tocca *"Aggiungi a schermata Home"* per avere il controller come icona dedicata.
| Browser | Supporto | Note |
|---------|----------|------|
| Chrome/Chromium | ✅ | Completo |
| Firefox | ✅ | Completo |
| Mobile Chrome (Playwright Pixel 5) | ✅ | Copertura E2E mobile |
---
## Funzionalità
## Installazione e Setup
### Display
### Prerequisiti
- Nomi squadre con indicatore di servizio
- Punteggio del set corrente (grande, leggibile da lontano)
- Contatore set vinti
- Striscia storica punti del set in corso, scorrevole verso destra
- Modalità formazioni: posizioni dei 6 giocatori in campo
- Indicatore connessione WebSocket (scompare quando connesso, rosso lampeggiante se disconnesso)
- Node.js `>= 18.19.0`
- npm `>= 9`
### Controller
- **Punti** — `+1` per casa e ospite, con annullamento dell'ultimo punto
- **Dialog set vinto** — appare automaticamente al raggiungimento dei 25 punti (o 15 nel tie-break); permette di confermare il set o annullare l'ultimo punto
- **Formazioni** — configura i numeri di maglia; la rotazione avviene automaticamente al cambio palla
- **Cambi** — dialog `IN → OUT` con validazione
- **Servizio** — cambio manuale (disponibile solo a 0-0)
- **Visualizzazione** — alterna tra punteggio grande e formazioni in campo
- **Striscia** — mostra/nasconde lo storico punti sul display
- **Reset** — azzera la partita (richiede conferma)
### Regole pallavolo integrate
| Set | Condizione di vittoria |
|---|---|
| Set 14 (modalità 3/5) o 12 (modalità 2/3) | Primo a **25** con almeno 2 punti di scarto |
| Set decisivo (tie-break) | Primo a **15** con almeno 2 punti di scarto |
---
## Shortcuts tastiera
> Valide sul controller da browser desktop.
| Tasto | Azione |
|---|---|
| `Ctrl + ↑` | Punto casa |
| `Ctrl + ↓` | Annulla ultimo punto |
| `Shift + ↑` | Punto ospite |
| `Ctrl + ←` | Cambia servizio (solo a 0-0) |
| `Ctrl + M` | Apri configurazione |
| `Ctrl + C` | Cambi squadra casa |
| `Shift + C` | Cambi squadra ospite |
| `Ctrl + Z` | Toggle punteggio / formazioni |
| `Ctrl + S` | Annuncio vocale punteggio |
| `Ctrl + B` | Mostra/nascondi barra pulsanti |
| `Ctrl + F` | Fullscreen |
---
## Deploy con Docker
### Prima installazione
```bash
docker compose up -d
```
Lo stato viene salvato nel volume Docker `segnapunti-state` e sopravvive ai riavvii del container.
### Aggiornamento a nuova versione
```bash
docker compose pull && docker compose up -d
```
### Build e pubblicazione immagine
```bash
docker build \
-t santantonio.sytes.net/attilio/segnapunti:2.0.0 \
-t santantonio.sytes.net/attilio/segnapunti:latest .
docker push santantonio.sytes.net/attilio/segnapunti:2.0.0
docker push santantonio.sytes.net/attilio/segnapunti:latest
```
---
## Sviluppo
### Requisiti
| Strumento | Versione minima |
|---|---|
| Node.js | >= 18 |
| npm | >= 9 |
### Avvio
### Installazione
```bash
git clone https://santantonio.sytes.net/attilio/segnapunti.git
cd segnapunti
npm install
```
---
## Comandi per Sviluppo
### Dev Server
Avvia il server di sviluppo Vite:
```bash
npm run dev
```
| URL | Interfaccia |
|---|---|
| `http://localhost:5173/display` | Display |
| `http://localhost:5173/controller` | Controller |
Accesso tipico in sviluppo:
- `http://localhost:5173/` -> Display
- `http://localhost:5173/controller.html` -> Controller
Lo stato viene salvato in `.segnapunti/state.json` anche in modalità dev.
### Comandi disponibili
| Comando | Descrizione |
|---|---|
| `npm run dev` | Dev server con hot reload |
| `npm run build` | Build di produzione in `dist/` |
| `npm run serve` | Build + avvio server produzione |
### Modalita Sviluppo
- Hot reload attivo
- Build veloce lato Vite
- Buona per sviluppo UI/UX
---
## Test
## Comandi per Build
| Comando | Descrizione |
|---|---|
| `npm run test:unit` | Unit + integration (Vitest) |
| `npm run test:component` | Componenti Vue (Happy-DOM) |
| `npm run test:stress` | Load test WebSocket (50+ client) |
| `npm run test:all` | Tutti i test tranne E2E |
| `npm run test:e2e` | Playwright — Chromium, Firefox, Mobile Chrome |
### Build Produzione
> I test E2E richiedono il server in esecuzione (`npm run serve`) e i browser Playwright installati:
> ```bash
> npx playwright install chromium firefox
> ```
```bash
npm run build
```
Output:
- cartella `dist/`
- asset ottimizzati
- file PWA (manifest + service worker)
### Avvio Server Applicativo Locale (Display + Controller)
```bash
npm run serve
```
Espone:
- `http://localhost:3000` -> Display
- `http://localhost:3001` -> Controller
### Altri comandi utili
```bash
npm run preview
npm run start
```
---
## Changelog
## Configurazione PWA
Vedere [CHANGELOG.md](CHANGELOG.md) per la storia delle versioni.
L'app usa `vite-plugin-pwa` (vedi `vite.config.js`) con:
- `registerType: 'autoUpdate'`
- manifest installabile
- orientamento landscape
- modalita fullscreen
Caratteristiche principali:
- installabile su dispositivi supportati
- aggiornamento automatico del service worker
- supporto utilizzo offline (in base alle risorse cache)
---
## Logica Regolamentare Pallavolo
### Vittoria Set
- Set normali: vittoria a 25 con almeno 2 punti di scarto
- Set decisivo: vittoria a 15 con almeno 2 punti di scarto
- Modalita partita supportate: `2/3` e `3/5`
### Rotazione Formazione
La rotazione avviene durante i cambi palla secondo la logica implementata in `src/gameState.js`.
### Formazione in Campo
Il sistema gestisce 6 posizioni per squadra e permette cambi validati da Controller.
---
## Test (stato attuale)
Suite presenti:
- Unit
- Integration
- Component
- Stress
- E2E (Playwright)
Comandi principali:
```bash
npm run test:all
npm run test:e2e
```
Guida completa test:
- `tests/README.md`
+1 -1
View File
@@ -2,7 +2,7 @@
<html lang="en">
<head>
<meta charset="UTF-8" />
<link rel="icon" type="image/png" href="/segnap-192x192.png" />
<link rel="icon" type="image/svg+xml" href="/vite.svg" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Segnapunti - Controller</title>
</head>
+4 -5
View File
@@ -1,9 +1,8 @@
services:
segnapunti:
build: .
container_name: segnapunti
ports:
- "3000:3000"
volumes:
- ./.segnapunti:/app/.segnapunti
restart: unless-stopped
- 3000:3000
- 3001:3001
container_name: segnapunti-container
+1 -1
View File
@@ -2,7 +2,7 @@
<html lang="en">
<head>
<meta charset="UTF-8" />
<link rel="icon" type="image/png" href="/segnap-192x192.png" />
<link rel="icon" type="image/svg+xml" href="/vite.svg" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Segnapunti - Anto</title>
</head>
+2239 -1017
View File
File diff suppressed because it is too large Load Diff
+10 -7
View File
@@ -1,11 +1,13 @@
{
"name": "segnapuntianto",
"private": true,
"version": "2.0.0",
"version": "0.0.0",
"type": "module",
"scripts": {
"dev": "vite",
"build": "vite build",
"preview": "node server.js",
"start": "node server.js",
"serve": "vite build && node server.js",
"test": "vitest",
"test:unit": "vitest run tests/unit tests/integration",
@@ -18,24 +20,25 @@
"test:e2e:codegen": "playwright codegen --config=playwright.config.cjs"
},
"dependencies": {
"better-sqlite3": "^12.6.2",
"express": "^5.2.1",
"vue": "^3.2.47",
"vue-router": "^4.6.4",
"wave-ui": "^3.3.0",
"ws": "^8.19.0"
},
"overrides": {
"serialize-javascript": "^7.0.5"
},
"devDependencies": {
"@axe-core/playwright": "^4.11.1",
"@playwright/test": "^1.58.2",
"@types/node": "^25.2.3",
"@vitejs/plugin-vue": "^6.0.5",
"@vitejs/plugin-vue": "^4.1.0",
"@vitest/ui": "^4.0.18",
"@vue/test-utils": "^2.4.6",
"concurrently": "^9.2.1",
"happy-dom": "^20.6.1",
"jsdom": "^28.0.0",
"vite": "^7.3.1",
"vite-plugin-pwa": "^1.2.0",
"vite": "^4.3.9",
"vite-plugin-pwa": "^0.16.0",
"vitest": "^4.0.18"
}
}
+76
View File
@@ -0,0 +1,76 @@
import { defineConfig, devices } from '@playwright/test';
/**
* Read environment variables from file.
* https://github.com/motdotla/dotenv
*/
// import dotenv from 'dotenv';
// import path from 'path';
// dotenv.config({ path: path.resolve(__dirname, '.env') });
/**
* See https://playwright.dev/docs/test-configuration.
*/
export default defineConfig({
testDir: './tests/e2e',
/* Run tests in files in parallel */
fullyParallel: true,
/* Fail the build on CI if you accidentally left test.only in the source code. */
forbidOnly: !!process.env.CI,
/* Retry on CI only */
retries: process.env.CI ? 2 : 0,
/* Opt out of parallel tests on CI. */
workers: process.env.CI ? 1 : undefined,
/* Reporter to use. See https://playwright.dev/docs/test-reporters */
reporter: 'html',
/* Shared settings for all the projects below. See https://playwright.dev/docs/api/class-testoptions. */
use: {
/* Base URL to use in actions like `await page.goto('')`. */
// baseURL: 'http://localhost:3000',
/* Collect trace when retrying the failed test. See https://playwright.dev/docs/trace-viewer */
trace: 'on-first-retry',
},
/* Configure projects for major browsers */
projects: [
{
name: 'chromium',
use: { ...devices['Desktop Chrome'] },
},
{
name: 'firefox',
use: { ...devices['Desktop Firefox'] },
},
// {
// name: 'webkit',
// use: { ...devices['Desktop Safari'] },
// },
/* Test against mobile viewports. */
{
name: 'Mobile Chrome',
use: { ...devices['Pixel 5'] },
},
/* Test against branded browsers. */
// {
// name: 'Microsoft Edge',
// use: { ...devices['Desktop Edge'], channel: 'msedge' },
// },
// {
// name: 'Google Chrome',
// use: { ...devices['Desktop Chrome'], channel: 'chrome' },
// },
],
/* Run your local dev server before starting the tests */
webServer: {
command: 'npm run serve',
url: 'http://localhost:3000',
reuseExistingServer: !process.env.CI,
timeout: 120 * 1000,
},
});
+1
View File
@@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="iconify iconify--logos" width="31.88" height="32" preserveAspectRatio="xMidYMid meet" viewBox="0 0 256 257"><defs><linearGradient id="IconifyId1813088fe1fbc01fb466" x1="-.828%" x2="57.636%" y1="7.652%" y2="78.411%"><stop offset="0%" stop-color="#41D1FF"></stop><stop offset="100%" stop-color="#BD34FE"></stop></linearGradient><linearGradient id="IconifyId1813088fe1fbc01fb467" x1="43.376%" x2="50.316%" y1="2.242%" y2="89.03%"><stop offset="0%" stop-color="#FFEA83"></stop><stop offset="8.333%" stop-color="#FFDD35"></stop><stop offset="100%" stop-color="#FFA800"></stop></linearGradient></defs><path fill="url(#IconifyId1813088fe1fbc01fb466)" d="M255.153 37.938L134.897 252.976c-2.483 4.44-8.862 4.466-11.382.048L.875 37.958c-2.746-4.814 1.371-10.646 6.827-9.67l120.385 21.517a6.537 6.537 0 0 0 2.322-.004l117.867-21.483c5.438-.991 9.574 4.796 6.877 9.62Z"></path><path fill="url(#IconifyId1813088fe1fbc01fb467)" d="M185.432.063L96.44 17.501a3.268 3.268 0 0 0-2.634 3.014l-5.474 92.456a3.268 3.268 0 0 0 3.997 3.378l24.777-5.718c2.318-.535 4.413 1.507 3.936 3.838l-7.361 36.047c-.495 2.426 1.782 4.5 4.151 3.78l15.304-4.649c2.372-.72 4.652 1.36 4.15 3.788l-11.698 56.621c-.732 3.542 3.979 5.473 5.943 2.437l1.313-2.028l72.516-144.72c1.215-2.423-.88-5.186-3.54-4.672l-25.505 4.922c-2.396.462-4.435-1.77-3.759-4.114l16.646-57.705c.677-2.35-1.37-4.583-3.769-4.113Z"></path></svg>

After

Width:  |  Height:  |  Size: 1.5 KiB

+67 -14
View File
@@ -5,31 +5,51 @@ import { fileURLToPath } from 'url'
import { dirname, join } from 'path'
import { setupWebSocketHandler } from './src/websocket-handler.js'
import { printServerInfo } from './src/server-utils.js'
import { loadState, saveState } from './src/persist.js'
import { getPartite, getPartita } from './src/db.js'
const __filename = fileURLToPath(import.meta.url)
const __dirname = dirname(__filename)
const PORT = process.env.PORT || 3000
const distDir = join(__dirname, 'dist')
// --- Configurazione del server ---
const app = express()
const DISPLAY_PORT = process.env.PORT || 3000
const CONTROLLER_PORT = process.env.CONTROLLER_PORT || 3001
app.use(express.static(distDir, { index: false }))
// ========================================
// Server Display (porta principale)
// ========================================
app.get(['/', '/display', '/display/*splat'], (_req, res) => {
res.sendFile(join(distDir, 'index.html'))
const displayApp = express()
// Espone i file generati dalla build di Vite.
displayApp.use(express.static(join(__dirname, 'dist')))
// API REST per le partite salvate.
displayApp.get('/api/partite', (_req, res) => {
try { res.json(getPartite()) }
catch (err) { res.status(500).json({ error: err.message }) }
})
app.get(['/controller', '/controller/*splat'], (_req, res) => {
res.sendFile(join(distDir, 'controller.html'))
displayApp.get('/api/partite/:id', (req, res) => {
try {
const p = getPartita(Number(req.params.id))
if (!p) return res.status(404).json({ error: 'Not found' })
res.json(p)
} catch (err) { res.status(500).json({ error: err.message }) }
})
const server = createServer(app)
// Fallback per SPA: restituisce `index.html` per tutte le route.
displayApp.get(/.*/, (_req, res) => {
res.sendFile(join(__dirname, 'dist', 'index.html'))
})
const displayServer = createServer(displayApp)
// Inizializza il server WebSocket condiviso.
const wss = new WebSocketServer({ noServer: true })
setupWebSocketHandler(wss, { initialState: loadState(), onStateChange: saveState })
setupWebSocketHandler(wss)
server.on('upgrade', (request, socket, head) => {
displayServer.on('upgrade', (request, socket, head) => {
const pathname = new URL(request.url, `http://${request.headers.host}`).pathname
if (pathname === '/ws') {
wss.handleUpgrade(request, socket, head, (ws) => {
@@ -40,6 +60,39 @@ server.on('upgrade', (request, socket, head) => {
}
})
server.listen(PORT, '0.0.0.0', () => {
printServerInfo(PORT)
displayServer.listen(DISPLAY_PORT, '0.0.0.0', () => {
console.log(`[Display] Server running on port ${DISPLAY_PORT}`)
})
// ========================================
// Server Controller (porta separata)
// ========================================
const controllerApp = express()
// Espone gli stessi file statici della build.
// IMPORTANTE: { index: false } impedisce di servire index.html (il display) sulla root.
controllerApp.use(express.static(join(__dirname, 'dist'), { index: false }))
// Fallback: restituisce `controller.html` per tutte le route.
controllerApp.get(/.*/, (_req, res) => {
res.sendFile(join(__dirname, 'dist', 'controller.html'))
})
const controllerServer = createServer(controllerApp)
// Gestisce l'upgrade WebSocket anche sulla porta del controller.
controllerServer.on('upgrade', (request, socket, head) => {
const pathname = new URL(request.url, `http://${request.headers.host}`).pathname
if (pathname === '/ws') {
wss.handleUpgrade(request, socket, head, (ws) => {
wss.emit('connection', ws, request)
})
} else {
socket.destroy()
}
})
controllerServer.listen(CONTROLLER_PORT, '0.0.0.0', () => {
printServerInfo(DISPLAY_PORT, CONTROLLER_PORT)
})
Binary file not shown.

After

Width:  |  Height:  |  Size: 12 KiB

+1
View File
@@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="iconify iconify--logos" width="37.07" height="36" preserveAspectRatio="xMidYMid meet" viewBox="0 0 256 198"><path fill="#41B883" d="M204.8 0H256L128 220.8L0 0h97.92L128 51.2L157.44 0h47.36Z"></path><path fill="#41B883" d="m0 0l128 220.8L256 0h-51.2L128 132.48L50.56 0H0Z"></path><path fill="#35495E" d="M50.56 0L128 133.12L204.8 0h-47.36L128 51.2L97.92 0H50.56Z"></path></svg>

After

Width:  |  Height:  |  Size: 496 B

+98 -56
View File
@@ -78,15 +78,60 @@
</div>
</div>
<!-- Finestra set vinto -->
<div class="overlay" v-if="showSetVinto">
<!-- Finestra fine set -->
<div class="overlay" v-if="setFinito">
<div class="dialog">
<div class="dialog-title">SET VINTO</div>
<div class="dialog-winner">{{ state.sp.nomi[setVintoTeam] }}</div>
<div class="dialog-subtitle">Configura le formazioni per il prossimo set</div>
<div class="dialog-title">SET FINITO</div>
<div class="set-finito-info">
<div class="set-vincitore">{{ state.sp.nomi[setFinito.vincitore] }}</div>
<div class="set-score">{{ state.sp.punt.home }} {{ state.sp.punt.guest }}</div>
</div>
<div class="dialog-buttons">
<button class="btn btn-cancel" @click="undoUltimoPoint()">INDIETRO</button>
<button class="btn btn-confirm" @click="doNuovoSet()">VAI AL SET SUCCESSIVO</button>
<button class="btn btn-confirm" @click="confermaSetEApriFormazione()">CONFERMA</button>
</div>
</div>
</div>
<!-- Finestra formazione inizio set -->
<div class="overlay" v-if="showFormazioneModal">
<div class="dialog dialog-config">
<div class="dialog-title">
FORMAZIONE SET {{ state.sp.set.home + state.sp.set.guest + 1 }}
</div>
<div class="form-group">
<label>{{ state.sp.nomi.home }}</label>
<div class="form-grid">
<div class="form-row">
<input type="text" v-model="formazioneSetData.home[3]" class="input-num" />
<input type="text" v-model="formazioneSetData.home[2]" class="input-num" />
<input type="text" v-model="formazioneSetData.home[1]" class="input-num" />
</div>
<div class="form-line"></div>
<div class="form-row">
<input type="text" v-model="formazioneSetData.home[4]" class="input-num" />
<input type="text" v-model="formazioneSetData.home[5]" class="input-num" />
<input type="text" v-model="formazioneSetData.home[0]" class="input-num" />
</div>
</div>
</div>
<div class="form-group">
<label>{{ state.sp.nomi.guest }}</label>
<div class="form-grid">
<div class="form-row">
<input type="text" v-model="formazioneSetData.guest[3]" class="input-num" />
<input type="text" v-model="formazioneSetData.guest[2]" class="input-num" />
<input type="text" v-model="formazioneSetData.guest[1]" class="input-num" />
</div>
<div class="form-line"></div>
<div class="form-row">
<input type="text" v-model="formazioneSetData.guest[4]" class="input-num" />
<input type="text" v-model="formazioneSetData.guest[5]" class="input-num" />
<input type="text" v-model="formazioneSetData.guest[0]" class="input-num" />
</div>
</div>
</div>
<div class="dialog-buttons">
<button class="btn btn-confirm" @click="confermaFormazioneSet()">INIZIA</button>
</div>
</div>
</div>
@@ -200,8 +245,11 @@ export default {
reconnectAttempts: 0,
maxReconnectDelay: 30000,
confirmReset: false,
showSetVinto: false,
setVintoTeam: null,
showFormazioneModal: false,
formazioneSetData: {
home: ["1", "2", "3", "4", "5", "6"],
guest: ["1", "2", "3", "4", "5", "6"],
},
showConfig: false,
showCambiTeam: false,
showCambi: false,
@@ -224,7 +272,9 @@ export default {
visuStriscia: true,
modalitaPartita: "3/5",
sp: {
striscia: [{ serv: 'h', ris: '' }],
strisce: [],
setFinito: null,
striscia: { home: [0], guest: [0] },
servHome: true,
punt: { home: 0, guest: 0 },
set: { home: 0, guest: 0 },
@@ -233,6 +283,7 @@ export default {
home: ["1", "2", "3", "4", "5", "6"],
guest: ["1", "2", "3", "4", "5", "6"],
},
storicoServizio: [],
},
},
}
@@ -241,14 +292,8 @@ export default {
isPunteggioZeroZero() {
return this.state.sp.punt.home === 0 && this.state.sp.punt.guest === 0
},
squadraVincente() {
const { home, guest } = this.state.sp.punt
const totSet = this.state.sp.set.home + this.state.sp.set.guest
const isSetDecisivo = this.state.modalitaPartita === '2/3' ? totSet >= 2 : totSet >= 4
const soglia = isSetDecisivo ? 15 : 25
if (home >= soglia && home - guest >= 2) return 'home'
if (guest >= soglia && guest - home >= 2) return 'guest'
return null
setFinito() {
return this.state.sp.setFinito
},
cambiValid() {
let hasComplete = false
@@ -263,14 +308,6 @@ export default {
return allValid && hasComplete
}
},
watch: {
squadraVincente(val) {
if (val && !this.showSetVinto) {
this.setVintoTeam = val
this.showSetVinto = true
}
},
},
mounted() {
this.connectWebSocket()
@@ -386,6 +423,9 @@ export default {
if (msg.type === 'state') {
this.state = msg.state
if (this.state.sp.partitaFinita && this.showFormazioneModal) {
this.showFormazioneModal = false
}
} else if (msg.type === 'error') {
console.error('[Controller] Server error:', msg.message)
// Fornisce feedback di errore all'utente.
@@ -466,27 +506,26 @@ export default {
console.error('[Controller] Error:', message)
},
confermaSetEApriFormazione() {
this.sendAction({ type: 'confermaSet' })
this.formazioneSetData = {
home: ["1", "2", "3", "4", "5", "6"],
guest: ["1", "2", "3", "4", "5", "6"],
}
this.showFormazioneModal = true
},
confermaFormazioneSet() {
this.sendAction({ type: 'setFormazione', team: 'home', form: this.formazioneSetData.home })
this.sendAction({ type: 'setFormazione', team: 'guest', form: this.formazioneSetData.guest })
this.showFormazioneModal = false
},
doReset() {
this.sendAction({ type: 'resetta' })
this.confirmReset = false
},
undoUltimoPoint() {
this.sendAction({ type: 'decPunt' })
this.showSetVinto = false
},
doNuovoSet() {
this.sendAction({ type: 'nuovoSet', team: this.setVintoTeam })
this.showSetVinto = false
this.configData.nomeHome = this.state.sp.nomi.home
this.configData.nomeGuest = this.state.sp.nomi.guest
this.configData.modalita = this.state.modalitaPartita
this.configData.formHome = ["1", "2", "3", "4", "5", "6"]
this.configData.formGuest = ["1", "2", "3", "4", "5", "6"]
this.showConfig = true
},
openConfig() {
this.configData.nomeHome = this.state.sp.nomi.home
this.configData.nomeGuest = this.state.sp.nomi.guest
@@ -794,20 +833,6 @@ export default {
border: 1px solid rgba(255,255,255,0.12);
}
.dialog-winner {
font-size: 28px;
font-weight: 900;
text-align: center;
margin-bottom: 8px;
}
.dialog-subtitle {
font-size: 13px;
color: #aaa;
text-align: center;
margin-bottom: 4px;
}
.dialog-config {
max-height: 85vh;
overflow-y: auto;
@@ -966,4 +991,21 @@ export default {
padding: 8px 0;
font-weight: 600;
}
/* Fine set */
.set-finito-info {
text-align: center;
padding: 16px 0;
}
.set-vincitore {
font-size: 22px;
font-weight: 800;
color: #fdd835;
text-transform: uppercase;
margin-bottom: 8px;
}
.set-score {
font-size: 36px;
font-weight: 900;
}
</style>
+64 -23
View File
@@ -92,16 +92,16 @@
<div class="striscia" v-if="state.visuStriscia">
<span class="striscia-nome text-bold">{{ state.sp.nomi.home }}</span>
<div class="striscia-items" ref="homeItems">
<div v-for="(h, i) in stricciaStrip.home" :key="'sh'+i"
class="item" :class="{ 'item-vuoto': h === ' ' }">
{{ h }}
<div v-for="(h, i) in state.sp.striscia.home" :key="'sh'+i"
class="item" :class="{ 'item-vuoto': String(h).trim() === '' }">
{{ String(h) }}
</div>
</div>
<span class="striscia-nome text-bold guest-striscia">{{ state.sp.nomi.guest }}</span>
<div class="striscia-items guest-striscia" ref="guestItems">
<div v-for="(h, i) in stricciaStrip.guest" :key="'sg'+i"
class="item" :class="{ 'item-vuoto': h === ' ' }">
{{ h }}
<div v-for="(h, i) in state.sp.striscia.guest" :key="'sg'+i"
class="item" :class="{ 'item-vuoto': String(h).trim() === '' }">
{{ String(h) }}
</div>
</div>
</div>
@@ -112,6 +112,15 @@
{{ wsConnected ? '' : 'Disconnesso' }}
</div>
</div>
<!-- Overlay fine partita -->
<div class="partita-finita-overlay" v-if="state.sp.partitaFinita">
<div class="partita-finita-box">
<div class="partita-finita-label">PARTITA FINITA</div>
<div class="partita-finita-vincitore">{{ state.sp.nomi[state.sp.partitaFinita.vincitore] }}</div>
<div class="partita-finita-set">{{ state.sp.set.home }} {{ state.sp.set.guest }}</div>
</div>
</div>
</section>
</template>
@@ -132,7 +141,10 @@ export default {
visuStriscia: true,
modalitaPartita: "3/5",
sp: {
striscia: [{ serv: 'h', ris: '' }],
strisce: [],
setFinito: null,
partitaFinita: null,
striscia: { home: [0], guest: [0] },
servHome: true,
punt: { home: 0, guest: 0 },
set: { home: 0, guest: 0 },
@@ -141,6 +153,7 @@ export default {
home: ["1", "2", "3", "4", "5", "6"],
guest: ["1", "2", "3", "4", "5", "6"],
},
storicoServizio: [],
},
},
}
@@ -191,29 +204,23 @@ export default {
this.ws = null
}
},
computed: {
stricciaStrip() {
const currentSet = this.state.sp.striscia.at(-1)
if (!currentSet) return { home: [], guest: [] }
let h = 0, g = 0
const home = [], guest = []
for (const scorer of currentSet.ris) {
if (scorer === 'h') { h++; home.push(h); guest.push(' ') }
else { g++; guest.push(g); home.push(' ') }
}
return { home, guest }
},
},
watch: {
'state.sp.striscia': {
'state.sp.striscia.home': {
deep: true,
handler() {
this.$nextTick(() => {
if (this.$refs.homeItems) this.$refs.homeItems.scrollLeft = this.$refs.homeItems.scrollWidth
if (this.$refs.guestItems) this.$refs.guestItems.scrollLeft = this.$refs.guestItems.scrollWidth
if (this.$refs.homeItems) this.$refs.homeItems.scrollLeft = this.$refs.homeItems.scrollWidth
})
}
},
'state.sp.striscia.guest': {
deep: true,
handler() {
this.$nextTick(() => {
if (this.$refs.guestItems) this.$refs.guestItems.scrollLeft = this.$refs.guestItems.scrollWidth
})
}
}
},
methods: {
isMobile() {
@@ -441,4 +448,38 @@ export default {
overflow: hidden;
box-sizing: border-box;
}
/* Fine partita */
.partita-finita-overlay {
position: fixed;
inset: 0;
background: rgba(0, 0, 0, 0.88);
display: flex;
align-items: center;
justify-content: center;
z-index: 500;
}
.partita-finita-box {
text-align: center;
color: #fff;
}
.partita-finita-label {
font-size: 5vw;
font-weight: 700;
letter-spacing: 0.1em;
color: #aaa;
margin-bottom: 0.3em;
}
.partita-finita-vincitore {
font-size: 14vw;
font-weight: 900;
color: #fdd835;
text-transform: uppercase;
line-height: 1;
margin-bottom: 0.2em;
}
.partita-finita-set {
font-size: 8vw;
font-weight: 700;
}
</style>
+3
View File
@@ -1,6 +1,9 @@
import { createApp } from 'vue'
import './style.css'
import WaveUI from 'wave-ui'
import 'wave-ui/dist/wave-ui.css'
import ControllerPage from './components/ControllerPage.vue'
const app = createApp(ControllerPage)
app.use(WaveUI)
app.mount('#app')
+62
View File
@@ -0,0 +1,62 @@
import Database from 'better-sqlite3'
import { mkdirSync } from 'fs'
import { join, dirname } from 'path'
import { fileURLToPath } from 'url'
const __dirname = dirname(fileURLToPath(import.meta.url))
const DATA_DIR = join(__dirname, '..', 'data')
const DB_PATH = process.env.DB_PATH || join(DATA_DIR, 'partite.db')
mkdirSync(DATA_DIR, { recursive: true })
const db = new Database(DB_PATH)
db.pragma('journal_mode = WAL')
db.exec(`
CREATE TABLE IF NOT EXISTS partite (
id INTEGER PRIMARY KEY AUTOINCREMENT,
data TEXT NOT NULL,
modalita TEXT NOT NULL,
nome_home TEXT NOT NULL,
nome_guest TEXT NOT NULL,
set_home INTEGER NOT NULL,
set_guest INTEGER NOT NULL,
vincitore TEXT,
json TEXT NOT NULL
)
`)
const stmtInsert = db.prepare(`
INSERT INTO partite (data, modalita, nome_home, nome_guest, set_home, set_guest, vincitore, json)
VALUES (?, ?, ?, ?, ?, ?, ?, ?)
`)
export function salvaPartita(state) {
const payload = {
data: new Date().toISOString(),
modalita: state.modalitaPartita,
nomi: state.sp.nomi,
set: state.sp.set,
vincitore: state.sp.partitaFinita?.vincitore ?? null,
strisce: state.sp.strisce,
}
const { lastInsertRowid } = stmtInsert.run(
payload.data,
payload.modalita,
payload.nomi.home,
payload.nomi.guest,
payload.set.home,
payload.set.guest,
payload.vincitore,
JSON.stringify(payload)
)
return lastInsertRowid
}
export function getPartite() {
return db.prepare('SELECT * FROM partite ORDER BY id DESC').all()
}
export function getPartita(id) {
return db.prepare('SELECT * FROM partite WHERE id = ?').get(id)
}
+124 -39
View File
@@ -1,3 +1,8 @@
/**
* Logica di gioco condivisa per il segnapunti.
* Utilizzata sia dal server WebSocket sia dal client per l'anteprima locale.
*/
export function createInitialState() {
return {
order: true,
@@ -5,7 +10,14 @@ export function createInitialState() {
visuStriscia: true,
modalitaPartita: "3/5",
sp: {
striscia: [{ serv: 'h', ris: '' }],
strisce: [],
setFinito: null,
partitaFinita: null,
formInizioSet: {
home: ["1", "2", "3", "4", "5", "6"],
guest: ["1", "2", "3", "4", "5", "6"],
},
striscia: { home: [0], guest: [" "] },
servHome: true,
punt: { home: 0, guest: 0 },
set: { home: 0, guest: 0 },
@@ -14,10 +26,18 @@ export function createInitialState() {
home: ["1", "2", "3", "4", "5", "6"],
guest: ["1", "2", "3", "4", "5", "6"],
},
storicoServizio: [],
},
}
}
export function checkVittoriaPartita(state) {
const setsToWin = state.modalitaPartita === "2/3" ? 2 : 3
if (state.sp.set.home >= setsToWin) return "home"
if (state.sp.set.guest >= setsToWin) return "guest"
return null
}
export function checkVittoria(state) {
const puntHome = state.sp.punt.home
const puntGuest = state.sp.punt.guest
@@ -25,55 +45,122 @@ export function checkVittoria(state) {
const setGuest = state.sp.set.guest
const totSet = setHome + setGuest
const isSetDecisivo = state.modalitaPartita === "2/3" ? totSet >= 2 : totSet >= 4
let isSetDecisivo = false
if (state.modalitaPartita === "2/3") {
isSetDecisivo = totSet >= 2
} else {
isSetDecisivo = totSet >= 4
}
const punteggioVittoria = isSetDecisivo ? 15 : 25
if (puntHome >= punteggioVittoria && puntHome - puntGuest >= 2) return true
if (puntGuest >= punteggioVittoria && puntGuest - puntHome >= 2) return true
if (puntHome >= punteggioVittoria && puntHome - puntGuest >= 2) {
return true
}
if (puntGuest >= punteggioVittoria && puntGuest - puntHome >= 2) {
return true
}
return false
}
export function applyAction(state, action) {
const s = structuredClone(state)
// Esegue un deep clone per evitare mutazioni indesiderate dello stato lato server.
// Restituisce sempre un nuovo oggetto di stato.
const s = JSON.parse(JSON.stringify(state))
switch (action.type) {
case "incPunt": {
const team = action.team
if (checkVittoria(s)) break
if (s.sp.setFinito !== null || s.sp.partitaFinita !== null) break
s.sp.storicoServizio.push({
servHome: s.sp.servHome,
cambioPalla: (team === "home" && !s.sp.servHome) || (team === "guest" && s.sp.servHome),
})
const cambioPalla = (team === "home") !== s.sp.servHome
s.sp.punt[team]++
s.sp.striscia.at(-1).ris += team === 'home' ? 'h' : 'g'
if (team === "home") {
s.sp.striscia.home.push(s.sp.punt.home)
s.sp.striscia.guest.push(" ")
} else {
s.sp.striscia.guest.push(s.sp.punt.guest)
s.sp.striscia.home.push(" ")
}
const cambioPalla = (team === "home" && !s.sp.servHome) || (team === "guest" && s.sp.servHome)
if (cambioPalla) {
s.sp.form[team].push(s.sp.form[team].shift())
}
s.sp.servHome = team === "home"
if (checkVittoria(s)) {
s.sp.setFinito = { vincitore: team }
}
break
}
case "decPunt": {
const currentSet = s.sp.striscia.at(-1)
if (currentSet.ris.length === 0) break
if (s.sp.setFinito !== null) {
s.sp.setFinito = null
}
if (s.sp.storicoServizio.length > 0) {
const tmpHome = s.sp.striscia.home.pop()
s.sp.striscia.guest.pop()
const statoServizio = s.sp.storicoServizio.pop()
const lastScorerShort = currentSet.ris.at(-1)
const prevServerShort = currentSet.ris.length >= 2
? currentSet.ris.at(-2)
: currentSet.serv
if (tmpHome === " ") {
s.sp.punt.guest--
if (statoServizio.cambioPalla) {
s.sp.form.guest.unshift(s.sp.form.guest.pop())
}
} else {
s.sp.punt.home--
if (statoServizio.cambioPalla) {
s.sp.form.home.unshift(s.sp.form.home.pop())
}
}
s.sp.servHome = statoServizio.servHome
}
break
}
const wasCambioPalla = lastScorerShort !== prevServerShort
case "confermaSet": {
if (!s.sp.setFinito) break
const vincitore = s.sp.setFinito.vincitore
currentSet.ris = currentSet.ris.slice(0, -1)
s.sp.strisce.push({
set: s.sp.strisce.length + 1,
formInizio: {
home: [...s.sp.formInizioSet.home],
guest: [...s.sp.formInizioSet.guest],
},
home: [...s.sp.striscia.home],
guest: [...s.sp.striscia.guest],
vincitore,
punt: { ...s.sp.punt },
})
const lastScorer = lastScorerShort === 'h' ? 'home' : 'guest'
const prevServer = prevServerShort === 'h' ? 'home' : 'guest'
s.sp.formInizioSet = {
home: [...s.sp.form.home],
guest: [...s.sp.form.guest],
}
s.sp.punt[lastScorer]--
s.sp.servHome = prevServerShort === 'h'
s.sp.set[vincitore]++
if (wasCambioPalla) {
s.sp.form[lastScorer].unshift(s.sp.form[lastScorer].pop())
s.sp.punt.home = 0
s.sp.punt.guest = 0
s.sp.storicoServizio = []
s.sp.setFinito = null
const vincitorePartita = checkVittoriaPartita(s)
if (vincitorePartita) {
s.sp.partitaFinita = { vincitore: vincitorePartita }
} else {
s.sp.striscia = s.sp.servHome
? { home: [0], guest: [" "] }
: { home: [" "], guest: [0] }
}
break
}
@@ -88,25 +175,12 @@ export function applyAction(state, action) {
break
}
case "nuovoSet": {
const team = action.team
if (team !== 'home' && team !== 'guest') break
s.sp.set[team]++
s.sp.punt.home = 0
s.sp.punt.guest = 0
s.sp.servHome = team === 'home'
s.sp.striscia.push({ serv: team === 'home' ? 'h' : 'g', ris: '' })
s.sp.form = {
home: ["1", "2", "3", "4", "5", "6"],
guest: ["1", "2", "3", "4", "5", "6"],
}
break
}
case "cambiaPalla": {
if (s.sp.punt.home === 0 && s.sp.punt.guest === 0) {
s.sp.servHome = !s.sp.servHome
s.sp.striscia.at(-1).serv = s.sp.servHome ? 'h' : 'g'
s.sp.striscia = s.sp.servHome
? { home: [0], guest: [" "] }
: { home: [" "], guest: [0] }
}
break
}
@@ -121,7 +195,17 @@ export function applyAction(state, action) {
home: ["1", "2", "3", "4", "5", "6"],
guest: ["1", "2", "3", "4", "5", "6"],
}
s.sp.striscia = [{ serv: s.sp.servHome ? 'h' : 'g', ris: '' }]
s.sp.striscia = s.sp.servHome
? { home: [0], guest: [" "] }
: { home: [" "], guest: [0] }
s.sp.storicoServizio = []
s.sp.strisce = []
s.sp.setFinito = null
s.sp.partitaFinita = null
s.sp.formInizioSet = {
home: ["1", "2", "3", "4", "5", "6"],
guest: ["1", "2", "3", "4", "5", "6"],
}
break
}
@@ -154,6 +238,7 @@ export function applyAction(state, action) {
case "setFormazione": {
if (action.team && action.form) {
s.sp.form[action.team] = [...action.form]
s.sp.formInizioSet[action.team] = [...action.form]
}
break
}
+6
View File
@@ -1,6 +1,12 @@
import { createApp } from 'vue'
import './style.css'
import App from './App.vue'
import WaveUI from 'wave-ui'
import 'wave-ui/dist/wave-ui.css'
import DisplayPage from './components/DisplayPage.vue'
// In modalità display-only, non serve il router.
// Il display viene montato direttamente.
const app = createApp(DisplayPage)
app.use(WaveUI)
app.mount('#app')
-26
View File
@@ -1,26 +0,0 @@
import { readFileSync, writeFileSync, mkdirSync, existsSync } from 'fs'
import { join, dirname } from 'path'
import { fileURLToPath } from 'url'
import { createInitialState } from './gameState.js'
const STATE_PATH = join(dirname(fileURLToPath(import.meta.url)), '..', '.segnapunti', 'state.json')
export function loadState() {
try {
if (existsSync(STATE_PATH)) {
return JSON.parse(readFileSync(STATE_PATH, 'utf8'))
}
} catch (err) {
console.warn('[Persist] Stato non leggibile, si riparte da zero:', err.message)
}
return createInitialState()
}
export function saveState(state) {
try {
mkdirSync(dirname(STATE_PATH), { recursive: true })
writeFileSync(STATE_PATH, JSON.stringify(state), 'utf8')
} catch (err) {
console.error('[Persist] Salvataggio fallito:', err.message)
}
}
+19 -4
View File
@@ -1,11 +1,16 @@
import { networkInterfaces } from 'os'
/**
* Restituisce gli indirizzi IP di rete del sistema, escludendo loopback e bridge Docker.
* @returns {string[]} Elenco degli indirizzi IP disponibili.
*/
export function getNetworkIPs() {
const nets = networkInterfaces()
const networkIPs = []
for (const name of Object.keys(nets)) {
for (const net of nets[name]) {
// Esclude loopback (127.0.0.1), indirizzi non IPv4 e bridge Docker (172.17.x.x, 172.18.x.x).
if (net.family === 'IPv4' &&
!net.internal &&
!net.address.startsWith('172.17.') &&
@@ -18,17 +23,27 @@ export function getNetworkIPs() {
return networkIPs
}
export function printServerInfo(port = 3000) {
/**
* Stampa il riepilogo di avvio del server con gli URL di accesso.
* @param {number} displayPort - Porta del display.
* @param {number} controllerPort - Porta del controller.
*/
export function printServerInfo(displayPort = 5173, controllerPort = 3001, storicoPort = 3002) {
const networkIPs = getNetworkIPs()
console.log(`\nSegnapunti Server`)
console.log(` Display: http://127.0.0.1:${port}/display`)
console.log(` Controller: http://127.0.0.1:${port}/controller`)
console.log(` Display: http://127.0.0.1:${displayPort}/`)
console.log(` Controller: http://127.0.0.1:${controllerPort}/`)
console.log(` Storico: http://127.0.0.1:${storicoPort}/`)
if (networkIPs.length > 0) {
console.log(`\n Controller da dispositivi remoti:`)
networkIPs.forEach(ip => {
console.log(` http://${ip}:${port}/controller`)
console.log(` http://${ip}:${controllerPort}/`)
})
console.log(`\n Storico da dispositivi remoti:`)
networkIPs.forEach(ip => {
console.log(` http://${ip}:${storicoPort}/`)
})
}
+12 -4
View File
@@ -248,7 +248,9 @@ button:focus-visible {
max-width: 64px;
}
.cambi-input input {
.cambi-input input,
.cambi-input .w-input__input,
.cambi-input .w-input__field {
border: 2px solid rgba(255, 255, 255, 0.35);
border-radius: 8px;
padding: 6px 10px;
@@ -257,15 +259,21 @@ button:focus-visible {
box-sizing: border-box;
}
.cambi-in input {
.cambi-in input,
.cambi-in .w-input__input,
.cambi-in .w-input__field {
background: rgba(120, 200, 120, 0.4);
}
.cambi-out input {
.cambi-out input,
.cambi-out .w-input__input,
.cambi-out .w-input__field {
background: rgba(200, 120, 120, 0.4);
}
.cambi-input input:focus {
.cambi-input input:focus,
.cambi-input .w-input__input:focus,
.cambi-input .w-input__field:focus {
border-color: rgba(255, 255, 255, 0.7);
outline: none;
}
+17 -5
View File
@@ -1,13 +1,14 @@
import { createInitialState, applyAction } from './gameState.js'
import { salvaPartita } from './db.js'
/**
* Crea e configura il server WebSocket per la gestione dello stato di gioco.
* @param {WebSocketServer} wss - Istanza del server WebSocket.
* @returns {Object} Oggetto con metodi di gestione dello stato.
*/
export function setupWebSocketHandler(wss, options = {}) {
export function setupWebSocketHandler(wss) {
// Stato globale della partita.
let gameState = options.initialState ?? createInitialState()
let gameState = createInitialState()
// Mappa dei ruoli associati ai client connessi.
const clients = new Map() // ws -> { role: 'display' | 'controller' }
@@ -98,9 +99,18 @@ export function setupWebSocketHandler(wss, options = {}) {
return
}
// Salva su DB quando la partita appena finisce.
if (!previousState.sp.partitaFinita && gameState.sp.partitaFinita) {
try {
const id = salvaPartita(gameState)
console.log(`[DB] Partita salvata (id: ${id})`)
} catch (err) {
console.error('[DB] Errore salvataggio partita:', err)
}
}
// Propaga il nuovo stato a tutti i client connessi.
broadcastState()
options.onStateChange?.(gameState)
}
/**
@@ -157,9 +167,9 @@ export function setupWebSocketHandler(wss, options = {}) {
*/
function handleClose(ws) {
const client = clients.get(ws)
const role = client?.role || 'unknown'
console.log(`[WebSocket] Client disconnected (role: ${role})`)
const role = client?.role || 'unregistered'
clients.delete(ws)
console.log(`[WebSocket] Client disconnected (role: ${role}, remaining: ${wss.clients.size})`)
}
/**
@@ -185,6 +195,8 @@ export function setupWebSocketHandler(wss, options = {}) {
// Imposta il tipo binario per ridurre i problemi di codifica.
ws.binaryType = 'arraybuffer'
console.log(`[WebSocket] New connection (total: ${wss.clients.size})`)
ws.on('message', (data) => handleMessage(ws, data))
ws.on('close', () => handleClose(ws))
ws.on('error', (err) => handleError(err, ws))
+293
View File
@@ -0,0 +1,293 @@
<!DOCTYPE html>
<html lang="it">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Storico Partite</title>
<style>
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
body {
background: #111;
color: #e0e0e0;
font-family: 'Inter', system-ui, sans-serif;
min-height: 100vh;
padding: 24px 16px;
}
h1 {
text-align: center;
font-size: 22px;
font-weight: 800;
letter-spacing: 0.1em;
color: #fdd835;
text-transform: uppercase;
margin-bottom: 24px;
}
#lista {
max-width: 700px;
margin: 0 auto;
display: flex;
flex-direction: column;
gap: 12px;
}
.card {
background: #1e1e1e;
border: 1px solid rgba(255,255,255,0.1);
border-radius: 16px;
overflow: hidden;
cursor: pointer;
}
.card-header {
display: flex;
align-items: center;
justify-content: space-between;
padding: 16px 20px;
gap: 12px;
user-select: none;
}
.card-header:hover {
background: rgba(255,255,255,0.04);
}
.card-data {
font-size: 11px;
color: #777;
white-space: nowrap;
}
.card-teams {
flex: 1;
text-align: center;
}
.card-nomi {
font-size: 16px;
font-weight: 700;
}
.card-result {
font-size: 22px;
font-weight: 900;
letter-spacing: 0.05em;
margin-top: 2px;
}
.card-result .winner { color: #fdd835; }
.card-modalita {
font-size: 11px;
color: #777;
white-space: nowrap;
}
.card-arrow {
font-size: 18px;
color: #555;
transition: transform 0.2s;
}
.card.open .card-arrow { transform: rotate(180deg); }
.card-detail {
display: none;
border-top: 1px solid rgba(255,255,255,0.08);
padding: 16px 20px;
}
.card.open .card-detail { display: block; }
.set-table {
width: 100%;
border-collapse: collapse;
font-size: 13px;
}
.set-table th {
text-align: left;
padding: 6px 8px;
font-size: 11px;
font-weight: 700;
color: #777;
text-transform: uppercase;
letter-spacing: 0.05em;
border-bottom: 1px solid rgba(255,255,255,0.08);
}
.set-table td {
padding: 8px 8px;
vertical-align: top;
border-bottom: 1px solid rgba(255,255,255,0.05);
}
.set-table tr:last-child td { border-bottom: none; }
.set-num {
font-weight: 800;
color: #aaa;
width: 32px;
}
.set-vince {
font-weight: 700;
color: #fdd835;
}
.set-punt {
font-weight: 700;
font-size: 15px;
}
.form-grid {
display: inline-grid;
grid-template-columns: repeat(3, 28px);
grid-template-rows: repeat(2, 24px);
gap: 2px;
background: rgba(255,255,255,0.05);
border-radius: 6px;
padding: 4px;
}
.form-cell {
display: flex;
align-items: center;
justify-content: center;
font-size: 11px;
font-weight: 700;
background: rgba(255,255,255,0.08);
border-radius: 4px;
}
.form-label {
font-size: 11px;
color: #666;
margin-bottom: 4px;
}
.form-wrap {
display: flex;
flex-direction: column;
}
#vuoto {
text-align: center;
color: #555;
padding: 48px 16px;
font-size: 15px;
}
#errore {
text-align: center;
color: #ef5350;
padding: 24px;
}
</style>
</head>
<body>
<h1>Storico Partite</h1>
<div id="lista"></div>
<script>
function formatData(iso) {
const d = new Date(iso)
return d.toLocaleDateString('it-IT', { day: '2-digit', month: '2-digit', year: 'numeric' })
+ ' ' + d.toLocaleTimeString('it-IT', { hour: '2-digit', minute: '2-digit' })
}
// Layout campo: righe [fila attacco 3-2-1, fila difesa 4-5-0] → indici nell'array form
const LAYOUT = [3, 2, 1, 4, 5, 0]
function renderForm(form, label) {
const cells = LAYOUT.map(i => `<div class="form-cell">${form[i] ?? '?'}</div>`).join('')
return `<div class="form-wrap">
<div class="form-label">${label}</div>
<div class="form-grid">${cells}</div>
</div>`
}
function renderDettaglio(dati, nomiHome, nomiGuest) {
if (!dati.strisce || dati.strisce.length === 0) return '<p style="color:#555">Nessun set registrato.</p>'
const righe = dati.strisce.map(s => {
const vince = s.vincitore === 'home' ? nomiHome : nomiGuest
const formHome = s.formInizio?.home ?? []
const formGuest = s.formInizio?.guest ?? []
return `<tr>
<td class="set-num">${s.set}</td>
<td class="set-vince">${vince}</td>
<td class="set-punt">${s.punt.home} ${s.punt.guest}</td>
<td>${renderForm(formHome, nomiHome)}</td>
<td>${renderForm(formGuest, nomiGuest)}</td>
</tr>`
}).join('')
return `<table class="set-table">
<thead>
<tr>
<th>Set</th>
<th>Vincitore</th>
<th>Punteggio</th>
<th>Form Home</th>
<th>Form Guest</th>
</tr>
</thead>
<tbody>${righe}</tbody>
</table>`
}
function renderCard(p) {
const dati = JSON.parse(p.json)
const nomeHome = p.nome_home
const nomeGuest = p.nome_guest
const vincitoreNome = p.vincitore === 'home' ? nomeHome : nomeGuest
const homeWin = p.vincitore === 'home'
const resultHome = homeWin ? `<span class="winner">${p.set_home}</span>` : p.set_home
const resultGuest = homeWin ? p.set_guest : `<span class="winner">${p.set_guest}</span>`
const card = document.createElement('div')
card.className = 'card'
card.innerHTML = `
<div class="card-header">
<div class="card-data">${formatData(p.data)}</div>
<div class="card-teams">
<div class="card-nomi">${nomeHome} vs ${nomeGuest}</div>
<div class="card-result">${resultHome} ${resultGuest}</div>
</div>
<div class="card-modalita">${p.modalita}</div>
<div class="card-arrow">▾</div>
</div>
<div class="card-detail">
${renderDettaglio(dati, nomeHome, nomeGuest)}
</div>
`
card.querySelector('.card-header').addEventListener('click', () => {
card.classList.toggle('open')
})
return card
}
async function caricaPartite() {
const lista = document.getElementById('lista')
try {
const res = await fetch('/api/partite')
if (!res.ok) throw new Error(`HTTP ${res.status}`)
const partite = await res.json()
if (partite.length === 0) {
lista.innerHTML = '<div id="vuoto">Nessuna partita registrata.</div>'
return
}
partite.forEach(p => lista.appendChild(renderCard(p)))
} catch (err) {
lista.innerHTML = `<div id="errore">Errore caricamento: ${err.message}</div>`
}
}
caricaPartite()
</script>
</body>
</html>
+33
View File
@@ -252,4 +252,37 @@ describe('ControllerPage.vue', () => {
expect(wrapper.find('.conn-bar').text()).toContain('Connesso')
})
})
// =============================================
// OVERLAY SET FINITO
// =============================================
describe('Overlay set finito', () => {
it('non mostra l\'overlay se setFinito è null', () => {
const wrapper = mountController()
expect(wrapper.find('.overlay').exists()).toBe(false)
})
it('mostra l\'overlay quando setFinito è impostato', async () => {
const wrapper = mountController()
wrapper.vm.state.sp.setFinito = { vincitore: 'home' }
await wrapper.vm.$nextTick()
expect(wrapper.find('.overlay').exists()).toBe(true)
})
it('l\'overlay mostra il nome del vincitore del set', async () => {
const wrapper = mountController()
wrapper.vm.state.sp.setFinito = { vincitore: 'home' }
await wrapper.vm.$nextTick()
expect(wrapper.find('.overlay').text()).toContain('Antoniana')
})
it('click su CONFERMA invia l\'azione confermaSet', async () => {
const wrapper = mountController()
wrapper.vm.state.sp.setFinito = { vincitore: 'guest' }
await wrapper.vm.$nextTick()
const spy = vi.spyOn(wrapper.vm, 'sendAction')
await wrapper.find('.btn-confirm').trigger('click')
expect(spy).toHaveBeenCalledWith({ type: 'confermaSet' })
})
})
})
+35
View File
@@ -192,4 +192,39 @@ describe('DisplayPage.vue', () => {
expect(guestStyle).toContain('display: none')
})
})
// =============================================
// OVERLAY PARTITA FINITA
// =============================================
describe('Overlay partita finita', () => {
it('non mostra l\'overlay se partitaFinita è null', () => {
const wrapper = mountDisplay()
expect(wrapper.find('.partita-finita-overlay').exists()).toBe(false)
})
it('mostra l\'overlay quando partitaFinita è impostato', async () => {
const wrapper = mountDisplay()
wrapper.vm.state.sp.partitaFinita = { vincitore: 'home' }
await wrapper.vm.$nextTick()
expect(wrapper.find('.partita-finita-overlay').exists()).toBe(true)
})
it('l\'overlay mostra il nome del vincitore della partita', async () => {
const wrapper = mountDisplay()
wrapper.vm.state.sp.nomi = { home: 'Antoniana', guest: 'Rivali' }
wrapper.vm.state.sp.partitaFinita = { vincitore: 'guest' }
await wrapper.vm.$nextTick()
expect(wrapper.find('.partita-finita-overlay').text()).toContain('Rivali')
})
it('l\'overlay mostra il punteggio dei set', async () => {
const wrapper = mountDisplay()
wrapper.vm.state.sp.set = { home: 3, guest: 1 }
wrapper.vm.state.sp.partitaFinita = { vincitore: 'home' }
await wrapper.vm.$nextTick()
const text = wrapper.find('.partita-finita-overlay').text()
expect(text).toContain('3')
expect(text).toContain('1')
})
})
})
+75
View File
@@ -1,6 +1,13 @@
import { describe, it, expect, beforeEach, vi, afterEach } from 'vitest'
import { setupWebSocketHandler } from '../../src/websocket-handler.js'
import { EventEmitter } from 'events'
import { salvaPartita } from '../../src/db.js'
// Mock di db.js: evita connessioni reali al DB SQLite durante i test.
// vi.mock è automaticamente hoistato da Vitest all'inizio del file.
vi.mock('../../src/db.js', () => ({
salvaPartita: vi.fn().mockReturnValue(42n),
}))
// Mock parziale di una WebSocket e del Server
class MockWebSocket extends EventEmitter {
@@ -400,4 +407,72 @@ describe('WebSocket Integration (websocket-handler.js)', () => {
expect(handler.getClients().size).toBe(1)
})
})
// =============================================
// SALVATAGGIO DB
// =============================================
describe('Salvataggio DB', () => {
// Helper: inietta uno stato con setFinito già impostato e N set vinti da home
function injectPreFinaleState(setHomeVinti, modalita = '3/5') {
const base = handler.getState()
handler.setState({
...base,
modalitaPartita: modalita,
sp: {
...base.sp,
set: { home: setHomeVinti, guest: 0 },
punt: { home: 25, guest: 0 },
setFinito: { vincitore: 'home' },
partitaFinita: null,
storicoServizio: [],
strisce: [],
striscia: { home: [0], guest: [" "] },
},
})
}
afterEach(() => {
vi.mocked(salvaPartita).mockClear()
})
it('salvaPartita viene chiamata quando confermaSet porta partitaFinita a non-null', () => {
// 3/5: servono 3 set → inietta 2 già vinti + setFinito, poi confermaSet
injectPreFinaleState(2, '3/5')
const controller = connectAndRegister(wss, 'controller')
controller.emit('message', JSON.stringify({ type: 'action', action: { type: 'confermaSet' } }))
expect(salvaPartita).toHaveBeenCalledTimes(1)
})
it('salvaPartita NON viene chiamata per azioni normali (incPunt)', () => {
const controller = connectAndRegister(wss, 'controller')
controller.emit('message', JSON.stringify({ type: 'action', action: { type: 'incPunt', team: 'home' } }))
expect(salvaPartita).not.toHaveBeenCalled()
})
it('salvaPartita NON viene chiamata se partitaFinita era già impostata', () => {
// Inietta stato con partitaFinita già presente
const base = handler.getState()
handler.setState({
...base,
sp: { ...base.sp, partitaFinita: { vincitore: 'home' } },
})
const controller = connectAndRegister(wss, 'controller')
// Qualsiasi azione non dovrebbe triggerare un secondo salvataggio
controller.emit('message', JSON.stringify({ type: 'action', action: { type: 'incPunt', team: 'home' } }))
expect(salvaPartita).not.toHaveBeenCalled()
})
it('se salvaPartita lancia un errore il broadcast avviene comunque', () => {
vi.mocked(salvaPartita).mockImplementationOnce(() => { throw new Error('DB error') })
injectPreFinaleState(2, '3/5')
const display = connectAndRegister(wss, 'display')
const controller = connectAndRegister(wss, 'controller')
display.send.mockClear()
controller.emit('message', JSON.stringify({ type: 'action', action: { type: 'confermaSet' } }))
// Il broadcast deve avvenire anche se il DB ha fallito
expect(display.send).toHaveBeenCalled()
const msg = lastSent(display)
expect(msg.type).toBe('state')
})
})
})
+145
View File
@@ -0,0 +1,145 @@
import { describe, it, expect, beforeAll, afterAll, vi } from 'vitest'
// Il modulo db.js apre il DB a livello di modulo (top-level).
// Per isolarlo usiamo un DB in memoria: vi.stubEnv + vi.resetModules + import dinamico.
let salvaPartita, getPartite, getPartita
beforeAll(async () => {
vi.stubEnv('DB_PATH', ':memory:')
vi.resetModules()
const mod = await import('../../src/db.js')
salvaPartita = mod.salvaPartita
getPartite = mod.getPartite
getPartita = mod.getPartita
})
afterAll(() => {
vi.unstubAllEnvs()
})
// Stato minimo valido da passare a salvaPartita
function makeState({ vincitore = 'home', setHome = 3, setGuest = 1, strisce = [] } = {}) {
return {
modalitaPartita: '3/5',
sp: {
nomi: { home: 'Antoniana', guest: 'Ospiti' },
set: { home: setHome, guest: setGuest },
partitaFinita: vincitore ? { vincitore } : null,
strisce,
},
}
}
describe('db.js', () => {
// =============================================
// salvaPartita
// =============================================
describe('salvaPartita', () => {
it('ritorna un ID numerico intero positivo', () => {
const id = salvaPartita(makeState())
expect(typeof id).toBe('number')
expect(id).toBeGreaterThan(0)
expect(Number.isInteger(id)).toBe(true)
})
it('IDs sono incrementali su inserimenti multipli', () => {
const id1 = salvaPartita(makeState())
const id2 = salvaPartita(makeState())
expect(id2).toBeGreaterThan(id1)
})
it('il record ha i campi corretti: modalita, nomi, set, vincitore', () => {
const state = makeState({ vincitore: 'guest', setHome: 1, setGuest: 3 })
const id = salvaPartita(state)
const row = getPartita(Number(id))
expect(row.modalita).toBe('3/5')
expect(row.nome_home).toBe('Antoniana')
expect(row.nome_guest).toBe('Ospiti')
expect(row.set_home).toBe(1)
expect(row.set_guest).toBe(3)
expect(row.vincitore).toBe('guest')
})
it('il campo json è una stringa JSON parsabile', () => {
const id = salvaPartita(makeState())
const row = getPartita(Number(id))
expect(() => JSON.parse(row.json)).not.toThrow()
})
it('il JSON contiene nomi, set, strisce, vincitore e data', () => {
const strisce = [{ set: 1, vincitore: 'home', punt: { home: 25, guest: 20 } }]
const state = makeState({ strisce })
const id = salvaPartita(state)
const row = getPartita(Number(id))
const json = JSON.parse(row.json)
expect(json.nomi).toEqual({ home: 'Antoniana', guest: 'Ospiti' })
expect(json.set).toEqual({ home: 3, guest: 1 })
expect(json.vincitore).toBe('home')
expect(json.strisce).toEqual(strisce)
expect(typeof json.data).toBe('string')
expect(() => new Date(json.data)).not.toThrow()
})
it('vincitore nel DB è null se partitaFinita è null', () => {
const state = makeState({ vincitore: null })
const id = salvaPartita(state)
const row = getPartita(Number(id))
expect(row.vincitore).toBeNull()
})
})
// =============================================
// getPartite
// =============================================
describe('getPartite', () => {
it('ritorna tutte le partite inserite', () => {
const prima = getPartite().length
salvaPartita(makeState())
salvaPartita(makeState())
const dopo = getPartite()
expect(dopo.length).toBe(prima + 2)
})
it('ordina per ID discendente (più recente prima)', () => {
const id1 = Number(salvaPartita(makeState()))
const id2 = Number(salvaPartita(makeState()))
const partite = getPartite()
const ids = partite.map(p => p.id)
const idx1 = ids.indexOf(id1)
const idx2 = ids.indexOf(id2)
// id2 (inserito dopo) deve apparire prima (indice minore)
expect(idx2).toBeLessThan(idx1)
})
})
// =============================================
// getPartita
// =============================================
describe('getPartita', () => {
it('ritorna undefined per ID inesistente', () => {
const result = getPartita(999999)
expect(result).toBeUndefined()
})
it('ritorna il record corretto per ID valido', () => {
const id = Number(salvaPartita(makeState({ vincitore: 'home', setHome: 3, setGuest: 0 })))
const row = getPartita(id)
expect(row).toBeDefined()
expect(row.id).toBe(id)
expect(row.set_home).toBe(3)
expect(row.set_guest).toBe(0)
})
it('il record ha tutti i campi attesi', () => {
const id = Number(salvaPartita(makeState()))
const row = getPartita(id)
const campi = ['id', 'data', 'modalita', 'nome_home', 'nome_guest', 'set_home', 'set_guest', 'vincitore', 'json']
for (const campo of campi) {
expect(row).toHaveProperty(campo)
}
})
})
})
+309 -65
View File
@@ -1,5 +1,5 @@
import { describe, it, expect, beforeEach } from 'vitest'
import { createInitialState, applyAction, checkVittoria } from '../../src/gameState.js'
import { createInitialState, applyAction, checkVittoria, checkVittoriaPartita } from '../../src/gameState.js'
describe('Game Logic (gameState.js)', () => {
let state
@@ -31,10 +31,14 @@ describe('Game Logic (gameState.js)', () => {
expect(state.sp.form.guest).toEqual(["1", "2", "3", "4", "5", "6"])
})
it('dovrebbe avere la striscia iniziale con un set vuoto', () => {
expect(state.sp.striscia).toHaveLength(1)
expect(state.sp.striscia[0].serv).toBe('h')
expect(state.sp.striscia[0].ris).toBe('')
it('dovrebbe avere la striscia iniziale a [0] per home e [" "] per guest', () => {
// home serve per primo → home parte con [0], guest con [" "]
expect(state.sp.striscia.home).toEqual([0])
expect(state.sp.striscia.guest).toEqual([" "])
})
it('dovrebbe avere storico servizio vuoto', () => {
expect(state.sp.storicoServizio).toEqual([])
})
it('dovrebbe avere modalità 3/5 di default', () => {
@@ -113,24 +117,30 @@ describe('Game Logic (gameState.js)', () => {
it('dovrebbe aggiornare la striscia per punto Home', () => {
const s = applyAction(state, { type: 'incPunt', team: 'home' })
expect(s.sp.striscia.at(-1).ris).toBe('h')
// Lo stato iniziale ha striscia = { home: [0], guest: [" "] }
expect(s.sp.striscia.home).toEqual([0, 1])
expect(s.sp.striscia.guest).toEqual([" ", " "])
})
it('dovrebbe aggiornare la striscia per punto Guest', () => {
const s = applyAction(state, { type: 'incPunt', team: 'guest' })
expect(s.sp.striscia.at(-1).ris).toBe('g')
// Lo stato iniziale ha striscia = { home: [0], guest: [" "] }
expect(s.sp.striscia.guest).toEqual([" ", 1])
expect(s.sp.striscia.home).toEqual([0, " "])
})
it('dovrebbe registrare scorer nella striscia', () => {
let s = applyAction(state, { type: 'incPunt', team: 'home' })
s = applyAction(s, { type: 'incPunt', team: 'guest' })
s = applyAction(s, { type: 'incPunt', team: 'home' })
expect(s.sp.striscia.at(-1).ris).toBe('hgh')
it('dovrebbe registrare lo storico servizio', () => {
const s = applyAction(state, { type: 'incPunt', team: 'home' })
expect(s.sp.storicoServizio).toHaveLength(1)
expect(s.sp.storicoServizio[0]).toHaveProperty('servHome')
expect(s.sp.storicoServizio[0]).toHaveProperty('cambioPalla')
})
it('non dovrebbe incrementare i punti dopo vittoria', () => {
it('non dovrebbe incrementare i punti dopo vittoria (setFinito impostato)', () => {
// Il guard controlla setFinito: va impostato come farebbe il ciclo di gioco reale
state.sp.punt.home = 25
state.sp.punt.guest = 23
state.sp.setFinito = { vincitore: 'home' }
const s = applyAction(state, { type: 'incPunt', team: 'home' })
expect(s.sp.punt.home).toBe(25)
})
@@ -180,7 +190,7 @@ describe('Game Logic (gameState.js)', () => {
it('dovrebbe ripristinare la striscia', () => {
const s1 = applyAction(state, { type: 'incPunt', team: 'home' })
const s2 = applyAction(s1, { type: 'decPunt' })
expect(s2.sp.striscia.at(-1).ris).toBe('')
expect(s2.sp.striscia.home).toEqual([0])
})
it('dovrebbe gestire undo multipli in sequenza', () => {
@@ -226,53 +236,6 @@ describe('Game Logic (gameState.js)', () => {
})
})
// =============================================
// NUOVO SET (nuovoSet)
// =============================================
describe('nuovoSet', () => {
it('dovrebbe incrementare il set della squadra vincente', () => {
state.sp.punt.home = 25
const s = applyAction(state, { type: 'nuovoSet', team: 'home' })
expect(s.sp.set.home).toBe(1)
expect(s.sp.set.guest).toBe(0)
})
it('dovrebbe azzerare i punti', () => {
state.sp.punt.home = 25
state.sp.punt.guest = 10
const s = applyAction(state, { type: 'nuovoSet', team: 'home' })
expect(s.sp.punt.home).toBe(0)
expect(s.sp.punt.guest).toBe(0)
})
it('dovrebbe aggiungere un nuovo set vuoto alla striscia', () => {
const s = applyAction(state, { type: 'nuovoSet', team: 'home' })
expect(s.sp.striscia).toHaveLength(2)
expect(s.sp.striscia.at(-1).ris).toBe('')
expect(s.sp.striscia.at(-1).serv).toBe('h')
})
it('dovrebbe conservare il set precedente nella striscia', () => {
state.sp.striscia[0].ris = 'hgh'
const s = applyAction(state, { type: 'nuovoSet', team: 'home' })
expect(s.sp.striscia[0].ris).toBe('hgh')
})
it('dovrebbe resettare le formazioni', () => {
state.sp.form.home = ['7', '8', '9', '10', '11', '12']
state.sp.form.guest = ['7', '8', '9', '10', '11', '12']
const s = applyAction(state, { type: 'nuovoSet', team: 'home' })
expect(s.sp.form.home).toEqual(['1', '2', '3', '4', '5', '6'])
expect(s.sp.form.guest).toEqual(['1', '2', '3', '4', '5', '6'])
})
it('dovrebbe ignorare team non valido', () => {
const s = applyAction(state, { type: 'nuovoSet', team: 'invalid' })
expect(s.sp.set.home).toBe(0)
expect(s.sp.set.guest).toBe(0)
})
})
// =============================================
// CAMBIO PALLA (cambiaPalla)
// =============================================
@@ -660,11 +623,18 @@ describe('Game Logic (gameState.js)', () => {
expect(s.sp.form.guest).toEqual(["1", "2", "3", "4", "5", "6"])
})
it('dovrebbe resettare la striscia a un set vuoto', () => {
state.sp.striscia = [{ serv: 'h', ris: 'hgh' }, { serv: 'h', ris: 'g' }]
it('dovrebbe resettare la striscia', () => {
state.sp.striscia = { home: [0, 1, 2, 3], guest: [" ", " ", " ", 1] }
const s = applyAction(state, { type: 'resetta' })
expect(s.sp.striscia).toHaveLength(1)
expect(s.sp.striscia[0].ris).toBe('')
// servHome è true di default → home parte con [0], guest con [" "]
expect(s.sp.striscia.home).toEqual([0])
expect(s.sp.striscia.guest).toEqual([" "])
})
it('dovrebbe resettare lo storico servizio', () => {
state.sp.storicoServizio = [{ servHome: true, cambioPalla: false }]
const s = applyAction(state, { type: 'resetta' })
expect(s.sp.storicoServizio).toEqual([])
})
it('dovrebbe impostare visuForm a false', () => {
@@ -692,4 +662,278 @@ describe('Game Logic (gameState.js)', () => {
expect(s.sp.punt.guest).toBe(0)
})
})
// =============================================
// FORMAZIONEINIZIOSET
// =============================================
describe('formInizioSet', () => {
it('dovrebbe esistere nello stato iniziale con valori di default', () => {
expect(state.sp.formInizioSet.home).toEqual(["1", "2", "3", "4", "5", "6"])
expect(state.sp.formInizioSet.guest).toEqual(["1", "2", "3", "4", "5", "6"])
})
it('setFormazione aggiorna sia form che formInizioSet per il team indicato', () => {
const nuova = ["10", "11", "12", "13", "14", "15"]
const s = applyAction(state, { type: 'setFormazione', team: 'home', form: nuova })
expect(s.sp.form.home).toEqual(nuova)
expect(s.sp.formInizioSet.home).toEqual(nuova)
})
it('setFormazione non tocca formInizioSet dell\'altro team', () => {
const nuova = ["10", "11", "12", "13", "14", "15"]
const s = applyAction(state, { type: 'setFormazione', team: 'home', form: nuova })
expect(s.sp.formInizioSet.guest).toEqual(["1", "2", "3", "4", "5", "6"])
})
})
// =============================================
// CONFERMASET
// =============================================
describe('confermaSet', () => {
// Helper: porta lo stato a fine set (home vince 25-0)
function stateConSetFinito(modalita = '3/5') {
let s = createInitialState()
s.modalitaPartita = modalita
// Aggiungiamo 25 punti a home: a 24-0 il prossimo punto vince il set
for (let i = 0; i < 25; i++) {
s = applyAction(s, { type: 'incPunt', team: 'home' })
}
// Ora setFinito dovrebbe essere impostato
return s
}
it('non fa nulla se setFinito è null', () => {
expect(state.sp.setFinito).toBeNull()
const s = applyAction(state, { type: 'confermaSet' })
expect(s.sp.strisce).toEqual([])
expect(s.sp.set.home).toBe(0)
})
it('aggiunge una entry in strisce con i campi corretti', () => {
const s = applyAction(stateConSetFinito(), { type: 'confermaSet' })
expect(s.sp.strisce).toHaveLength(1)
const striscia = s.sp.strisce[0]
expect(striscia).toHaveProperty('set')
expect(striscia).toHaveProperty('formInizio')
expect(striscia).toHaveProperty('home')
expect(striscia).toHaveProperty('guest')
expect(striscia).toHaveProperty('vincitore')
expect(striscia).toHaveProperty('punt')
})
it('il numero set è 1 per il primo set, 2 per il secondo', () => {
let s = stateConSetFinito()
s = applyAction(s, { type: 'confermaSet' })
expect(s.sp.strisce[0].set).toBe(1)
// Secondo set
for (let i = 0; i < 25; i++) {
s = applyAction(s, { type: 'incPunt', team: 'home' })
}
s = applyAction(s, { type: 'confermaSet' })
expect(s.sp.strisce[1].set).toBe(2)
})
it('formInizio nella striscia corrisponde a formInizioSet prima del conferma', () => {
const formazioneInizio = ["7", "8", "9", "10", "11", "12"]
let s = createInitialState()
s = applyAction(s, { type: 'setFormazione', team: 'home', form: formazioneInizio })
// porta a fine set
for (let i = 0; i < 25; i++) {
s = applyAction(s, { type: 'incPunt', team: 'home' })
}
s = applyAction(s, { type: 'confermaSet' })
expect(s.sp.strisce[0].formInizio.home).toEqual(formazioneInizio)
})
it('incrementa set[vincitore]', () => {
const s = applyAction(stateConSetFinito(), { type: 'confermaSet' })
expect(s.sp.set.home).toBe(1)
expect(s.sp.set.guest).toBe(0)
})
it('resetta punt a 0', () => {
const s = applyAction(stateConSetFinito(), { type: 'confermaSet' })
expect(s.sp.punt.home).toBe(0)
expect(s.sp.punt.guest).toBe(0)
})
it('svuota storicoServizio', () => {
const s = applyAction(stateConSetFinito(), { type: 'confermaSet' })
expect(s.sp.storicoServizio).toEqual([])
})
it('azzera setFinito', () => {
const s = applyAction(stateConSetFinito(), { type: 'confermaSet' })
expect(s.sp.setFinito).toBeNull()
})
it('aggiorna formInizioSet con la form corrente post-conferma', () => {
const preConferma = stateConSetFinito()
// La form potrebbe essere ruotata durante il set
const formDopoSet = [...preConferma.sp.form.home]
const s = applyAction(preConferma, { type: 'confermaSet' })
expect(s.sp.formInizioSet.home).toEqual(formDopoSet)
})
it('NON imposta partitaFinita se la partita non è ancora vinta (3/5)', () => {
const s = applyAction(stateConSetFinito('3/5'), { type: 'confermaSet' })
// 1 set vinto su 3 necessari → partita non finita
expect(s.sp.partitaFinita).toBeNull()
})
it('imposta partitaFinita quando home vince 3 set (modalità 3/5)', () => {
let s = createInitialState()
s.modalitaPartita = '3/5'
// Vinci 3 set
for (let set = 0; set < 3; set++) {
for (let i = 0; i < 25; i++) s = applyAction(s, { type: 'incPunt', team: 'home' })
s = applyAction(s, { type: 'confermaSet' })
}
expect(s.sp.partitaFinita).not.toBeNull()
expect(s.sp.partitaFinita.vincitore).toBe('home')
})
it('imposta partitaFinita quando home vince 2 set (modalità 2/3)', () => {
let s = createInitialState()
s.modalitaPartita = '2/3'
for (let set = 0; set < 2; set++) {
for (let i = 0; i < 25; i++) s = applyAction(s, { type: 'incPunt', team: 'home' })
s = applyAction(s, { type: 'confermaSet' })
}
expect(s.sp.partitaFinita).not.toBeNull()
expect(s.sp.partitaFinita.vincitore).toBe('home')
})
it('resetta striscia per il set successivo con 0 per chi serve', () => {
const s = applyAction(stateConSetFinito(), { type: 'confermaSet' })
// servHome era true (home segna per primo → resta home a servire)
expect(s.sp.striscia.home).toEqual([0])
expect(s.sp.striscia.guest).toEqual([" "])
})
})
// =============================================
// GUARDIE setFinito / partitaFinita
// =============================================
describe('Guardie setFinito e partitaFinita', () => {
it('incPunt non incrementa se setFinito è impostato', () => {
state.sp.setFinito = { vincitore: 'home' }
const s = applyAction(state, { type: 'incPunt', team: 'home' })
expect(s.sp.punt.home).toBe(0)
})
it('incPunt non incrementa se partitaFinita è impostata', () => {
state.sp.partitaFinita = { vincitore: 'home' }
const s = applyAction(state, { type: 'incPunt', team: 'guest' })
expect(s.sp.punt.guest).toBe(0)
})
it('decPunt azzera setFinito se era impostato', () => {
state.sp.setFinito = { vincitore: 'home' }
const s = applyAction(state, { type: 'decPunt' })
expect(s.sp.setFinito).toBeNull()
})
})
// =============================================
// RESETTA — nuovi campi
// =============================================
describe('resetta (nuovi campi)', () => {
it('azzera strisce', () => {
state.sp.strisce = [{ set: 1, vincitore: 'home', punt: { home: 25, guest: 20 } }]
const s = applyAction(state, { type: 'resetta' })
expect(s.sp.strisce).toEqual([])
})
it('azzera setFinito', () => {
state.sp.setFinito = { vincitore: 'home' }
const s = applyAction(state, { type: 'resetta' })
expect(s.sp.setFinito).toBeNull()
})
it('azzera partitaFinita', () => {
state.sp.partitaFinita = { vincitore: 'guest' }
const s = applyAction(state, { type: 'resetta' })
expect(s.sp.partitaFinita).toBeNull()
})
it('reimposta formInizioSet ai valori di default', () => {
state.sp.formInizioSet = { home: ["7", "8", "9", "10", "11", "12"], guest: ["7", "8", "9", "10", "11", "12"] }
const s = applyAction(state, { type: 'resetta' })
expect(s.sp.formInizioSet.home).toEqual(["1", "2", "3", "4", "5", "6"])
expect(s.sp.formInizioSet.guest).toEqual(["1", "2", "3", "4", "5", "6"])
})
})
// =============================================
// checkVittoriaPartita
// =============================================
describe('checkVittoriaPartita', () => {
it('ritorna null se nessuno ha vinto (3/5, 1-1)', () => {
state.sp.set.home = 1
state.sp.set.guest = 1
expect(checkVittoriaPartita(state)).toBeNull()
})
it('ritorna "home" con 3 set in modalità 3/5', () => {
state.modalitaPartita = '3/5'
state.sp.set.home = 3
state.sp.set.guest = 1
expect(checkVittoriaPartita(state)).toBe('home')
})
it('ritorna "guest" con 3 set in modalità 3/5', () => {
state.modalitaPartita = '3/5'
state.sp.set.home = 0
state.sp.set.guest = 3
expect(checkVittoriaPartita(state)).toBe('guest')
})
it('ritorna null con 2 set in modalità 3/5 (non ancora vinto)', () => {
state.modalitaPartita = '3/5'
state.sp.set.home = 2
state.sp.set.guest = 2
expect(checkVittoriaPartita(state)).toBeNull()
})
it('ritorna "home" con 2 set in modalità 2/3', () => {
state.modalitaPartita = '2/3'
state.sp.set.home = 2
state.sp.set.guest = 0
expect(checkVittoriaPartita(state)).toBe('home')
})
it('ritorna "guest" con 2 set in modalità 2/3', () => {
state.modalitaPartita = '2/3'
state.sp.set.home = 1
state.sp.set.guest = 2
expect(checkVittoriaPartita(state)).toBe('guest')
})
it('ritorna null con 1 set in modalità 2/3 (non ancora vinto)', () => {
state.modalitaPartita = '2/3'
state.sp.set.home = 1
state.sp.set.guest = 0
expect(checkVittoriaPartita(state)).toBeNull()
})
})
// =============================================
// confermaSet con servHome=false
// =============================================
describe('confermaSet — striscia con servHome=false', () => {
it('resetta striscia con guest a [0] se è guest a servire', () => {
let s = createInitialState()
// guest serve
s = applyAction(s, { type: 'cambiaPalla' })
expect(s.sp.servHome).toBe(false)
// porta a fine set (guest segna 25 volte)
for (let i = 0; i < 25; i++) s = applyAction(s, { type: 'incPunt', team: 'guest' })
s = applyAction(s, { type: 'confermaSet' })
// dopo il set, continua a servire guest
expect(s.sp.striscia.guest).toEqual([0])
expect(s.sp.striscia.home).toEqual([" "])
})
})
})
+22 -11
View File
@@ -102,44 +102,55 @@ describe('Server Utils', () => {
// printServerInfo
// =============================================
describe('printServerInfo', () => {
it('dovrebbe stampare la porta di default (3000)', () => {
it('dovrebbe stampare le porte corrette (default)', () => {
os.networkInterfaces.mockReturnValue({})
const consoleSpy = vi.spyOn(console, 'log').mockImplementation(() => {})
printServerInfo()
const allLogs = consoleSpy.mock.calls.map(c => c[0]).join('\n')
expect(allLogs).toContain('3000')
expect(allLogs).toContain('/display')
expect(allLogs).toContain('/controller')
expect(allLogs).toContain('5173')
expect(allLogs).toContain('3001')
expect(allLogs).toContain('3002')
consoleSpy.mockRestore()
})
it('dovrebbe stampare la porta personalizzata', () => {
it('dovrebbe stampare le porte personalizzate', () => {
os.networkInterfaces.mockReturnValue({})
const consoleSpy = vi.spyOn(console, 'log').mockImplementation(() => {})
printServerInfo(8080)
printServerInfo(3000, 4000)
const allLogs = consoleSpy.mock.calls.map(c => c[0]).join('\n')
expect(allLogs).toContain('8080')
expect(allLogs).toContain('3000')
expect(allLogs).toContain('4000')
consoleSpy.mockRestore()
})
it('dovrebbe mostrare gli URL remoti se ci sono IP di rete', () => {
it('dovrebbe stampare storicoPort personalizzato', () => {
os.networkInterfaces.mockReturnValue({})
const consoleSpy = vi.spyOn(console, 'log').mockImplementation(() => {})
printServerInfo(3000, 3001, 5000)
const allLogs = consoleSpy.mock.calls.map(c => c[0]).join('\n')
expect(allLogs).toContain('5000')
consoleSpy.mockRestore()
})
it('dovrebbe mostrare gli URL remoti per controller e storico', () => {
os.networkInterfaces.mockReturnValue({
eth0: [
{ family: 'IPv4', internal: false, address: '192.168.1.50' }
]
})
const consoleSpy = vi.spyOn(console, 'log').mockImplementation(() => {})
printServerInfo(3000)
printServerInfo(3000, 3001, 3002)
const allLogs = consoleSpy.mock.calls.map(c => c[0]).join('\n')
expect(allLogs).toContain('192.168.1.50')
expect(allLogs).toContain('remoti')
expect(allLogs).toContain('3001')
expect(allLogs).toContain('3002')
consoleSpy.mockRestore()
})
it('non dovrebbe mostrare sezione remoti se nessun IP di rete', () => {
os.networkInterfaces.mockReturnValue({})
const consoleSpy = vi.spyOn(console, 'log').mockImplementation(() => {})
printServerInfo(3000)
printServerInfo(3000, 3001)
const allLogs = consoleSpy.mock.calls.map(c => c[0]).join('\n')
expect(allLogs).not.toContain('remoti')
consoleSpy.mockRestore()
+173 -10
View File
@@ -1,24 +1,36 @@
import { WebSocketServer } from 'ws'
import { createServer as createHttpServer, request as httpRequest } from 'http'
import { readFile } from 'fs'
import { join, dirname } from 'path'
import { fileURLToPath } from 'url'
import { setupWebSocketHandler } from './src/websocket-handler.js'
import { printServerInfo } from './src/server-utils.js'
import { loadState, saveState } from './src/persist.js'
import { getPartite, getPartita } from './src/db.js'
const __dirname = dirname(fileURLToPath(import.meta.url))
const CONTROLLER_PORT = 3001
const STORICO_PORT = process.env.STORICO_PORT || 3002
const DEV_PROXY_HOST = process.env.DEV_PROXY_HOST || '127.0.0.1'
/**
* Plugin Vite che integra un server WebSocket per la gestione dello stato di gioco
* e un server separato sulla porta 3001 per il controller.
* @returns {import('vite').Plugin}
*/
export default function websocketPlugin() {
return {
name: 'vite-plugin-websocket',
configureServer(server) {
// Inizializza un server WebSocket collegato al server HTTP di Vite.
const wss = new WebSocketServer({ noServer: true })
setupWebSocketHandler(wss, { initialState: loadState(), onStateChange: saveState })
// Rewrite /display → / (index.html) e /controller → /controller.html
server.middlewares.use((req, _res, next) => {
if (req.url === '/display' || req.url === '/display/') req.url = '/'
else if (req.url === '/controller' || req.url === '/controller/') req.url = '/controller.html'
next()
})
// Registra i gestori WebSocket con la logica di gioco.
setupWebSocketHandler(wss)
// Intercetta le richieste di upgrade WebSocket solo sul path /ws.
server.httpServer.on('upgrade', (request, socket, head) => {
const pathname = new URL(request.url, `http://${request.headers.host}`).pathname
if (pathname === '/ws') {
wss.handleUpgrade(request, socket, head, (ws) => {
wss.emit('connection', ws, request)
@@ -26,10 +38,161 @@ export default function websocketPlugin() {
}
})
// Avvia un server separato per il controller sulla porta 3001.
server.httpServer.once('listening', () => {
const { port } = server.httpServer.address()
setTimeout(() => printServerInfo(port), 100)
const viteAddr = server.httpServer.address()
const vitePort = viteAddr.port
startControllerDevServer(vitePort, wss)
startStoricoDevServer()
setTimeout(() => printServerInfo(vitePort, CONTROLLER_PORT, STORICO_PORT), 100)
})
}
}
}
/**
* Avvia il server di sviluppo per il controller.
* Fa da proxy verso il dev server di Vite per moduli ES, HMR, e asset.
*/
function startControllerDevServer(vitePort, wss) {
const controllerServer = createHttpServer((req, res) => {
// Se richiesta alla root, riscrive verso controller.html
let targetPath = req.url
if (targetPath === '/' || targetPath === '') {
targetPath = '/controller.html'
}
// Proxy verso il dev server di Vite
const proxyReq = httpRequest(
{
hostname: DEV_PROXY_HOST,
port: vitePort,
path: targetPath,
method: req.method,
headers: {
...req.headers,
host: `${DEV_PROXY_HOST}:${vitePort}`,
},
},
(proxyRes) => {
res.writeHead(proxyRes.statusCode, proxyRes.headers)
proxyRes.pipe(res, { end: true })
}
)
proxyReq.on('error', (err) => {
console.error('[Controller Proxy] Error:', err.message)
if (!res.headersSent) {
res.writeHead(502)
res.end('Proxy error')
}
})
req.pipe(proxyReq, { end: true })
})
// Gestisce l'upgrade WebSocket anche sulla porta del controller
controllerServer.on('upgrade', (request, socket, head) => {
const pathname = new URL(request.url, `http://${request.headers.host}`).pathname
if (pathname === '/ws') {
wss.handleUpgrade(request, socket, head, (ws) => {
wss.emit('connection', ws, request)
})
} else {
// Per l'HMR di Vite, proxare l'upgrade WebSocket verso Vite
const proxyReq = httpRequest({
hostname: DEV_PROXY_HOST,
port: vitePort,
path: request.url,
method: 'GET',
headers: request.headers,
})
proxyReq.on('upgrade', (proxyRes, proxySocket, proxyHead) => {
socket.write(
`HTTP/1.1 101 Switching Protocols\r\n` +
Object.entries(proxyRes.headers)
.map(([k, v]) => `${k}: ${v}`)
.join('\r\n') +
'\r\n\r\n'
)
proxySocket.pipe(socket)
socket.pipe(proxySocket)
})
proxyReq.on('error', (err) => {
console.error('[Controller Proxy] WS upgrade error:', err.message)
socket.destroy()
})
proxyReq.end()
}
})
controllerServer.listen(CONTROLLER_PORT, '0.0.0.0', () => {
console.log(`[Controller] Dev server running on port ${CONTROLLER_PORT}`)
})
}
/**
* Avvia il server di sviluppo per lo storico sulla porta 3002.
* Serve storico.html e gli endpoint /api/partite.
*/
function startStoricoDevServer() {
const storicoServer = createHttpServer((req, res) => {
const url = new URL(req.url, `http://${req.headers.host}`)
const pathname = url.pathname
if (pathname === '/api/partite') {
try {
res.writeHead(200, { 'Content-Type': 'application/json' })
res.end(JSON.stringify(getPartite()))
} catch (err) {
res.writeHead(500, { 'Content-Type': 'application/json' })
res.end(JSON.stringify({ error: err.message }))
}
return
}
const matchId = pathname.match(/^\/api\/partite\/(\d+)$/)
if (matchId) {
try {
const p = getPartita(Number(matchId[1]))
if (!p) {
res.writeHead(404, { 'Content-Type': 'application/json' })
res.end(JSON.stringify({ error: 'Not found' }))
} else {
res.writeHead(200, { 'Content-Type': 'application/json' })
res.end(JSON.stringify(p))
}
} catch (err) {
res.writeHead(500, { 'Content-Type': 'application/json' })
res.end(JSON.stringify({ error: err.message }))
}
return
}
if (pathname === '/' || pathname === '') {
readFile(join(__dirname, 'storico.html'), (err, data) => {
if (err) {
res.writeHead(500)
res.end('Error loading storico.html')
} else {
res.writeHead(200, { 'Content-Type': 'text/html' })
res.end(data)
}
})
return
}
res.writeHead(404)
res.end('Not found')
})
storicoServer.listen(STORICO_PORT, '0.0.0.0', () => {
console.log(`[Storico] http://localhost:${STORICO_PORT}`)
})
}