Aggiorna dipendenze e Node.js 20 con fix permessi dist

- Aggiorna Vite: 4.3.9 → 5.4.10
- Aggiorna Vue: 3.2.47 → 3.4.38
- Aggiorna @vitejs/plugin-vue: 4.1.0 → 5.1.4
- Aggiorna vite-plugin-pwa: 0.16.0 → 0.20.5
- Aggiorna Capacitor: 6.0.0 → 6.2.0
- Aggiorna wave-ui: 3.3.0 → 3.17.0
- Aggiorna Node.js nel Dockerfile: 18.x → 20.x (LTS)
- Aggiunge fix automatico permessi dist dopo build Docker

.gitignore

@@ -11,7 +11,8 @@ lerna-debug.log*
 currentCommit.txt
 
 node_modules
-dist
+dist/*
+!dist/android/
 dist-ssr
 *.local
 
@@ -26,12 +27,13 @@ dist-ssr
 *.sln
 *.sw?
 
-# Playwright
+# Capacitor
-/test-results/
+android/
-/playwright-report/
+ios/
-/blob-report/
+.capacitor/
-/playwright/.cache/
-/playwright/.auth/
 
-# Vitest
+# Build output
-coverage/
+output/
+*.apk
+!dist/android/*.apk
+*.aab

CHANGELOG.md

@@ -1,282 +0,0 @@
-# Changelog
-
-Tutte le modifiche significative a questo progetto sono documentate in questo file.
-
-Il formato si basa su [Keep a Changelog](https://keepachangelog.com/it/1.0.0/),
-e questo progetto aderisce al [Versionamento Semantico](https://semver.org/lang/it/).
-
----
-
-## [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.
-
-### Funzionalità Principali
-
-#### Gestione Partite e Punteggi
-- **Tracciamento punti in tempo reale** per entrambe le squadre (casa e ospite)
-- **Conteggio automatico dei set** con supporto per modalità al meglio di 3 o al meglio di 5
-- **Logica regolamentare completa**:
-  - Set regolari: primo a 25 punti con almeno 2 di vantaggio
-  - Set decisivo (tie-break): primo a 15 punti con almeno 2 di vantaggio
-  - Blocco automatico assegnazione punti al raggiungimento della vittoria
-- **Indicatore visivo del servizio** per identificare quale squadra è al servizio
-- **Cronologia punti** con striscia visiva per seguire l'andamento della partita
-- Possibilità di **incrementare e decrementare punti** e **set**
-- **Annullamento punti** con ripristino automatico del servizio precedente
-
-#### Formazioni e Rotazioni
-- **Visualizzazione interattiva** della formazione in campo con 6 giocatori per squadra
-- **Rotazione automatica regolamentare** quando la squadra conquista il servizio (cambio palla)
-- **Configurazione manuale dei numeri di maglia** per ogni giocatore
-- **Sistema di cambi giocatori**:
-  - Dialog dedicato per effettuare i cambi
-  - Supporto per cambi singoli o multipli
-  - Tabella IN/OUT con validazione degli input
-  - Verifica che i numeri di maglia siano numerici
-  - Scorciatoie da tastiera dedicate per squadra casa e ospite
-- **Limitazione cambio palla manuale** solo a inizio set (0-0) per prevenire errori nella rotazione
-
-#### Interfaccia Utente e Personalizzazione
-- **Interfaccia fullscreen touch-friendly** ottimizzata per tablet e smartphone
-- **Layout responsive** con media queries per schermi piccoli (<768px)
-- **Modalità di visualizzazione**:
-  - Punteggio semplice
-  - Formazioni complete con posizioni giocatori
-  - Toggle tra le due modalità con scorciatoia da tastiera
-- **Personalizzazione squadre**:
-  - Configurazione dinamica dei nomi squadre
-  - Inversione layout orizzontale (scambio posizione casa/ospite)
-  - Configurazione numeri di maglia giocatori
-- **Controlli nascondibili**: possibilità di nascondere/mostrare barra pulsanti e cronologia
-- **Stabilizzazione UI**: dimensioni fisse per riquadri punteggio per evitare spostamenti durante gli aggiornamenti
-
-#### Controlli e Accessibilità
-- **Controlli da tastiera completi** con scorciatoie dedicate:
-  - **Squadra Casa**: `Ctrl + ↑/↓` (punti), `Ctrl + →` (set), `Ctrl + C` (cambi)
-  - **Squadra Ospite**: `Shift + ↑/↓` (punti), `Shift + →` (set), `Shift + C` (cambi)
-  - **Comandi globali**:
-    - `Ctrl + ←` (cambio palla, solo a 0-0)
-    - `Ctrl + M` (configurazione)
-    - `Ctrl + B` (toggle barra pulsanti)
-    - `Ctrl + F` (fullscreen)
-    - `Ctrl + S` (annuncio vocale)
-    - `Ctrl + Z` (switch visualizzazione)
-- **Sintesi vocale** per annunci punteggio in italiano usando Web Speech API
-- **Sistema di alert professionale** usando Wave UI per notifiche e conferme
-
-#### Progressive Web App (PWA)
-- **Installabile** come app nativa su smartphone, tablet e desktop
-- **Funzionamento offline completo** grazie ai Service Worker
-- **Auto-update automatico** per ricevere nuovi aggiornamenti senza reinstallazione
-- **Display fullscreen** per massimizzare lo spazio visivo
-- **Orientamento landscape ottimizzato** per utilizzo su tablet
-- **Orientamento sensor landscape** con supporto rotazione 180°
-- **Icone PWA personalizzate** (192x192 e 512x512)
-- **Prevenzione scroll indesiderato** su mobile (overscroll-behavior)
-- **Supporto 100dvh** e position:fixed per layout mobile stabile
-- **Blocco scroll** per evitare ricariche accidentali con swipe-down
-
-#### Build e Deployment
-- **Build APK Android** tramite Capacitor per distribuzione nativa
-- **Setup automatico icone Android** con script dedicato per multi-densità (ldpi, mdpi, hdpi, xhdpi, xxhdpi, xxxhdpi)
-- **Configurazione Capacitor** ottimizzata per landscape senza splash screen
-- **Output unificato** in `/dist/android` per build Android
-- **Base path configurabile** (`/segnap`) per deployment su sottocartelle
-
-### Tecnologie e Dipendenze
-
-#### Stack Tecnologico
-- **Vue 3.4.38** - Framework JavaScript reattivo
-- **Vite 5.4.10** - Build tool e dev server veloce
-- **Wave UI 3.17.0** - Libreria UI components per alert e dialogs
-- **NoSleep.js 0.12.0** - Prevenzione standby durante le partite
-- **vite-plugin-pwa 0.20.5** - Plugin per generazione PWA
-- **Capacitor 6.2.0** - Framework per build app native Android/iOS
-
-#### Ambiente di Sviluppo
-- **Node.js 20.x LTS** (consigliato v20.2.0)
-- **npm 9.0.0+** per gestione dipendenze
-- **NVM support** per gestione versioni Node.js
-- **Hot Module Replacement (HMR)** in modalità sviluppo
-- **Source maps** per debugging
-- **Vue DevTools** supportato
-
-#### Browser Supportati
-- **Chrome/Chromium 90+** - Supporto completo (consigliato)
-- **Firefox 88+** - Supporto completo
-
-### Build e Comandi
-
-#### Comandi Disponibili
-- `npm run dev` - Server di sviluppo con hot-reload su http://localhost:5173
-- `npm run build` - Build di produzione ottimizzata in `/dist`
-- `npm run preview` - Anteprima locale della build di produzione
-
-#### Output Build
-- File statici ottimizzati e minificati
-- Service Worker generato automaticamente
-- PWA manifest configurato
-- Assets con hash per cache busting
-- Permessi automatici per cartella dist in ambiente Docker
-
-### Documentazione
-- **README.md completo** con:
-  - Panoramica funzionalità
-  - Requisiti di sistema dettagliati
-  - Istruzioni di installazione e setup con NVM
-  - Guida ai comandi per sviluppo e build
-  - Tabella completa shortcuts tastiera
-  - Configurazione PWA documentata
-  - Spiegazione logica regolamentare pallavolo
-  - Browser testati e supportati
-- **Encoding corretto** per caratteri accentati italiani
-
-### Miglioramenti Architetturali
-- **Separazione componenti**: HomePage estratta in componente dedicato
-- **Rimozione codice legacy**: eliminati file non utilizzati (HelloWorld.vue)
-- **Refactoring CSS**: file style.css organizzato e ottimizzato
-- **Gestione servizio migliorata**: variabile booleana `servHome` per gestione cambio servizio
-- **Validazione input**: controlli su numeri di maglia e cambi giocatori
-- **Gestione errori**: prevenzione incrementi a set concluso senza notifiche spam
-
-### Note di Sviluppo
-- **Orientamento sensor landscape**: permette rotazione 180° del dispositivo
-- **Fix tentati audio mobile**: implementati ma richiedono ancora debug (WIP)
-  - Aggiunto supporto @capacitor-community/text-to-speech per audio nativo
-  - Implementato fallback Web API su desktop, plugin nativo su mobile
-  - Correzione lingua da 'it_IT' a 'it-IT'
-- **Java 17 → 21**: aggiornamento per compatibilità plugin TTS
-- **ImageMagick in Dockerfile**: per generazione automatica icone Android
-
-### Configurazione
-- **Base path**: `/segnap` (configurabile in vite.config.js)
-- **Tema PWA**: background `#eee`, theme color `#ffffff`
-- **Display**: fullscreen landscape
-- **Manifest name**: app_segnap
-- **Short name**: segnap
-
----
-
-## Architettura e Funzionamento Interno
-
-### Come Funziona l'Applicazione Web
-
-L'applicazione è una **Single Page Application (SPA)** completamente **client-side**:
-
-- **Server**: Serve solo file statici (nessun backend, nessun database)
-- **Esecuzione**: Tutto gira nel browser dell'utente
-- **Stato**: Memorizzato solo nella RAM del browser (si perde al refresh)
-- **Offline**: Funziona completamente offline dopo la prima visita (Service Worker)
-
-#### Build e Deployment
-
-```bash
-npm run build
-```
-
-1. Vite compila il codice Vue/JavaScript
-2. Ottimizza e minifica JavaScript e CSS
-3. Genera Service Worker e manifest PWA
-4. Output in `/dist` con file statici pronti
-
-**Deploy**: Copia `/dist` su web server statico (nginx, Apache, Vercel, Netlify). Non serve Node.js, PHP o database sul server.
-
-#### Funzionamento Runtime
-
-**Prima visita:**
-1. Browser scarica index.html dal server
-2. Carica bundle JavaScript e CSS
-3. Vue.js inizializza l'applicazione
-4. Service Worker cachea tutti gli asset
-5. App pronta (nessuna ulteriore chiamata al server)
-
-**Visite successive:**
-1. Service Worker serve i file dalla cache locale
-2. App si avvia istantaneamente anche senza internet
-3. In background verifica se esistono aggiornamenti
-4. Aggiornamenti applicati al prossimo refresh
-
-#### Gestione Stato
-
-Tutto lo stato della partita vive nella memoria del browser:
-
-```javascript
-data() {
-  return {
-    sp: {
-      punt: { home: 0, guest: 0 },
-      set: { home: 0, guest: 0 },
-      servHome: true,
-      form: { home: ["1","2","3","4","5","6"], guest: ["1","2","3","4","5","6"] }
-    }
-  }
-}
-```
-
-**Limitazioni:**
-- Refresh della pagina azzera tutto lo stato
-- Nessuna sincronizzazione tra dispositivi
-- Nessuno storico partite
-
-**Vantaggi:**
-- Privacy totale (nessun dato esce dal dispositivo)
-- Velocità massima (nessuna latenza di rete)
-- Funzionamento offline completo
-
-**Possibili evoluzioni:**
-- Persistenza con localStorage
-- Backend con database per multi-dispositivo
-- WebSocket per sincronizzazione real-time
-
-### Note Tecniche
-
-**Problemi noti:**
-- Audio mobile: sintesi vocale non funziona su alcuni dispositivi Android
-- Persistenza: lo stato si perde al refresh della pagina
-- Codice legacy: presenza di file HomePage duplicati
-
-**Architettura futura:**
-- Stato centralizzato con Pinia/Vuex
-- Architettura client-server con WebSocket per display remoto
-- Persistenza con localStorage o database
-- Testing con Vitest e Cypress
-
----
-
-## Informazioni sul Progetto
-
-**Nome progetto**: Segnapunti Anto
-**Descrizione**: Applicazione web PWA per tracciare i punteggi di partite di pallavolo in tempo reale
-**Sviluppato per**: Team Antoniana
-**Licenza**: Privata
-**Repository**: https://github.com/[username]/segnapunti
-
----
-
-### Come Leggere Questo Changelog
-
-- **Funzionalità Principali**: nuove caratteristiche aggiunte all'applicazione
-- **Tecnologie e Dipendenze**: stack tecnologico e versioni utilizzate
-- **Build e Comandi**: istruzioni per compilare ed eseguire il progetto
-- **Documentazione**: miglioramenti alla documentazione utente e sviluppatore
-- **Miglioramenti Architetturali**: refactoring e ottimizzazioni del codice
-- **Note di Sviluppo**: work in progress e problemi noti
-
----
-
-### Supporto e Contributi
-
-Per segnalare bug o richiedere funzionalità, aprire una issue nel repository del progetto.
-
-Per contribuire al progetto:
-1. Fork del repository
-2. Creare un branch per la feature (`git checkout -b feature/nome-feature`)
-3. Commit delle modifiche (`git commit -m 'Aggiunge nome-feature'`)
-4. Push al branch (`git push origin feature/nome-feature`)
-5. Aprire una Pull Request
-
----
-
-**Data primo commit**: 2024
-**Data rilascio 1.0.0**: 2026-02-10

Dockerfile

@@ -1,18 +1,83 @@
-FROM node:20-alpine AS builder
+# Dockerfile per build APK Android con Capacitor
+FROM ubuntu:22.04
 
-WORKDIR /usr/src/app
+# Evita prompt interattivi
-# Copia tutto
+ENV DEBIAN_FRONTEND=noninteractive
+
+# Installa dipendenze base
+RUN apt-get update && apt-get install -y \
+    curl \
+    git \
+    unzip \
+    wget \
+    openjdk-21-jdk \
+    build-essential \
+    imagemagick \
+    && rm -rf /var/lib/apt/lists/*
+
+# Installa Node.js 20.x (LTS)
+RUN curl -fsSL https://deb.nodesource.com/setup_20.x | bash - \
+    && apt-get install -y nodejs
+
+# Installa Gradle 8.5
+ENV GRADLE_VERSION=8.5
+RUN wget https://services.gradle.org/distributions/gradle-${GRADLE_VERSION}-bin.zip -P /tmp \
+    && unzip -d /opt/gradle /tmp/gradle-${GRADLE_VERSION}-bin.zip \
+    && ln -s /opt/gradle/gradle-${GRADLE_VERSION}/bin/gradle /usr/bin/gradle \
+    && rm /tmp/gradle-${GRADLE_VERSION}-bin.zip
+
+# Installa Android SDK
+ENV ANDROID_SDK_ROOT=/opt/android-sdk
+ENV ANDROID_HOME=${ANDROID_SDK_ROOT}
+ENV PATH=${PATH}:${ANDROID_SDK_ROOT}/cmdline-tools/latest/bin:${ANDROID_SDK_ROOT}/platform-tools
+
+RUN mkdir -p ${ANDROID_SDK_ROOT}/cmdline-tools \
+    && wget https://dl.google.com/android/repository/commandlinetools-linux-9477386_latest.zip -P /tmp \
+    && unzip -d ${ANDROID_SDK_ROOT}/cmdline-tools /tmp/commandlinetools-linux-9477386_latest.zip \
+    && mv ${ANDROID_SDK_ROOT}/cmdline-tools/cmdline-tools ${ANDROID_SDK_ROOT}/cmdline-tools/latest \
+    && rm /tmp/commandlinetools-linux-9477386_latest.zip
+
+# Accetta licenze Android SDK
+RUN yes | sdkmanager --licenses || true
+
+# Installa componenti Android necessari
+RUN sdkmanager "platform-tools" \
+    "platforms;android-34" \
+    "build-tools;34.0.0" \
+    "extras;google;google_play_services" \
+    "extras;android;m2repository" \
+    "extras;google;m2repository"
+
+# Imposta JAVA_HOME in base all'architettura
+RUN ARCH=$(dpkg --print-architecture) && \
+    echo "export JAVA_HOME=/usr/lib/jvm/java-21-openjdk-${ARCH}" >> /etc/profile && \
+    ln -sf /usr/lib/jvm/java-21-openjdk-${ARCH} /usr/lib/jvm/default-java
+
+ENV JAVA_HOME=/usr/lib/jvm/default-java
+
+# Directory di lavoro
+WORKDIR /app
+
+# Copia package files per cache layer
+COPY package*.json ./
+
+# Installa dipendenze npm
+RUN npm ci --legacy-peer-deps || npm install --legacy-peer-deps
+
+# Copia il resto del progetto
 COPY . .
 
-# Aggiunge GIT ma serve solo se si vuole evidenziare un hash del commit 
+# Build script
-RUN apk add git
+CMD ["bash", "-c", "\
-
+  npm install --legacy-peer-deps && \
-# aggiunge l'ultima versione di node
+  npm run build && \
-RUN npm install -g npm@latest
+  npx cap add android && \
-# Installa tutte le dipendenze del progetto
+  npx cap sync && \
-RUN npm install
+  sed -i 's/android:configChanges=\"\\([^\"]*\\)\"/android:configChanges=\"\\1\" android:screenOrientation=\"sensorLandscape\"/g' android/app/src/main/AndroidManifest.xml && \
-
+  bash setup-android-icons.sh && \
-# Qui fa partire il comando...
+  cd android && ./gradlew assembleDebug --no-daemon && \
-# Per adesso è dev perchè non ho capito bene il tutto... (Attilio)
+  mkdir -p /app/dist/android && \
-CMD ["npm", "run", "serve"]
+  cp app/build/outputs/apk/debug/app-debug.apk /app/dist/android/segnapunti-debug.apk && \
-
+  echo '' && \
+  echo 'APK generato: /app/dist/android/segnapunti-debug.apk'\
+"]

README.md

@@ -1,213 +1,437 @@
-# Segnapunti Anto
+# Segnapunti - Anto
 
-Applicazione web **fullstack real-time** per il tracciamento dei punteggi di partite di pallavolo, installabile come PWA.
+Un'applicazione web segnapunti per pallavolo con funzionalità di sintesi vocale, modalità formazione e supporto PWA (Progressive Web App).
 
----
+## Cos'è
 
-## Panoramica
+Segnapunti è un'applicazione standalone per tenere il punteggio durante le partite di pallavolo. L'applicazione è ottimizzata per dispositivi mobili in modalità landscape (orizzontale) e può essere installata come app nativa grazie al supporto PWA.
 
-**Segnapunti Anto** è un'applicazione fullstack per il tracciamento del punteggio durante partite di pallavolo, ottimizzata per tablet e smartphone in contesto sportivo.
+### Caratteristiche principali
 
-### Architettura
+- **Segnapunti digitale**: Visualizzazione chiara del punteggio per le due squadre (Home e Guest)
+- **Contatore set**: Traccia i set vinti da ciascuna squadra (fino a 3 set)
+- **Indicatore battuta**: Mostra quale squadra ha il servizio
+- **Modalità formazione**: Visualizza la rotazione dei giocatori in campo (posizioni 1-6)
+- **Sintesi vocale**: Annuncia il punteggio in italiano
+- **PWA**: Installabile come app standalone con funzionamento offline
+- **Controllo da tastiera**: Scorciatoie per gestire rapidamente il punteggio
+- **No Sleep**: Impedisce allo schermo di spegnersi durante l'uso
+- **Fullscreen automatico**: Su dispositivi mobili si avvia a schermo intero
 
-Il sistema è composto da un **backend Node.js/Express** e due interfacce web separate:
+## Come funziona
 
-| Interfaccia | Porta | Ruolo |
+### Interfaccia
-|-------------|-------|-------|
-| **Display** | 3000 | Tabellone pubblico — mostra punteggi, formazioni e storico |
-| **Controller** | 3001 | Pannello operatore — invia azioni e gestisce la partita |
 
-Le due interfacce comunicano tramite **WebSocket** (`/ws`): ogni azione del Controller viene elaborata dal server e trasmessa in broadcast a tutti i client connessi.
+L'applicazione divide lo schermo in due metà:
 
-La logica di gioco risiede interamente **lato server** (`gameState.js`), con aggiornamenti di stato immutabili. Il frontend Vue 3 è puramente reattivo: riceve lo stato e lo visualizza senza gestirne la consistenza.
+- **Metà sinistra (gialla su sfondo nero)**: Squadra Home - Antoniana
+- **Metà destra (bianca su sfondo blu)**: Squadra Guest
 
-In produzione, entrambi i server sono gestiti da un unico processo Node.js (`server.js`) e l'intera applicazione è containerizzabile via Docker. Il frontend è installabile come **PWA** (service worker, manifest, modalità fullscreen landscape) per utilizzo kiosk su dispositivi sportivi.
+#### Visualizzazioni
 
----
+1. **Modalità Punteggio** (default):
+   - Mostra il punteggio corrente in caratteri molto grandi
+   - Cliccando sul punteggio si incrementa di 1
+   - Cliccando sul nome della squadra si decrementa di 1
 
-## Funzionalità
+2. **Modalità Formazione**:
+   - Mostra le posizioni dei giocatori in campo (1-6)
+   - La formazione ruota automaticamente quando si incrementa il punteggio
+   - L'ordine visualizzato è: [3, 2, 1, 4, 5, 0] (ordine inverso rispetto alla rotazione standard)
 
-### Gestione partita in tempo reale
+#### Funzionalità
-- Tracciamento punti home/guest con indicatore di servizio
-- Gestione set e storico punti (striscia)
-- Blocco azioni quando il set è già vinto
 
-### Regole pallavolo integrate
+- **Reset**: Azzera punteggio e formazioni, mantiene i nomi delle squadre
-- Set normali: vittoria a 25 con almeno 2 punti di scarto
+- **Cambio servizio**: Toggle manuale del servizio tra le squadre
-- Set decisivo (5° set): vittoria a 15 con almeno 2 punti di scarto
+- **Configurazione nomi**: Dialog per modificare i nomi delle squadre
-- Modalità partita `2/3` o `3/5`
+- **Sintesi vocale**:
+  - Pronuncia il punteggio in italiano
+  - Se 0-0 dice "zero a zero"
+  - Se pari dice "[punteggio] pari"
+  - Altrimenti annuncia prima il punteggio della squadra al servizio
+- **Incremento set**: Click sul contatore set per aumentarlo (si azzera dopo 2)
 
-### Formazioni e cambi
+### Controlli da tastiera
-- Gestione formazione a 6 giocatori per squadra
-- Rotazione automatica al cambio palla
-- Dialog cambi con validazione `IN → OUT`
 
-### Controlli e personalizzazione
+- **Ctrl + M**: Apri dialog configurazione nomi
-- Configurazione nomi squadre
+- **Ctrl + B**: Mostra/nascondi barra pulsanti in basso
-- Inversione ordine di visualizzazione squadre
+- **Ctrl + F**: Attiva modalità fullscreen
-- Toggle punteggio/formazioni e visibilità striscia storico
+- **Ctrl + S**: Pronuncia il punteggio
-- Sintesi vocale del punteggio (Web Speech API)
+- **Ctrl + Z**: Alterna tra modalità punteggio e formazione
+- **Ctrl + ↑**: Incrementa punteggio Home
+- **Ctrl + ↓**: Decrementa punteggio Home
+- **Ctrl + →**: Incrementa set Home
+- **Shift + ↑**: Incrementa punteggio Guest
+- **Shift + ↓**: Decrementa punteggio Guest
+- **Shift + →**: Incrementa set Guest
+- **Ctrl + ←**: Cambia servizio
 
----
+### Comportamento su mobile
 
-## Requisiti
+Su dispositivi mobili l'applicazione:
+1. Attiva automaticamente NoSleep per impedire lo spegnimento dello schermo
+2. Si avvia in modalità fullscreen
+3. Esegue un test di sintesi vocale al caricamento
+4. Mostra il pulsante "Esci" per chiudere l'app
 
-### Ambiente di sviluppo
+## Stack tecnologico
 
-| Requisito | Versione minima | Consigliata |
+### Framework e librerie
-|-----------|-----------------|-------------|
-| **Node.js** | `>= 18.19.0` | `24 LTS` |
-| **npm** | `>= 9` | — |
-| **RAM** | 2 GB | 4 GB |
-| **OS** | Linux, macOS, Windows | — |
 
-### Test E2E
+- **Vue 3** (^3.2.47): Framework JavaScript progressivo per l'interfaccia utente
+- **Vite** (^4.3.9): Build tool moderno e veloce
+- **Wave UI** (^3.3.0): Libreria di componenti UI per Vue
+- **NoSleep.js** (^0.12.0): Previene lo spegnimento automatico dello schermo
+- **vite-plugin-pwa** (^0.16.0): Plugin per generare la PWA
 
-I test end-to-end richiedono i browser Playwright. Su Linux potrebbero essere necessarie dipendenze di sistema aggiuntive.
+### API Web utilizzate
 
+- **Web Speech API**: Per la sintesi vocale (Text-to-Speech)
+- **Fullscreen API**: Per la modalità schermo intero
+- **Service Worker**: Per il funzionamento offline (PWA)
+
+## Come svilupparlo
+
+### Prerequisiti
+
+- **Node.js** (versione 14 o superiore, raccomandata v20.2.0)
+- **npm** o **yarn**
+
+### Installazione
+
+1. Clona il repository:
+
+2. Installa le dipendenze:
 ```bash
-npx playwright install chromium firefox
-# Linux (con dipendenze di sistema):
-# npx playwright install --with-deps chromium firefox
-```
-
-### Requisiti browser (utente finale)
-
-| API | Utilizzo | Necessità |
-|-----|----------|-----------|
-| JavaScript ES6+ | Moduli, async/await | Obbligatorio |
-| WebSocket | Sincronizzazione stato live | Obbligatorio |
-| Service Worker | Supporto PWA offline | Consigliato |
-| Web Speech API | Annunci vocali punteggio | Opzionale |
-
-**Browser testati:** Chrome/Chromium, Firefox, Mobile Chrome (Playwright Pixel 5).
-
----
-
-## Installazione
-
-```bash
-git clone https://santantonio.sytes.net/attilio/segnapunti.git
-cd segnapunti
 npm install
 ```
 
----
+### Comandi di sviluppo
 
-## Sviluppo
+#### Avviare il server di sviluppo
+```bash
+npm run dev
+```
+Questo comando avvia Vite in modalità development. L'applicazione sarà disponibile su `http://localhost:5173` (o altra porta se già occupata).
 
-### Dev server
+#### Build per produzione
+```bash
+npm run build
+```
+Genera i file ottimizzati per la produzione nella cartella `dist/`. Include:
+- Minificazione del codice
+- Tree-shaking per rimuovere codice non utilizzato
+- Generazione del Service Worker per la PWA
+- Generazione del manifest per l'installazione
 
+#### Anteprima build di produzione
+```bash
+npm run preview
+```
+Avvia un server locale per testare la build di produzione.
+
+La configurazione PWA si trova in [vite.config.js](vite.config.js:10-32):
+
+- **Display**: fullscreen
+- **Orientamento**: landscape (orizzontale)
+- **Colore tema**: bianco
+- **Base path**: `/segnap` in produzione, `/` in sviluppo
+
+### Modifiche comuni
+
+#### Cambiare i colori delle squadre
+
+Modifica il file [src/style.css](src/style.css:101-108):
+```css
+.home {
+  background-color: black;
+  color: yellow;
+}
+.guest {
+  background-color: blue;
+  color: white;
+}
+```
+
+#### Modificare i nomi predefiniti
+
+Nel file [src/components/HomePage.vue](src/components/HomePage.vue:20), modifica:
+```javascript
+nomi: { home: "Antoniana", guest: "Guest" }
+```
+
+#### Cambiare la voce della sintesi vocale
+
+Nel file [src/components/HomePage.vue](src/components/HomePage.vue:104), modifica:
+```javascript
+msg.voice = voices.find(voice => voice.name === 'Google italiano');
+```
+
+#### Modificare l'ordine di visualizzazione delle formazioni
+
+Nel template del componente [src/components/HomePage.vue](src/components/HomePage.vue:181), l'ordine di visualizzazione delle posizioni è controllato dall'array nell'attributo `v-for`. La sequenza `[3, 2, 1, 4, 5, 0]` rappresenta l'ordine in cui vengono mostrate le posizioni dei giocatori sulla griglia 2x3 del campo.
+
+Per modificare l'ordine di visualizzazione, modifica questo array:
+```vue
+<div class="formdiv" v-for="x in [3, 2, 1, 4, 5, 0]">
+  {{ sp.form.home[x] }}
+</div>
+```
+
+L'ordine attuale mostra le posizioni in questo schema:
+```
+3  2  1
+4  5  0
+```
+
+Dove 0 corrisponde alla posizione 1 nel pallavolo, 1 alla posizione 2, e così via.
+
+## Testing e Deploy
+
+### Testing su dispositivi mobili
+
+Per testare l'applicazione su dispositivi mobili nella stessa rete locale:
+
+1. Avvia il server di sviluppo:
 ```bash
 npm run dev
 ```
 
-Avvia il server Vite con hot reload:
+2. Vite mostrerà l'indirizzo locale e di rete. Se non viene mostrato, trova l'indirizzo IP del tuo computer:
-- `http://localhost:5173/` — Display
+```bash
-- `http://localhost:5173/controller.html` — Controller
+# Su Linux/Mac
+hostname -I
+# oppure
+ifconfig | grep "inet "
 
-### Build di produzione
+# Su Windows
+ipconfig
+```
 
+3. Dal dispositivo mobile, connesso alla stessa rete Wi-Fi, naviga su:
+```
+http://[tuo-ip]:5173
+```
+
+4. Accetta eventuali permessi richiesti dal browser per:
+   - Modalità fullscreen
+   - Sintesi vocale
+   - Wake Lock (prevenzione spegnimento schermo)
+
+### Build e Deploy
+
+#### Build per produzione
+
+Genera i file ottimizzati per la produzione:
 ```bash
 npm run build
 ```
 
-Genera la cartella `dist/` con asset ottimizzati, manifest e service worker PWA.
+Questo comando crea una cartella `dist/` contenente:
+- HTML, CSS e JavaScript minificati
+- Service Worker per il funzionamento offline
+- Manifest PWA per l'installazione come app
+- Asset ottimizzati
 
-### Avvio in produzione (locale)
+#### Anteprima della build
 
+Prima del deploy, puoi testare la build in locale:
 ```bash
-npm run serve
+npm run preview
 ```
 
-Espone i due server:
+#### Deploy su GitHub Pages
-- `http://localhost:3000` — Display
-- `http://localhost:3001` — Controller
 
----
+1. Nel file [vite.config.js](vite.config.js:7), verifica che il `base` path corrisponda al nome del repository:
-
+```javascript
-## Terminal Controller (CLI)
+base: process.env.NODE_ENV === 'production' ? '/nome-repository' : '/',
-
-Il CLI è un controller da terminale che si connette al server via WebSocket e permette di gestire la partita senza browser.
-
-### Avvio
-
-```bash
-# Modalità produzione (server su porta 3000)
-npm run cli
-
-# Modalità sviluppo (server Vite su porta 5173)
-npm run cli:dev
-
-# Porta custom
-node cli.js <porta>
 ```
 
-Il CLI richiede che il server sia già in esecuzione in un altro terminale.
+2. Esegui la build:
-
-### Comandi disponibili
-
-#### Punteggio
-
-| Comando | Alias | Effetto |
-|---------|-------|---------|
-| `punto casa` | `+`, `pc` | Assegna un punto alla squadra di casa |
-| `punto ospite` | `-`, `po` | Assegna un punto alla squadra ospite |
-| `undo` | `u` | Annulla l'ultimo punto assegnato |
-
-#### Set
-
-| Comando | Effetto |
-|---------|---------|
-| `set casa` | Incrementa il contatore set della squadra di casa |
-| `set ospite` | Incrementa il contatore set della squadra ospite |
-
-#### Partita
-
-| Comando | Effetto |
-|---------|---------|
-| `serv` | Cambia il servizio (disponibile solo se il punteggio è 0-0) |
-| `reset` | Resetta la partita — chiede conferma prima di procedere |
-| `nomi <casa> <ospite>` | Imposta i nomi delle squadre (es. `nomi Antoniana Teate`) |
-| `modalita 2/3` | Imposta la modalità best-of-3 |
-| `modalita 3/5` | Imposta la modalità best-of-5 |
-
-#### Informazioni
-
-| Comando | Alias | Effetto |
-|---------|-------|---------|
-| `stato` | — | Mostra il punteggio corrente nel terminale |
-| `help` | — | Mostra la lista dei comandi |
-| `exit` | `q` | Chiude il CLI |
-
-### Note
-
-- **Tab**: completamento automatico dei comandi
-- **Freccia su/giù**: navigazione nella history dei comandi (ultime 100 voci)
-- Il Display nel browser si aggiorna in tempo reale ad ogni comando inviato
-
----
-
-## Test
-
-La suite di test copre tutti i livelli dell'applicazione:
-
-| Suite | Comando | Descrizione |
-|-------|---------|-------------|
-| Tutti | `npm run test:all` | Unit + integration + component + stress |
-| Unit + integration | `npm run test:unit` | Logica di gioco e WebSocket |
-| Component | `npm run test:component` | Componenti Vue |
-| Stress | `npm run test:stress` | Load test WebSocket |
-| E2E | `npm run test:e2e` | Playwright (chromium, firefox, mobile) |
-
-Per la guida completa ai test, consultare [`tests/README.md`](tests/README.md).
-
----
-
-## Docker
-
 ```bash
-docker-compose up --build
+npm run build
 ```
 
-Espone le porte `3000` (Display) e `3001` (Controller).
+3. Publica il contenuto della cartella `dist/` su GitHub Pages usando uno di questi metodi:
+   - Manualmente tramite l'interfaccia GitHub
+   - Usando `gh-pages`:
+     ```bash
+     npm install -D gh-pages
+     npx gh-pages -d dist
+     ```
+   - Tramite GitHub Actions (configurando un workflow)
+
+#### Deploy su server web
+
+Il contenuto della cartella `dist/` può essere servito da qualsiasi server web statico:
+
+**Nginx:**
+```nginx
+server {
+    listen 80;
+    server_name tuo-dominio.com;
+    root /percorso/a/dist;
+    index index.html;
+
+    location / {
+        try_files $uri $uri/ /index.html;
+    }
+}
+```
+
+**Apache (.htaccess):**
+```apache
+<IfModule mod_rewrite.c>
+    RewriteEngine On
+    RewriteBase /
+    RewriteRule ^index\.html$ - [L]
+    RewriteCond %{REQUEST_FILENAME} !-f
+    RewriteCond %{REQUEST_FILENAME} !-d
+    RewriteRule . /index.html [L]
+</IfModule>
+```
+
+#### Installazione come PWA
+
+Dopo il deploy, gli utenti possono installare l'app:
+
+**Su Android/Chrome:**
+1. Visita il sito
+2. Tocca il menu (⋮) > "Aggiungi a schermata Home"
+3. L'app si avvierà in modalità fullscreen standalone
+
+**Su iOS/Safari:**
+1. Visita il sito
+2. Tocca il pulsante Condividi
+3. Seleziona "Aggiungi a Home"
+
+## Dettagli tecnici
+
+### Architettura del componente
+
+L'applicazione è strutturata come Single Page Application (SPA) con un unico componente principale `HomePage`. Questo design semplice è ideale per un'app focalizzata su un'unica funzionalità.
+
+### Gestione dello stato
+
+Lo stato dell'applicazione è gestito localmente nel componente tramite `data()`:
+- `punt`: punteggio corrente delle due squadre
+- `set`: numero di set vinti
+- `servHome`: boolean che indica quale squadra ha il servizio
+- `form`: array con le posizioni dei giocatori (1-6)
+- `nomi`: nomi personalizzabili delle squadre
+- `visuForm`: toggle tra visualizzazione punteggio/formazione
+- `visuButt`: visibilità della barra dei pulsanti
+
+### Gestione della rotazione
+
+La rotazione dei giocatori segue le regole del pallavolo:
+
+**Incremento punteggio** ([HomePage.vue:74-78](src/components/HomePage.vue:74-78)):
+```javascript
+incPunt(team) {
+  this.sp.punt[team]++;
+  this.sp.servHome = (team == "home");
+  this.sp.form[team].push(this.sp.form[team].shift());
+}
+```
+- Il servizio passa alla squadra che ha segnato
+- La rotazione avviene con `push(shift())`: il primo elemento va in fondo
+- Simula la rotazione oraria dei giocatori
+
+**Decremento punteggio** ([HomePage.vue:79-85](src/components/HomePage.vue:79-85)):
+```javascript
+decPunt(team) {
+  if (this.sp.punt[team] > 0) {
+    this.sp.punt[team]--;
+    this.sp.form[team].unshift(this.sp.form[team].pop());
+  }
+}
+```
+- La rotazione inversa avviene con `unshift(pop())`: l'ultimo elemento va all'inizio
+- Permette di annullare errori di punteggio
+
+### Sintesi vocale
+
+La funzione `speak()` ([HomePage.vue:86-112](src/components/HomePage.vue:86-112)) utilizza la Web Speech API:
+
+```javascript
+const msg = new SpeechSynthesisUtterance();
+msg.lang = 'it_IT';
+msg.voice = voices.find(voice => voice.name === 'Google italiano');
+```
+
+Logica di annuncio:
+- "zero a zero" se il punteggio è 0-0
+- "[numero] pari" se il punteggio è uguale
+- "[servizio] a [ricezione]" annunciando prima chi ha il servizio
+
+### Prevenzione spegnimento schermo
+
+NoSleep.js ([HomePage.vue:32-33](src/components/HomePage.vue:32-33)) viene attivato al mount su dispositivi mobili:
+```javascript
+var noSleep = new NoSleep();
+noSleep.enable();
+```
+
+Questo impedisce allo schermo di spegnersi durante le partite, funzionalità essenziale per un segnapunti.
+
+### Controlli da tastiera
+
+Gli eventi tastiera sono gestiti tramite listener globale ([HomePage.vue:121-150](src/components/HomePage.vue:121-150)):
+
+```javascript
+window.addEventListener("keydown", this.funzioneTastiSpeciali);
+```
+
+I listener vengono temporaneamente disabilitati quando si aprono dialog per permettere l'inserimento di testo.
+
+### Progressive Web App
+
+La configurazione PWA in [vite.config.js](vite.config.js:10-33) definisce:
+
+- **Manifest**: metadati dell'app (nome, icone, orientamento)
+- **Service Worker**: strategia di cache per funzionamento offline
+- **Display mode**: fullscreen per esperienza app-like
+- **Orientamento forzato**: landscape per massimizzare spazio visibile
+
+## Setup IDE raccomandato
+
+- [VS Code](https://code.visualstudio.com/) - Editor consigliato
+- [Volar](https://marketplace.visualstudio.com/items?itemName=Vue.volar) - Supporto Vue 3 (disabilita Vetur se installato)
+- [TypeScript Vue Plugin (Volar)](https://marketplace.visualstudio.com/items?itemName=Vue.vscode-typescript-vue-plugin) - IntelliSense migliorato
+
+### Estensioni VS Code utili
+
+File [.vscode/extensions.json](.vscode/extensions.json) suggerisce:
+- Vue Language Features (Volar)
+- TypeScript Vue Plugin
+
+## Risoluzione problemi comuni
+
+### La sintesi vocale non funziona
+
+- Verifica che il browser supporti la Web Speech API (Chrome/Edge consigliati)
+- Su alcuni browser è necessaria l'interazione utente prima di utilizzare la sintesi vocale
+- Controlla che la voce "Google italiano" sia disponibile nel sistema
+
+### L'app non si installa come PWA
+
+- Verifica che il sito sia servito tramite HTTPS (richiesto per Service Workers)
+- Controlla che le icone in `public/` siano presenti e accessibili
+- Ispeziona la console del browser per errori del Service Worker
+
+### Lo schermo si spegne comunque
+
+- NoSleep.js richiede un'interazione utente per attivarsi
+- Su iOS, la prevenzione dello spegnimento ha limitazioni del sistema operativo
+- Verifica che non ci siano impostazioni di risparmio energetico aggressive
+
+### La rotazione non funziona correttamente
+
+- Le formazioni si azzerano con il RESET
+- Verifica che gli array `form` abbiano sempre 6 elementi
+- La visualizzazione può essere invertita ma la logica di rotazione rimane corretta
+
+## Licenza
+
+Progetto privato. Tutti i diritti riservati.

build-apk.sh

@@ -0,0 +1,41 @@
+#!/bin/bash
+set -e
+
+echo "========================================="
+echo "  Building APK for Segnapunti Android  "
+echo "========================================="
+echo ""
+
+# Rileva architettura
+ARCH=$(uname -m)
+echo "Architettura rilevata: $ARCH"
+
+# Crea directory dist/android se non esiste
+mkdir -p dist/android
+
+echo "Building Docker image..."
+docker build --platform linux/$(uname -m) -t segnapunti-android-builder .
+
+echo ""
+echo "Building APK inside Docker container..."
+docker run --rm \
+  -v "$(pwd)/dist:/app/dist" \
+  segnapunti-android-builder
+
+echo ""
+echo "Fixing permissions on dist folder..."
+sudo chown -R $USER:$USER dist
+
+echo ""
+echo "========================================="
+echo "Build completed successfully!"
+echo "========================================="
+echo ""
+echo "APK location: $(pwd)/dist/android/segnapunti-debug.apk"
+echo ""
+echo "Per installare su dispositivo Android:"
+echo "  adb install dist/android/segnapunti-debug.apk"
+echo ""
+echo "Oppure trasferisci il file sul dispositivo"
+echo "e installalo manualmente."
+echo ""

capacitor.config.json

@@ -0,0 +1,21 @@
+{
+  "appId": "com.antoniana.segnapunti",
+  "appName": "Segnapunti",
+  "webDir": "dist",
+  "bundledWebRuntime": false,
+  "server": {
+    "androidScheme": "https"
+  },
+  "android": {
+    "allowMixedContent": true,
+    "webContentsDebuggingEnabled": true
+  },
+  "plugins": {
+    "SplashScreen": {
+      "launchShowDuration": 0
+    }
+  },
+  "preferences": {
+    "orientation": "landscape"
+  }
+}

cli.js

@@ -1,302 +0,0 @@
-import { WebSocket } from 'ws';
-import readline from 'readline';
-
-// ---------------------------------------------------------------------------
-// ANSI helpers
-// ---------------------------------------------------------------------------
-
-const c = {
-  reset:       '\x1b[0m',
-  bold:        '\x1b[1m',
-  dim:         '\x1b[2m',
-  red:         '\x1b[31m',
-  green:       '\x1b[32m',
-  yellow:      '\x1b[33m',
-  cyan:        '\x1b[36m',
-  brightWhite: '\x1b[97m',
-};
-
-// ---------------------------------------------------------------------------
-// Config
-// ---------------------------------------------------------------------------
-
-const port = process.argv[2] || process.env.PORT || 3000;
-const url  = `ws://localhost:${port}/ws`;
-
-// ---------------------------------------------------------------------------
-// State
-// ---------------------------------------------------------------------------
-
-let currentState = null;
-let connected    = false;
-
-// ---------------------------------------------------------------------------
-// Startup banner
-// ---------------------------------------------------------------------------
-
-console.log(`\n${c.bold}${c.cyan}  Segnapunti Anto — Terminal Controller${c.reset}`);
-console.log(`${c.dim}  Connessione a ${url}...${c.reset}\n`);
-
-// ---------------------------------------------------------------------------
-// WebSocket
-// ---------------------------------------------------------------------------
-
-const ws = new WebSocket(url);
-
-ws.on('error', (err) => {
-  console.error(`${c.red}Errore di connessione: ${err.message}${c.reset}`);
-  console.error(`${c.dim}Assicurati che il server sia avviato su ${url}${c.reset}`);
-  process.exit(1);
-});
-
-ws.on('open', () => {
-  connected = true;
-  console.log(`  ${c.green}Connesso.${c.reset} Digita ${c.bold}help${c.reset} per i comandi disponibili.\n`);
-  ws.send(JSON.stringify({ type: 'register', role: 'controller' }));
-});
-
-ws.on('message', (data) => {
-  try {
-    const msg = JSON.parse(data.toString());
-    if (msg.type === 'state') {
-      currentState = msg.state;
-      printState(currentState);
-    } else if (msg.type === 'error') {
-      clearLine();
-      console.error(`  ${c.red}Errore server: ${msg.message}${c.reset}`);
-    }
-  } catch {
-    // ignora messaggi malformati
-  }
-  rl.prompt(true);
-});
-
-ws.on('close', () => {
-  console.log(`\n${c.dim}  Connessione chiusa.${c.reset}\n`);
-  process.exit(0);
-});
-
-// ---------------------------------------------------------------------------
-// Output helpers
-// ---------------------------------------------------------------------------
-
-/** Cancella la riga corrente del terminale (evita di sovrascrivere il prompt). */
-function clearLine() {
-  process.stdout.write('\r\x1b[K');
-}
-
-function printState(s) {
-  if (!s) return;
-  const { nomi, punt, set, servHome } = s.sp;
-
-  const homeServ  = servHome  ? `${c.yellow}▶${c.reset}` : ' ';
-  const guestServ = !servHome ? `${c.yellow}◀${c.reset}` : ' ';
-
-  const homeName  = nomi.home.padEnd(15);
-  const guestName = nomi.guest.padEnd(15);
-  const homeScore  = String(punt.home).padStart(3);
-  const guestScore = String(punt.guest).padStart(3);
-
-  clearLine();
-  console.log(
-    `  ${homeServ} ${c.bold}${homeName}${c.reset}` +
-    `${c.brightWhite}${homeScore}${c.reset} ${c.dim}(set ${set.home})${c.reset}` +
-    `  ${c.dim}│${c.reset}  ` +
-    `${c.brightWhite}${guestScore}${c.reset} ${c.dim}(set ${set.guest})${c.reset}` +
-    `  ${c.bold}${guestName}${c.reset} ${guestServ}` +
-    `  ${c.dim}[${s.modalitaPartita}]${c.reset}`
-  );
-}
-
-function printHelp() {
-  console.log(`
-${c.bold}  Punteggio${c.reset}
-    ${c.cyan}+${c.reset}  /  ${c.cyan}pc${c.reset}                   Punto casa (shortcut)
-    ${c.cyan}-${c.reset}  /  ${c.cyan}po${c.reset}                   Punto ospite (shortcut)
-    ${c.cyan}punto casa${c.reset}               Punto casa
-    ${c.cyan}punto ospite${c.reset}             Punto ospite
-    ${c.cyan}undo${c.reset}  /  ${c.cyan}u${c.reset}               Annulla ultimo punto
-
-${c.bold}  Set${c.reset}
-    ${c.cyan}set casa${c.reset}                 Incrementa set casa
-    ${c.cyan}set ospite${c.reset}               Incrementa set ospite
-
-${c.bold}  Partita${c.reset}
-    ${c.cyan}serv${c.reset}                     Cambia servizio (solo se 0-0)
-    ${c.cyan}reset${c.reset}                    Resetta la partita (chiede conferma)
-    ${c.cyan}nomi <casa> <ospite>${c.reset}     Imposta nomi squadre
-    ${c.cyan}modalita 2/3${c.reset}             Imposta modalità best-of-3
-    ${c.cyan}modalita 3/5${c.reset}             Imposta modalità best-of-5
-
-${c.bold}  Informazioni${c.reset}
-    ${c.cyan}stato${c.reset}                    Mostra punteggio attuale
-    ${c.cyan}help${c.reset}                     Mostra questo aiuto
-    ${c.cyan}exit${c.reset}  /  ${c.cyan}q${c.reset}              Esci
-
-  ${c.dim}Suggerimento: usa Tab per il completamento automatico dei comandi.${c.reset}
-`);
-}
-
-// ---------------------------------------------------------------------------
-// Command dispatch
-// ---------------------------------------------------------------------------
-
-function sendAction(action) {
-  if (!connected || ws.readyState !== WebSocket.OPEN) {
-    console.error(`  ${c.red}Non connesso al server.${c.reset}`);
-    rl.prompt();
-    return;
-  }
-  ws.send(JSON.stringify({ type: 'action', action }));
-}
-
-function parseCommand(line) {
-  const parts = line.trim().split(/\s+/);
-  const cmd   = parts[0].toLowerCase();
-
-  switch (cmd) {
-
-    case '+':
-    case 'pc':
-      sendAction({ type: 'incPunt', team: 'home' });
-      break;
-
-    case '-':
-    case 'po':
-      sendAction({ type: 'incPunt', team: 'guest' });
-      break;
-
-    case 'punto': {
-      const team = parts[1]?.toLowerCase();
-      if (team === 'casa' || team === 'home') {
-        sendAction({ type: 'incPunt', team: 'home' });
-      } else if (team === 'ospite' || team === 'guest') {
-        sendAction({ type: 'incPunt', team: 'guest' });
-      } else {
-        console.error(`  ${c.red}Uso: punto casa | punto ospite${c.reset}`);
-        rl.prompt();
-      }
-      break;
-    }
-
-    case 'undo':
-    case 'u':
-      sendAction({ type: 'decPunt' });
-      break;
-
-    case 'set': {
-      const team = parts[1]?.toLowerCase();
-      if (team === 'casa' || team === 'home') {
-        sendAction({ type: 'incSet', team: 'home' });
-      } else if (team === 'ospite' || team === 'guest') {
-        sendAction({ type: 'incSet', team: 'guest' });
-      } else {
-        console.error(`  ${c.red}Uso: set casa | set ospite${c.reset}`);
-        rl.prompt();
-      }
-      break;
-    }
-
-    case 'serv':
-      sendAction({ type: 'cambiaPalla' });
-      break;
-
-    case 'reset':
-      rl.question(`  ${c.yellow}Confermi reset partita? (s/N) ${c.reset}`, (answer) => {
-        if (answer.trim().toLowerCase() === 's') {
-          sendAction({ type: 'resetta' });
-        } else {
-          console.log(`  ${c.dim}Reset annullato.${c.reset}`);
-          rl.prompt();
-        }
-      });
-      return;
-
-    case 'nomi': {
-      const home  = parts[1];
-      const guest = parts[2];
-      if (!home) {
-        console.error(`  ${c.red}Uso: nomi <casa> <ospite>${c.reset}`);
-        rl.prompt();
-        break;
-      }
-      const payload = { type: 'setNomi', home };
-      if (guest) payload.guest = guest;
-      sendAction(payload);
-      break;
-    }
-
-    case 'modalita': {
-      const m = parts[1];
-      if (m !== '2/3' && m !== '3/5') {
-        console.error(`  ${c.red}Uso: modalita 2/3 | modalita 3/5${c.reset}`);
-        rl.prompt();
-        break;
-      }
-      sendAction({ type: 'setModalita', modalita: m });
-      break;
-    }
-
-    case 'stato':
-      printState(currentState);
-      rl.prompt();
-      break;
-
-    case 'help':
-      printHelp();
-      rl.prompt();
-      break;
-
-    case 'exit':
-    case 'q':
-      ws.close();
-      break;
-
-    default:
-      console.error(
-        `  ${c.red}Comando non riconosciuto: "${cmd}"${c.reset}` +
-        `  — digita ${c.bold}help${c.reset} per la lista`
-      );
-      rl.prompt();
-  }
-}
-
-// ---------------------------------------------------------------------------
-// REPL
-// ---------------------------------------------------------------------------
-
-const TAB_COMPLETIONS = [
-  '+', '-', 'pc', 'po',
-  'punto casa', 'punto ospite',
-  'undo', 'u',
-  'set casa', 'set ospite',
-  'serv',
-  'reset',
-  'nomi',
-  'modalita 2/3', 'modalita 3/5',
-  'stato', 'help',
-  'exit', 'q',
-];
-
-const rl = readline.createInterface({
-  input:       process.stdin,
-  output:      process.stdout,
-  prompt:      '> ',
-  historySize: 100,
-  completer(line) {
-    const hits = TAB_COMPLETIONS.filter((entry) => entry.startsWith(line));
-    return [hits.length ? hits : TAB_COMPLETIONS, line];
-  },
-});
-
-rl.on('line', (line) => {
-  if (!line.trim()) {
-    rl.prompt();
-    return;
-  }
-  parseCommand(line.trim());
-});
-
-rl.on('close', () => {
-  ws.close();
-});

