Riferimento rapido¶

Checklist operativa per chi conosce già il manuale e vuole un promemoria dei passaggi essenziali.

Avviare il server locale¶

Windows (doppio clic sugli script batch):

• start-navigator.bat → apre il Navigator
• start-scenario-editor.bat → apre lo Scenario Editor
• start-theme-editor.bat → apre il Theme Editor

Manuale (Mac/Linux o senza script):

python -m http.server 8000

Indirizzi:

• Navigator: http://localhost:8000/navigator.html
• Scenario Editor: http://localhost:8000/scenario-editor.html
• Theme Editor: http://localhost:8000/theme-editor.html

Creare uno scenario¶

1. New → crea scenario vuoto
2. Settings → titolo, descrizione, autore, modificare etichette dei tasti
3. Selezionare nodo, definire Content
4. + Add Choice → testo pulsante + nodo destinazione
5. + Add resource → tipo, link e etichetta del tasto (se sono presenti allegati)
6. Ripetere per tutti i nodi
7. Map → verificare struttura (no bordi rossi = ok)
8. Save → scarica il file JSON

Modificare uno scenario esistente¶

1. Open → selezionare file JSON
2. Modificare nodi e scelte
3. Save

Personalizzare il tema¶

1. Aprire Theme Editor
2. Brand → logo, nome azienda, sito web
3. Typography → scegliere font
4. Colors → sfondo, testo, pulsanti, mappa
5. Verificare nell'anteprima
6. Save → scarica il file JSON

Configurare config.json¶

{
    "scenario": "nome-scenario.json",
    "theme": "nome-tema.json",
    "showCredits": false
}

Testare in locale¶

1. Aggiornare config.json con i nomi file corretti
2. Ricaricare il Navigator (Ctrl+Shift+R)
3. Percorrere tutto lo scenario verificando i percorsi

Pubblicare¶

File necessari (solo questi):

• navigator.html
• config.json
• defaults.json
• shared-utils.js
• shared-styles.css
• File JSON dello scenario
• File JSON del tema (se personalizzato)
• Cartella risorse (se usate)

Non includere: scenario-editor.html, theme-editor.html

GitHub Pages:

1. Creare repository
2. Caricare i file necessari
3. Settings → Pages → attivare da branch main
4. URL: https://nomeutente.github.io/nome-repo/navigator.html

Posizionamento nella mappa (solo Scenario Editor)¶

Codice colori mappa (Scenario Editor)¶

Colori connessioni:

Markdown nel contenuto¶

# Titolo grande
## Sottotitolo
**grassetto**
*corsivo*
- elemento lista
> citazione

Troubleshooting veloce¶