Catena

Catena è un videogioco a gemme colorate, giocabile interamente in un singolo file HTML autosufficiente (HTML + CSS + JavaScript vanilla, nessuna libreria esterna, nessun asset esterno).

Come si gioca

  1. Trascina il mouse o il dito su gemme dello stesso colore una accanto all'altra
  2. Forma un percorso di almeno 3 gemme per farle scomparire e guadagnare punti
  3. Le gemme sopra cadono per gravità e nuove gemme spuntano dall'alto
  4. Il punteggio aumenta in base alla lunghezza della catena:
    • 3 gemme → 10 pt ciascuna
    • 4 gemme → 15 pt ciascuna
    • 5 gemme → 25 pt ciascuna
    • 6+ gemme → 40 pt ciascuna (bonus "Combo!")
  5. Hai 90 secondi a partita. La barra del tempo si svuota progressivamente
  6. Quando non ci sono mosse possibili, puoi usare il pulsante Mescola (costo: 50 pt + 10 secondi) per rimescolare le gemme con un effetto shake

Schermate

  • Schermata iniziale: titolo "Catena", istruzioni brevi, pulsante "Inizia"
  • Partita: punteggio, barra del tempo, record, pulsante Mescola, griglia 8×8
  • Game Over: punteggio finale, record, pulsanti "Rigioca" e "Menu"

Caratteristiche tecniche

  • Singolo file HTML — apri e gioca, niente installazione
  • Responsive — funziona su desktop (mouse) e mobile (touch)
  • 60 fps — animazioni fluide con CSS transitions e keyframes
  • 6 colori — rosso corallo, giallo sole, verde menta, azzurro chiaro, viola lavanda, arancione
  • Timer 90 secondi con barra che pulsa negli ultimi 5 secondi
  • Record in sessione (variabile JS, non localStorage)
  • Effetto 3D sulle gemme con gradienti radiali e highlight
  • Animazioni: scale-out (rimozione), drop (caduta con easing), shake (mescola)

Requisiti

Un browser moderno (Chrome, Firefox, Safari, Edge). Supporto per Pointer Events.

Sviluppo

git clone http://192.168.0.183:8085/truetype/catena.git
cd catena
# apri catena.html nel browser

Licenza

Software libero. Distribuito sotto licenza MIT.

S
Description
Catena - videogioco a gemme colorate in HTML
Readme
753 KiB
0 Stars 1 Watchers 0 Forks
Languages
HTML 100%