controller.html

@@ -1,13 +0,0 @@
-<!DOCTYPE html>
-<html lang="en">
-  <head>
-    <meta charset="UTF-8" />
-    <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>
-  <body>
-    <div id="app"></div>
-    <script type="module" src="/src/controller-main.js"></script>
-  </body>
-</html>

docker-compose.yml

@@ -1,8 +0,0 @@
-services:
-  segnapunti:
-    build: .
-    ports:
-      - 3000:3000
-      - 3001:3001
-    container_name: segnapunti-container
-

generate-icons.sh

@@ -0,0 +1,42 @@
+#!/bin/bash
+# Script per generare automaticamente le icone Android da segnap-512x512.png
+
+SOURCE="./public/segnap-512x512.png"
+BASE_DIR="./android/app/src/main/res"
+
+# Verifica che ImageMagick sia installato
+if ! command -v convert &> /dev/null; then
+    echo "Errore: ImageMagick non è installato."
+    echo "Installa con: sudo apt-get install imagemagick"
+    exit 1
+fi
+
+# Verifica che il file sorgente esista
+if [ ! -f "$SOURCE" ]; then
+    echo "Errore: File sorgente $SOURCE non trovato"
+    exit 1
+fi
+
+# Verifica che la directory android esista
+if [ ! -d "./android" ]; then
+    echo "Errore: Directory android/ non trovata."
+    echo "Esegui prima: npx cap add android"
+    exit 1
+fi
+
+echo "Generazione icone Android da $SOURCE..."
+
+# Crea le directory se non esistono e genera le icone
+for size in "mdpi:48" "hdpi:72" "xhdpi:96" "xxhdpi:144" "xxxhdpi:192"; do
+    density="${size%:*}"
+    pixels="${size#*:}"
+    dir="$BASE_DIR/mipmap-$density"
+
+    mkdir -p "$dir"
+    convert "$SOURCE" -resize ${pixels}x${pixels} "$dir/ic_launcher.png"
+    echo "  ✓ Creata icona $density (${pixels}x${pixels})"
+done
+
+echo "Icone generate con successo!"
+echo ""
+echo "Prossimo passo: npx cap sync"

index.html

@@ -3,7 +3,10 @@
   <head>
     <meta charset="UTF-8" />
     <link rel="icon" type="image/svg+xml" href="/vite.svg" />
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no, viewport-fit=cover" />
+    <meta name="mobile-web-app-capable" content="yes" />
+    <meta name="apple-mobile-web-app-capable" content="yes" />
+    <meta name="apple-mobile-web-app-status-bar-style" content="black-translucent" />
     <title>Segnapunti - Anto</title>
   </head>
   <body>

package.json

@@ -6,43 +6,25 @@
   "scripts": {
     "dev": "vite",
     "build": "vite build",
-    "preview": "node server.js",
+    "preview": "vite preview",
-    "start": "node server.js",
+    "cap:sync": "npm run build && cap sync",
-    "serve": "vite build && node server.js",
+    "cap:open": "cap open android",
-    "cli": "node cli.js",
+    "android:build:debug": "cd android && ./gradlew assembleDebug",
-    "cli:dev": "node cli.js 5173",
+    "docker:build": "./build-apk.sh"
-    "test": "vitest",
-    "test:unit": "vitest run tests/unit tests/integration",
-    "test:component": "vitest run tests/component",
-    "test:stress": "vitest run tests/stress",
-    "test:all": "vitest run",
-    "test:ui": "vitest --ui",
-    "test:e2e": "playwright test --config=playwright.config.cjs",
-    "test:e2e:ui": "playwright test --config=playwright.config.cjs --ui",
-    "test:e2e:codegen": "playwright codegen --config=playwright.config.cjs"
   },
   "dependencies": {
-    "express": "^5.2.1",
+    "@capacitor-community/text-to-speech": "^6.0.0",
-    "vue": "^3.2.47",
+    "@capacitor/android": "^6.2.0",
-    "vue-router": "^4.6.4",
+    "@capacitor/app": "^6.0.1",
-    "wave-ui": "^3.3.0",
+    "@capacitor/core": "^6.2.0",
-    "ws": "^8.19.0"
+    "nosleep.js": "^0.12.0",
-  },
+    "vue": "^3.4.38",
-  "overrides": {
+    "wave-ui": "^3.17.0"
-    "serialize-javascript": "^7.0.5"
   },
   "devDependencies": {
-    "@axe-core/playwright": "^4.11.1",
+    "@capacitor/cli": "^6.2.0",
-    "@playwright/test": "^1.58.2",
+    "@vitejs/plugin-vue": "^5.1.4",
-    "@types/node": "^25.2.3",
+    "vite": "^5.4.10",
-    "@vitejs/plugin-vue": "^6.0.5",
+    "vite-plugin-pwa": "^0.20.5"
-    "@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",
-    "vitest": "^4.0.18"
   }
 }

playwright.config.cjs

@@ -1,38 +0,0 @@
-const { defineConfig, devices } = require('@playwright/test');
-
-/**
- * See https://playwright.dev/docs/test-configuration.
- */
-module.exports = defineConfig({
-  testDir: './tests/e2e',
-  fullyParallel: false,
-  forbidOnly: !!process.env.CI,
-  retries: process.env.CI ? 2 : 0,
-  workers: 1,
-  reporter: 'html',
-  use: {
-    trace: 'on-first-retry',
-  },
-
-  projects: [
-    {
-      name: 'chromium',
-      use: { ...devices['Desktop Chrome'] },
-    },
-    {
-      name: 'firefox',
-      use: { ...devices['Desktop Firefox'] },
-    },
-    {
-      name: 'Mobile Chrome',
-      use: { ...devices['Pixel 5'] },
-    },
-  ],
-
-  webServer: {
-    command: 'npm run serve',
-    url: 'http://localhost:3000',
-    reuseExistingServer: !process.env.CI,
-    timeout: 120 * 1000,
-  },
-});

playwright.config.ts

@@ -1,76 +0,0 @@
-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,
-  },
-});

server.js

@@ -1,83 +0,0 @@
-import { createServer } from 'http'
-import express from 'express'
-import { WebSocketServer } from 'ws'
-import { fileURLToPath } from 'url'
-import { dirname, join } from 'path'
-import { setupWebSocketHandler } from './src/websocket-handler.js'
-import { printServerInfo } from './src/server-utils.js'
-
-const __filename = fileURLToPath(import.meta.url)
-const __dirname = dirname(__filename)
-
-// --- Configurazione del server ---
-
-const DISPLAY_PORT = process.env.PORT || 3000
-const CONTROLLER_PORT = process.env.CONTROLLER_PORT || 3001
-
-// ========================================
-// Server Display (porta principale)
-// ========================================
-
-const displayApp = express()
-
-// Espone i file generati dalla build di Vite.
-displayApp.use(express.static(join(__dirname, 'dist')))
-
-// 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)
-
-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) => {
-            wss.emit('connection', ws, request)
-        })
-    } else {
-        socket.destroy()
-    }
-})
-
-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)
-})

setup-android-icons.sh

@@ -0,0 +1,40 @@
+#!/bin/bash
+set -e
+
+echo "Configurazione icone Android..."
+
+# Rimuove icone default di Capacitor
+rm -rf android/app/src/main/res/mipmap-*
+
+# Crea directory per tutte le densità
+for density in mdpi hdpi xhdpi xxhdpi xxxhdpi; do
+  mkdir -p android/app/src/main/res/mipmap-$density
+done
+
+# Mappa densità -> dimensioni
+declare -A sizes=(
+  ["mdpi"]="48"
+  ["hdpi"]="72"
+  ["xhdpi"]="96"
+  ["xxhdpi"]="144"
+  ["xxxhdpi"]="192"
+)
+
+# Genera icone per ogni densità
+for density in "${!sizes[@]}"; do
+  size="${sizes[$density]}"
+  echo "  Generando icone ${size}x${size} per $density..."
+
+  convert public/segnap-512x512.png -resize ${size}x${size} \
+    android/app/src/main/res/mipmap-$density/ic_launcher.png
+
+  convert public/segnap-512x512.png -resize ${size}x${size} \
+    android/app/src/main/res/mipmap-$density/ic_launcher_round.png
+done
+
+# Icona per il file APK (visibile da PC)
+mkdir -p android/app/src/main/res/drawable
+convert public/segnap-512x512.png -resize 512x512 \
+  android/app/src/main/res/drawable/icon.png
+
+echo "Icone configurate con successo!"

src/App.vue

@@ -1,3 +1,7 @@
+<script setup>
+import HomePage from './components/HomePage/index.vue'
+</script>
+
 <template>
-  <router-view />
+  <HomePage />
 </template>

src/components/ControllerPage.vue

@@ -1,908 +0,0 @@
-<template>
-  <section class="controller-page">
-    <!-- Barra di stato connessione -->
-    <div class="conn-bar" :class="{ connected: wsConnected }">
-      <span class="dot"></span>
-      {{ wsConnected ? 'Connesso' : 'Connessione...' }}
-    </div>
-
-    <!-- Anteprima punteggio -->
-    <div class="score-preview">
-      <div class="team-score home-bg" @click="sendAction({ type: 'incPunt', team: 'home' })">
-        <div class="team-name">{{ state.sp.nomi.home }}</div>
-        <div class="team-pts">{{ state.sp.punt.home }}</div>
-        <div class="team-set">SET {{ state.sp.set.home }}</div>
-        <img v-show="state.sp.servHome" src="/serv.png" class="serv-icon" alt="Servizio" />
-      </div>
-      <div class="team-score guest-bg" @click="sendAction({ type: 'incPunt', team: 'guest' })">
-        <div class="team-name">{{ state.sp.nomi.guest }}</div>
-        <div class="team-pts">{{ state.sp.punt.guest }}</div>
-        <div class="team-set">SET {{ state.sp.set.guest }}</div>
-        <img v-show="!state.sp.servHome" src="/serv.png" class="serv-icon" alt="Servizio" />
-      </div>
-    </div>
-
-    <!-- Riga annulla punto -->
-    <div class="undo-row">
-      <button class="btn btn-undo" @click="sendAction({ type: 'decPunt' })">
-        ANNULLA PUNTO
-      </button>
-    </div>
-
-    <!-- Pulsanti set -->
-    <div class="action-row">
-      <button class="btn btn-set home-bg" @click="sendAction({ type: 'incSet', team: 'home' })">
-        SET {{ state.sp.nomi.home }}
-      </button>
-      <button class="btn btn-set guest-bg" @click="sendAction({ type: 'incSet', team: 'guest' })">
-        SET {{ state.sp.nomi.guest }}
-      </button>
-    </div>
-
-    <!-- Controlli principali -->
-    <div class="controls">
-      <button class="btn btn-ctrl" @click="sendAction({ type: 'cambiaPalla' })" :disabled="!isPunteggioZeroZero">
-        Cambio Palla
-      </button>
-      <button class="btn btn-ctrl" @click="sendAction({ type: 'toggleFormazione' })">
-        {{ state.visuForm ? 'Punteggio' : 'Formazioni' }}
-      </button>
-      <button class="btn btn-ctrl" @click="sendAction({ type: 'toggleStriscia' })">
-        Striscia
-      </button>
-      <button class="btn btn-ctrl" @click="sendAction({ type: 'toggleOrder' })">
-        Inverti
-      </button>
-      <button class="btn btn-ctrl" @click="speak()">
-        Voce
-      </button>
-      <button class="btn btn-ctrl" @click="openConfig()">
-        Config
-      </button>
-      <button class="btn btn-ctrl" @click="openCambiTeam()">
-        Cambi
-      </button>
-      <button class="btn btn-danger" @click="confirmReset = true">
-        Reset
-      </button>
-    </div>
-
-    <!-- Finestra conferma reset -->
-    <div class="overlay" v-if="confirmReset" @click.self="confirmReset = false">
-      <div class="dialog">
-        <div class="dialog-title">Azzero punteggio?</div>
-        <div class="dialog-buttons">
-          <button class="btn btn-cancel" @click="confirmReset = false">NO</button>
-          <button class="btn btn-confirm" @click="doReset()">SI</button>
-        </div>
-      </div>
-    </div>
-
-    <!-- Finestra configurazione -->
-    <div class="overlay" v-if="showConfig" @click.self="showConfig = false">
-      <div class="dialog dialog-config">
-        <div class="dialog-title">Configurazione</div>
-
-        <div class="form-group">
-          <label>Nome Home</label>
-          <input type="text" v-model="configData.nomeHome" class="input-field" />
-        </div>
-        <div class="form-group">
-          <label>Nome Guest</label>
-          <input type="text" v-model="configData.nomeGuest" class="input-field" />
-        </div>
-
-        <div class="form-group">
-          <label>Modalità partita</label>
-          <div class="mode-buttons">
-            <button :class="['btn', 'btn-mode', configData.modalita === '2/3' ? 'active' : '']"
-              @click="configData.modalita = '2/3'">2/3</button>
-            <button :class="['btn', 'btn-mode', configData.modalita === '3/5' ? 'active' : '']"
-              @click="configData.modalita = '3/5'">3/5</button>
-          </div>
-        </div>
-
-        <div class="form-group">
-          <label>Formazione Home</label>
-          <div class="form-grid">
-            <div class="form-row">
-              <input type="text" v-model="configData.formHome[3]" class="input-num" />
-              <input type="text" v-model="configData.formHome[2]" class="input-num" />
-              <input type="text" v-model="configData.formHome[1]" class="input-num" />
-            </div>
-            <div class="form-line"></div>
-            <div class="form-row">
-              <input type="text" v-model="configData.formHome[4]" class="input-num" />
-              <input type="text" v-model="configData.formHome[5]" class="input-num" />
-              <input type="text" v-model="configData.formHome[0]" class="input-num" />
-            </div>
-          </div>
-        </div>
-
-        <div class="form-group">
-          <label>Formazione Guest</label>
-          <div class="form-grid">
-            <div class="form-row">
-              <input type="text" v-model="configData.formGuest[3]" class="input-num" />
-              <input type="text" v-model="configData.formGuest[2]" class="input-num" />
-              <input type="text" v-model="configData.formGuest[1]" class="input-num" />
-            </div>
-            <div class="form-line"></div>
-            <div class="form-row">
-              <input type="text" v-model="configData.formGuest[4]" class="input-num" />
-              <input type="text" v-model="configData.formGuest[5]" class="input-num" />
-              <input type="text" v-model="configData.formGuest[0]" class="input-num" />
-            </div>
-          </div>
-        </div>
-
-        <div class="dialog-buttons">
-          <button class="btn btn-cancel" @click="showConfig = false">Annulla</button>
-          <button class="btn btn-confirm" @click="saveConfig()">OK</button>
-        </div>
-      </div>
-    </div>
-
-    <!-- Selezione squadra per cambi -->
-    <div class="overlay" v-if="showCambiTeam" @click.self="showCambiTeam = false">
-      <div class="dialog">
-        <div class="dialog-title">Scegli squadra</div>
-        <div class="dialog-buttons">
-          <button class="btn btn-set home-bg" @click="openCambi('home')">{{ state.sp.nomi.home }}</button>
-          <button class="btn btn-set guest-bg" @click="openCambi('guest')">{{ state.sp.nomi.guest }}</button>
-        </div>
-      </div>
-    </div>
-
-    <!-- Finestra gestione cambi -->
-    <div class="overlay" v-if="showCambi" @click.self="closeCambi()">
-      <div class="dialog">
-        <div class="dialog-title">{{ state.sp.nomi[cambiTeam] }}: CAMBIO</div>
-        <div class="cambi-container">
-          <div class="cambio-row" v-for="(c, i) in cambiData" :key="i">
-            <input type="text" v-model="c.in" placeholder="IN" class="input-num cambi-in-field" />
-            <span class="cambio-arrow">→</span>
-            <input type="text" v-model="c.out" placeholder="OUT" class="input-num cambi-out-field" />
-          </div>
-        </div>
-        <div v-if="cambiError" class="cambi-error">{{ cambiError }}</div>
-        <div class="dialog-buttons">
-          <button class="btn btn-cancel" @click="closeCambi()">Annulla</button>
-          <button class="btn btn-confirm" :disabled="!cambiValid" @click="confermaCambi()">CONFERMA</button>
-        </div>
-      </div>
-    </div>
-  </section>
-</template>
-
-<script>
-export default {
-  name: "ControllerPage",
-  data() {
-    return {
-      ws: null,
-      wsConnected: false,
-      isConnecting: false,
-      reconnectTimeout: null,
-      reconnectAttempts: 0,
-      maxReconnectDelay: 30000,
-      confirmReset: false,
-      showConfig: false,
-      showCambiTeam: false,
-      showCambi: false,
-      cambiTeam: "home",
-      cambiData: [
-        { in: "", out: "" },
-        { in: "", out: "" },
-      ],
-      cambiError: "",
-      configData: {
-        nomeHome: "",
-        nomeGuest: "",
-        modalita: "3/5",
-        formHome: ["1", "2", "3", "4", "5", "6"],
-        formGuest: ["1", "2", "3", "4", "5", "6"],
-      },
-      state: {
-        order: true,
-        visuForm: false,
-        visuStriscia: true,
-        modalitaPartita: "3/5",
-        sp: {
-          striscia: { home: [0], guest: [0] },
-          servHome: true,
-          punt: { home: 0, guest: 0 },
-          set: { home: 0, guest: 0 },
-          nomi: { home: "Antoniana", guest: "Guest" },
-          form: {
-            home: ["1", "2", "3", "4", "5", "6"],
-            guest: ["1", "2", "3", "4", "5", "6"],
-          },
-          storicoServizio: [],
-        },
-      },
-    }
-  },
-  computed: {
-    isPunteggioZeroZero() {
-      return this.state.sp.punt.home === 0 && this.state.sp.punt.guest === 0
-    },
-    cambiValid() {
-      let hasComplete = false
-      let allValid = true
-      this.cambiData.forEach((c) => {
-        const cin = (c.in || "").trim()
-        const cout = (c.out || "").trim()
-        if (!cin && !cout) return
-        if (!cin || !cout) { allValid = false; return }
-        hasComplete = true
-      })
-      return allValid && hasComplete
-    }
-  },
-  mounted() {
-    this.connectWebSocket()
-
-    // Gestisce l'HMR di Vite evitando riconnessioni durante la ricarica a caldo.
-    if (import.meta.hot) {
-      import.meta.hot.on('vite:beforeUpdate', () => {
-        // Annulla eventuali tentativi di riconnessione pianificati.
-        if (this.reconnectTimeout) {
-          clearTimeout(this.reconnectTimeout)
-          this.reconnectTimeout = null
-        }
-      })
-    }
-  },
-  beforeUnmount() {
-    // Pulisce il timeout di riconnessione.
-    if (this.reconnectTimeout) {
-      clearTimeout(this.reconnectTimeout)
-      this.reconnectTimeout = null
-    }
-
-    // Chiude il WebSocket con il codice di chiusura appropriato.
-    if (this.ws) {
-      this.ws.onclose = null // Rimuove il listener per evitare nuove riconnessioni pianificate.
-      this.ws.onerror = null
-      this.ws.onmessage = null
-      this.ws.onopen = null
-
-      // Usa il codice 1000 (chiusura normale) se la connessione e aperta.
-      try {
-        if (this.ws.readyState === WebSocket.OPEN) {
-          this.ws.close(1000, 'Component unmounting')
-        } else if (this.ws.readyState === WebSocket.CONNECTING) {
-          // Se la connessione e ancora in fase di apertura, chiude direttamente.
-          this.ws.close()
-        }
-      } catch (err) {
-        console.error('[Controller] Error closing WebSocket:', err)
-      }
-      this.ws = null
-    }
-  },
-  methods: {
-    connectWebSocket() {
-      // Evita connessioni simultanee multiple.
-      if (this.isConnecting) {
-        console.log('[Controller] Already connecting, skipping...')
-        return
-      }
-
-      // Chiude la connessione precedente, se presente.
-      if (this.ws) {
-        this.ws.onclose = null
-        this.ws.onerror = null
-        this.ws.onmessage = null
-        this.ws.onopen = null
-        try {
-          if (this.ws.readyState === WebSocket.OPEN) {
-            this.ws.close(1000, 'Reconnecting')
-          } else if (this.ws.readyState === WebSocket.CONNECTING) {
-            this.ws.close()
-          }
-        } catch (err) {
-          console.error('[Controller] Error closing previous WebSocket:', err)
-        }
-        this.ws = null
-      }
-
-      this.isConnecting = true
-      const protocol = location.protocol === 'https:' ? 'wss:' : 'ws:'
-
-      // Permette di specificare un host WebSocket alternativo via query parameter
-      // Utile per scenari WSL2 o development remoto: ?wsHost=192.168.1.100:3001
-      const params = new URLSearchParams(location.search)
-      const defaultHost = (
-        location.hostname === 'localhost' || location.hostname === '::1'
-      )
-        ? `127.0.0.1${location.port ? `:${location.port}` : ''}`
-        : location.host
-      const wsHost = params.get('wsHost') || defaultHost
-      const wsUrl = `${protocol}//${wsHost}/ws`
-
-      console.log('[Controller] Connecting to WebSocket:', wsUrl)
-
-      try {
-        this.ws = new WebSocket(wsUrl)
-      } catch (err) {
-        console.error('[Controller] Failed to create WebSocket:', err)
-        this.isConnecting = false
-        this.scheduleReconnect()
-        return
-      }
-
-      this.ws.onopen = () => {
-        this.isConnecting = false
-        this.wsConnected = true
-        this.reconnectAttempts = 0
-        console.log('[Controller] Connected to server')
-
-        // Invia la registrazione solo se la connessione e realmente aperta.
-        if (this.ws && this.ws.readyState === WebSocket.OPEN) {
-          try {
-            this.ws.send(JSON.stringify({ type: 'register', role: 'controller' }))
-          } catch (err) {
-            console.error('[Controller] Failed to register:', err)
-          }
-        }
-      }
-
-      this.ws.onmessage = (event) => {
-        try {
-          const msg = JSON.parse(event.data)
-
-          if (msg.type === 'state') {
-            this.state = msg.state
-          } else if (msg.type === 'error') {
-            console.error('[Controller] Server error:', msg.message)
-            // Fornisce feedback di errore all'utente.
-            this.showErrorFeedback(msg.message)
-          }
-        } catch (e) {
-          console.error('[Controller] Parse error:', e)
-        }
-      }
-
-      this.ws.onclose = (event) => {
-        this.isConnecting = false
-        this.wsConnected = false
-        console.log('[Controller] Disconnected from server', event.code, event.reason)
-
-        // Non riconnette durante HMR (codice 1001, "going away")
-        // ne in caso di chiusura pulita (codice 1000).
-        if (event.code === 1000 || event.code === 1001) {
-          console.log('[Controller] Clean close, not reconnecting')
-          return
-        }
-
-        this.scheduleReconnect()
-      }
-
-      this.ws.onerror = (err) => {
-        console.error('[Controller] WebSocket error:', err)
-        this.isConnecting = false
-        this.wsConnected = false
-      }
-    },
-
-    scheduleReconnect() {
-      // Evita pianificazioni multiple della riconnessione.
-      if (this.reconnectTimeout) {
-        return
-      }
-
-      // Applica backoff esponenziale: 1s, 2s, 4s, 8s, 16s, fino a 30s.
-      const delay = Math.min(
-        1000 * Math.pow(2, this.reconnectAttempts),
-        this.maxReconnectDelay
-      )
-      this.reconnectAttempts++
-
-      console.log(`[Controller] Reconnecting in ${delay}ms (attempt ${this.reconnectAttempts})`)
-
-      this.reconnectTimeout = setTimeout(() => {
-        this.reconnectTimeout = null
-        this.connectWebSocket()
-      }, delay)
-    },
-
-    sendAction(action) {
-      if (!this.wsConnected || !this.ws || this.ws.readyState !== WebSocket.OPEN) {
-        console.warn('[Controller] Cannot send action: not connected')
-        this.showErrorFeedback('Non connesso al server')
-        return
-      }
-
-      // Valida l'azione prima dell'invio.
-      if (!action || !action.type) {
-        console.error('[Controller] Invalid action format:', action)
-        return
-      }
-
-      try {
-        this.ws.send(JSON.stringify({ type: 'action', action }))
-      } catch (err) {
-        console.error('[Controller] Failed to send action:', err)
-        this.showErrorFeedback('Errore invio comando')
-      }
-    },
-
-    showErrorFeedback(message) {
-      // Feedback visivo degli errori: attualmente solo log su console.
-      // In futuro puo essere esteso con notifiche a comparsa (toast).
-      console.error('[Controller] Error:', message)
-    },
-
-    doReset() {
-      this.sendAction({ type: 'resetta' })
-      this.confirmReset = false
-    },
-
-    openConfig() {
-      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 = [...this.state.sp.form.home]
-      this.configData.formGuest = [...this.state.sp.form.guest]
-      this.showConfig = true
-    },
-
-    saveConfig() {
-      this.sendAction({ type: 'setNomi', home: this.configData.nomeHome, guest: this.configData.nomeGuest })
-      this.sendAction({ type: 'setModalita', modalita: this.configData.modalita })
-      this.sendAction({ type: 'setFormazione', team: 'home', form: this.configData.formHome })
-      this.sendAction({ type: 'setFormazione', team: 'guest', form: this.configData.formGuest })
-      this.showConfig = false
-    },
-
-    openCambiTeam() {
-      this.showCambiTeam = true
-    },
-
-    openCambi(team) {
-      this.showCambiTeam = false
-      this.cambiTeam = team
-      this.cambiData = [{ in: "", out: "" }, { in: "", out: "" }]
-      this.cambiError = ""
-      this.showCambi = true
-    },
-
-    closeCambi() {
-      this.showCambi = false
-      this.cambiData = [{ in: "", out: "" }, { in: "", out: "" }]
-      this.cambiError = ""
-    },
-
-    confermaCambi() {
-      if (!this.cambiValid) return
-      this.cambiError = ""
-
-      const cambi = this.cambiData
-        .filter(c => (c.in || "").trim() && (c.out || "").trim())
-        .map(c => ({ in: c.in.trim(), out: c.out.trim() }))
-
-      // Simula i cambi in sequenza per validare
-      const formCorrente = this.state.sp.form[this.cambiTeam].map(v => String(v).trim())
-      const formSimulata = [...formCorrente]
-
-      for (const cambio of cambi) {
-        if (!/^\d+$/.test(cambio.in) || !/^\d+$/.test(cambio.out)) {
-          this.cambiError = "I numeri dei giocatori devono essere cifre"
-          return
-        }
-        if (cambio.in === cambio.out) {
-          this.cambiError = `Il giocatore ${cambio.in} non può sostituire sé stesso`
-          return
-        }
-        if (formSimulata.includes(cambio.in)) {
-          this.cambiError = `Il giocatore ${cambio.in} è già in formazione`
-          return
-        }
-        if (!formSimulata.includes(cambio.out)) {
-          this.cambiError = `Il giocatore ${cambio.out} non è in formazione`
-          return
-        }
-        const idx = formSimulata.indexOf(cambio.out)
-        formSimulata.splice(idx, 1, cambio.in)
-      }
-
-      this.sendAction({ type: 'confermaCambi', team: this.cambiTeam, cambi })
-      this.closeCambi()
-    },
-
-    speak() {
-      let text = ''
-      if (this.state.sp.punt.home + this.state.sp.punt.guest === 0) {
-        text = "zero a zero"
-      } else if (this.state.sp.punt.home === this.state.sp.punt.guest) {
-        text = this.state.sp.punt.home + " pari"
-      } else {
-        if (this.state.sp.servHome) {
-          text = this.state.sp.punt.home + " a " + this.state.sp.punt.guest
-        } else {
-          text = this.state.sp.punt.guest + " a " + this.state.sp.punt.home
-        }
-      }
-      if (!this.wsConnected || !this.ws || this.ws.readyState !== WebSocket.OPEN) {
-        this.showErrorFeedback('Non connesso al server')
-        return
-      }
-
-      try {
-        this.ws.send(JSON.stringify({ type: 'speak', text }))
-      } catch (err) {
-        console.error('[Controller] Failed to send speak command:', err)
-        this.showErrorFeedback('Errore invio comando voce')
-      }
-    }
-  }
-}
-</script>
-
-<style scoped>
-.controller-page {
-  min-height: 100vh;
-  background: #111;
-  color: #fff;
-  padding: 8px;
-  padding-top: 36px;
-  font-family: 'Inter', system-ui, sans-serif;
-  -webkit-user-select: none;
-  user-select: none;
-}
-
-/* Barra stato connessione */
-.conn-bar {
-  position: fixed;
-  top: 0;
-  left: 0;
-  right: 0;
-  height: 28px;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  gap: 6px;
-  font-size: 12px;
-  font-weight: 600;
-  background: #c62828;
-  color: white;
-  z-index: 200;
-  transition: background 0.3s;
-}
-.conn-bar.connected {
-  background: #2e7d32;
-}
-.dot {
-  width: 8px;
-  height: 8px;
-  border-radius: 50%;
-  background: white;
-}
-
-/* Anteprima punteggio */
-.score-preview {
-  display: flex;
-  gap: 8px;
-  margin-bottom: 8px;
-}
-.team-score {
-  flex: 1;
-  border-radius: 16px;
-  padding: 16px 12px;
-  text-align: center;
-  cursor: pointer;
-  position: relative;
-  transition: transform 0.1s;
-  min-height: 120px;
-  display: flex;
-  flex-direction: column;
-  justify-content: center;
-  align-items: center;
-}
-.team-score:active {
-  transform: scale(0.97);
-}
-.home-bg {
-  background: linear-gradient(145deg, #1a1a1a, #333);
-  border: 2px solid #fdd835;
-  color: #fdd835;
-}
-.guest-bg {
-  background: linear-gradient(145deg, #0d47a1, #1565c0);
-  border: 2px solid #64b5f6;
-  color: #fff;
-}
-.team-name {
-  font-size: 14px;
-  font-weight: 700;
-  text-transform: uppercase;
-  letter-spacing: 1px;
-  margin-bottom: 4px;
-}
-.team-pts {
-  font-size: 56px;
-  font-weight: 900;
-  line-height: 1;
-}
-.team-set {
-  font-size: 13px;
-  font-weight: 600;
-  opacity: 0.75;
-  margin-top: 4px;
-}
-.serv-icon {
-  position: absolute;
-  top: 8px;
-  right: 8px;
-  width: 20px;
-  height: 20px;
-}
-
-/* Riga annulla punto */
-.undo-row {
-  margin-bottom: 8px;
-}
-.btn-undo {
-  width: 100%;
-  background: rgba(255,255,255,0.08);
-  border: 1px solid rgba(255,255,255,0.2);
-  color: #ffab91;
-  padding: 10px;
-  font-size: 14px;
-  font-weight: 700;
-  border-radius: 12px;
-  cursor: pointer;
-}
-.btn-undo:active {
-  background: rgba(255,100,50,0.2);
-}
-
-/* Pulsanti set */
-.action-row {
-  display: flex;
-  gap: 8px;
-  margin-bottom: 8px;
-}
-.btn-set {
-  flex: 1;
-  padding: 12px;
-  font-size: 13px;
-  font-weight: 700;
-  border-radius: 12px;
-  cursor: pointer;
-  border: none;
-  text-transform: uppercase;
-}
-.btn-set:active {
-  transform: scale(0.97);
-}
-
-/* Griglia controlli */
-.controls {
-  display: grid;
-  grid-template-columns: repeat(2, 1fr);
-  gap: 8px;
-}
-
-.btn {
-  border: none;
-  font-family: inherit;
-  cursor: pointer;
-  -webkit-tap-highlight-color: transparent;
-}
-
-.btn-ctrl {
-  background: rgba(255,255,255,0.08);
-  border: 1px solid rgba(255,255,255,0.15);
-  color: #e0e0e0;
-  padding: 14px 8px;
-  font-size: 14px;
-  font-weight: 600;
-  border-radius: 12px;
-  transition: background 0.15s;
-}
-.btn-ctrl:active {
-  background: rgba(255,255,255,0.18);
-}
-.btn-ctrl:disabled {
-  opacity: 0.35;
-}
-
-.btn-danger {
-  background: rgba(198, 40, 40, 0.25);
-  border: 1px solid rgba(239, 83, 80, 0.4);
-  color: #ff8a80;
-  padding: 14px 8px;
-  font-size: 14px;
-  font-weight: 600;
-  border-radius: 12px;
-}
-.btn-danger:active {
-  background: rgba(198, 40, 40, 0.45);
-}
-
-/* Overlay e finestre modali */
-.overlay {
-  position: fixed;
-  top: 0;
-  left: 0;
-  right: 0;
-  bottom: 0;
-  background: rgba(0,0,0,0.75);
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  z-index: 300;
-  padding: 16px;
-}
-
-.dialog {
-  background: #1e1e1e;
-  border-radius: 20px;
-  padding: 24px;
-  width: 100%;
-  max-width: 400px;
-  border: 1px solid rgba(255,255,255,0.12);
-}
-
-.dialog-config {
-  max-height: 85vh;
-  overflow-y: auto;
-}
-
-.dialog-title {
-  font-size: 18px;
-  font-weight: 800;
-  text-align: center;
-  margin-bottom: 20px;
-  padding-bottom: 12px;
-  border-bottom: 1px solid rgba(255,255,255,0.12);
-}
-
-.dialog-buttons {
-  display: flex;
-  gap: 12px;
-  margin-top: 20px;
-}
-
-.btn-cancel {
-  flex: 1;
-  background: rgba(255,255,255,0.08);
-  color: #aaa;
-  padding: 12px;
-  border-radius: 12px;
-  font-size: 15px;
-  font-weight: 600;
-}
-
-.btn-confirm {
-  flex: 1;
-  background: #2e7d32;
-  color: white;
-  padding: 12px;
-  border-radius: 12px;
-  font-size: 15px;
-  font-weight: 700;
-}
-.btn-confirm:disabled {
-  opacity: 0.4;
-}
-
-/* Gruppi form */
-.form-group {
-  margin-bottom: 16px;
-}
-.form-group label {
-  display: block;
-  font-size: 13px;
-  font-weight: 600;
-  color: #aaa;
-  margin-bottom: 6px;
-  text-transform: uppercase;
-  letter-spacing: 0.5px;
-}
-.input-field {
-  width: 100%;
-  background: rgba(255,255,255,0.08);
-  border: 1px solid rgba(255,255,255,0.2);
-  color: white;
-  padding: 10px 14px;
-  border-radius: 10px;
-  font-size: 16px;
-  box-sizing: border-box;
-}
-.input-field:focus {
-  outline: none;
-  border-color: #64b5f6;
-}
-
-.input-num {
-  width: 52px;
-  background: rgba(255,255,255,0.08);
-  border: 1px solid rgba(255,255,255,0.2);
-  color: white;
-  padding: 8px;
-  border-radius: 8px;
-  font-size: 18px;
-  text-align: center;
-  box-sizing: border-box;
-}
-.input-num:focus {
-  outline: none;
-  border-color: #64b5f6;
-}
-
-/* Griglia formazione */
-.form-grid {
-  background: rgba(205, 133, 63, 0.15);
-  border: 2px solid rgba(255,255,255,0.15);
-  border-radius: 12px;
-  padding: 12px;
-}
-.form-row {
-  display: flex;
-  justify-content: center;
-  gap: 10px;
-  padding: 8px 0;
-}
-.form-line {
-  border-top: 1px dashed rgba(255,255,255,0.3);
-  margin: 4px 0;
-}
-
-/* Pulsanti modalita */
-.mode-buttons {
-  display: flex;
-  gap: 8px;
-}
-.btn-mode {
-  flex: 1;
-  padding: 10px;
-  background: rgba(255,255,255,0.08);
-  color: #aaa;
-  border-radius: 10px;
-  font-size: 16px;
-  font-weight: 700;
-  transition: all 0.15s;
-}
-.btn-mode.active {
-  background: #2e7d32;
-  color: white;
-}
-
-/* Sezione cambi */
-.cambi-container {
-  display: flex;
-  flex-direction: column;
-  gap: 14px;
-  padding: 8px 0;
-}
-.cambio-row {
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  gap: 12px;
-}
-.cambio-arrow {
-  font-size: 20px;
-  font-weight: 700;
-  color: #aaa;
-}
-.cambi-in-field {
-  background: rgba(120, 200, 120, 0.2) !important;
-  border-color: rgba(120, 200, 120, 0.4) !important;
-}
-.cambi-out-field {
-  background: rgba(200, 120, 120, 0.2) !important;
-  border-color: rgba(200, 120, 120, 0.4) !important;
-}
-.cambi-error {
-  color: #ff6b6b;
-  font-size: 14px;
-  text-align: center;
-  padding: 8px 0;
-  font-weight: 600;
-}
-</style>

src/components/DisplayPage.vue

@@ -1,439 +0,0 @@
-<template>
-  <section class="display-page">
-    <div class="campo">
-      <span v-if="state.order">
-        <!-- Ordine visualizzazione: home / guest -->
-        <div class="hea home">
-          <span :style="{ 'float': 'left' }">
-            {{ state.sp.nomi.home }}
-            <span class="serv-slot">
-              <img v-show="state.sp.servHome" src="/serv.png" width="25" alt="Servizio" />
-            </span>
-            <span v-if="state.visuForm" class="score-inline">{{ state.sp.punt.home }}</span>
-          </span>
-          <span class="mr3" :style="{ 'float': 'right' }">set {{ state.sp.set.home }}</span>
-        </div>
-
-        <div class="hea guest">
-          <span :style="{ 'float': 'right' }">
-            <span v-if="state.visuForm" class="score-inline">{{ state.sp.punt.guest }}</span>
-            <span class="serv-slot">
-              <img v-show="!state.sp.servHome" src="/serv.png" width="25" alt="Servizio" />
-            </span>
-            {{ state.sp.nomi.guest }}
-          </span>
-          <span class="ml3" :style="{ 'float': 'left' }">set {{ state.sp.set.guest }}</span>
-        </div>
-
-        <span v-if="state.visuForm">
-          <div class="col form home">
-            <div class="formdiv" v-for="x in [3, 2, 1, 4, 5, 0]" :key="'hf'+x">
-              {{ state.sp.form.home[x] }}
-            </div>
-          </div>
-          <div class="col form guest">
-            <div class="formdiv" v-for="x in [3, 2, 1, 4, 5, 0]" :key="'gf'+x">
-              {{ state.sp.form.guest[x] }}
-            </div>
-          </div>
-        </span>
-        <span v-else>
-          <div class="punteggio-container">
-            <div class="col punt home">{{ state.sp.punt.home }}</div>
-            <div class="col punt guest">{{ state.sp.punt.guest }}</div>
-          </div>
-        </span>
-      </span>
-
-      <span v-else>
-        <!-- Ordine visualizzazione: guest / home -->
-        <div class="hea guest">
-          <span :style="{ 'float': 'left' }">
-            {{ state.sp.nomi.guest }}
-            <span class="serv-slot">
-              <img v-show="!state.sp.servHome" src="/serv.png" width="25" alt="Servizio" />
-            </span>
-            <span v-if="state.visuForm" class="score-inline">{{ state.sp.punt.guest }}</span>
-          </span>
-          <span class="mr3" :style="{ 'float': 'right' }">set {{ state.sp.set.guest }}</span>
-        </div>
-
-        <div class="hea home">
-          <span :style="{ 'float': 'right' }">
-            <span v-if="state.visuForm" class="score-inline">{{ state.sp.punt.home }}</span>
-            <span class="serv-slot">
-              <img v-show="state.sp.servHome" src="/serv.png" width="25" alt="Servizio" />
-            </span>
-            {{ state.sp.nomi.home }}
-          </span>
-          <span class="ml3" :style="{ 'float': 'left' }">set {{ state.sp.set.home }}</span>
-        </div>
-
-        <span v-if="state.visuForm">
-          <div class="col form guest">
-            <div class="formdiv" v-for="x in [3, 2, 1, 4, 5, 0]" :key="'gf2'+x">
-              {{ state.sp.form.guest[x] }}
-            </div>
-          </div>
-          <div class="col form home">
-            <div class="formdiv" v-for="x in [3, 2, 1, 4, 5, 0]" :key="'hf2'+x">
-              {{ state.sp.form.home[x] }}
-            </div>
-          </div>
-        </span>
-        <span v-else>
-          <div class="punteggio-container">
-            <div class="col punt guest">{{ state.sp.punt.guest }}</div>
-            <div class="col punt home">{{ state.sp.punt.home }}</div>
-          </div>
-        </span>
-      </span>
-
-      <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 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 state.sp.striscia.guest" :key="'sg'+i"
-               class="item" :class="{ 'item-vuoto': String(h).trim() === '' }">
-            {{ String(h) }}
-          </div>
-        </div>
-      </div>
-
-      <!-- Indicatore stato connessione -->
-      <div class="connection-status" :class="{ connected: wsConnected, disconnected: !wsConnected }">
-        <span class="dot"></span>
-        {{ wsConnected ? '' : 'Disconnesso' }}
-      </div>
-    </div>
-  </section>
-</template>
-
-<script>
-export default {
-  name: "DisplayPage",
-  data() {
-    return {
-      ws: null,
-      wsConnected: false,
-      isConnecting: false,
-      reconnectTimeout: null,
-      reconnectAttempts: 0,
-      maxReconnectDelay: 30000, // Ritardo massimo di riconnessione: 30 secondi
-      state: {
-        order: true,
-        visuForm: false,
-        visuStriscia: true,
-        modalitaPartita: "3/5",
-        sp: {
-          striscia: { home: [0], guest: [0] },
-          servHome: true,
-          punt: { home: 0, guest: 0 },
-          set: { home: 0, guest: 0 },
-          nomi: { home: "Antoniana", guest: "Guest" },
-          form: {
-            home: ["1", "2", "3", "4", "5", "6"],
-            guest: ["1", "2", "3", "4", "5", "6"],
-          },
-          storicoServizio: [],
-        },
-      },
-    }
-  },
-  mounted() {
-    this.connectWebSocket()
-    // Attiva la modalita fullscreen su dispositivi mobili.
-    if (this.isMobile()) {
-      try { document.documentElement.requestFullscreen() } catch (e) {}
-    }
-
-    // Gestisce l'HMR di Vite evitando riconnessioni durante la ricarica a caldo.
-    if (import.meta.hot) {
-      import.meta.hot.on('vite:beforeUpdate', () => {
-        // Annulla eventuali tentativi di riconnessione pianificati.
-        if (this.reconnectTimeout) {
-          clearTimeout(this.reconnectTimeout)
-          this.reconnectTimeout = null
-        }
-      })
-    }
-  },
-  beforeUnmount() {
-    // Pulisce il timeout di riconnessione.
-    if (this.reconnectTimeout) {
-      clearTimeout(this.reconnectTimeout)
-      this.reconnectTimeout = null
-    }
-
-    // Chiude il WebSocket con il codice di chiusura appropriato.
-    if (this.ws) {
-      this.ws.onclose = null // Rimuove il listener per evitare nuove riconnessioni pianificate.
-      this.ws.onerror = null
-      this.ws.onmessage = null
-      this.ws.onopen = null
-
-      // Usa il codice 1000 (chiusura normale) se la connessione e aperta.
-      try {
-        if (this.ws.readyState === WebSocket.OPEN) {
-          this.ws.close(1000, 'Component unmounting')
-        } else if (this.ws.readyState === WebSocket.CONNECTING) {
-          // Se la connessione e ancora in fase di apertura, chiude direttamente.
-          this.ws.close()
-        }
-      } catch (err) {
-        console.error('[Display] Error closing WebSocket:', err)
-      }
-      this.ws = null
-    }
-  },
-  watch: {
-    'state.sp.striscia.home': {
-      deep: true,
-      handler() {
-        this.$nextTick(() => {
-          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() {
-      return /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent)
-    },
-    connectWebSocket() {
-      // Evita connessioni simultanee multiple.
-      if (this.isConnecting) {
-        console.log('[Display] Already connecting, skipping...')
-        return
-      }
-
-      // Chiude la connessione precedente, se presente.
-      if (this.ws) {
-        this.ws.onclose = null
-        this.ws.onerror = null
-        this.ws.onmessage = null
-        this.ws.onopen = null
-        try {
-          if (this.ws.readyState === WebSocket.OPEN) {
-            this.ws.close(1000, 'Reconnecting')
-          } else if (this.ws.readyState === WebSocket.CONNECTING) {
-            this.ws.close()
-          }
-        } catch (err) {
-          console.error('[Display] Error closing previous WebSocket:', err)
-        }
-        this.ws = null
-      }
-
-      this.isConnecting = true
-      const protocol = location.protocol === 'https:' ? 'wss:' : 'ws:'
-
-      // Permette di specificare un host WebSocket alternativo via query parameter
-      // Utile per scenari WSL2 o development remoto: ?wsHost=192.168.1.100:5173
-      const params = new URLSearchParams(location.search)
-      const defaultHost = (
-        location.hostname === 'localhost' || location.hostname === '::1'
-      )
-        ? `127.0.0.1${location.port ? `:${location.port}` : ''}`
-        : location.host
-      const wsHost = params.get('wsHost') || defaultHost
-      const wsUrl = `${protocol}//${wsHost}/ws`
-
-      console.log('[Display] Connecting to WebSocket:', wsUrl)
-
-      try {
-        this.ws = new WebSocket(wsUrl)
-      } catch (err) {
-        console.error('[Display] Failed to create WebSocket:', err)
-        this.isConnecting = false
-        this.scheduleReconnect()
-        return
-      }
-
-      this.ws.onopen = () => {
-        this.isConnecting = false
-        this.wsConnected = true
-        this.reconnectAttempts = 0
-        console.log('[Display] Connected to server')
-
-        // Registra il client come display solo con connessione effettivamente aperta.
-        if (this.ws && this.ws.readyState === WebSocket.OPEN) {
-          try {
-            this.ws.send(JSON.stringify({ type: 'register', role: 'display' }))
-          } catch (err) {
-            console.error('[Display] Failed to register:', err)
-          }
-        }
-      }
-
-      this.ws.onmessage = (event) => {
-        try {
-          const msg = JSON.parse(event.data)
-
-          if (msg.type === 'state') {
-            this.state = msg.state
-          } else if (msg.type === 'speak') {
-            this.speakOnDisplay(msg.text)
-          } else if (msg.type === 'error') {
-            console.error('[Display] Server error:', msg.message)
-          }
-        } catch (e) {
-          console.error('[Display] Error parsing message:', e)
-        }
-      }
-
-      this.ws.onclose = (event) => {
-        this.isConnecting = false
-        this.wsConnected = false
-        console.log('[Display] Disconnected from server', event.code, event.reason)
-
-        // Non riconnette durante HMR (codice 1001, "going away")
-        // ne in caso di chiusura pulita (codice 1000).
-        if (event.code === 1000 || event.code === 1001) {
-          console.log('[Display] Clean close, not reconnecting')
-          return
-        }
-
-        this.scheduleReconnect()
-      }
-
-      this.ws.onerror = (err) => {
-        console.error('[Display] WebSocket error:', err)
-        this.isConnecting = false
-        this.wsConnected = false
-      }
-    },
-    scheduleReconnect() {
-      // Evita pianificazioni multiple della riconnessione.
-      if (this.reconnectTimeout) {
-        return
-      }
-
-      // Applica backoff esponenziale: 1s, 2s, 4s, 8s, 16s, fino a 30s.
-      const delay = Math.min(
-        1000 * Math.pow(2, this.reconnectAttempts),
-        this.maxReconnectDelay
-      )
-      this.reconnectAttempts++
-
-      console.log(`[Display] Reconnecting in ${delay}ms (attempt ${this.reconnectAttempts})`)
-
-      this.reconnectTimeout = setTimeout(() => {
-        this.reconnectTimeout = null
-        this.connectWebSocket()
-      }, delay)
-    },
-    speakOnDisplay(text) {
-      if (typeof text !== 'string' || !text.trim()) {
-        return
-      }
-      if (!('speechSynthesis' in window)) {
-        console.warn('[Display] speechSynthesis not supported')
-        return
-      }
-
-      const utterance = new SpeechSynthesisUtterance(text.trim())
-      const voices = window.speechSynthesis.getVoices()
-      const preferredVoice = voices.find((v) => v.name === 'Google italiano')
-        || voices.find((v) => v.lang && v.lang.toLowerCase().startsWith('it'))
-      if (preferredVoice) {
-        utterance.voice = preferredVoice
-      }
-      utterance.lang = 'it-IT'
-
-      window.speechSynthesis.cancel()
-      window.speechSynthesis.speak(utterance)
-    }
-  }
-}
-</script>
-
-<style scoped>
-.display-page {
-  width: 100%;
-  height: 100vh;
-  background: #000;
-  overflow: hidden;
-}
-
-.connection-status {
-  position: fixed;
-  top: 8px;
-  right: 8px;
-  font-size: 12px;
-  padding: 4px 10px;
-  border-radius: 12px;
-  display: flex;
-  align-items: center;
-  gap: 5px;
-  z-index: 100;
-  transition: opacity 0.5s;
-}
-
-.connection-status.connected {
-  opacity: 0;
-}
-
-.connection-status.disconnected {
-  background: rgba(255, 50, 50, 0.8);
-  color: white;
-  opacity: 1;
-}
-
-.dot {
-  width: 8px;
-  height: 8px;
-  border-radius: 50%;
-  display: inline-block;
-}
-
-.connected .dot {
-  background: #4caf50;
-}
-
-.disconnected .dot {
-  background: #f44336;
-  animation: blink 1s infinite;
-}
-
-@keyframes blink {
-  0%, 100% { opacity: 1; }
-  50% { opacity: 0.3; }
-}
-
-.guest-striscia {
-  color: white;
-}
-
-.punteggio-container {
-  width: 100%;
-  display: flex;
-}
-
-.punt {
-  font-size: 60vh;
-  flex: 1;
-  display: flex;
-  justify-content: center;
-  align-items: center;
-  min-height: 50vh;
-  min-width: 50vw;
-  max-width: 50vw;
-  overflow: hidden;
-  box-sizing: border-box;
-}
-</style>

src/components/HomePage.vue

@@ -0,0 +1,264 @@
+<script>
+import NoSleep from "nosleep.js";
+import { Capacitor } from '@capacitor/core';
+import { App } from '@capacitor/app';
+import { TextToSpeech } from '@capacitor-community/text-to-speech';
+
+export default {
+  name: "HomePage",
+  components: {},
+  data() {
+    return {
+      voices: null,
+      diaNomi: {
+        show: false,
+        home: "",
+        guest: "",
+      },
+      visuForm: false,
+      visuButt: true,
+      sp: {
+        servHome: true,
+        punt: { home: 0, guest: 0 },
+        set: { home: 0, guest: 0 },
+        nomi: { home: "Antoniana", guest: "Guest" },
+        form: {
+          home: ["1", "2", "3", "4", "5", "6"],
+          guest: ["1", "2", "3", "4", "5", "6"],
+        },
+      },
+    }
+  },
+  mounted() {
+    // Carica le voci (necessario su alcuni browser)
+    this.voices = window.speechSynthesis.getVoices();
+
+    // Ascolta l'evento voiceschanged per Android/Chrome
+    if (speechSynthesis.onvoiceschanged !== undefined) {
+      speechSynthesis.onvoiceschanged = () => {
+        this.voices = window.speechSynthesis.getVoices();
+      };
+    }
+
+    if (this.isMobile()) {
+      var noSleep = new NoSleep();
+      noSleep.enable();
+      document.documentElement.requestFullscreen();
+    }
+    this.abilitaTastiSpeciali();
+  },
+  methods: {
+    closeApp() {
+      var win = window.open("", "_self");
+      win.close();
+    },
+    fullScreen() {
+      document.documentElement.requestFullscreen();
+    },
+    isMobile() {
+      if (
+        /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(
+          navigator.userAgent
+        )
+      ) {
+        return true;
+      } else {
+        return false;
+      }
+    },
+    resetta() {
+      this.$waveui.notify("Punteggio<br />RESETTATO", "success");
+      this.visuForm = false;
+      this.sp.punt.home = 0;
+      this.sp.punt.guest = 0;
+      this.sp.form = {
+        home: ["1", "2", "3", "4", "5", "6"],
+        guest: ["1", "2", "3", "4", "5", "6"],
+      }
+    },
+    incSet(team) {
+      if (this.sp.set[team] == 2) {
+        this.sp.set[team] = 0;
+      } else {
+        this.sp.set[team]++;
+      }
+    },
+    incPunt(team) {
+      this.sp.punt[team]++;
+      this.sp.servHome = (team == "home");
+      this.sp.form[team].push(this.sp.form[team].shift());
+    },
+    decPunt(team) {
+      // decrementa il punteggio se è > 0.
+      if (this.sp.punt[team] > 0) {
+        this.sp.punt[team]--;
+        this.sp.form[team].unshift(this.sp.form[team].pop());
+      }
+    },
+    async speak() {
+      // Prepara il testo da pronunciare
+      let text = "";
+      if (this.sp.punt.home + this.sp.punt.guest == 0) {
+        text = "zero a zero";
+      } else if (this.sp.punt.home == this.sp.punt.guest) {
+        text = this.sp.punt.home + " pari";
+      } else {
+        if (this.sp.servHome) {
+          text = this.sp.punt.home + " a " + this.sp.punt.guest;
+        } else {
+          text = this.sp.punt.guest + " a " + this.sp.punt.home;
+        }
+      }
+
+      console.log('Speak called, text:', text);
+      console.log('Is native platform:', Capacitor.isNativePlatform());
+
+      // Usa plugin nativo su mobile, Web API su desktop
+      if (Capacitor.isNativePlatform()) {
+        try {
+          console.log('Using native TTS');
+          await TextToSpeech.speak({
+            text: text,
+            lang: 'it-IT',
+            rate: 0.9,
+            pitch: 1.0,
+            volume: 1.0,
+            category: 'ambient'
+          });
+          console.log('TTS completed successfully');
+        } catch (error) {
+          console.error('TTS error:', error);
+          this.$waveui.notify('Errore TTS: ' + error.message, 'error', 3000);
+        }
+      } else {
+        // Fallback Web API per desktop/browser
+        console.log('Using web API speechSynthesis');
+        window.speechSynthesis.cancel();
+
+        const msg = new SpeechSynthesisUtterance();
+        msg.text = text;
+        msg.volume = 1.0;
+        msg.rate = 0.9;
+        msg.pitch = 1.0;
+        msg.lang = 'it-IT';
+
+        const voices = window.speechSynthesis.getVoices();
+        const italianVoice = voices.find(voice =>
+          voice.lang.startsWith('it') || voice.name.includes('Italian') || voice.name.includes('italiano')
+        );
+
+        if (italianVoice) {
+          msg.voice = italianVoice;
+        }
+
+        window.speechSynthesis.speak(msg);
+      }
+    },
+    apriDialogConfig() {
+      this.disabilitaTastiSpeciali();
+      this.diaNomi.show = true;
+    },
+    disabilitaTastiSpeciali() {
+      window.removeEventListener("keydown", this.funzioneTastiSpeciali);
+    },
+    abilitaTastiSpeciali() {
+      window.addEventListener("keydown", this.funzioneTastiSpeciali);
+    },
+    funzioneTastiSpeciali(e) {
+      e.preventDefault();
+      if (e.ctrlKey && e.key == "m") {
+        this.diaNomi.show = true
+      } else if (e.ctrlKey && e.key == "b") {
+        this.visuButt = !this.visuButt
+      } else if (e.ctrlKey && e.key == "f") {
+        document.documentElement.requestFullscreen();
+      } else if (e.ctrlKey && e.key == "s") {
+        this.speak();
+      } else if (e.ctrlKey && e.key == "z") {
+        this.visuForm = !this.visuForm
+      } else if (e.ctrlKey && e.key == "ArrowUp") {
+        this.incPunt("home")
+      } else if (e.ctrlKey && e.key == "ArrowDown") {
+        this.decPunt("home")
+      } else if (e.ctrlKey && e.key == "ArrowRight") {
+        this.incSet("home")
+      } else if (e.shiftKey && e.key == "ArrowUp") {
+        this.incPunt("guest")
+      } else if (e.shiftKey && e.key == "ArrowDown") {
+        this.decPunt("guest")
+      } else if (e.shiftKey && e.key == "ArrowRight") {
+        this.incSet("guest")
+      } else if (e.ctrlKey && e.key == "ArrowLeft") {
+        this.sp.servHome = !this.sp.servHome
+      } else { return false }
+    }
+  }
+};
+</script>
+
+<template>
+  <w-dialog v-model="diaNomi.show" :width="500" @close="abilitaTastiSpeciali()">
+    <w-input v-model="sp.nomi.home" type="text" class="pa3">Home</w-input>
+    <w-input v-model="sp.nomi.guest" type="text" class="pa3">Guest</w-input>
+    <w-button bg-color="success" @click="diaNomi.show = false">
+      Ok
+    </w-button>
+  </w-dialog>
+  <div class="campo">
+    <div class="hea home">
+      <span @click="decPunt('home')" :style="{ 'float': 'left' }">
+        {{ sp.nomi.home }} <img v-if="sp.servHome" src="/serv.png" width="25" />
+        <span v-if="visuForm">{{ sp.punt.home }}</span>
+      </span>
+      <span @click="incSet('home')" class="mr3" :style="{ 'float': 'right' }">set {{ sp.set.home }}</span>
+    </div>
+    <div class="hea guest">
+      <span @click="decPunt('guest')" :style="{ 'float': 'right' }">
+        <img v-if="!sp.servHome" src="/serv.png" width="25" /> {{ sp.nomi.guest }}
+        <span v-if="visuForm">{{ sp.punt.guest }}</span>
+      </span>
+      <span @click="incSet('guest')" class="ml3" :style="{ 'float': 'left' }">set {{ sp.set.guest }}</span>
+
+    </div>
+    <span v-if="visuForm">
+      <div class="col form home" @click="incPunt('home')">
+        <div class="formdiv" v-for="x in [3, 2, 1, 4, 5, 0]">
+          {{ sp.form.home[x] }}
+        </div>
+      </div>
+      <div class="col form guest" @click="incPunt('guest')">
+        <div class="formdiv" v-for="x in [3, 2, 1, 4, 5, 0]">
+          {{ sp.form.guest[x] }}
+        </div>
+      </div>
+    </span>
+    <span v-else>
+      <div class="col punt home" @click="incPunt('home')">{{ sp.punt.home }}</div>
+      <div class="col punt guest" @click="incPunt('guest')">{{ sp.punt.guest }}</div>
+    </span>
+
+    <div class="bot" v-if="visuButt">
+      <w-flex justify-space-between class="pa2">
+        <w-confirm right align-bottom v-if="isMobile()" question="CHIUDO ?" cancel="NO" confirm="SI" @confirm="closeApp">
+          <img src="/exit.png" width="25" />
+        </w-confirm>
+        <w-button @click="apriDialogConfig()">
+          <img src="/gear.png" width="25" />
+        </w-button>
+        <w-button @click="sp.servHome = !sp.servHome">
+          <img src="/serv.png" width="25" />
+        </w-button>
+        <w-confirm top left question="Azzero punteggio ?" cancel="NO" confirm="SI" @confirm="resetta">
+          RESET
+        </w-confirm>
+        <w-button @click="visuForm = !visuForm">
+          <span v-if="visuForm">PUNTEGGIO</span>
+          <span v-if="!visuForm">FORMAZIONI</span>
+        </w-button>
+        <w-button @click="speak">
+          <img src="/speaker.png" width="25" />
+        </w-button>
+      </w-flex>
+    </div>
+  </div>
+</template>

src/components/HomePage/HomePage.html

@@ -0,0 +1,129 @@
+<section class="homepage">
+    <w-dialog v-model="diaNomi.show" :width="500" @close="abilitaTastiSpeciali()">
+      <w-input v-model="sp.nomi.home" type="text" class="pa3">Home</w-input>
+      <w-input v-model="sp.nomi.guest" type="text" class="pa3">Guest</w-input>
+      <w-button @click="order = !order">Inverti ordine</w-button>
+      <w-button bg-color="success" @click="diaNomi.show = false">
+        Ok
+      </w-button>
+    </w-dialog>
+    <div class="campo">
+
+      <span v-if="order">
+<!-- home guest -->
+      <div class="hea home">
+        <span @click="decPunt('home')" :style="{ 'float': 'left' }">
+          {{ sp.nomi.home }} <img v-if="sp.servHome" src="/serv.png" width="25" />
+          <span v-if="visuForm">{{ sp.punt.home }}</span>
+        </span>
+        <span @click="incSet('home')" class="mr3" :style="{ 'float': 'right' }">set {{ sp.set.home }}</span>
+      </div>
+
+      <div class="hea guest">
+        <span @click="decPunt('guest')" :style="{ 'float': 'right' }">
+          <img v-if="!sp.servHome" src="/serv.png" width="25" /> {{ sp.nomi.guest }}
+          <span v-if="visuForm">{{ sp.punt.guest }}</span>
+        </span>
+        <span @click="incSet('guest')" class="ml3" :style="{ 'float': 'left' }">set {{ sp.set.guest }}</span>
+      </div>
+
+      <span v-if="visuForm">
+        <div class="col form home" @click="incPunt('home')">
+          <div class="formdiv" v-for="x in [3, 2, 1, 4, 5, 0]">
+            {{ sp.form.home[x] }}
+          </div>
+        </div>
+        <div class="col form guest" @click="incPunt('guest')">
+          <div class="formdiv" v-for="x in [3, 2, 1, 4, 5, 0]">
+            {{ sp.form.guest[x] }}
+          </div>
+        </div>
+      </span>
+      <span v-else>
+        <div class="col punt home" @click="incPunt('home')">{{ sp.punt.home }}</div>
+        <div class="col punt guest" @click="incPunt('guest')">{{ sp.punt.guest }}</div>
+      </span>
+  
+      </span>
+      <span v-else>
+<!-- guest home -->        
+
+      <div class="hea guest">
+        <span @click="decPunt('guest')" :style="{ 'float': 'left' }">
+          {{ sp.nomi.guest }} <img v-if="!sp.servHome" src="/serv.png" width="25" />
+          <span v-if="visuForm">{{ sp.punt.guest }}</span>
+        </span>
+        <span @click="incSet('guest')" class="mr3" :style="{ 'float': 'right' }">set {{ sp.set.guest }}</span>
+      </div>
+
+      <div class="hea home">
+        <span @click="decPunt('home')" :style="{ 'float': 'right' }">
+          <img v-if="sp.servHome" src="/serv.png" width="25" /> {{ sp.nomi.home }}
+          <span v-if="visuForm">{{ sp.punt.home }}</span>
+        </span>
+        <span @click="incSet('home')" class="ml3" :style="{ 'float': 'left' }">set {{ sp.set.home }}</span>
+      </div>
+
+      <span v-if="visuForm">
+        <div class="col form guest" @click="incPunt('guest')">
+          <div class="formdiv" v-for="x in [3, 2, 1, 4, 5, 0]">
+            {{ sp.form.guest[x] }}
+          </div>
+        </div>
+        <div class="col form home" @click="incPunt('home')">
+          <div class="formdiv" v-for="x in [3, 2, 1, 4, 5, 0]">
+            {{ sp.form.home[x] }}
+          </div>
+        </div>
+      </span>
+      <span v-else>
+        <div class="col punt guest" @click="incPunt('guest')">{{ sp.punt.guest }}</div>
+        <div class="col punt home" @click="incPunt('home')">{{ sp.punt.home }}</div>        
+      </span>
+
+      </span>
+      
+      <div class="striscia" v-if="visuStriscia">
+      <div>
+        <span class="text-bold mr1">{{ sp.nomi.home }}</span>
+        <div v-for="h in sp.striscia.home" class="item">
+          {{String(h)}}
+        </div>
+      </div>
+      <div class="guest">
+        <span class="text-bold mr1">{{ sp.nomi.guest }}</span>
+        <div v-for="h in sp.striscia.guest" class="item">
+          {{String(h)}}
+        </div>
+      </div>
+      </div>
+
+      <div class="bot" v-if="visuButt">
+        <w-flex justify-space-between class="pa2">
+          <w-confirm right align-bottom v-if="isMobile()" question="CHIUDO ?" cancel="NO" confirm="SI" @confirm="closeApp">
+            <img src="/exit.png" width="25" />
+          </w-confirm>
+          <w-button @click="apriDialogConfig()">
+            <img src="/gear.png" width="25" />
+          </w-button>
+          <w-button @click="sp.servHome = !sp.servHome">
+            <img src="/serv.png" width="25" />
+          </w-button>
+          <w-confirm top left question="Azzero punteggio ?" cancel="NO" confirm="SI" @confirm="resetta">
+            RESET
+          </w-confirm>
+          <w-button @click="visuForm = !visuForm">
+            <span v-if="visuForm">PUNTEGGIO</span>
+            <span v-if="!visuForm">FORMAZIONI</span>
+          </w-button>
+          <w-button @click="visuStriscia = !visuStriscia">
+            STRISCIA
+          </w-button>
+          <w-button @click="speak">
+            <img src="/speaker.png" width="25" />
+          </w-button>
+        </w-flex>
+      </div>
+    </div>
+</section>
+  

src/components/HomePage/HomePage.js

@@ -0,0 +1,178 @@
+import NoSleep from "nosleep.js";
+export default {
+  name: "HomePage",
+  components: {},
+  data() {
+    return {
+      order: true,
+      voices: null,
+      diaNomi: {
+        show: false,
+        home: "",
+        guest: "",
+      },
+      visuForm: false,
+      visuButt: true,
+      visuStriscia: true,
+      sp: {
+        striscia: { home: [0], guest: [0] },
+        servHome: true,
+        punt: { home: 0, guest: 0 },
+        set: { home: 0, guest: 0 },
+        nomi: { home: "Antoniana", guest: "Guest" },
+        form: {
+          home: ["1", "2", "3", "4", "5", "6"],
+          guest: ["1", "2", "3", "4", "5", "6"],
+        },
+      },
+    }
+  },
+  mounted() {
+    this.voices = window.speechSynthesis.getVoices();
+    if (this.isMobile()) {
+      this.speak();
+      var noSleep = new NoSleep();
+      noSleep.enable();
+      document.documentElement.requestFullscreen();
+    }
+    this.abilitaTastiSpeciali();
+  },
+  methods: {
+    closeApp() {
+      var win = window.open("", "_self");
+      win.close();
+    },
+    fullScreen() {
+      document.documentElement.requestFullscreen();
+    },
+    isMobile() {
+      if (
+        /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(
+          navigator.userAgent
+        )
+      ) {
+        return true;
+      } else {
+        return false;
+      }
+    },
+    resetta() {
+      this.$waveui.notify("Punteggio<br />RESETTATO", "success");
+      this.visuForm = false;
+      this.sp.punt.home = 0;
+      this.sp.punt.guest = 0;
+      this.sp.form = {
+        home: ["1", "2", "3", "4", "5", "6"],
+        guest: ["1", "2", "3", "4", "5", "6"],
+      }
+      this.sp.striscia = { home: [0], guest: [0] }
+    },
+    incSet(team) {
+      if (this.sp.set[team] == 2) {
+        this.sp.set[team] = 0;
+      } else {
+        this.sp.set[team]++;
+      }
+    },
+    incPunt(team) {
+      this.sp.punt[team]++;
+      if (team == 'home') {
+        this.sp.striscia.home.push(this.sp.punt.home)
+        this.sp.striscia.guest.push(' ')
+      } else {
+        this.sp.striscia.guest.push(this.sp.punt.guest)
+        this.sp.striscia.home.push(' ')
+      }      
+      this.sp.servHome = (team == "home");
+      this.sp.form[team].push(this.sp.form[team].shift());
+    },
+    decPunt() {
+      if (this.sp.striscia.home.length > 1) {
+        var tmpHome = this.sp.striscia.home.pop()
+        var tmpGuest = this.sp.striscia.guest.pop()
+        if (tmpHome == ' ') {
+          this.sp.punt.guest--
+          this.sp.form.guest.unshift(this.sp.form.guest.pop());
+        } else {
+          this.sp.punt.home--
+          this.sp.form.home.unshift(this.sp.form.home.pop());
+        }
+      }
+    },
+    // decPunt(team) {
+    //   // decrementa il punteggio se è > 0.
+    //   if (this.sp.punt[team] > 0) {
+    //     this.sp.punt[team]--;
+    //     this.sp.striscia.home.pop()
+    //     this.sp.striscia.guest.pop()
+    //     this.sp.form[team].unshift(this.sp.form[team].pop());
+    //   }
+    // },
+    speak() {
+      const msg = new SpeechSynthesisUtterance();
+      if (this.sp.punt.home + this.sp.punt.guest == 0) {
+        msg.text = "zero a zero";
+      } else if (this.sp.punt.home == this.sp.punt.guest) {
+        msg.text = this.sp.punt.home + " pari";
+      } else {
+        if (this.sp.servHome) {
+          msg.text = this.sp.punt.home + " a " + this.sp.punt.guest;
+        } else {
+          msg.text = this.sp.punt.guest + " a " + this.sp.punt.home;
+        }
+      }
+      // msg.volume = 1.0; // speech volume (default: 1.0)
+      // msg.pitch = 1.0; // speech pitch (default: 1.0)
+      // msg.rate = 1.0; // speech rate (default: 1.0)
+      // msg.lang = 'it_IT'; // speech language (default: 'en-US')
+      const voices = window.speechSynthesis.getVoices();
+      msg.voice = voices.find(voice => voice.name === 'Google italiano');
+      // voice URI (default: platform-dependent)
+      // msg.onboundary = function (event) {
+      //   console.log('Speech reached a boundary:', event.name);
+      // };
+      // msg.onpause = function (event) {
+      //   console.log('Speech paused:', event.utterance.text.substring(event.charIndex));
+      // };
+      window.speechSynthesis.speak(msg);
+    },
+    apriDialogConfig() {
+      this.disabilitaTastiSpeciali();
+      this.diaNomi.show = true;
+    },
+    disabilitaTastiSpeciali() {
+      window.removeEventListener("keydown", this.funzioneTastiSpeciali);
+    },
+    abilitaTastiSpeciali() {
+      window.addEventListener("keydown", this.funzioneTastiSpeciali);
+    },
+    funzioneTastiSpeciali(e) {
+      e.preventDefault();
+      if (e.ctrlKey && e.key == "m") {
+        this.diaNomi.show = true
+      } else if (e.ctrlKey && e.key == "b") {
+        this.visuButt = !this.visuButt
+      } else if (e.ctrlKey && e.key == "f") {
+        document.documentElement.requestFullscreen();
+      } else if (e.ctrlKey && e.key == "s") {
+        this.speak();
+      } else if (e.ctrlKey && e.key == "z") {
+        this.visuForm = !this.visuForm
+      } else if (e.ctrlKey && e.key == "ArrowUp") {
+        this.incPunt("home")
+      } else if (e.ctrlKey && e.key == "ArrowDown") {
+        this.decPunt("home")
+      } else if (e.ctrlKey && e.key == "ArrowRight") {
+        this.incSet("home")
+      } else if (e.shiftKey && e.key == "ArrowUp") {
+        this.incPunt("guest")
+      } else if (e.shiftKey && e.key == "ArrowDown") {
+        this.decPunt("guest")
+      } else if (e.shiftKey && e.key == "ArrowRight") {
+        this.incSet("guest")
+      } else if (e.ctrlKey && e.key == "ArrowLeft") {
+        this.sp.servHome = !this.sp.servHome
+      } else { return false }
+    }
+  }
+}

src/components/HomePage/HomePage.scss

@@ -0,0 +1,112 @@
+.homepage {
+    :root {
+        font-family: Inter, system-ui, Avenir, Helvetica, Arial, sans-serif;
+        touch-action: pan-x pan-y;
+        height: 100% 
+    }
+
+    body {
+        overscroll-behavior-y: contain;
+        margin: 0;
+        place-items: center;
+        min-width: 320px;
+        width: 100%;
+        min-height: 100vh;
+        background-color: #000;
+    }
+
+    button {
+        margin-left: 10px;
+        margin-right: 10px;
+        border-radius: 8px;
+        border: 1px solid #fff;
+        padding: 0.6em 1.2em;
+        font-size: 0.8em;
+        font-weight: 500;
+        font-family: inherit;
+        color: #fff;
+        background-color: #000;
+        cursor: pointer;
+        transition: border-color 0.25s;
+    }
+    button:hover {
+        border-color: #646cff;
+        background-color: #333;
+    }
+    button:focus, button:focus-visible {
+        outline: 4px auto -webkit-focus-ring-color;
+    }
+
+    #app {
+        margin: 0 auto;
+        text-align: center;
+    }
+    .campo {
+        user-select: none;
+        width: 100%;
+        display: table;
+        color: #fff;
+    }
+    .hea {
+        float: left;
+        width: 50%;
+        font-size: xx-large;
+    }
+    .hea span {
+        /* border: 1px solid #f3fb00; */
+        padding-left: 10px;
+        padding-right: 10px;
+        border-radius: 5px;
+    }
+    .tal {
+        text-align: left;
+    }
+    .tar {
+        text-align: right;
+    }
+    .bot {
+        position: fixed;
+        left: 0;
+        bottom: 0;
+        width: 100%;
+        margin-top: 10px;
+        margin-bottom: 1px;
+        background-color: #111;
+    }
+    .col {
+        margin-left: auto;
+        margin-right: auto;
+        text-align: center;
+        float: left;
+        width: 50%;
+    }
+    .punt {
+        font-size: 60vh;
+    }
+    .form {
+        font-size: 5vh;
+        border-top: #fff dashed 25px;
+        padding-top: 50px;
+    }
+    .formtit {
+        font-size: 5vh;
+        margin-top: 30px;
+        margin-bottom: 20px;
+    }
+    .formdiv {
+        font-size: 20vh;
+        float: left;
+        width: 32%;
+    }
+    .home {
+        background-color: black;
+        color: yellow;
+    }
+    .guest {
+        background-color: blue;
+        color: white
+    }
+    .item-stri {
+        background-color: #fff;
+    }
+}

src/components/HomePage/index.vue

@@ -0,0 +1,3 @@
+<template src="./HomePage.html"></template>
+<script src="./HomePage.js"></script>
+

src/controller-main.js

@@ -1,9 +0,0 @@
-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')

src/gameState.js

@@ -1,211 +0,0 @@
-/**
- * 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,
-        visuForm: false,
-        visuStriscia: true,
-        modalitaPartita: "3/5",
-        sp: {
-            striscia: { home: [0], guest: [" "] },
-            servHome: true,
-            punt: { home: 0, guest: 0 },
-            set: { home: 0, guest: 0 },
-            nomi: { home: "Antoniana", guest: "Guest" },
-            form: {
-                home: ["1", "2", "3", "4", "5", "6"],
-                guest: ["1", "2", "3", "4", "5", "6"],
-            },
-            storicoServizio: [],
-        },
-    }
-}
-
-export function checkVittoria(state) {
-    const puntHome = state.sp.punt.home
-    const puntGuest = state.sp.punt.guest
-    const setHome = state.sp.set.home
-    const setGuest = state.sp.set.guest
-    const totSet = setHome + setGuest
-
-    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
-    }
-
-    return false
-}
-
-export function applyAction(state, action) {
-    // 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
-
-            s.sp.storicoServizio.push({
-                servHome: s.sp.servHome,
-                cambioPalla: (team === "home" && !s.sp.servHome) || (team === "guest" && s.sp.servHome),
-            })
-
-            s.sp.punt[team]++
-            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"
-            break
-        }
-
-        case "decPunt": {
-            if (s.sp.storicoServizio.length > 0) {
-                const tmpHome = s.sp.striscia.home.pop()
-                s.sp.striscia.guest.pop()
-                const statoServizio = s.sp.storicoServizio.pop()
-
-                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
-        }
-
-        case "incSet": {
-            const team = action.team
-            if (s.sp.set[team] === 2) {
-                s.sp.set[team] = 0
-            } else {
-                s.sp.set[team]++
-            }
-            break
-        }
-
-        case "cambiaPalla": {
-            if (s.sp.punt.home === 0 && s.sp.punt.guest === 0) {
-                s.sp.servHome = !s.sp.servHome
-                s.sp.striscia = s.sp.servHome
-                    ? { home: [0], guest: [" "] }
-                    : { home: [" "], guest: [0] }
-            }
-            break
-        }
-
-        case "resetta": {
-            s.visuForm = false
-            s.sp.punt.home = 0
-            s.sp.punt.guest = 0
-            s.sp.set.home = 0
-            s.sp.set.guest = 0
-            s.sp.form = {
-                home: ["1", "2", "3", "4", "5", "6"],
-                guest: ["1", "2", "3", "4", "5", "6"],
-            }
-            s.sp.striscia = s.sp.servHome
-                ? { home: [0], guest: [" "] }
-                : { home: [" "], guest: [0] }
-            s.sp.storicoServizio = []
-            break
-        }
-
-        case "toggleFormazione": {
-            s.visuForm = !s.visuForm
-            break
-        }
-
-        case "toggleStriscia": {
-            s.visuStriscia = !s.visuStriscia
-            break
-        }
-
-        case "toggleOrder": {
-            s.order = !s.order
-            break
-        }
-
-        case "setNomi": {
-            if (action.home !== undefined) s.sp.nomi.home = action.home
-            if (action.guest !== undefined) s.sp.nomi.guest = action.guest
-            break
-        }
-
-        case "setModalita": {
-            s.modalitaPartita = action.modalita
-            break
-        }
-
-        case "setFormazione": {
-            if (action.team && action.form) {
-                s.sp.form[action.team] = [...action.form]
-            }
-            break
-        }
-
-        case "confermaCambi": {
-            const team = action.team
-            const cambi = action.cambi || []
-            const form = s.sp.form[team].map((val) => String(val).trim())
-            const formAggiornata = [...form]
-
-            let valid = true
-            for (const cambio of cambi) {
-                const cin = (cambio.in || "").trim()
-                const cout = (cambio.out || "").trim()
-                if (!cin || !cout) continue
-                if (!/^\d+$/.test(cin) || !/^\d+$/.test(cout)) { valid = false; break }
-                if (cin === cout) { valid = false; break }
-                if (formAggiornata.includes(cin)) { valid = false; break }
-                if (!formAggiornata.includes(cout)) { valid = false; break }
-
-                const idx = formAggiornata.findIndex((val) => String(val).trim() === cout)
-                if (idx !== -1) {
-                    formAggiornata.splice(idx, 1, cin)
-                }
-            }
-
-            if (valid) {
-                s.sp.form[team] = formAggiornata
-            }
-            break
-        }
-
-        default:
-            break
-    }
-
-    return s
-}

src/main.js

@@ -3,10 +3,8 @@ 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.
+const app = createApp(App)
-// Il display viene montato direttamente.
+
-const app = createApp(DisplayPage)
 app.use(WaveUI)
 app.mount('#app')

src/server-utils.js

@@ -1,46 +0,0 @@
-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.') &&
-        !net.address.startsWith('172.18.')) {
-        networkIPs.push(net.address)
-      }
-    }
-  }
-
-  return networkIPs
-}
-
-/**
- * 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) {
-  const networkIPs = getNetworkIPs()
-
-  console.log(`\nSegnapunti Server`)
-  console.log(`   Display:      http://127.0.0.1:${displayPort}/`)
-  console.log(`   Controller:   http://127.0.0.1:${controllerPort}/`)
-
-  if (networkIPs.length > 0) {
-    console.log(`\n   Controller da dispositivi remoti:`)
-    networkIPs.forEach(ip => {
-      console.log(`   http://${ip}:${controllerPort}/`)
-    })
-  }
-
-  console.log()
-}

src/style.css

@@ -1,17 +1,33 @@
 :root {
   font-family: Inter, system-ui, Avenir, Helvetica, Arial, sans-serif;
-  touch-action: pan-x pan-y;
+  touch-action: none;
-  height: 100% 
+  height: 100%;
+  width: 100%;
+  overflow: hidden;
+}
+
+html {
+  height: 100%;
+  width: 100%;
+  overflow: hidden;
+  position: fixed;
 }
 
 body {
-  overscroll-behavior-y: contain;
+  overscroll-behavior: none;
   margin: 0;
+  padding: 0;
   place-items: center;
-  min-width: 320px;
   width: 100%;
-  min-height: 100vh;
+  height: 100vh;
+  height: 100dvh; /* Dynamic viewport height per mobile */
   background-color: #000;
+  overflow: hidden;
+  position: fixed;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
 }
 
 button {
@@ -38,8 +54,13 @@ button:focus-visible {
 }
 
 #app {
-  margin: 0 auto;
+  margin: 0;
+  padding: 0;
   text-align: center;
+  width: 100%;
+  height: 100%;
+  overflow: hidden;
+  position: relative;
 }
 .campo {
   user-select: none;
@@ -53,24 +74,11 @@ button:focus-visible {
   font-size: xx-large;
 }
 .hea span {
-/* Bordo di debug: border: 1px solid #f3fb00; */
+/* border: 1px solid #f3fb00; */
   padding-left: 10px;
   padding-right: 10px;
   border-radius: 5px;
 }
-.score-inline {
-  display: inline-block;
-  min-width: 3ch;
-  text-align: center;
-}
-.serv-slot {
-  display: inline-flex;
-  width: 25px;
-  height: 25px;
-  align-items: center;
-  justify-content: center;
-  vertical-align: middle;
-}
 .tal {
   text-align: left;
 }
@@ -93,23 +101,8 @@ button:focus-visible {
   float: left;
   width: 50%;
 }
-.punteggio-container {
-  width: 100%;
-  height: 100%;
-  display: flex;
-}
 .punt {
   font-size: 60vh;
-  flex: 1;
-  display: flex;
-  justify-content: center;
-  align-items: center;
-  cursor: pointer;
-  min-height: 50vh;
-  min-width: 50vw;
-  max-width: 50vw;
-  overflow: hidden;
-  box-sizing: border-box;
 }
 .form {
   font-size: 5vh;
@@ -135,145 +128,59 @@ button:focus-visible {
   color: white
 }
 .striscia {
-  position: fixed;
+  position:fixed;
+  text-align: right;
   bottom: 50px;
-  left: 10px;
   right: 10px;
-  display: grid;
+  margin-left: -10000px;
-  grid-template-columns: max-content 1fr;
-  row-gap: 2px;
-  align-items: center;
-}
-.striscia-nome {
-  white-space: nowrap;
-  padding-right: 6px;
-}
-.striscia-items {
-  display: flex;
-  flex-wrap: nowrap;
-  overflow: hidden;
 }
 .striscia .item {
   width: 25px;
-  min-width: 25px;
   text-align: center;
   font-weight: bold;
-  flex-shrink: 0;
+  display: inline-block;
-  border-radius: 5px;
-}
-.striscia .item:not(.item-vuoto) {
   background-color: rgb(206, 247, 3);
   color: blue;
+  border-radius: 5px;
 }
 
-.campo-config {
+/* Responsive mobile */
-  display: flex;
+@media (max-width: 768px) {
-  flex-direction: column;
+  .hea {
-  align-items: center;
+    font-size: 4vw;
-}
+  }
 
-.campo-pallavolo {
+  .hea span {
-  border: 3px solid #999;
+    padding-left: 5px;
-  background-color: rgba(205, 133, 63, 0.25);
+    padding-right: 5px;
-  position: relative;
+  }
-  width: 220px;
-  height: 220px;
-  display: flex;
-  flex-direction: column;
-  padding: 0;
-}
 
-.fila-anteriore {
+  .hea img {
-  height: 33.33%;
+    width: 18px !important;
-  display: flex;
+  }
-  align-items: center;
-  justify-content: center;
-  padding: 5px;
-}
 
-.fila-posteriore {
+  .punt {
-  height: 66.67%;
+    font-size: 45vh;
-  display: flex;
+  }
-  align-items: center;
-  justify-content: center;
-  padding: 5px;
-}
 
-.linea-tre-metri {
+  .form {
-  border-top: 2px solid #666;
+    font-size: 4vh;
-  width: 100%;
+    border-top: #fff dashed 15px;
-  height: 0;
+    padding-top: 30px;
-  margin: 0;
+  }
-}
 
-.cambi-rows {
+  .formdiv {
-  display: flex;
+    font-size: 15vh;
-  flex-direction: column;
+  }
-  gap: 12px;
-  padding: 8px 0;
-}
 
-.cambi-dialog {
+  .bot button {
-  padding: 8px 6px 2px;
+    font-size: 0.7em;
-}
+    padding: 0.4em 0.8em;
+    margin-left: 3px;
+    margin-right: 3px;
+  }
 
-.cambi-title {
+  .bot img {
-  text-align: center;
+    width: 20px !important;
-  font-weight: 800;
+  }
-  letter-spacing: 0.5px;
+}
-  margin-bottom: 8px;
-  padding-bottom: 6px;
-  border-bottom: 1px solid rgba(255, 255, 255, 0.15);
-}
-
-.cambi-row {
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  gap: 12px;
-}
-
-.cambi-arrow {
-  font-weight: 700;
-  font-size: 18px;
-  line-height: 1;
-  padding: 6px 8px;
-  border-radius: 999px;
-  background: rgba(255, 255, 255, 0.08);
-  white-space: nowrap;
-}
-
-.cambi-input {
-  min-width: 48px;
-  max-width: 64px;
-}
-
-.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;
-  color: #000;
-  text-align: center;
-  box-sizing: border-box;
-}
-
-.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 .w-input__input,
-.cambi-out .w-input__field {
-  background: rgba(200, 120, 120, 0.4);
-}
-
-.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;
-}

src/websocket-handler.js

@@ -1,199 +0,0 @@
-import { createInitialState, applyAction } from './gameState.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) {
-  // Stato globale della partita.
-  let gameState = createInitialState()
-
-  // Mappa dei ruoli associati ai client connessi.
-  const clients = new Map() // ws -> { role: 'display' | 'controller' }
-
-  /**
-   * Gestisce i messaggi in arrivo dal client
-   */
-  function handleMessage(ws, data) {
-    try {
-      // Converte il payload in stringa in modo sicuro, anche se arriva come Buffer.
-      const dataStr = typeof data === 'string' ? data : data.toString('utf8')
-      const msg = JSON.parse(dataStr)
-
-      if (msg.type === 'register') {
-        return handleRegister(ws, msg)
-      }
-
-      if (msg.type === 'action') {
-        return handleAction(ws, msg)
-      }
-
-      if (msg.type === 'speak') {
-        return handleSpeak(ws, msg)
-      }
-    } catch (err) {
-      console.error('Error processing message:', err, 'data:', data)
-      // Invia l'errore solo se la connessione e ancora aperta.
-      if (ws.readyState === 1) { // Stato WebSocket.OPEN
-        try {
-          sendError(ws, 'Invalid message format')
-        } catch (sendErr) {
-          console.error('Error sending error message:', sendErr)
-        }
-      }
-    }
-  }
-
-  /**
-   * Gestisce la registrazione di un client (display o controller)
-   */
-  function handleRegister(ws, msg) {
-    const role = msg.role || 'display'
-
-    // Valida il ruolo dichiarato dal client.
-    if (!['display', 'controller'].includes(role)) {
-      sendError(ws, 'Invalid role')
-      return
-    }
-
-    clients.set(ws, { role })
-    console.log(`[WebSocket] Client registered as: ${role} (total clients: ${clients.size})`)
-
-    // Invia subito lo stato corrente, se la connessione e aperta.
-    if (ws.readyState === 1) { // Stato WebSocket.OPEN
-      try {
-        ws.send(JSON.stringify({ type: 'state', state: gameState }))
-      } catch (err) {
-        console.error('Error sending initial state:', err)
-      }
-    }
-  }
-
-  /**
-   * Gestisce un'azione di gioco dal controller
-   */
-  function handleAction(ws, msg) {
-    // Solo i client controller possono inviare azioni.
-    const client = clients.get(ws)
-    if (!client || client.role !== 'controller') {
-      sendError(ws, 'Only controllers can send actions')
-      return
-    }
-
-    // Verifica il formato dell'azione ricevuta.
-    if (!msg.action || !msg.action.type) {
-      sendError(ws, 'Invalid action format')
-      return
-    }
-
-    // Applica l'azione allo stato della partita.
-    const previousState = gameState
-    try {
-      gameState = applyAction(gameState, msg.action)
-    } catch (err) {
-      console.error('Error applying action:', err)
-      sendError(ws, 'Failed to apply action')
-      gameState = previousState
-      return
-    }
-
-    // Propaga il nuovo stato a tutti i client connessi.
-    broadcastState()
-  }
-
-  /**
-   * Gestisce una richiesta di sintesi vocale proveniente dal controller.
-   * Il messaggio viene inoltrato solo ai client registrati come display.
-   */
-  function handleSpeak(ws, msg) {
-    const client = clients.get(ws)
-    if (!client || client.role !== 'controller') {
-      sendError(ws, 'Only controllers can request speech')
-      return
-    }
-
-    if (typeof msg.text !== 'string' || msg.text.trim() === '') {
-      sendError(ws, 'Invalid speak payload')
-      return
-    }
-
-    const speakMsg = JSON.stringify({ type: 'speak', text: msg.text.trim() })
-    clients.forEach((meta, clientWs) => {
-      if (meta.role === 'display' && clientWs.readyState === 1) {
-        clientWs.send(speakMsg)
-      }
-    })
-  }
-
-  /**
-   * Invia un messaggio di errore al client
-   */
-  function sendError(ws, message) {
-    if (ws.readyState === 1) { // Stato WebSocket.OPEN
-      try {
-        ws.send(JSON.stringify({ type: 'error', message }))
-      } catch (err) {
-        console.error('Failed to send error message:', err)
-      }
-    }
-  }
-
-  /**
-   * Invia lo stato corrente a tutti i client connessi.
-   */
-  function broadcastState() {
-    const stateMsg = JSON.stringify({ type: 'state', state: gameState })
-    wss.clients.forEach((client) => {
-      if (client.readyState === 1) { // Stato WebSocket.OPEN
-        client.send(stateMsg)
-      }
-    })
-  }
-
-  /**
-   * Gestisce la chiusura della connessione
-   */
-  function handleClose(ws) {
-    const client = clients.get(ws)
-    const role = client?.role || 'unknown'
-    console.log(`[WebSocket] Client disconnected (role: ${role})`)
-    clients.delete(ws)
-  }
-
-  /**
-   * Gestisce gli errori WebSocket
-   */
-  function handleError(err, ws) {
-    console.error('WebSocket error:', err)
-
-    // In caso di frame non validi, chiude forzatamente la connessione.
-    if (err.code === 'WS_ERR_INVALID_CLOSE_CODE' || err.code === 'WS_ERR_INVALID_UTF8') {
-      try {
-        if (ws && ws.readyState === 1) { // Stato WebSocket.OPEN
-          ws.terminate() // Chiusura forzata senza handshake di chiusura.
-        }
-      } catch (closeErr) {
-        console.error('Error closing connection:', closeErr)
-      }
-    }
-  }
-
-  // Registra gli handler per ogni nuova connessione.
-  wss.on('connection', (ws) => {
-    // Imposta il tipo binario per ridurre i problemi di codifica.
-    ws.binaryType = 'arraybuffer'
-
-    ws.on('message', (data) => handleMessage(ws, data))
-    ws.on('close', () => handleClose(ws))
-    ws.on('error', (err) => handleError(err, ws))
-  })
-
-  // Espone un'API pubblica per controllo esterno, se necessario.
-  return {
-    getState: () => gameState,
-    setState: (newState) => { gameState = newState },
-    broadcastState,
-    getClients: () => clients,
-  }
-}

tests/README.md

@@ -1,281 +0,0 @@
-# Guida ai Test
-
-Obiettivo della guida:
-- capire che tipi di test esistono nel progetto
-- capire a cosa servono davvero
-- sapere come lanciarli senza errori
-- sapere come leggere i risultati
-- sapere cosa fare quando qualcosa fallisce
-
-## 0) Perche facciamo i test?
-
-Un test è un controllo automatico.
-
-In pratica:
-- tu cambi il codice
-- lanci i test
-- i test ti dicono se hai rotto qualcosa
-
-Se i test sono verdi, hai una buona probabilita che il progetto sia ancora stabile.
-Se i test sono rossi, c'e un problema da capire e sistemare.
-
-## 1) Struttura delle cartelle test
-
-```text
-tests/
-├── unit/          # Test della logica pura (molto veloci)
-├── integration/   # Test di moduli che comunicano tra loro
-├── component/     # Test dei componenti Vue in isolamento
-├── stress/        # Test sotto carico (molti client/azioni)
-├── e2e/           # Test end-to-end su browser reale
-└── README.md      # Questa guida
-```
-
-## 2) Tecnologie usate
-
-- `Vitest`: per `unit`, `integration`, `component`, `stress`
-- `Playwright`: per `e2e`
-
-Tradotto in modo semplice:
-- Vitest controlla parti interne del progetto
-- Playwright controlla il comportamento reale dell'app nel browser
-
-## 3) Prerequisiti (prima di tutto)
-
-### 3.1 Installa dipendenze
-
-Dalla root del progetto:
-
-```bash
-npm install
-```
-
-### 3.2 Installa browser Playwright (solo E2E)
-
-```bash
-npx playwright install chromium firefox
-```
-
-Se non fai questo passo, gli E2E possono fallire subito con errore tipo:
-- `Executable doesn't exist`
-
-## 4) Comandi principali
-
-```bash
-npm run test            # Vitest in watch mode (resta in ascolto)
-npm run test:all        # Tutta la suite Vitest una volta
-npm run test:unit       # Unit + integration
-npm run test:component  # Solo component test
-npm run test:stress     # Solo stress test
-npm run test:e2e        # Tutti gli E2E Playwright
-npm run test:e2e:ui     # Playwright con interfaccia grafica
-```
-
-Ordine consigliato (quando vuoi verificare tutto):
-1. `npm run test:all`
-2. `npm run test:e2e`
-
-## 5) Cosa testa ogni suite (spiegato semplice)
-
-### 5.1 Unit (`tests/unit`)
-
-Cosa sono:
-- test piccoli e veloci sulla logica del gioco
-
-A cosa servono:
-- trovano subito bug in regole punteggio/set/reset
-
-Esempi reali nel progetto:
-- incremento/decremento punti
-- cambio palla
-- vittoria set con regola dei 2 punti di scarto
-- reset stato
-
-Quando falliscono:
-- quasi sempre c'e un problema nella logica core
-
-### 5.2 Integration (`tests/integration`)
-
-Cosa sono:
-- test su pezzi che lavorano insieme (es. WebSocket + handler)
-
-A cosa servono:
-- verificano che i messaggi si muovano nel modo corretto
-
-Esempi reali nel progetto:
-- registrazione client `display`/`controller`
-- broadcast stato ai client
-- validazione input malformati
-- autorizzazioni (solo controller puo inviare certe azioni)
-
-Quando falliscono:
-- spesso c'e problema nel protocollo messaggi o nei controlli di ruolo
-
-### 5.3 Component (`tests/component`)
-
-Cosa sono:
-- test dei componenti Vue senza browser completo
-
-A cosa servono:
-- controllano rendering e comportamento UI locale
-
-Esempi reali nel progetto:
-- punteggio mostrato correttamente
-- stato connessione
-- click bottoni controller
-- dialog reset/config/cambi
-
-Quando falliscono:
-- spesso hai rotto template, computed, metodi o binding
-
-### 5.4 Stress (`tests/stress`)
-
-Cosa sono:
-- test per simulare carico elevato
-
-A cosa servono:
-- verificano che il sistema regga molti client e molte azioni rapide
-
-Esempi reali nel progetto:
-- tanti client display connessi insieme
-- burst di azioni consecutive
-
-Quando falliscono:
-- possono emergere problemi di performance o consistenza stato
-
-### 5.5 End-to-End (`tests/e2e`)
-
-Cosa sono:
-- test realistici nel browser
-
-A cosa servono:
-- verificano che Controller e Display funzionino davvero insieme
-
-File principali:
-- `basic-flow.spec.cjs`: flusso base Controller <-> Display
-- `game-operations.spec.cjs`: reset, config, toggle, cambi
-- `game-simulation.spec.cjs`: simulazione partita
-- `full-match.spec.cjs`: scenari partita completi
-- `accessibility.spec.cjs`: controlli accessibilita con axe
-- `visual-regression.spec.cjs`: confronto screenshot con baseline
-
-Nota importante:
-- gli E2E sono configurati in seriale (`workers: 1`) per evitare interferenze sullo stato partita condiviso.
-
-## 6) Come leggere i risultati
-
-### 6.1 Risultati Vitest
-
-Caso OK (verde):
-
-```text
-Test Files  6 passed (6)
-Tests      159 passed (159)
-```
-
-Significa:
-- tutti i test Vitest sono passati
-
-Caso KO (rosso):
-- guarda prima il nome del file test
-- poi il nome del test (`describe/test`)
-- poi la riga con `expected` e `received`
-- infine vai alla riga indicata nello stack trace
-
-### 6.2 Risultati Playwright
-
-Caso OK:
-
-```text
-72 passed
-```
-
-Caso KO:
-- apri il report HTML
-
-```bash
-npx playwright show-report
-```
-
-Nel report puoi vedere:
-- step del test
-- errori precisi
-- screenshot/diff
-- trace
-
-## 7) Visual Regression (screenshot)
-
-I test visual confrontano immagini attuali con immagini baseline.
-
-Cartella baseline:
-- `tests/e2e/visual-regression.spec.cjs-snapshots/`
-
-Se cambia la UI in modo intenzionale:
-- aggiorna snapshot
-
-```bash
-npm run test:e2e -- --update-snapshots
-```
-
-Poi rilancia controllo:
-
-```bash
-npm run test:e2e
-```
-
-Se la UI non doveva cambiare:
-- non aggiornare snapshot
-- correggi prima il codice UI/CSS
-
-## 8) Errori comuni e soluzione veloce
-
-- Errore Playwright `Executable doesn't exist`:
-  - esegui `npx playwright install chromium firefox`
-
-- E2E instabili con punteggi strani:
-  - assicurati che i test restino seriali (`workers: 1`)
-  - assicurati che ogni test parta da stato pulito (reset)
-
-- Selettore ambiguo (esempio bottone `Cambi`):
-  - usa selector piu specifici, ad esempio `getByRole(..., { exact: true })`
-
-- Failure accessibilita:
-  - controlla prima `alt` delle immagini e contrasto colori
-
-## 9) Mini checklist prima di fare push
-
-Esegui:
-
-```bash
-npm run test:all
-npm run test:e2e
-```
-
-Se hai cambiato UI e i visual falliscono per differenze volute:
-
-```bash
-npm run test:e2e -- --update-snapshots
-npm run test:e2e
-```
-
-## 10) Come aggiungere un nuovo test (consigli pratici)
-
-- metti i test nel posto giusto:
-  - `tests/unit` per logica pura
-  - `tests/integration` per moduli che dialogano
-  - `tests/component` per Vue in isolamento
-  - `tests/stress` per carico
-  - `tests/e2e` per flussi reali
-
-- mantieni nomi chiari:
-  - il titolo del test deve spiegare cosa verifica
-
-- evita test dipendenti da ordine:
-  - ogni test deve potersi eseguire da solo
-
-- negli E2E:
-  - porta sempre il sistema in stato iniziale
-  - usa selector robusti
-  - limita `waitForTimeout` e preferisci attese su condizioni reali
-
-Se segui questi punti, i test restano stabili e facili da capire anche per chi entra ora nel progetto.

tests/component/ControllerPage.test.js

@@ -1,255 +0,0 @@
-// @vitest-environment happy-dom
-import { describe, it, expect, vi, beforeEach, afterEach } from 'vitest'
-import { mount } from '@vue/test-utils'
-import ControllerPage from '../../src/components/ControllerPage.vue'
-
-// Mock globale WebSocket per jsdom
-class MockWebSocket {
-    static OPEN = 1
-    static CONNECTING = 0
-    readyState = 0
-    onopen = null
-    onclose = null
-    onmessage = null
-    onerror = null
-    send = vi.fn()
-    close = vi.fn()
-    constructor() {
-        // Simula connessione immediata
-        setTimeout(() => {
-            this.readyState = 1
-            if (this.onopen) this.onopen()
-        }, 0)
-    }
-}
-
-vi.stubGlobal('WebSocket', MockWebSocket)
-
-// Helper per creare il componente con stato personalizzato
-function mountController(stateOverrides = {}) {
-    const wrapper = mount(ControllerPage, {
-        global: {
-            stubs: { 'w-app': true, 'w-button': true }
-        }
-    })
-    if (Object.keys(stateOverrides).length > 0) {
-        wrapper.vm.state = { ...wrapper.vm.state, ...stateOverrides }
-    }
-    return wrapper
-}
-
-describe('ControllerPage.vue', () => {
-
-    beforeEach(() => {
-        vi.useFakeTimers()
-    })
-
-    afterEach(() => {
-        vi.useRealTimers()
-    })
-
-    // =============================================
-    // RENDERING INIZIALE
-    // =============================================
-    describe('Rendering iniziale', () => {
-        it('dovrebbe mostrare i nomi dei team', () => {
-            const wrapper = mountController()
-            const text = wrapper.text()
-            expect(text).toContain('Antoniana')
-            expect(text).toContain('Guest')
-        })
-
-        it('dovrebbe mostrare punteggio 0-0', () => {
-            const wrapper = mountController()
-            const pts = wrapper.findAll('.team-pts')
-            expect(pts[0].text()).toBe('0')
-            expect(pts[1].text()).toBe('0')
-        })
-
-        it('dovrebbe mostrare SET 0 per entrambi i team', () => {
-            const wrapper = mountController()
-            const sets = wrapper.findAll('.team-set')
-            expect(sets[0].text()).toContain('SET 0')
-            expect(sets[1].text()).toContain('SET 0')
-        })
-    })
-
-    // =============================================
-    // CLICK PUNTEGGIO
-    // =============================================
-    describe('Click punteggio', () => {
-        it('dovrebbe chiamare sendAction con incPunt home al click sul team home', async () => {
-            const wrapper = mountController()
-            const spy = vi.spyOn(wrapper.vm, 'sendAction')
-            await wrapper.find('.team-score.home-bg').trigger('click')
-            expect(spy).toHaveBeenCalledWith({ type: 'incPunt', team: 'home' })
-        })
-
-        it('dovrebbe chiamare sendAction con incPunt guest al click sul team guest', async () => {
-            const wrapper = mountController()
-            const spy = vi.spyOn(wrapper.vm, 'sendAction')
-            await wrapper.find('.team-score.guest-bg').trigger('click')
-            expect(spy).toHaveBeenCalledWith({ type: 'incPunt', team: 'guest' })
-        })
-    })
-
-    // =============================================
-    // BOTTONE CAMBIO PALLA
-    // =============================================
-    describe('Cambio Palla', () => {
-        it('dovrebbe essere abilitato a 0-0', () => {
-            const wrapper = mountController()
-            const btn = wrapper.findAll('.btn-ctrl').find(b => b.text().includes('Cambio Palla'))
-            expect(btn.attributes('disabled')).toBeUndefined()
-        })
-
-        it('dovrebbe essere disabilitato se il punteggio non è 0-0', async () => {
-            const wrapper = mountController()
-            wrapper.vm.state.sp.punt.home = 5
-            await wrapper.vm.$nextTick()
-            const btn = wrapper.findAll('.btn-ctrl').find(b => b.text().includes('Cambio Palla'))
-            expect(btn.attributes('disabled')).toBeDefined()
-        })
-    })
-
-    // =============================================
-    // DIALOG RESET
-    // =============================================
-    describe('Dialog Reset', () => {
-        it('click Reset dovrebbe aprire la conferma', async () => {
-            const wrapper = mountController()
-            expect(wrapper.find('.overlay').exists()).toBe(false)
-            await wrapper.find('.btn-danger').trigger('click')
-            expect(wrapper.vm.confirmReset).toBe(true)
-            expect(wrapper.find('.overlay').exists()).toBe(true)
-        })
-
-        it('click NO dovrebbe chiudere la conferma', async () => {
-            const wrapper = mountController()
-            wrapper.vm.confirmReset = true
-            await wrapper.vm.$nextTick()
-            await wrapper.find('.btn-cancel').trigger('click')
-            expect(wrapper.vm.confirmReset).toBe(false)
-        })
-
-        it('click SI dovrebbe chiamare doReset', async () => {
-            const wrapper = mountController()
-            const spy = vi.spyOn(wrapper.vm, 'sendAction')
-            wrapper.vm.confirmReset = true
-            await wrapper.vm.$nextTick()
-            await wrapper.find('.btn-confirm').trigger('click')
-            expect(spy).toHaveBeenCalledWith({ type: 'resetta' })
-            expect(wrapper.vm.confirmReset).toBe(false)
-        })
-    })
-
-    // =============================================
-    // COMPUTED cambiValid
-    // =============================================
-    describe('cambiValid', () => {
-        it('dovrebbe essere false se tutti i campi sono vuoti', () => {
-            const wrapper = mountController()
-            wrapper.vm.cambiData = [{ in: '', out: '' }, { in: '', out: '' }]
-            expect(wrapper.vm.cambiValid).toBe(false)
-        })
-
-        it('dovrebbe essere true con un cambio completo', () => {
-            const wrapper = mountController()
-            wrapper.vm.cambiData = [{ in: '10', out: '1' }, { in: '', out: '' }]
-            expect(wrapper.vm.cambiValid).toBe(true)
-        })
-
-        it('dovrebbe essere false con un cambio parziale (solo IN)', () => {
-            const wrapper = mountController()
-            wrapper.vm.cambiData = [{ in: '10', out: '' }, { in: '', out: '' }]
-            expect(wrapper.vm.cambiValid).toBe(false)
-        })
-
-        it('dovrebbe essere false con un cambio parziale (solo OUT)', () => {
-            const wrapper = mountController()
-            wrapper.vm.cambiData = [{ in: '', out: '1' }, { in: '', out: '' }]
-            expect(wrapper.vm.cambiValid).toBe(false)
-        })
-
-        it('dovrebbe essere true con due cambi completi', () => {
-            const wrapper = mountController()
-            wrapper.vm.cambiData = [{ in: '10', out: '1' }, { in: '11', out: '2' }]
-            expect(wrapper.vm.cambiValid).toBe(true)
-        })
-    })
-
-    // =============================================
-    // SPEAK
-    // =============================================
-    describe('speak', () => {
-        it('dovrebbe generare "zero a zero" a 0-0', () => {
-            const wrapper = mountController()
-            wrapper.vm.wsConnected = true
-            wrapper.vm.ws = { readyState: 1, send: vi.fn() }
-            wrapper.vm.speak()
-            const sent = JSON.parse(wrapper.vm.ws.send.mock.calls[0][0])
-            expect(sent.type).toBe('speak')
-            expect(sent.text).toBe('zero a zero')
-        })
-
-        it('dovrebbe generare "N pari" a punteggio uguale', () => {
-            const wrapper = mountController()
-            wrapper.vm.state.sp.punt.home = 5
-            wrapper.vm.state.sp.punt.guest = 5
-            wrapper.vm.wsConnected = true
-            wrapper.vm.ws = { readyState: 1, send: vi.fn() }
-            wrapper.vm.speak()
-            const sent = JSON.parse(wrapper.vm.ws.send.mock.calls[0][0])
-            expect(sent.text).toBe('5 pari')
-        })
-
-        it('dovrebbe annunciare prima il punteggio di chi batte (home serve)', () => {
-            const wrapper = mountController()
-            wrapper.vm.state.sp.punt.home = 15
-            wrapper.vm.state.sp.punt.guest = 10
-            wrapper.vm.state.sp.servHome = true
-            wrapper.vm.wsConnected = true
-            wrapper.vm.ws = { readyState: 1, send: vi.fn() }
-            wrapper.vm.speak()
-            const sent = JSON.parse(wrapper.vm.ws.send.mock.calls[0][0])
-            expect(sent.text).toBe('15 a 10')
-        })
-
-        it('dovrebbe annunciare prima il punteggio di chi batte (guest serve)', () => {
-            const wrapper = mountController()
-            wrapper.vm.state.sp.punt.home = 10
-            wrapper.vm.state.sp.punt.guest = 15
-            wrapper.vm.state.sp.servHome = false
-            wrapper.vm.wsConnected = true
-            wrapper.vm.ws = { readyState: 1, send: vi.fn() }
-            wrapper.vm.speak()
-            const sent = JSON.parse(wrapper.vm.ws.send.mock.calls[0][0])
-            expect(sent.text).toBe('15 a 10')
-        })
-    })
-
-    // =============================================
-    // BARRA CONNESSIONE
-    // =============================================
-    describe('Barra connessione', () => {
-        it('dovrebbe avere classe "connected" quando connesso', async () => {
-            const wrapper = mountController()
-            wrapper.vm.wsConnected = true
-            await wrapper.vm.$nextTick()
-            expect(wrapper.find('.conn-bar').classes()).toContain('connected')
-        })
-
-        it('non dovrebbe avere classe "connected" quando disconnesso', () => {
-            const wrapper = mountController()
-            wrapper.vm.wsConnected = false
-            expect(wrapper.find('.conn-bar').classes()).not.toContain('connected')
-        })
-
-        it('dovrebbe mostrare "Connesso" quando connesso', async () => {
-            const wrapper = mountController()
-            wrapper.vm.wsConnected = true
-            await wrapper.vm.$nextTick()
-            expect(wrapper.find('.conn-bar').text()).toContain('Connesso')
-        })
-    })
-})

tests/component/DisplayPage.test.js

@@ -1,195 +0,0 @@
-// @vitest-environment happy-dom
-import { describe, it, expect, vi, beforeEach, afterEach } from 'vitest'
-import { mount } from '@vue/test-utils'
-import DisplayPage from '../../src/components/DisplayPage.vue'
-
-// Mock globale WebSocket per jsdom
-class MockWebSocket {
-    static OPEN = 1
-    static CONNECTING = 0
-    readyState = 0
-    onopen = null
-    onclose = null
-    onmessage = null
-    onerror = null
-    send = vi.fn()
-    close = vi.fn()
-    constructor() {
-        setTimeout(() => {
-            this.readyState = 1
-            if (this.onopen) this.onopen()
-        }, 0)
-    }
-}
-
-vi.stubGlobal('WebSocket', MockWebSocket)
-
-// Mock requestFullscreen e speechSynthesis
-vi.stubGlobal('speechSynthesis', {
-    speak: vi.fn(),
-    cancel: vi.fn(),
-    getVoices: () => []
-})
-
-function mountDisplay() {
-    return mount(DisplayPage, {
-        global: {
-            stubs: { 'w-app': true }
-        }
-    })
-}
-
-describe('DisplayPage.vue', () => {
-
-    beforeEach(() => {
-        vi.useFakeTimers()
-    })
-
-    afterEach(() => {
-        vi.useRealTimers()
-    })
-
-    // =============================================
-    // RENDERING PUNTEGGIO
-    // =============================================
-    describe('Rendering punteggio', () => {
-        it('dovrebbe mostrare i nomi dei team', () => {
-            const wrapper = mountDisplay()
-            const text = wrapper.text()
-            expect(text).toContain('Antoniana')
-            expect(text).toContain('Guest')
-        })
-
-        it('dovrebbe mostrare punteggio iniziale 0-0', () => {
-            const wrapper = mountDisplay()
-            const punti = wrapper.findAll('.punt')
-            expect(punti[0].text()).toBe('0')
-            expect(punti[1].text()).toBe('0')
-        })
-
-        it('dovrebbe mostrare i set corretti', () => {
-            const wrapper = mountDisplay()
-            const text = wrapper.text()
-            expect(text).toContain('set 0')
-        })
-
-        it('dovrebbe aggiornare il punteggio quando lo stato cambia', async () => {
-            const wrapper = mountDisplay()
-            wrapper.vm.state.sp.punt.home = 15
-            wrapper.vm.state.sp.punt.guest = 12
-            await wrapper.vm.$nextTick()
-            const punti = wrapper.findAll('.punt')
-            expect(punti[0].text()).toBe('15')
-            expect(punti[1].text()).toBe('12')
-        })
-    })
-
-    // =============================================
-    // ORDINE TEAM
-    // =============================================
-    describe('Ordine team', () => {
-        it('order=true → Home prima di Guest', () => {
-            const wrapper = mountDisplay()
-            const headers = wrapper.findAll('.hea')
-            expect(headers[0].classes()).toContain('home')
-            expect(headers[1].classes()).toContain('guest')
-        })
-
-        it('order=false → Guest prima di Home', async () => {
-            const wrapper = mountDisplay()
-            wrapper.vm.state.order = false
-            await wrapper.vm.$nextTick()
-            const headers = wrapper.findAll('.hea')
-            expect(headers[0].classes()).toContain('guest')
-            expect(headers[1].classes()).toContain('home')
-        })
-    })
-
-    // =============================================
-    // FORMAZIONE vs PUNTEGGIO
-    // =============================================
-    describe('visuForm toggle', () => {
-        it('visuForm=false → mostra punteggio grande', () => {
-            const wrapper = mountDisplay()
-            expect(wrapper.find('.punteggio-container').exists()).toBe(true)
-            expect(wrapper.find('.form').exists()).toBe(false)
-        })
-
-        it('visuForm=true → mostra formazione', async () => {
-            const wrapper = mountDisplay()
-            wrapper.vm.state.visuForm = true
-            await wrapper.vm.$nextTick()
-            expect(wrapper.findAll('.form').length).toBeGreaterThan(0)
-            expect(wrapper.find('.punteggio-container').exists()).toBe(false)
-        })
-
-        it('formazione mostra 6 giocatori per team', async () => {
-            const wrapper = mountDisplay()
-            wrapper.vm.state.visuForm = true
-            await wrapper.vm.$nextTick()
-            const formDivs = wrapper.findAll('.formdiv')
-            // 6 per home + 6 per guest = 12
-            expect(formDivs).toHaveLength(12)
-        })
-    })
-
-    // =============================================
-    // STRISCIA
-    // =============================================
-    describe('visuStriscia toggle', () => {
-        it('visuStriscia=true → mostra la striscia', () => {
-            const wrapper = mountDisplay()
-            expect(wrapper.find('.striscia').exists()).toBe(true)
-        })
-
-        it('visuStriscia=false → nasconde la striscia', async () => {
-            const wrapper = mountDisplay()
-            wrapper.vm.state.visuStriscia = false
-            await wrapper.vm.$nextTick()
-            expect(wrapper.find('.striscia').exists()).toBe(false)
-        })
-    })
-
-    // =============================================
-    // INDICATORE CONNESSIONE
-    // =============================================
-    describe('Indicatore connessione', () => {
-        it('dovrebbe avere classe "disconnected" quando non connesso', () => {
-            const wrapper = mountDisplay()
-            const status = wrapper.find('.connection-status')
-            expect(status.classes()).toContain('disconnected')
-        })
-
-        it('dovrebbe avere classe "connected" quando connesso', async () => {
-            const wrapper = mountDisplay()
-            wrapper.vm.wsConnected = true
-            await wrapper.vm.$nextTick()
-            const status = wrapper.find('.connection-status')
-            expect(status.classes()).toContain('connected')
-        })
-
-        it('dovrebbe mostrare "Disconnesso" quando non connesso', () => {
-            const wrapper = mountDisplay()
-            const status = wrapper.find('.connection-status')
-            expect(status.text()).toContain('Disconnesso')
-        })
-    })
-
-    // =============================================
-    // ICONA SERVIZIO
-    // =============================================
-    describe('Icona servizio', () => {
-        it('dovrebbe mostrare l\'icona servizio sul team home quando servHome=true', () => {
-            const wrapper = mountDisplay()
-            // v-show imposta display:none. In happy-dom controlliamo lo style.
-            const imgs = wrapper.findAll('.serv-slot img')
-            // Con state.order=true e servHome=true:
-            // - la prima img (home) è visibile (no display:none)
-            // - la seconda img (guest) ha display:none
-            const homeStyle = imgs[0].attributes('style') || ''
-            const guestStyle = imgs[1].attributes('style') || ''
-            expect(homeStyle).not.toContain('display: none')
-            expect(guestStyle).toContain('display: none')
-        })
-    })
-})

tests/e2e/accessibility.spec.cjs

@@ -1,72 +0,0 @@
-const { test, expect } = require('@playwright/test');
-const AxeBuilderImport = require('@axe-core/playwright');
-const AxeBuilder = AxeBuilderImport.default || AxeBuilderImport;
-
-test.describe('Accessibility (a11y)', () => {
-
-    test('Display: non dovrebbe avere violazioni critiche a11y', async ({ page }) => {
-        await page.goto('http://localhost:3000');
-        await page.waitForTimeout(500);
-
-        const results = await new AxeBuilder({ page })
-            .withTags(['wcag2a', 'wcag2aa'])
-            .disableRules(['color-contrast']) // il display ha sfondo nero con testo grande, valutato separatamente
-            .analyze();
-
-        expect(results.violations).toEqual([]);
-    });
-
-    test('Controller: non dovrebbe avere violazioni critiche a11y', async ({ page }) => {
-        await page.goto('http://localhost:3001');
-        await page.waitForTimeout(500);
-
-        const results = await new AxeBuilder({ page })
-            .withTags(['wcag2a', 'wcag2aa'])
-            .analyze();
-
-        // Mostra i dettagli delle violazioni se ci sono
-        if (results.violations.length > 0) {
-            console.log('A11y violations:', JSON.stringify(results.violations.map(v => ({
-                id: v.id,
-                impact: v.impact,
-                description: v.description,
-                nodes: v.nodes.length
-            })), null, 2));
-        }
-
-        // Accettiamo solo violazioni minor (non critiche o serie)
-        const serious = results.violations.filter(v =>
-            v.impact === 'critical' || v.impact === 'serious'
-        );
-        expect(serious).toEqual([]);
-    });
-
-    test('Controller: i touch target dovrebbero avere dimensione minima', async ({ page }) => {
-        await page.goto('http://localhost:3001');
-        await page.waitForSelector('.conn-bar.connected');
-
-        // Controlla che i bottoni principali abbiano dimensione minima 44x44px
-        const buttons = page.locator('.btn-ctrl');
-        const count = await buttons.count();
-
-        for (let i = 0; i < count; i++) {
-            const box = await buttons.nth(i).boundingBox();
-            expect(box.width).toBeGreaterThanOrEqual(44);
-            expect(box.height).toBeGreaterThanOrEqual(44);
-        }
-    });
-
-    test('Controller: i bottoni punteggio dovrebbero avere dimensione adeguata', async ({ page }) => {
-        await page.goto('http://localhost:3001');
-        await page.waitForSelector('.conn-bar.connected');
-
-        const scoreButtons = page.locator('.team-score');
-        const count = await scoreButtons.count();
-
-        for (let i = 0; i < count; i++) {
-            const box = await scoreButtons.nth(i).boundingBox();
-            expect(box.width).toBeGreaterThanOrEqual(100);
-            expect(box.height).toBeGreaterThanOrEqual(100);
-        }
-    });
-});

tests/e2e/basic-flow.spec.cjs

@@ -1,119 +0,0 @@
-const { test, expect } = require('@playwright/test');
-
-test.describe('Basic Flow: Controller ↔ Display', () => {
-
-    test('dovrebbe caricare Display e Controller con i titoli corretti', async ({ context }) => {
-        const displayPage = await context.newPage();
-        const controllerPage = await context.newPage();
-
-        await displayPage.goto('http://localhost:3000');
-        await controllerPage.goto('http://localhost:3001');
-
-        await expect(displayPage).toHaveTitle(/Segnapunti/);
-        await expect(controllerPage).toHaveTitle(/Controller/);
-    });
-
-    test('il punteggio iniziale dovrebbe essere 0-0', async ({ context }) => {
-        const controllerPage = await context.newPage();
-        await controllerPage.goto('http://localhost:3001');
-
-        // Attende la connessione WebSocket
-        await controllerPage.waitForSelector('.conn-bar.connected');
-
-        const homeScore = controllerPage.locator('.team-score.home-bg .team-pts');
-        const guestScore = controllerPage.locator('.team-score.guest-bg .team-pts');
-        await expect(homeScore).toHaveText('0');
-        await expect(guestScore).toHaveText('0');
-    });
-
-    test('click +1 Home sul Controller dovrebbe aggiornare il Display', async ({ context }) => {
-        const displayPage = await context.newPage();
-        const controllerPage = await context.newPage();
-
-        await displayPage.goto('http://localhost:3000');
-        await controllerPage.goto('http://localhost:3001');
-
-        // Attende la connessione WebSocket del controller
-        await controllerPage.waitForSelector('.conn-bar.connected');
-
-        // Reset per stato pulito
-        await controllerPage.getByText(/Reset/i).first().click();
-        const btnConfirm = controllerPage.locator('.dialog .btn-confirm');
-        if (await btnConfirm.isVisible()) {
-            await btnConfirm.click();
-        }
-        await controllerPage.waitForTimeout(200);
-
-        // Click +1 Home
-        await controllerPage.locator('.team-score.home-bg').click();
-        await controllerPage.waitForTimeout(200);
-
-        // Verifica Controller mostra 1
-        await expect(controllerPage.locator('.team-score.home-bg .team-pts')).toHaveText('1');
-
-        // Verifica Display mostra 1 (il punteggio grande)
-        await expect(displayPage.locator('.punt.home')).toHaveText('1');
-    });
-
-    test('click +1 Guest sul Controller dovrebbe aggiornare il Display', async ({ context }) => {
-        const displayPage = await context.newPage();
-        const controllerPage = await context.newPage();
-
-        await displayPage.goto('http://localhost:3000');
-        await controllerPage.goto('http://localhost:3001');
-
-        await controllerPage.waitForSelector('.conn-bar.connected');
-
-        // Reset
-        await controllerPage.getByText(/Reset/i).first().click();
-        const btnConfirm = controllerPage.locator('.dialog .btn-confirm');
-        if (await btnConfirm.isVisible()) {
-            await btnConfirm.click();
-        }
-        await controllerPage.waitForTimeout(200);
-
-        // Click +1 Guest
-        await controllerPage.locator('.team-score.guest-bg').click();
-        await controllerPage.waitForTimeout(200);
-
-        // Verifica Controller
-        await expect(controllerPage.locator('.team-score.guest-bg .team-pts')).toHaveText('1');
-
-        // Verifica Display
-        await expect(displayPage.locator('.punt.guest')).toHaveText('1');
-    });
-
-    test('la sincronizzazione dovrebbe funzionare con punti alternati', async ({ context }) => {
-        const displayPage = await context.newPage();
-        const controllerPage = await context.newPage();
-
-        await displayPage.goto('http://localhost:3000');
-        await controllerPage.goto('http://localhost:3001');
-
-        await controllerPage.waitForSelector('.conn-bar.connected');
-
-        // Reset
-        await controllerPage.getByText(/Reset/i).first().click();
-        const btnConfirm = controllerPage.locator('.dialog .btn-confirm');
-        if (await btnConfirm.isVisible()) {
-            await btnConfirm.click();
-        }
-        await controllerPage.waitForTimeout(200);
-
-        // Home +1, Guest +1, Home +1
-        await controllerPage.locator('.team-score.home-bg').click();
-        await controllerPage.waitForTimeout(100);
-        await controllerPage.locator('.team-score.guest-bg').click();
-        await controllerPage.waitForTimeout(100);
-        await controllerPage.locator('.team-score.home-bg').click();
-        await controllerPage.waitForTimeout(200);
-
-        // Controller: Home 2, Guest 1
-        await expect(controllerPage.locator('.team-score.home-bg .team-pts')).toHaveText('2');
-        await expect(controllerPage.locator('.team-score.guest-bg .team-pts')).toHaveText('1');
-
-        // Display: Home 2, Guest 1
-        await expect(displayPage.locator('.punt.home')).toHaveText('2');
-        await expect(displayPage.locator('.punt.guest')).toHaveText('1');
-    });
-});

tests/e2e/full-match.spec.cjs

@@ -1,131 +0,0 @@
-const { test, expect } = require('@playwright/test');
-
-// Helper: reset dal controller
-async function resetGame(controllerPage) {
-    await controllerPage.getByText(/Reset/i).first().click();
-    const btnConfirm = controllerPage.locator('.dialog .btn-confirm');
-    if (await btnConfirm.isVisible()) {
-        await btnConfirm.click();
-    }
-    await controllerPage.waitForTimeout(300);
-}
-
-// Helper: incrementa punti per una squadra N volte
-async function addPoints(controllerPage, team, count) {
-    const selector = team === 'home' ? '.team-score.home-bg' : '.team-score.guest-bg';
-    for (let i = 0; i < count; i++) {
-        await controllerPage.locator(selector).click();
-        await controllerPage.waitForTimeout(30);
-    }
-    await controllerPage.waitForTimeout(100);
-}
-
-// Helper: assegna un set a una squadra (25 punti + click SET)
-async function winSet(controllerPage, team) {
-    await addPoints(controllerPage, team, 25);
-    // Clicca bottone SET
-    const setSelector = team === 'home' ? '.btn-set.home-bg' : '.btn-set.guest-bg';
-    await controllerPage.locator(setSelector).click();
-    await controllerPage.waitForTimeout(100);
-    // Reset punti per il prossimo set
-    // (in questo gioco i punti non si resettano automaticamente, serve reset manuale
-    //  o il controller gestisce il prossimo set manualmente)
-}
-
-test.describe('Full Match Simulation', () => {
-
-    test('Partita 2/3: Home vince 2 set a 0', async ({ context }) => {
-        const controllerPage = await context.newPage();
-        await controllerPage.goto('http://localhost:3001');
-        await controllerPage.waitForSelector('.conn-bar.connected');
-
-        await resetGame(controllerPage);
-
-        // Cambia modalità a 2/3
-        await controllerPage.getByText('Config').click();
-        await controllerPage.waitForSelector('.dialog-config');
-        await controllerPage.locator('.btn-mode').getByText('2/3').click();
-        await controllerPage.locator('.dialog-config .btn-confirm').click();
-        await controllerPage.waitForTimeout(200);
-
-        // === SET 1: Home vince 25-0 ===
-        await addPoints(controllerPage, 'home', 25);
-
-        // Verifica punteggio 25
-        await expect(controllerPage.locator('.team-score.home-bg .team-pts')).toHaveText('25');
-
-        // Incrementa set Home
-        await controllerPage.locator('.btn-set.home-bg').click();
-        await controllerPage.waitForTimeout(100);
-
-        // Verifica set 1 per Home
-        await expect(controllerPage.locator('.team-score.home-bg .team-set')).toContainText('SET 1');
-    });
-
-    test('Set decisivo 2/3: vittoria a 15 punti', async ({ context }) => {
-        const controllerPage = await context.newPage();
-        await controllerPage.goto('http://localhost:3001');
-        await controllerPage.waitForSelector('.conn-bar.connected');
-
-        await resetGame(controllerPage);
-
-        // Cambia modalità a 2/3
-        await controllerPage.getByText('Config').click();
-        await controllerPage.waitForSelector('.dialog-config');
-        await controllerPage.locator('.btn-mode').getByText('2/3').click();
-        await controllerPage.locator('.dialog-config .btn-confirm').click();
-        await controllerPage.waitForTimeout(200);
-
-        // Imposta set 1-1 manualmente (simula set pareggiati)
-        await controllerPage.locator('.btn-set.home-bg').click();
-        await controllerPage.waitForTimeout(50);
-        await controllerPage.locator('.btn-set.guest-bg').click();
-        await controllerPage.waitForTimeout(100);
-
-        // Verifica set 1-1
-        await expect(controllerPage.locator('.team-score.home-bg .team-set')).toContainText('SET 1');
-        await expect(controllerPage.locator('.team-score.guest-bg .team-set')).toContainText('SET 1');
-
-        // === SET DECISIVO: Home porta a 15 ===
-        await addPoints(controllerPage, 'home', 15);
-
-        // Verifica punteggio 15 (e il set è decisivo: dopo 15 punti il gioco è vinto)
-        await expect(controllerPage.locator('.team-score.home-bg .team-pts')).toHaveText('15');
-
-        // Verifica che non si possono aggiungere altri punti (vittoria)
-        await controllerPage.locator('.team-score.home-bg').click();
-        await controllerPage.waitForTimeout(100);
-        // Dovrebbe restare 15 (checkVittoria blocca incPunt)
-        await expect(controllerPage.locator('.team-score.home-bg .team-pts')).toHaveText('15');
-    });
-
-    test('Set normale: punti oltre 25 fino ai vantaggi', async ({ context }) => {
-        const controllerPage = await context.newPage();
-        await controllerPage.goto('http://localhost:3001');
-        await controllerPage.waitForSelector('.conn-bar.connected');
-
-        await resetGame(controllerPage);
-
-        // Porta a 24-24
-        await addPoints(controllerPage, 'home', 24);
-        await addPoints(controllerPage, 'guest', 24);
-
-        await expect(controllerPage.locator('.team-score.home-bg .team-pts')).toHaveText('24');
-        await expect(controllerPage.locator('.team-score.guest-bg .team-pts')).toHaveText('24');
-
-        // Home va a 25 (non è vittoria perché serve scarto di 2)
-        await controllerPage.locator('.team-score.home-bg').click();
-        await controllerPage.waitForTimeout(100);
-        await expect(controllerPage.locator('.team-score.home-bg .team-pts')).toHaveText('25');
-
-        // Si possono ancora aggiungere punti (non è vittoria a 25-24)
-        await controllerPage.locator('.team-score.home-bg').click();
-        await controllerPage.waitForTimeout(100);
-        await expect(controllerPage.locator('.team-score.home-bg .team-pts')).toHaveText('26');
-
-        // 26-24 è vittoria → non si possono più aggiungere punti
-        await controllerPage.locator('.team-score.home-bg').click();
-        await controllerPage.waitForTimeout(100);
-        await expect(controllerPage.locator('.team-score.home-bg .team-pts')).toHaveText('26');
-    });
-});

tests/e2e/game-operations.spec.cjs

@@ -1,182 +0,0 @@
-const { test, expect } = require('@playwright/test');
-
-// Helper: reset dal controller
-async function resetGame(controllerPage) {
-    await controllerPage.getByText(/Reset/i).first().click();
-    const btnConfirm = controllerPage.locator('.dialog .btn-confirm');
-    if (await btnConfirm.isVisible()) {
-        await btnConfirm.click();
-    }
-    await controllerPage.waitForTimeout(300);
-}
-
-test.describe('Game Operations', () => {
-
-    test('Undo: dovrebbe annullare l\'ultimo punto', async ({ context }) => {
-        const controllerPage = await context.newPage();
-        await controllerPage.goto('http://localhost:3001');
-        await controllerPage.waitForSelector('.conn-bar.connected');
-
-        await resetGame(controllerPage);
-
-        // Incrementa Home a 1
-        await controllerPage.locator('.team-score.home-bg').click();
-        await controllerPage.waitForTimeout(100);
-        await expect(controllerPage.locator('.team-score.home-bg .team-pts')).toHaveText('1');
-
-        // Annulla
-        await controllerPage.getByText('ANNULLA PUNTO').click();
-        await controllerPage.waitForTimeout(100);
-        await expect(controllerPage.locator('.team-score.home-bg .team-pts')).toHaveText('0');
-    });
-
-    test('Reset: dovrebbe azzerare tutto dopo conferma', async ({ context }) => {
-        const controllerPage = await context.newPage();
-        await controllerPage.goto('http://localhost:3001');
-        await controllerPage.waitForSelector('.conn-bar.connected');
-
-        // Imposta qualche punto
-        for (let i = 0; i < 5; i++) {
-            await controllerPage.locator('.team-score.home-bg').click();
-            await controllerPage.waitForTimeout(50);
-        }
-        await expect(controllerPage.locator('.team-score.home-bg .team-pts')).toHaveText('5');
-
-        // Reset
-        await resetGame(controllerPage);
-
-        await expect(controllerPage.locator('.team-score.home-bg .team-pts')).toHaveText('0');
-        await expect(controllerPage.locator('.team-score.guest-bg .team-pts')).toHaveText('0');
-    });
-
-    test('Config: dovrebbe cambiare i nomi dei team', async ({ context }) => {
-        const displayPage = await context.newPage();
-        const controllerPage = await context.newPage();
-
-        await displayPage.goto('http://localhost:3000');
-        await controllerPage.goto('http://localhost:3001');
-        await controllerPage.waitForSelector('.conn-bar.connected');
-
-        // Apri config
-        await controllerPage.getByText('Config').click();
-        await controllerPage.waitForSelector('.dialog-config');
-
-        // Modifica nomi
-        const inputs = controllerPage.locator('.dialog-config .input-field');
-        await inputs.first().fill('Padova');
-        await inputs.nth(1).fill('Milano');
-
-        // Salva
-        await controllerPage.locator('.dialog-config .btn-confirm').click();
-        await controllerPage.waitForTimeout(300);
-
-        // Verifica sul Controller
-        await expect(controllerPage.locator('.team-score.home-bg .team-name')).toHaveText('Padova');
-        await expect(controllerPage.locator('.team-score.guest-bg .team-name')).toHaveText('Milano');
-
-        // Verifica sul Display
-        await expect(displayPage.locator('.hea.home')).toContainText('Padova');
-        await expect(displayPage.locator('.hea.guest')).toContainText('Milano');
-    });
-
-    test('Toggle Formazione: dovrebbe mostrare la formazione sul display', async ({ context }) => {
-        const displayPage = await context.newPage();
-        const controllerPage = await context.newPage();
-
-        await displayPage.goto('http://localhost:3000');
-        await controllerPage.goto('http://localhost:3001');
-        await controllerPage.waitForSelector('.conn-bar.connected');
-
-        // Inizialmente mostra punteggio, non formazione
-        await expect(displayPage.locator('.punteggio-container')).toBeVisible();
-
-        // Click Formazioni
-        await controllerPage.getByText('Formazioni').click();
-        await controllerPage.waitForTimeout(300);
-
-        // Il display mostra le formazioni
-        await expect(displayPage.locator('.form').first()).toBeVisible();
-    });
-
-    test('Toggle Striscia: dovrebbe nascondere/mostrare la striscia', async ({ context }) => {
-        const displayPage = await context.newPage();
-        const controllerPage = await context.newPage();
-
-        await displayPage.goto('http://localhost:3000');
-        await controllerPage.goto('http://localhost:3001');
-        await controllerPage.waitForSelector('.conn-bar.connected');
-
-        // Inizialmente la striscia è visibile
-        await expect(displayPage.locator('.striscia')).toBeVisible();
-
-        // Toggle off
-        await controllerPage.getByText('Striscia').click();
-        await controllerPage.waitForTimeout(300);
-        await expect(displayPage.locator('.striscia')).not.toBeVisible();
-
-        // Toggle on
-        await controllerPage.getByText('Striscia').click();
-        await controllerPage.waitForTimeout(300);
-        await expect(displayPage.locator('.striscia')).toBeVisible();
-    });
-
-    test('Cambi: dovrebbe effettuare una sostituzione giocatore', async ({ context }) => {
-        const displayPage = await context.newPage();
-        const controllerPage = await context.newPage();
-
-        await displayPage.goto('http://localhost:3000');
-        await controllerPage.goto('http://localhost:3001');
-        await controllerPage.waitForSelector('.conn-bar.connected');
-
-        await resetGame(controllerPage);
-
-        // Attiva formazione sul display per verificare
-        await controllerPage.getByText('Formazioni').click();
-        await controllerPage.waitForTimeout(200);
-
-        // Apri cambi → scegli Home
-        await controllerPage.getByRole('button', { name: 'Cambi', exact: true }).click();
-        await controllerPage.waitForTimeout(100);
-        await controllerPage.locator('.dialog .btn-set.home-bg').click();
-        await controllerPage.waitForTimeout(100);
-
-        // Inserisci sostituzione: IN=10, OUT=1
-        const inField = controllerPage.locator('.cambi-in-field').first();
-        const outField = controllerPage.locator('.cambi-out-field').first();
-        await inField.fill('10');
-        await outField.fill('1');
-
-        // Conferma
-        await controllerPage.locator('.dialog .btn-confirm').click();
-        await controllerPage.waitForTimeout(300);
-
-        // Verifica formazione aggiornata sul display
-        const formText = await displayPage.locator('.form.home').textContent();
-        expect(formText).toContain('10');
-    });
-
-    test('Cambi: dovrebbe mostrare errore per giocatore non in formazione', async ({ context }) => {
-        const controllerPage = await context.newPage();
-        await controllerPage.goto('http://localhost:3001');
-        await controllerPage.waitForSelector('.conn-bar.connected');
-
-        await resetGame(controllerPage);
-
-        // Apri cambi → scegli Home
-        await controllerPage.getByRole('button', { name: 'Cambi', exact: true }).click();
-        await controllerPage.waitForTimeout(100);
-        await controllerPage.locator('.dialog .btn-set.home-bg').click();
-        await controllerPage.waitForTimeout(100);
-
-        // Inserisci sostituzione invalida: OUT=99 (non in formazione)
-        await controllerPage.locator('.cambi-in-field').first().fill('10');
-        await controllerPage.locator('.cambi-out-field').first().fill('99');
-
-        // Conferma
-        await controllerPage.locator('.dialog .btn-confirm').click();
-        await controllerPage.waitForTimeout(200);
-
-        // Dovrebbe mostrare errore
-        await expect(controllerPage.locator('.cambi-error')).toBeVisible();
-    });
-});

tests/e2e/game-simulation.spec.cjs

@@ -1,69 +0,0 @@
-const { test, expect } = require('@playwright/test');
-
-test.describe('Game Simulation', () => {
-    test('Simulazione Partita: Controller aggiunge punti finché non cambia il set', async ({ context }) => {
-        // 1. Setup Pagine
-        const displayPage = await context.newPage();
-        const controllerPage = await context.newPage();
-
-        await displayPage.goto('http://localhost:3000');
-        await controllerPage.goto('http://localhost:3001');
-
-        // Selettori (basati su ID ipotetici o classi, adattali al tuo HTML reale)
-        // Assumo che nel DOM ci siano elementi con ID o classi riconoscibili
-        // E che i punteggi siano visibili.
-
-        // Pulisco lo stato iniziale (reset)
-        const btnReset = controllerPage.getByText(/Reset/i).first();
-        if (await btnReset.isVisible()) {
-            await btnReset.click();
-            // La modale di conferma ha un bottone "SI" con classe .btn-confirm
-            const btnConfirmReset = controllerPage.locator('.dialog .btn-confirm').getByText('SI');
-            if (await btnConfirmReset.isVisible()) {
-                await btnConfirmReset.click();
-            }
-        }
-
-        // 2. Loop per vincere il primo set (25 punti)
-        // In ControllerPage.vue, il click su .team-score.home-bg incrementa i punti home
-        const btnHomeScore = controllerPage.locator('.team-score.home-bg');
-
-        for (let i = 0; i < 25; i++) {
-            await btnHomeScore.click();
-            // Piccola pausa per lasciare tempo al server di processare e broadcastare
-            //await displayPage.waitForTimeout(10); 
-        }
-
-        // 3. Verifica Vittoria Set
-        // I punti dovrebbero essere tornati a 0 (o mostrare 25 prima del reset manuale?)
-        // Il codice gameState dice: checkVittoria -> resetta solo se qualcuno chiama resetta?
-        // No, checkVittoria è boolean. applyAction('incPunt') incrementa.
-        // Se vince, il set incrementa? 'incPunt' non incrementa i set in automatico nel codice gameState checkato prima!
-        // Controllo applyAction:
-        // "s.sp.punt[team]++" ... POI "checkVittoria(s)" all'inizio del prossimo incPunt?
-        // NO: "if (checkVittoria(s)) break" all'inizio di incPunt impedisce di andare oltre 25 se già vinto.
-        // MA 'incSet' è un'azione separata!
-
-        // Aspetta, la logica standard è: arrivo a 25 -> vinco set?
-        // In questo codice `gameState.js` NON c'è automatismo "arrivo a 25 -> set++ e palla al centro".
-        // L'utente deve cliccare "SET Antoniana" manualmente?
-        // Guardiamo ControllerPage.vue:
-        // C'è un bottone "SET {{ state.sp.nomi.home }}" che manda { type: 'incSet', team: 'home' }
-
-        // QUINDI: Il test deve:
-        // 1. Arrivare a 25 pt.
-        // 2. Cliccare "SET HOME".
-        // 3. Verificare che Set Home = 1.
-
-        // Verifica che siamo a 25
-        await expect(controllerPage.locator('.team-score.home-bg .team-pts')).toHaveText('25');
-
-        // Clicca bottone SET
-        const btnSetHome = controllerPage.locator('.btn-set.home-bg');
-        await btnSetHome.click();
-
-        // Verifica che il set sia incrementato
-        // Nota: display potrebbe chiamarsi diversamente, controlliamo Controller per coerenza
-        await expect(controllerPage.locator('.team-score.home-bg .team-set')).toContainText('SET 1');
-    });
-});

tests/e2e/visual-regression.spec.cjs

@@ -1,86 +0,0 @@
-const { test, expect } = require('@playwright/test');
-
-// Helper: reset dal controller
-async function resetGame(controllerPage) {
-    await controllerPage.getByText(/Reset/i).first().click();
-    const btnConfirm = controllerPage.locator('.dialog .btn-confirm');
-    if (await btnConfirm.isVisible()) {
-        await btnConfirm.click();
-    }
-    await controllerPage.waitForTimeout(300);
-}
-
-test.describe('Visual Regression', () => {
-
-    test('Display: screenshot a 0-0', async ({ context }) => {
-        const controllerPage = await context.newPage();
-        const displayPage = await context.newPage();
-
-        await controllerPage.goto('http://localhost:3001');
-        await displayPage.goto('http://localhost:3000');
-        await controllerPage.waitForSelector('.conn-bar.connected');
-
-        // Reset per stato pulito
-        await resetGame(controllerPage);
-
-        // Attende che il display riceva lo stato
-        await displayPage.waitForTimeout(500);
-
-        await expect(displayPage).toHaveScreenshot('display-0-0.png', {
-            maxDiffPixelRatio: 0.05,
-        });
-    });
-
-    test('Display: screenshot durante partita (15-12)', async ({ context }) => {
-        const controllerPage = await context.newPage();
-        const displayPage = await context.newPage();
-
-        await controllerPage.goto('http://localhost:3001');
-        await displayPage.goto('http://localhost:3000');
-        await controllerPage.waitForSelector('.conn-bar.connected');
-
-        await resetGame(controllerPage);
-
-        // Porta il punteggio a 15-12
-        for (let i = 0; i < 15; i++) {
-            await controllerPage.locator('.team-score.home-bg').click();
-            await controllerPage.waitForTimeout(20);
-        }
-        for (let i = 0; i < 12; i++) {
-            await controllerPage.locator('.team-score.guest-bg').click();
-            await controllerPage.waitForTimeout(20);
-        }
-        await displayPage.waitForTimeout(500);
-
-        await expect(displayPage).toHaveScreenshot('display-15-12.png', {
-            maxDiffPixelRatio: 0.05,
-        });
-    });
-
-    test('Controller: screenshot stato iniziale', async ({ context }) => {
-        const controllerPage = await context.newPage();
-        await controllerPage.goto('http://localhost:3001');
-        await controllerPage.waitForSelector('.conn-bar.connected');
-
-        await resetGame(controllerPage);
-
-        await expect(controllerPage).toHaveScreenshot('controller-initial.png', {
-            maxDiffPixelRatio: 0.05,
-        });
-    });
-
-    test('Controller: screenshot con modal config aperta', async ({ context }) => {
-        const controllerPage = await context.newPage();
-        await controllerPage.goto('http://localhost:3001');
-        await controllerPage.waitForSelector('.conn-bar.connected');
-
-        // Apri config
-        await controllerPage.getByText('Config').click();
-        await controllerPage.waitForSelector('.dialog-config');
-        await controllerPage.waitForTimeout(300);
-
-        await expect(controllerPage).toHaveScreenshot('controller-config-modal.png', {
-            maxDiffPixelRatio: 0.05,
-        });
-    });
-});

tests/integration/websocket.test.js

@@ -1,403 +0,0 @@
-import { describe, it, expect, beforeEach, vi, afterEach } from 'vitest'
-import { setupWebSocketHandler } from '../../src/websocket-handler.js'
-import { EventEmitter } from 'events'
-
-// Mock parziale di una WebSocket e del Server
-class MockWebSocket extends EventEmitter {
-    constructor() {
-        super()
-        this.readyState = 1 // OPEN
-    }
-    send = vi.fn()
-    terminate = vi.fn()
-}
-
-class MockWebSocketServer extends EventEmitter {
-    clients = new Set()
-}
-
-// Helper: connette e registra un client
-function connectAndRegister(wss, role) {
-    const ws = new MockWebSocket()
-    wss.emit('connection', ws)
-    wss.clients.add(ws)
-    ws.emit('message', JSON.stringify({ type: 'register', role }))
-    ws.send.mockClear()
-    return ws
-}
-
-// Helper: ultimo messaggio inviato a un ws
-function lastSent(ws) {
-    const calls = ws.send.mock.calls
-    return JSON.parse(calls[calls.length - 1][0])
-}
-
-describe('WebSocket Integration (websocket-handler.js)', () => {
-    let wss
-    let handler
-
-    beforeEach(() => {
-        wss = new MockWebSocketServer()
-        handler = setupWebSocketHandler(wss)
-    })
-
-    afterEach(() => {
-        vi.restoreAllMocks()
-    })
-
-    // =============================================
-    // REGISTRAZIONE
-    // =============================================
-    describe('Registrazione', () => {
-        it('dovrebbe registrare un client come "display" e inviare lo stato', () => {
-            const ws = new MockWebSocket()
-            wss.emit('connection', ws)
-            wss.clients.add(ws)
-            ws.emit('message', JSON.stringify({ type: 'register', role: 'display' }))
-
-            expect(ws.send).toHaveBeenCalled()
-            const sentMsg = JSON.parse(ws.send.mock.calls[0][0])
-            expect(sentMsg.type).toBe('state')
-            expect(sentMsg.state).toBeDefined()
-        })
-
-        it('dovrebbe registrare un client come "controller"', () => {
-            connectAndRegister(wss, 'controller')
-            expect(handler.getClients().size).toBe(1)
-        })
-
-        it('dovrebbe rifiutare ruolo non valido', () => {
-            const ws = new MockWebSocket()
-            wss.emit('connection', ws)
-            wss.clients.add(ws)
-            ws.emit('message', JSON.stringify({ type: 'register', role: 'hacker' }))
-
-            const sentMsg = JSON.parse(ws.send.mock.calls[0][0])
-            expect(sentMsg.type).toBe('error')
-            expect(sentMsg.message).toContain('Invalid role')
-        })
-
-        it('dovrebbe usare "display" come ruolo default se mancante', () => {
-            const ws = new MockWebSocket()
-            wss.emit('connection', ws)
-            wss.clients.add(ws)
-            ws.emit('message', JSON.stringify({ type: 'register' }))
-
-            const sentMsg = JSON.parse(ws.send.mock.calls[0][0])
-            expect(sentMsg.type).toBe('state')
-        })
-    })
-
-    // =============================================
-    // AZIONI
-    // =============================================
-    describe('Azioni', () => {
-        it('dovrebbe permettere al controller di cambiare il punteggio', () => {
-            const controller = connectAndRegister(wss, 'controller')
-
-            controller.emit('message', JSON.stringify({
-                type: 'action',
-                action: { type: 'incPunt', team: 'home' }
-            }))
-
-            expect(controller.send).toHaveBeenCalled()
-            const sentMsg = lastSent(controller)
-            expect(sentMsg.type).toBe('state')
-            expect(sentMsg.state.sp.punt.home).toBe(1)
-        })
-
-        it('dovrebbe impedire al display di inviare azioni', () => {
-            const display = connectAndRegister(wss, 'display')
-
-            display.emit('message', JSON.stringify({
-                type: 'action',
-                action: { type: 'incPunt', team: 'home' }
-            }))
-
-            const sentMsg = lastSent(display)
-            expect(sentMsg.type).toBe('error')
-            expect(sentMsg.message).toContain('Only controllers')
-        })
-
-        it('dovrebbe impedire azioni da client non registrati', () => {
-            const ws = new MockWebSocket()
-            wss.emit('connection', ws)
-            wss.clients.add(ws)
-
-            ws.emit('message', JSON.stringify({
-                type: 'action',
-                action: { type: 'incPunt', team: 'home' }
-            }))
-
-            const sentMsg = JSON.parse(ws.send.mock.calls[0][0])
-            expect(sentMsg.type).toBe('error')
-            expect(sentMsg.message).toContain('Only controllers')
-        })
-
-        it('dovrebbe rifiutare azione con formato invalido (missing action)', () => {
-            const controller = connectAndRegister(wss, 'controller')
-
-            controller.emit('message', JSON.stringify({
-                type: 'action'
-            }))
-
-            const sentMsg = lastSent(controller)
-            expect(sentMsg.type).toBe('error')
-            expect(sentMsg.message).toContain('Invalid action format')
-        })
-
-        it('dovrebbe rifiutare azione con formato invalido (missing action.type)', () => {
-            const controller = connectAndRegister(wss, 'controller')
-
-            controller.emit('message', JSON.stringify({
-                type: 'action',
-                action: { team: 'home' }
-            }))
-
-            const sentMsg = lastSent(controller)
-            expect(sentMsg.type).toBe('error')
-            expect(sentMsg.message).toContain('Invalid action format')
-        })
-    })
-
-    // =============================================
-    // BROADCAST MULTI-CLIENT
-    // =============================================
-    describe('Broadcast', () => {
-        it('dovrebbe inviare lo stato a tutti i client dopo un\'azione', () => {
-            const controller = connectAndRegister(wss, 'controller')
-            const display1 = connectAndRegister(wss, 'display')
-            const display2 = connectAndRegister(wss, 'display')
-
-            controller.emit('message', JSON.stringify({
-                type: 'action',
-                action: { type: 'incPunt', team: 'home' }
-            }))
-
-            // Tutti i client nel set dovrebbero aver ricevuto lo stato
-            expect(controller.send).toHaveBeenCalled()
-            expect(display1.send).toHaveBeenCalled()
-            expect(display2.send).toHaveBeenCalled()
-
-            const msg1 = lastSent(display1)
-            const msg2 = lastSent(display2)
-            expect(msg1.type).toBe('state')
-            expect(msg1.state.sp.punt.home).toBe(1)
-            expect(msg2.state.sp.punt.home).toBe(1)
-        })
-
-        it('non dovrebbe inviare a client con readyState != OPEN', () => {
-            const controller = connectAndRegister(wss, 'controller')
-            const closedClient = connectAndRegister(wss, 'display')
-            closedClient.readyState = 3 // CLOSED
-
-            controller.emit('message', JSON.stringify({
-                type: 'action',
-                action: { type: 'incPunt', team: 'home' }
-            }))
-
-            // closedClient non dovrebbe aver ricevuto il broadcast
-            expect(closedClient.send).not.toHaveBeenCalled()
-        })
-    })
-
-    // =============================================
-    // SPEAK
-    // =============================================
-    describe('Speak', () => {
-        it('dovrebbe inoltrare il messaggio speak solo ai display', () => {
-            const controller = connectAndRegister(wss, 'controller')
-            const display = connectAndRegister(wss, 'display')
-
-            controller.emit('message', JSON.stringify({
-                type: 'speak',
-                text: 'quindici a dieci'
-            }))
-
-            // Il display riceve il messaggio speak
-            expect(display.send).toHaveBeenCalled()
-            const msg = lastSent(display)
-            expect(msg.type).toBe('speak')
-            expect(msg.text).toBe('quindici a dieci')
-        })
-
-        it('non dovrebbe permettere al display di inviare speak', () => {
-            const display = connectAndRegister(wss, 'display')
-
-            display.emit('message', JSON.stringify({
-                type: 'speak',
-                text: 'test'
-            }))
-
-            const msg = lastSent(display)
-            expect(msg.type).toBe('error')
-            expect(msg.message).toContain('Only controllers')
-        })
-
-        it('dovrebbe rifiutare speak con testo vuoto', () => {
-            const controller = connectAndRegister(wss, 'controller')
-
-            controller.emit('message', JSON.stringify({
-                type: 'speak',
-                text: '   '
-            }))
-
-            const msg = lastSent(controller)
-            expect(msg.type).toBe('error')
-            expect(msg.message).toContain('Invalid speak payload')
-        })
-
-        it('dovrebbe rifiutare speak senza testo', () => {
-            const controller = connectAndRegister(wss, 'controller')
-
-            controller.emit('message', JSON.stringify({
-                type: 'speak'
-            }))
-
-            const msg = lastSent(controller)
-            expect(msg.type).toBe('error')
-        })
-
-        it('dovrebbe fare trim del testo speak', () => {
-            const controller = connectAndRegister(wss, 'controller')
-            const display = connectAndRegister(wss, 'display')
-
-            controller.emit('message', JSON.stringify({
-                type: 'speak',
-                text: '  dieci a otto  '
-            }))
-
-            const msg = lastSent(display)
-            expect(msg.text).toBe('dieci a otto')
-        })
-    })
-
-    // =============================================
-    // MESSAGGI MALFORMATI
-    // =============================================
-    describe('Messaggi malformati', () => {
-        it('dovrebbe gestire JSON non valido senza crash', () => {
-            const ws = new MockWebSocket()
-            wss.emit('connection', ws)
-            wss.clients.add(ws)
-
-            expect(() => {
-                ws.emit('message', 'questo non è JSON {{{')
-            }).not.toThrow()
-
-            const msg = lastSent(ws)
-            expect(msg.type).toBe('error')
-            expect(msg.message).toContain('Invalid message format')
-        })
-
-        it('dovrebbe gestire Buffer come input', () => {
-            const controller = connectAndRegister(wss, 'controller')
-
-            const buf = Buffer.from(JSON.stringify({
-                type: 'action',
-                action: { type: 'incPunt', team: 'home' }
-            }))
-
-            controller.emit('message', buf)
-
-            const msg = lastSent(controller)
-            expect(msg.type).toBe('state')
-            expect(msg.state.sp.punt.home).toBe(1)
-        })
-    })
-
-    // =============================================
-    // DISCONNESSIONE
-    // =============================================
-    describe('Disconnessione', () => {
-        it('dovrebbe rimuovere il client dalla mappa alla disconnessione', () => {
-            const controller = connectAndRegister(wss, 'controller')
-            expect(handler.getClients().size).toBe(1)
-
-            controller.emit('close')
-
-            expect(handler.getClients().size).toBe(0)
-        })
-
-        it('i client rimanenti non dovrebbero essere affetti dalla disconnessione', () => {
-            const controller = connectAndRegister(wss, 'controller')
-            const display = connectAndRegister(wss, 'display')
-            expect(handler.getClients().size).toBe(2)
-
-            controller.emit('close')
-            expect(handler.getClients().size).toBe(1)
-
-            expect(handler.getClients().has(display)).toBe(true)
-        })
-    })
-
-    // =============================================
-    // ERRORI WEBSOCKET
-    // =============================================
-    describe('Errori WebSocket', () => {
-        it('dovrebbe terminare la connessione per errore UTF8 invalido', () => {
-            const ws = new MockWebSocket()
-            wss.emit('connection', ws)
-
-            const err = new Error('Invalid UTF8')
-            err.code = 'WS_ERR_INVALID_UTF8'
-            ws.emit('error', err)
-
-            expect(ws.terminate).toHaveBeenCalled()
-        })
-
-        it('dovrebbe terminare la connessione per close code invalido', () => {
-            const ws = new MockWebSocket()
-            wss.emit('connection', ws)
-
-            const err = new Error('Invalid close code')
-            err.code = 'WS_ERR_INVALID_CLOSE_CODE'
-            ws.emit('error', err)
-
-            expect(ws.terminate).toHaveBeenCalled()
-        })
-
-        it('non dovrebbe terminare per altri errori', () => {
-            const ws = new MockWebSocket()
-            wss.emit('connection', ws)
-
-            const err = new Error('Generic error')
-            ws.emit('error', err)
-
-            expect(ws.terminate).not.toHaveBeenCalled()
-        })
-    })
-
-    // =============================================
-    // API PUBBLICA
-    // =============================================
-    describe('API pubblica', () => {
-        it('getState dovrebbe restituire lo stato corrente', () => {
-            const state = handler.getState()
-            expect(state.sp.punt.home).toBe(0)
-            expect(state.sp.punt.guest).toBe(0)
-        })
-
-        it('setState dovrebbe sovrascrivere lo stato', () => {
-            const newState = handler.getState()
-            newState.sp.punt.home = 99
-            handler.setState(newState)
-            expect(handler.getState().sp.punt.home).toBe(99)
-        })
-
-        it('broadcastState dovrebbe inviare a tutti i client', () => {
-            const display = connectAndRegister(wss, 'display')
-            handler.broadcastState()
-            expect(display.send).toHaveBeenCalled()
-            const msg = lastSent(display)
-            expect(msg.type).toBe('state')
-        })
-
-        it('getClients dovrebbe restituire la mappa dei client', () => {
-            expect(handler.getClients()).toBeInstanceOf(Map)
-            expect(handler.getClients().size).toBe(0)
-            connectAndRegister(wss, 'display')
-            expect(handler.getClients().size).toBe(1)
-        })
-    })
-})

tests/stress/websocket-load.test.js

@@ -1,118 +0,0 @@
-import { describe, it, expect, beforeEach, vi, afterEach } from 'vitest'
-import { setupWebSocketHandler } from '../../src/websocket-handler.js'
-import { EventEmitter } from 'events'
-
-class MockWebSocket extends EventEmitter {
-    constructor() {
-        super()
-        this.readyState = 1
-    }
-    send = vi.fn()
-    terminate = vi.fn()
-}
-
-class MockWebSocketServer extends EventEmitter {
-    clients = new Set()
-}
-
-function connectAndRegister(wss, role) {
-    const ws = new MockWebSocket()
-    wss.emit('connection', ws)
-    wss.clients.add(ws)
-    ws.emit('message', JSON.stringify({ type: 'register', role }))
-    ws.send.mockClear()
-    return ws
-}
-
-describe('Stress Test WebSocket', () => {
-    let wss
-    let handler
-
-    beforeEach(() => {
-        wss = new MockWebSocketServer()
-        handler = setupWebSocketHandler(wss)
-    })
-
-    afterEach(() => {
-        vi.restoreAllMocks()
-    })
-
-    it('dovrebbe gestire 50 client display connessi simultaneamente', () => {
-        const displays = []
-        for (let i = 0; i < 50; i++) {
-            displays.push(connectAndRegister(wss, 'display'))
-        }
-
-        expect(handler.getClients().size).toBe(50)
-
-        // Un controller invia un'azione
-        const controller = connectAndRegister(wss, 'controller')
-        controller.emit('message', JSON.stringify({
-            type: 'action',
-            action: { type: 'incPunt', team: 'home' }
-        }))
-
-        // Tutti i display devono aver ricevuto il broadcast
-        for (const display of displays) {
-            expect(display.send).toHaveBeenCalled()
-            const msg = JSON.parse(display.send.mock.calls[display.send.mock.calls.length - 1][0])
-            expect(msg.type).toBe('state')
-            expect(msg.state.sp.punt.home).toBe(1)
-        }
-    })
-
-    it('dovrebbe gestire 100 azioni rapide in sequenza con stato finale corretto', () => {
-        const controller = connectAndRegister(wss, 'controller')
-
-        // 60 punti home, 40 punti guest
-        for (let i = 0; i < 60; i++) {
-            controller.emit('message', JSON.stringify({
-                type: 'action',
-                action: { type: 'incPunt', team: 'home' }
-            }))
-        }
-        for (let i = 0; i < 40; i++) {
-            controller.emit('message', JSON.stringify({
-                type: 'action',
-                action: { type: 'incPunt', team: 'guest' }
-            }))
-        }
-
-        // Lo stato finale dipende da checkVittoria che blocca a 25+2
-        // Home arriva a 25-0 → vittoria → blocca. Quindi punti home = 25
-        const state = handler.getState()
-        expect(state.sp.punt.home).toBe(25)
-        // Guest: non può segnare dopo vittoria? No, checkVittoria blocca solo il team che ha vinto?
-        // Controlliamo: checkVittoria controlla ENTRAMBI i team.
-        // A 25-0 → vittoria=true → incPunt per guest è anche bloccato
-        expect(state.sp.punt.guest).toBe(0)
-    })
-
-    it('dovrebbe garantire che tutti i display ricevano ogni update sotto carico', () => {
-        const displays = []
-        for (let i = 0; i < 10; i++) {
-            displays.push(connectAndRegister(wss, 'display'))
-        }
-
-        const controller = connectAndRegister(wss, 'controller')
-
-        // 5 azioni rapide
-        for (let i = 0; i < 5; i++) {
-            controller.emit('message', JSON.stringify({
-                type: 'action',
-                action: { type: 'incPunt', team: 'home' }
-            }))
-        }
-
-        // Ogni display deve aver ricevuto esattamente 5 broadcast
-        for (const display of displays) {
-            expect(display.send).toHaveBeenCalledTimes(5)
-        }
-
-        // Verifica stato finale su tutti i display
-        for (const display of displays) {
-            const lastMsg = JSON.parse(display.send.mock.calls[4][0])
-            expect(lastMsg.state.sp.punt.home).toBe(5)
-        }
-    })
-})

tests/unit/cli.test.js

@@ -1,303 +0,0 @@
-import { vi, describe, it, expect, beforeAll, beforeEach } from 'vitest'
-
-// vi.hoisted garantisce che refs sia disponibile nelle factory dei mock,
-// che vengono hoistate prima degli import statici.
-const refs = vi.hoisted(() => ({ ws: null, rl: null }))
-
-// ---------------------------------------------------------------------------
-// Mock: ws
-// ---------------------------------------------------------------------------
-
-vi.mock('ws', async () => {
-  const { EventEmitter } = await import('events')
-
-  class WebSocket extends EventEmitter {
-    static OPEN = 1
-    constructor() {
-      super()
-      this.readyState = 1
-      this.send  = vi.fn()
-      this.close = vi.fn()
-      refs.ws = this
-    }
-  }
-
-  return { WebSocket }
-})
-
-// ---------------------------------------------------------------------------
-// Mock: readline
-// ---------------------------------------------------------------------------
-
-vi.mock('readline', async () => {
-  const { EventEmitter } = await import('events')
-
-  return {
-    default: {
-      createInterface: vi.fn(() => {
-        const rl    = new EventEmitter()
-        rl.prompt   = vi.fn()
-        rl.question = vi.fn()
-        rl.close    = vi.fn()
-        refs.rl     = rl
-        return rl
-      }),
-    },
-  }
-})
-
-// ---------------------------------------------------------------------------
-// Silenzia output e blocca process.exit durante i test
-// ---------------------------------------------------------------------------
-
-vi.spyOn(process, 'exit').mockImplementation(() => {})
-vi.spyOn(process.stdout, 'write').mockReturnValue(true)
-vi.spyOn(console, 'log').mockImplementation(() => {})
-vi.spyOn(console, 'error').mockImplementation(() => {})
-
-// ---------------------------------------------------------------------------
-// Importa cli.js — esegue gli effetti collaterali con le dipendenze mockate
-// ---------------------------------------------------------------------------
-
-beforeAll(async () => {
-  await import('../../cli.js')
-  refs.ws.emit('open')
-})
-
-// ---------------------------------------------------------------------------
-// Helper
-// ---------------------------------------------------------------------------
-
-function sendLine(line) {
-  refs.rl.emit('line', line)
-}
-
-function lastSent() {
-  const calls = refs.ws.send.mock.calls
-  return calls.length ? JSON.parse(calls[calls.length - 1][0]) : null
-}
-
-// ---------------------------------------------------------------------------
-// Test
-// ---------------------------------------------------------------------------
-
-describe('CLI — Registrazione', () => {
-  it('invia register con ruolo controller all\'apertura del WebSocket', () => {
-    const call = refs.ws.send.mock.calls.find((c) => {
-      try { return JSON.parse(c[0]).type === 'register' } catch { return false }
-    })
-    expect(call).toBeDefined()
-    expect(JSON.parse(call[0])).toEqual({ type: 'register', role: 'controller' })
-  })
-})
-
-describe('CLI — Ricezione messaggi', () => {
-  beforeEach(() => {
-    refs.rl.prompt.mockClear()
-    vi.mocked(console.error).mockClear()
-  })
-
-  it('ripristina il prompt dopo un messaggio "state"', () => {
-    const state = {
-      sp: { nomi: { home: 'A', guest: 'B' }, punt: { home: 0, guest: 0 }, set: { home: 0, guest: 0 }, servHome: true },
-      modalitaPartita: '3/5',
-    }
-    refs.ws.emit('message', JSON.stringify({ type: 'state', state }))
-    expect(refs.rl.prompt).toHaveBeenCalled()
-  })
-
-  it('mostra un errore alla ricezione di un messaggio "error"', () => {
-    refs.ws.emit('message', JSON.stringify({ type: 'error', message: 'azione non valida' }))
-    expect(console.error).toHaveBeenCalled()
-  })
-})
-
-describe('CLI — Comandi punteggio', () => {
-  beforeEach(() => refs.ws.send.mockClear())
-
-  it('"+"  → incPunt home', () => {
-    sendLine('+')
-    expect(lastSent()).toMatchObject({ type: 'action', action: { type: 'incPunt', team: 'home' } })
-  })
-
-  it('"pc" → incPunt home (shortcut)', () => {
-    sendLine('pc')
-    expect(lastSent()).toMatchObject({ type: 'action', action: { type: 'incPunt', team: 'home' } })
-  })
-
-  it('"-"  → incPunt guest', () => {
-    sendLine('-')
-    expect(lastSent()).toMatchObject({ type: 'action', action: { type: 'incPunt', team: 'guest' } })
-  })
-
-  it('"po" → incPunt guest (shortcut)', () => {
-    sendLine('po')
-    expect(lastSent()).toMatchObject({ type: 'action', action: { type: 'incPunt', team: 'guest' } })
-  })
-
-  it('"punto casa"   → incPunt home', () => {
-    sendLine('punto casa')
-    expect(lastSent()).toMatchObject({ type: 'action', action: { type: 'incPunt', team: 'home' } })
-  })
-
-  it('"punto ospite" → incPunt guest', () => {
-    sendLine('punto ospite')
-    expect(lastSent()).toMatchObject({ type: 'action', action: { type: 'incPunt', team: 'guest' } })
-  })
-
-  it('"punto" senza squadra → errore, nessun invio', () => {
-    sendLine('punto')
-    expect(refs.ws.send).not.toHaveBeenCalled()
-    expect(console.error).toHaveBeenCalled()
-  })
-
-  it('"undo"  → decPunt', () => {
-    sendLine('undo')
-    expect(lastSent()).toMatchObject({ type: 'action', action: { type: 'decPunt' } })
-  })
-
-  it('"u"    → decPunt (shortcut)', () => {
-    sendLine('u')
-    expect(lastSent()).toMatchObject({ type: 'action', action: { type: 'decPunt' } })
-  })
-})
-
-describe('CLI — Comandi set', () => {
-  beforeEach(() => refs.ws.send.mockClear())
-
-  it('"set casa"   → incSet home', () => {
-    sendLine('set casa')
-    expect(lastSent()).toMatchObject({ type: 'action', action: { type: 'incSet', team: 'home' } })
-  })
-
-  it('"set ospite" → incSet guest', () => {
-    sendLine('set ospite')
-    expect(lastSent()).toMatchObject({ type: 'action', action: { type: 'incSet', team: 'guest' } })
-  })
-
-  it('"set" senza squadra → errore, nessun invio', () => {
-    sendLine('set')
-    expect(refs.ws.send).not.toHaveBeenCalled()
-    expect(console.error).toHaveBeenCalled()
-  })
-})
-
-describe('CLI — Comandi partita', () => {
-  beforeEach(() => refs.ws.send.mockClear())
-
-  it('"serv" → cambiaPalla', () => {
-    sendLine('serv')
-    expect(lastSent()).toMatchObject({ type: 'action', action: { type: 'cambiaPalla' } })
-  })
-
-  it('"nomi <casa> <ospite>" → setNomi con entrambi i nomi', () => {
-    sendLine('nomi Antoniana Riviera')
-    expect(lastSent()).toMatchObject({
-      type: 'action',
-      action: { type: 'setNomi', home: 'Antoniana', guest: 'Riviera' },
-    })
-  })
-
-  it('"nomi <casa>" → setNomi con solo nome casa', () => {
-    sendLine('nomi Antoniana')
-    const sent = lastSent()
-    expect(sent).toMatchObject({ type: 'action', action: { type: 'setNomi', home: 'Antoniana' } })
-    expect(sent.action.guest).toBeUndefined()
-  })
-
-  it('"nomi" senza argomenti → errore, nessun invio', () => {
-    sendLine('nomi')
-    expect(refs.ws.send).not.toHaveBeenCalled()
-    expect(console.error).toHaveBeenCalled()
-  })
-
-  it('"modalita 2/3" → setModalita 2/3', () => {
-    sendLine('modalita 2/3')
-    expect(lastSent()).toMatchObject({ type: 'action', action: { type: 'setModalita', modalita: '2/3' } })
-  })
-
-  it('"modalita 3/5" → setModalita 3/5', () => {
-    sendLine('modalita 3/5')
-    expect(lastSent()).toMatchObject({ type: 'action', action: { type: 'setModalita', modalita: '3/5' } })
-  })
-
-  it('"modalita" con valore non valido → errore, nessun invio', () => {
-    sendLine('modalita 4/7')
-    expect(refs.ws.send).not.toHaveBeenCalled()
-    expect(console.error).toHaveBeenCalled()
-  })
-})
-
-describe('CLI — Comando reset (con conferma)', () => {
-  beforeEach(() => {
-    refs.ws.send.mockClear()
-    refs.rl.question.mockClear()
-  })
-
-  it('conferma "s" → invia resetta', () => {
-    refs.rl.question.mockImplementationOnce((_msg, cb) => cb('s'))
-    sendLine('reset')
-    expect(lastSent()).toMatchObject({ type: 'action', action: { type: 'resetta' } })
-  })
-
-  it('risposta "n" → non invia nulla', () => {
-    refs.rl.question.mockImplementationOnce((_msg, cb) => cb('n'))
-    sendLine('reset')
-    expect(refs.ws.send).not.toHaveBeenCalled()
-  })
-
-  it('risposta vuota → non invia nulla', () => {
-    refs.rl.question.mockImplementationOnce((_msg, cb) => cb(''))
-    sendLine('reset')
-    expect(refs.ws.send).not.toHaveBeenCalled()
-  })
-})
-
-describe('CLI — Comandi informativi', () => {
-  beforeEach(() => {
-    refs.ws.send.mockClear()
-    vi.mocked(console.log).mockClear()
-  })
-
-  it('"help" → stampa aiuto, nessun invio', () => {
-    sendLine('help')
-    expect(console.log).toHaveBeenCalled()
-    expect(refs.ws.send).not.toHaveBeenCalled()
-  })
-
-  it('"stato" → nessun invio', () => {
-    sendLine('stato')
-    expect(refs.ws.send).not.toHaveBeenCalled()
-  })
-
-  it('comando sconosciuto → messaggio di errore, nessun invio', () => {
-    sendLine('xyzzy')
-    expect(refs.ws.send).not.toHaveBeenCalled()
-    expect(console.error).toHaveBeenCalled()
-  })
-
-  it('riga vuota → nessun invio', () => {
-    refs.rl.emit('line', '   ')
-    expect(refs.ws.send).not.toHaveBeenCalled()
-  })
-})
-
-describe('CLI — Uscita', () => {
-  it('"exit" → chiude il WebSocket', () => {
-    refs.ws.close.mockClear()
-    sendLine('exit')
-    expect(refs.ws.close).toHaveBeenCalled()
-  })
-
-  it('"q" → chiude il WebSocket (shortcut)', () => {
-    refs.ws.close.mockClear()
-    sendLine('q')
-    expect(refs.ws.close).toHaveBeenCalled()
-  })
-
-  it('chiusura readline → chiude il WebSocket', () => {
-    refs.ws.close.mockClear()
-    refs.rl.emit('close')
-    expect(refs.ws.close).toHaveBeenCalled()
-  })
-})

tests/unit/gameState.test.js

@@ -1,659 +0,0 @@
-import { describe, it, expect, beforeEach } from 'vitest'
-import { createInitialState, applyAction, checkVittoria } from '../../src/gameState.js'
-
-describe('Game Logic (gameState.js)', () => {
-    let state
-
-    beforeEach(() => {
-        state = createInitialState()
-    })
-
-    // =============================================
-    // STATO INIZIALE
-    // =============================================
-    describe('Stato iniziale', () => {
-        it('dovrebbe iniziare con 0-0', () => {
-            expect(state.sp.punt.home).toBe(0)
-            expect(state.sp.punt.guest).toBe(0)
-        })
-
-        it('dovrebbe avere i set a 0', () => {
-            expect(state.sp.set.home).toBe(0)
-            expect(state.sp.set.guest).toBe(0)
-        })
-
-        it('dovrebbe avere servizio Home', () => {
-            expect(state.sp.servHome).toBe(true)
-        })
-
-        it('dovrebbe avere formazione di default [1-6]', () => {
-            expect(state.sp.form.home).toEqual(["1", "2", "3", "4", "5", "6"])
-            expect(state.sp.form.guest).toEqual(["1", "2", "3", "4", "5", "6"])
-        })
-
-        it('dovrebbe avere la striscia iniziale a [0]', () => {
-            expect(state.sp.striscia.home).toEqual([0])
-            expect(state.sp.striscia.guest).toEqual([0])
-        })
-
-        it('dovrebbe avere storico servizio vuoto', () => {
-            expect(state.sp.storicoServizio).toEqual([])
-        })
-
-        it('dovrebbe avere modalità 3/5 di default', () => {
-            expect(state.modalitaPartita).toBe("3/5")
-        })
-
-        it('dovrebbe avere visuForm false e visuStriscia true', () => {
-            expect(state.visuForm).toBe(false)
-            expect(state.visuStriscia).toBe(true)
-        })
-    })
-
-    // =============================================
-    // IMMUTABILITÀ
-    // =============================================
-    describe('Immutabilità', () => {
-        it('applyAction non dovrebbe mutare lo stato originale', () => {
-            const original = JSON.stringify(state)
-            applyAction(state, { type: 'incPunt', team: 'home' })
-            expect(JSON.stringify(state)).toBe(original)
-        })
-
-        it('dovrebbe restituire un nuovo oggetto', () => {
-            const newState = applyAction(state, { type: 'incPunt', team: 'home' })
-            expect(newState).not.toBe(state)
-        })
-    })
-
-    // =============================================
-    // INCREMENTO PUNTI (incPunt)
-    // =============================================
-    describe('incPunt', () => {
-        it('dovrebbe incrementare i punti Home', () => {
-            const newState = applyAction(state, { type: 'incPunt', team: 'home' })
-            expect(newState.sp.punt.home).toBe(1)
-            expect(newState.sp.punt.guest).toBe(0)
-        })
-
-        it('dovrebbe incrementare i punti Guest', () => {
-            const newState = applyAction(state, { type: 'incPunt', team: 'guest' })
-            expect(newState.sp.punt.guest).toBe(1)
-            expect(newState.sp.punt.home).toBe(0)
-        })
-
-        it('dovrebbe gestire il cambio palla (Guest segna, batteva Home)', () => {
-            state.sp.servHome = true
-            const s1 = applyAction(state, { type: 'incPunt', team: 'guest' })
-            expect(s1.sp.servHome).toBe(false)
-        })
-
-        it('dovrebbe gestire il cambio palla (Home segna, batteva Guest)', () => {
-            state.sp.servHome = false
-            const s1 = applyAction(state, { type: 'incPunt', team: 'home' })
-            expect(s1.sp.servHome).toBe(true)
-        })
-
-        it('non dovrebbe cambiare palla se segna chi batte', () => {
-            state.sp.servHome = true
-            const s1 = applyAction(state, { type: 'incPunt', team: 'home' })
-            expect(s1.sp.servHome).toBe(true)
-        })
-
-        it('dovrebbe ruotare la formazione al cambio palla', () => {
-            state.sp.servHome = true
-            state.sp.form.guest = ["1", "2", "3", "4", "5", "6"]
-            const newState = applyAction(state, { type: 'incPunt', team: 'guest' })
-            expect(newState.sp.form.guest).toEqual(["2", "3", "4", "5", "6", "1"])
-        })
-
-        it('non dovrebbe ruotare la formazione se non c\'è cambio palla', () => {
-            state.sp.servHome = true
-            state.sp.form.home = ["1", "2", "3", "4", "5", "6"]
-            const newState = applyAction(state, { type: 'incPunt', team: 'home' })
-            expect(newState.sp.form.home).toEqual(["1", "2", "3", "4", "5", "6"])
-        })
-
-        it('dovrebbe aggiornare la striscia per punto Home', () => {
-            const s = applyAction(state, { type: 'incPunt', team: 'home' })
-            expect(s.sp.striscia.home).toEqual([0, 1])
-            expect(s.sp.striscia.guest).toEqual([0, " "])
-        })
-
-        it('dovrebbe aggiornare la striscia per punto Guest', () => {
-            const s = applyAction(state, { type: 'incPunt', team: 'guest' })
-            expect(s.sp.striscia.guest).toEqual([0, 1])
-            expect(s.sp.striscia.home).toEqual([0, " "])
-        })
-
-        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', () => {
-            state.sp.punt.home = 25
-            state.sp.punt.guest = 23
-            const s = applyAction(state, { type: 'incPunt', team: 'home' })
-            expect(s.sp.punt.home).toBe(25)
-        })
-    })
-
-    // =============================================
-    // DECREMENTO PUNTI (decPunt)
-    // =============================================
-    describe('decPunt', () => {
-        it('dovrebbe annullare l\'ultimo punto Home', () => {
-            const s1 = applyAction(state, { type: 'incPunt', team: 'home' })
-            const s2 = applyAction(s1, { type: 'decPunt' })
-            expect(s2.sp.punt.home).toBe(0)
-            expect(s2.sp.punt.guest).toBe(0)
-        })
-
-        it('dovrebbe annullare l\'ultimo punto Guest', () => {
-            const s1 = applyAction(state, { type: 'incPunt', team: 'guest' })
-            const s2 = applyAction(s1, { type: 'decPunt' })
-            expect(s2.sp.punt.home).toBe(0)
-            expect(s2.sp.punt.guest).toBe(0)
-        })
-
-        it('non dovrebbe fare nulla sullo stato iniziale', () => {
-            const s = applyAction(state, { type: 'decPunt' })
-            expect(s.sp.punt.home).toBe(0)
-            expect(s.sp.punt.guest).toBe(0)
-        })
-
-        it('dovrebbe ripristinare il servizio dopo undo con cambio palla', () => {
-            state.sp.servHome = true
-            const s1 = applyAction(state, { type: 'incPunt', team: 'guest' })
-            expect(s1.sp.servHome).toBe(false)
-            const s2 = applyAction(s1, { type: 'decPunt' })
-            expect(s2.sp.servHome).toBe(true)
-        })
-
-        it('dovrebbe invertire la rotazione dopo undo con cambio palla', () => {
-            state.sp.servHome = true
-            state.sp.form.guest = ["1", "2", "3", "4", "5", "6"]
-            const s1 = applyAction(state, { type: 'incPunt', team: 'guest' })
-            expect(s1.sp.form.guest).toEqual(["2", "3", "4", "5", "6", "1"])
-            const s2 = applyAction(s1, { type: 'decPunt' })
-            expect(s2.sp.form.guest).toEqual(["1", "2", "3", "4", "5", "6"])
-        })
-
-        it('dovrebbe ripristinare la striscia', () => {
-            const s1 = applyAction(state, { type: 'incPunt', team: 'home' })
-            const s2 = applyAction(s1, { type: 'decPunt' })
-            expect(s2.sp.striscia.home).toEqual([0])
-        })
-
-        it('dovrebbe gestire undo multipli in sequenza', () => {
-            let s = state
-            s = applyAction(s, { type: 'incPunt', team: 'home' })
-            s = applyAction(s, { type: 'incPunt', team: 'guest' })
-            s = applyAction(s, { type: 'incPunt', team: 'home' })
-            expect(s.sp.punt.home).toBe(2)
-            expect(s.sp.punt.guest).toBe(1)
-            s = applyAction(s, { type: 'decPunt' })
-            expect(s.sp.punt.home).toBe(1)
-            s = applyAction(s, { type: 'decPunt' })
-            expect(s.sp.punt.guest).toBe(0)
-            s = applyAction(s, { type: 'decPunt' })
-            expect(s.sp.punt.home).toBe(0)
-        })
-    })
-
-    // =============================================
-    // INCREMENTO SET (incSet)
-    // =============================================
-    describe('incSet', () => {
-        it('dovrebbe incrementare il set Home', () => {
-            const s = applyAction(state, { type: 'incSet', team: 'home' })
-            expect(s.sp.set.home).toBe(1)
-        })
-
-        it('dovrebbe incrementare il set Guest', () => {
-            const s = applyAction(state, { type: 'incSet', team: 'guest' })
-            expect(s.sp.set.guest).toBe(1)
-        })
-
-        it('dovrebbe fare wrap da 2 a 0', () => {
-            state.sp.set.home = 2
-            const s = applyAction(state, { type: 'incSet', team: 'home' })
-            expect(s.sp.set.home).toBe(0)
-        })
-
-        it('dovrebbe incrementare da 1 a 2', () => {
-            state.sp.set.home = 1
-            const s = applyAction(state, { type: 'incSet', team: 'home' })
-            expect(s.sp.set.home).toBe(2)
-        })
-    })
-
-    // =============================================
-    // CAMBIO PALLA (cambiaPalla)
-    // =============================================
-    describe('cambiaPalla', () => {
-        it('dovrebbe invertire il servizio a 0-0', () => {
-            expect(state.sp.servHome).toBe(true)
-            const s = applyAction(state, { type: 'cambiaPalla' })
-            expect(s.sp.servHome).toBe(false)
-        })
-
-        it('dovrebbe tornare a Home con doppio toggle', () => {
-            let s = applyAction(state, { type: 'cambiaPalla' })
-            s = applyAction(s, { type: 'cambiaPalla' })
-            expect(s.sp.servHome).toBe(true)
-        })
-
-        it('non dovrebbe cambiare palla se il punteggio non è 0-0', () => {
-            state.sp.punt.home = 1
-            const s = applyAction(state, { type: 'cambiaPalla' })
-            expect(s.sp.servHome).toBe(true)
-        })
-
-        it('non dovrebbe cambiare palla se Guest ha punti', () => {
-            state.sp.punt.guest = 3
-            const s = applyAction(state, { type: 'cambiaPalla' })
-            expect(s.sp.servHome).toBe(true)
-        })
-    })
-
-    // =============================================
-    // TOGGLE (toggleFormazione, toggleStriscia, toggleOrder)
-    // =============================================
-    describe('Toggle', () => {
-        it('toggleFormazione: false → true', () => {
-            expect(state.visuForm).toBe(false)
-            const s = applyAction(state, { type: 'toggleFormazione' })
-            expect(s.visuForm).toBe(true)
-        })
-
-        it('toggleFormazione: true → false', () => {
-            state.visuForm = true
-            const s = applyAction(state, { type: 'toggleFormazione' })
-            expect(s.visuForm).toBe(false)
-        })
-
-        it('toggleStriscia: true → false', () => {
-            expect(state.visuStriscia).toBe(true)
-            const s = applyAction(state, { type: 'toggleStriscia' })
-            expect(s.visuStriscia).toBe(false)
-        })
-
-        it('toggleOrder: true → false', () => {
-            expect(state.order).toBe(true)
-            const s = applyAction(state, { type: 'toggleOrder' })
-            expect(s.order).toBe(false)
-        })
-    })
-
-    // =============================================
-    // NOMI (setNomi)
-    // =============================================
-    describe('setNomi', () => {
-        it('dovrebbe aggiornare entrambi i nomi', () => {
-            const s = applyAction(state, { type: 'setNomi', home: 'Volley A', guest: 'Volley B' })
-            expect(s.sp.nomi.home).toBe('Volley A')
-            expect(s.sp.nomi.guest).toBe('Volley B')
-        })
-
-        it('dovrebbe aggiornare solo il nome Home se guest è undefined', () => {
-            const s = applyAction(state, { type: 'setNomi', home: 'Volley A' })
-            expect(s.sp.nomi.home).toBe('Volley A')
-            expect(s.sp.nomi.guest).toBe('Guest')
-        })
-
-        it('dovrebbe aggiornare solo il nome Guest se home è undefined', () => {
-            const s = applyAction(state, { type: 'setNomi', guest: 'Volley B' })
-            expect(s.sp.nomi.home).toBe('Antoniana')
-            expect(s.sp.nomi.guest).toBe('Volley B')
-        })
-    })
-
-    // =============================================
-    // MODALITÀ (setModalita)
-    // =============================================
-    describe('setModalita', () => {
-        it('dovrebbe cambiare in 2/3', () => {
-            const s = applyAction(state, { type: 'setModalita', modalita: '2/3' })
-            expect(s.modalitaPartita).toBe('2/3')
-        })
-
-        it('dovrebbe cambiare in 3/5', () => {
-            state.modalitaPartita = '2/3'
-            const s = applyAction(state, { type: 'setModalita', modalita: '3/5' })
-            expect(s.modalitaPartita).toBe('3/5')
-        })
-    })
-
-    // =============================================
-    // FORMAZIONE (setFormazione)
-    // =============================================
-    describe('setFormazione', () => {
-        it('dovrebbe sostituire la formazione Home', () => {
-            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)
-        })
-
-        it('dovrebbe sostituire la formazione Guest', () => {
-            const nuova = ["7", "8", "9", "10", "11", "12"]
-            const s = applyAction(state, { type: 'setFormazione', team: 'guest', form: nuova })
-            expect(s.sp.form.guest).toEqual(nuova)
-        })
-
-        it('non dovrebbe modificare se manca team', () => {
-            const s = applyAction(state, { type: 'setFormazione', form: ["7", "8", "9", "10", "11", "12"] })
-            expect(s.sp.form.home).toEqual(["1", "2", "3", "4", "5", "6"])
-        })
-
-        it('non dovrebbe modificare se manca form', () => {
-            const s = applyAction(state, { type: 'setFormazione', team: 'home' })
-            expect(s.sp.form.home).toEqual(["1", "2", "3", "4", "5", "6"])
-        })
-    })
-
-    // =============================================
-    // CAMBI GIOCATORI (confermaCambi)
-    // =============================================
-    describe('confermaCambi', () => {
-        it('dovrebbe effettuare una sostituzione valida', () => {
-            state.sp.form.home = ["1", "2", "3", "4", "5", "6"]
-            const s = applyAction(state, {
-                type: 'confermaCambi',
-                team: 'home',
-                cambi: [{ in: "10", out: "3" }]
-            })
-            expect(s.sp.form.home).toContain("10")
-            expect(s.sp.form.home).not.toContain("3")
-        })
-
-        it('dovrebbe gestire doppia sostituzione', () => {
-            state.sp.form.home = ["1", "2", "3", "4", "5", "6"]
-            const s = applyAction(state, {
-                type: 'confermaCambi',
-                team: 'home',
-                cambi: [
-                    { in: "10", out: "1" },
-                    { in: "11", out: "2" }
-                ]
-            })
-            expect(s.sp.form.home).toContain("10")
-            expect(s.sp.form.home).toContain("11")
-            expect(s.sp.form.home).not.toContain("1")
-            expect(s.sp.form.home).not.toContain("2")
-        })
-
-        it('non dovrebbe accettare input non numerico', () => {
-            state.sp.form.home = ["1", "2", "3", "4", "5", "6"]
-            const s = applyAction(state, {
-                type: 'confermaCambi',
-                team: 'home',
-                cambi: [{ in: "abc", out: "1" }]
-            })
-            expect(s.sp.form.home).toEqual(["1", "2", "3", "4", "5", "6"])
-        })
-
-        it('non dovrebbe accettare in == out', () => {
-            const s = applyAction(state, {
-                type: 'confermaCambi',
-                team: 'home',
-                cambi: [{ in: "1", out: "1" }]
-            })
-            expect(s.sp.form.home).toEqual(["1", "2", "3", "4", "5", "6"])
-        })
-
-        it('non dovrebbe accettare giocatore IN già in formazione', () => {
-            const s = applyAction(state, {
-                type: 'confermaCambi',
-                team: 'home',
-                cambi: [{ in: "2", out: "1" }]
-            })
-            expect(s.sp.form.home).toEqual(["1", "2", "3", "4", "5", "6"])
-        })
-
-        it('non dovrebbe accettare giocatore OUT non in formazione', () => {
-            const s = applyAction(state, {
-                type: 'confermaCambi',
-                team: 'home',
-                cambi: [{ in: "10", out: "99" }]
-            })
-            expect(s.sp.form.home).toEqual(["1", "2", "3", "4", "5", "6"])
-        })
-
-        it('dovrebbe saltare cambi con campo vuoto', () => {
-            const s = applyAction(state, {
-                type: 'confermaCambi',
-                team: 'home',
-                cambi: [
-                    { in: "", out: "" },
-                    { in: "10", out: "1" }
-                ]
-            })
-            expect(s.sp.form.home).toContain("10")
-        })
-
-        it('dovrebbe mantenere la posizione del giocatore sostituito', () => {
-            state.sp.form.home = ["1", "2", "3", "4", "5", "6"]
-            const s = applyAction(state, {
-                type: 'confermaCambi',
-                team: 'home',
-                cambi: [{ in: "10", out: "3" }]
-            })
-            expect(s.sp.form.home[2]).toBe("10")
-        })
-
-        it('dovrebbe gestire cambi sequenziali che dipendono l\'uno dall\'altro', () => {
-            // Sostituisci 1→10, poi 10→20 (il secondo dipende dal risultato del primo)
-            state.sp.form.home = ["1", "2", "3", "4", "5", "6"]
-            const s = applyAction(state, {
-                type: 'confermaCambi',
-                team: 'home',
-                cambi: [
-                    { in: "10", out: "1" },
-                    { in: "20", out: "10" }
-                ]
-            })
-            expect(s.sp.form.home).toContain("20")
-            expect(s.sp.form.home).not.toContain("1")
-            expect(s.sp.form.home).not.toContain("10")
-        })
-    })
-
-    // =============================================
-    // VITTORIA SET (checkVittoria)
-    // =============================================
-    describe('checkVittoria', () => {
-        it('non dovrebbe dare vittoria a 24-24', () => {
-            state.sp.punt.home = 24
-            state.sp.punt.guest = 24
-            expect(checkVittoria(state)).toBe(false)
-        })
-
-        it('dovrebbe dare vittoria a 25-23', () => {
-            state.sp.punt.home = 25
-            state.sp.punt.guest = 23
-            expect(checkVittoria(state)).toBe(true)
-        })
-
-        it('non dovrebbe dare vittoria a 25-24 (serve 2 punti di scarto)', () => {
-            state.sp.punt.home = 25
-            state.sp.punt.guest = 24
-            expect(checkVittoria(state)).toBe(false)
-        })
-
-        it('dovrebbe dare vittoria a 26-24', () => {
-            state.sp.punt.home = 26
-            state.sp.punt.guest = 24
-            expect(checkVittoria(state)).toBe(true)
-        })
-
-        it('dovrebbe dare vittoria Guest a 25-20', () => {
-            state.sp.punt.home = 20
-            state.sp.punt.guest = 25
-            expect(checkVittoria(state)).toBe(true)
-        })
-
-        it('dovrebbe dare vittoria ai vantaggi (30-28)', () => {
-            state.sp.punt.home = 30
-            state.sp.punt.guest = 28
-            expect(checkVittoria(state)).toBe(true)
-        })
-
-        it('non dovrebbe dare vittoria ai vantaggi senza scarto (28-27)', () => {
-            state.sp.punt.home = 28
-            state.sp.punt.guest = 27
-            expect(checkVittoria(state)).toBe(false)
-        })
-    })
-
-    // =============================================
-    // SET DECISIVO (15 punti)
-    // =============================================
-    describe('Set decisivo', () => {
-        it('modalità 3/5: set decisivo dopo 4 set totali → vittoria a 15', () => {
-            state.modalitaPartita = "3/5"
-            state.sp.set.home = 2
-            state.sp.set.guest = 2
-            state.sp.punt.home = 15
-            state.sp.punt.guest = 10
-            expect(checkVittoria(state)).toBe(true)
-        })
-
-        it('modalità 3/5: non vittoria a 14-10 nel set decisivo', () => {
-            state.modalitaPartita = "3/5"
-            state.sp.set.home = 2
-            state.sp.set.guest = 2
-            state.sp.punt.home = 14
-            state.sp.punt.guest = 10
-            expect(checkVittoria(state)).toBe(false)
-        })
-
-        it('modalità 3/5: vittoria a 15-13 nel set decisivo', () => {
-            state.modalitaPartita = "3/5"
-            state.sp.set.home = 2
-            state.sp.set.guest = 2
-            state.sp.punt.home = 15
-            state.sp.punt.guest = 13
-            expect(checkVittoria(state)).toBe(true)
-        })
-
-        it('modalità 3/5: non vittoria a 15-14 nel set decisivo (serve scarto)', () => {
-            state.modalitaPartita = "3/5"
-            state.sp.set.home = 2
-            state.sp.set.guest = 2
-            state.sp.punt.home = 15
-            state.sp.punt.guest = 14
-            expect(checkVittoria(state)).toBe(false)
-        })
-
-        it('modalità 3/5: vittoria a 16-14 nel set decisivo', () => {
-            state.modalitaPartita = "3/5"
-            state.sp.set.home = 2
-            state.sp.set.guest = 2
-            state.sp.punt.home = 16
-            state.sp.punt.guest = 14
-            expect(checkVittoria(state)).toBe(true)
-        })
-
-        it('modalità 2/3: set decisivo dopo 2 set totali → vittoria a 15', () => {
-            state.modalitaPartita = "2/3"
-            state.sp.set.home = 1
-            state.sp.set.guest = 1
-            state.sp.punt.home = 15
-            state.sp.punt.guest = 10
-            expect(checkVittoria(state)).toBe(true)
-        })
-
-        it('modalità 2/3: non vittoria a 24-20 nel set decisivo (soglia 15)', () => {
-            state.modalitaPartita = "2/3"
-            state.sp.set.home = 1
-            state.sp.set.guest = 1
-            state.sp.punt.home = 14
-            state.sp.punt.guest = 10
-            expect(checkVittoria(state)).toBe(false)
-        })
-
-        it('modalità 2/3: set non decisivo (1-0) → soglia 25', () => {
-            state.modalitaPartita = "2/3"
-            state.sp.set.home = 1
-            state.sp.set.guest = 0
-            state.sp.punt.home = 15
-            state.sp.punt.guest = 10
-            expect(checkVittoria(state)).toBe(false)
-        })
-
-        it('modalità 3/5: set non decisivo (2-1) → soglia 25', () => {
-            state.modalitaPartita = "3/5"
-            state.sp.set.home = 2
-            state.sp.set.guest = 1
-            state.sp.punt.home = 15
-            state.sp.punt.guest = 10
-            expect(checkVittoria(state)).toBe(false)
-        })
-    })
-
-    // =============================================
-    // RESET
-    // =============================================
-    describe('Reset', () => {
-        it('dovrebbe resettare punti e set a zero', () => {
-            state.sp.punt.home = 10
-            state.sp.punt.guest = 8
-            state.sp.set.home = 1
-            state.sp.set.guest = 1
-            const s = applyAction(state, { type: 'resetta' })
-            expect(s.sp.punt.home).toBe(0)
-            expect(s.sp.punt.guest).toBe(0)
-            expect(s.sp.set.home).toBe(0)
-            expect(s.sp.set.guest).toBe(0)
-        })
-
-        it('dovrebbe resettare formazioni a default', () => {
-            state.sp.form.home = ["10", "11", "12", "13", "14", "15"]
-            const s = applyAction(state, { type: 'resetta' })
-            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 resettare la striscia', () => {
-            state.sp.striscia = { home: [0, 1, 2, 3], guest: [0, " ", " ", 1] }
-            const s = applyAction(state, { type: 'resetta' })
-            expect(s.sp.striscia.home).toEqual([0])
-            expect(s.sp.striscia.guest).toEqual([0])
-        })
-
-        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', () => {
-            state.visuForm = true
-            const s = applyAction(state, { type: 'resetta' })
-            expect(s.visuForm).toBe(false)
-        })
-
-        it('dovrebbe mantenere nomi e modalità', () => {
-            state.sp.nomi.home = "Squadra A"
-            state.modalitaPartita = "2/3"
-            const s = applyAction(state, { type: 'resetta' })
-            expect(s.sp.nomi.home).toBe("Squadra A")
-            expect(s.modalitaPartita).toBe("2/3")
-        })
-    })
-
-    // =============================================
-    // AZIONE SCONOSCIUTA
-    // =============================================
-    describe('Azione sconosciuta', () => {
-        it('dovrebbe restituire lo stato invariato con azione non riconosciuta', () => {
-            const s = applyAction(state, { type: 'azioneInesistente' })
-            expect(s.sp.punt.home).toBe(0)
-            expect(s.sp.punt.guest).toBe(0)
-        })
-    })
-})

tests/unit/server-utils.test.js

@@ -1,148 +0,0 @@
-import { describe, it, expect, vi, afterEach } from 'vitest'
-import * as os from 'os'
-
-vi.mock('os', async (importOriginal) => {
-    return {
-        ...await importOriginal(),
-        networkInterfaces: vi.fn(() => ({}))
-    }
-})
-
-import { getNetworkIPs, printServerInfo } from '../../src/server-utils.js'
-
-describe('Server Utils', () => {
-
-    afterEach(() => {
-        vi.restoreAllMocks()
-    })
-
-    // =============================================
-    // getNetworkIPs
-    // =============================================
-    describe('getNetworkIPs', () => {
-        it('dovrebbe restituire indirizzi IPv4 non-loopback', () => {
-            os.networkInterfaces.mockReturnValue({
-                eth0: [
-                    { family: 'IPv4', internal: false, address: '192.168.1.100' }
-                ]
-            })
-            expect(getNetworkIPs()).toEqual(['192.168.1.100'])
-        })
-
-        it('dovrebbe escludere indirizzi loopback (internal)', () => {
-            os.networkInterfaces.mockReturnValue({
-                lo: [
-                    { family: 'IPv4', internal: true, address: '127.0.0.1' }
-                ],
-                eth0: [
-                    { family: 'IPv4', internal: false, address: '192.168.1.100' }
-                ]
-            })
-            const ips = getNetworkIPs()
-            expect(ips).not.toContain('127.0.0.1')
-            expect(ips).toContain('192.168.1.100')
-        })
-
-        it('dovrebbe escludere indirizzi IPv6', () => {
-            os.networkInterfaces.mockReturnValue({
-                eth0: [
-                    { family: 'IPv6', internal: false, address: 'fe80::1' },
-                    { family: 'IPv4', internal: false, address: '192.168.1.100' }
-                ]
-            })
-            const ips = getNetworkIPs()
-            expect(ips).toEqual(['192.168.1.100'])
-        })
-
-        it('dovrebbe escludere bridge Docker 172.17.x.x', () => {
-            os.networkInterfaces.mockReturnValue({
-                docker0: [
-                    { family: 'IPv4', internal: false, address: '172.17.0.1' }
-                ],
-                eth0: [
-                    { family: 'IPv4', internal: false, address: '10.0.0.5' }
-                ]
-            })
-            const ips = getNetworkIPs()
-            expect(ips).not.toContain('172.17.0.1')
-            expect(ips).toContain('10.0.0.5')
-        })
-
-        it('dovrebbe escludere bridge Docker 172.18.x.x', () => {
-            os.networkInterfaces.mockReturnValue({
-                br0: [
-                    { family: 'IPv4', internal: false, address: '172.18.0.1' }
-                ]
-            })
-            expect(getNetworkIPs()).toEqual([])
-        })
-
-        it('dovrebbe restituire array vuoto se nessuna interfaccia disponibile', () => {
-            os.networkInterfaces.mockReturnValue({})
-            expect(getNetworkIPs()).toEqual([])
-        })
-
-        it('dovrebbe restituire più indirizzi da interfacce diverse', () => {
-            os.networkInterfaces.mockReturnValue({
-                eth0: [
-                    { family: 'IPv4', internal: false, address: '192.168.1.100' }
-                ],
-                wlan0: [
-                    { family: 'IPv4', internal: false, address: '192.168.1.101' }
-                ]
-            })
-            const ips = getNetworkIPs()
-            expect(ips).toHaveLength(2)
-            expect(ips).toContain('192.168.1.100')
-            expect(ips).toContain('192.168.1.101')
-        })
-    })
-
-    // =============================================
-    // printServerInfo
-    // =============================================
-    describe('printServerInfo', () => {
-        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('5173')
-            expect(allLogs).toContain('3001')
-            consoleSpy.mockRestore()
-        })
-
-        it('dovrebbe stampare le porte personalizzate', () => {
-            os.networkInterfaces.mockReturnValue({})
-            const consoleSpy = vi.spyOn(console, 'log').mockImplementation(() => {})
-            printServerInfo(3000, 4000)
-            const allLogs = consoleSpy.mock.calls.map(c => c[0]).join('\n')
-            expect(allLogs).toContain('3000')
-            expect(allLogs).toContain('4000')
-            consoleSpy.mockRestore()
-        })
-
-        it('dovrebbe mostrare gli URL remoti se ci sono IP di rete', () => {
-            os.networkInterfaces.mockReturnValue({
-                eth0: [
-                    { family: 'IPv4', internal: false, address: '192.168.1.50' }
-                ]
-            })
-            const consoleSpy = vi.spyOn(console, 'log').mockImplementation(() => {})
-            printServerInfo(3000, 3001)
-            const allLogs = consoleSpy.mock.calls.map(c => c[0]).join('\n')
-            expect(allLogs).toContain('192.168.1.50')
-            expect(allLogs).toContain('remoti')
-            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, 3001)
-            const allLogs = consoleSpy.mock.calls.map(c => c[0]).join('\n')
-            expect(allLogs).not.toContain('remoti')
-            consoleSpy.mockRestore()
-        })
-    })
-})

vite-plugin-websocket.js

@@ -1,131 +0,0 @@
-import { WebSocketServer } from 'ws'
-import { createServer as createHttpServer, request as httpRequest } from 'http'
-import { setupWebSocketHandler } from './src/websocket-handler.js'
-import { printServerInfo } from './src/server-utils.js'
-
-const CONTROLLER_PORT = 3001
-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 })
-
-      // 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)
-          })
-        }
-      })
-
-      // Avvia un server separato per il controller sulla porta 3001.
-      server.httpServer.once('listening', () => {
-        const viteAddr = server.httpServer.address()
-        const vitePort = viteAddr.port
-
-        startControllerDevServer(vitePort, wss)
-
-        setTimeout(() => printServerInfo(vitePort, CONTROLLER_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}`)
-  })
-}

vite.config.js

@@ -1,26 +1,12 @@
 import { defineConfig } from 'vite'
-import { resolve, dirname } from 'path'
-import { fileURLToPath } from 'url'
 import vue from '@vitejs/plugin-vue'
 import { VitePWA } from 'vite-plugin-pwa'
-import websocketPlugin from './vite-plugin-websocket.js'
 
-const __dirname = dirname(fileURLToPath(import.meta.url))
+// https://vitejs.dev/config/
-
-// Configurazione principale di Vite
 export default defineConfig({
   base: '/',
-  build: {
-    rollupOptions: {
-      input: {
-        main: resolve(__dirname, 'index.html'),
-        controller: resolve(__dirname, 'controller.html'),
-      },
-    },
-  },
   plugins: [
     vue(),
-    websocketPlugin(),
     VitePWA({
       registerType: 'autoUpdate',
       manifest: {
@@ -46,8 +32,4 @@ export default defineConfig({
       }
     })
   ],
-  server: {
-    host: '0.0.0.0',
-    port: 5173,
-  },
 })

vitest.config.js

@@ -1,19 +0,0 @@
-import { defineConfig } from 'vitest/config'
-import vue from '@vitejs/plugin-vue'
-
-export default defineConfig({
-    plugins: [vue()],
-    test: {
-        include: [
-            'tests/unit/**/*.{test,spec}.js',
-            'tests/integration/**/*.{test,spec}.js',
-            'tests/component/**/*.{test,spec}.js',
-            'tests/stress/**/*.{test,spec}.js',
-        ],
-        globals: true,
-        environment: 'node',
-        environmentMatchGlobs: [
-            ['tests/component/**', 'happy-dom'],
-        ],
-    },
-})