Morseau

Apprends le code morse, un éclat à la fois. Site statique inspiré de Duolingo : chaque caractère se lit dans la lumière d'un timonier qui l'émet à la lampe de signalisation.

Section 1 (répertoire) implémentée. Sections 2 à 4 (deviner un caractère, un mot, un message) à venir — la place leur est déjà réservée dans l'architecture.

Mise en route

npm install
npm run dev      # serveur de développement
npm run build    # build de production dans dist/
npm run preview  # prévisualiser le build

Architecture

Le principe : découpler la logique morse de son affichage, parce que le moteur servira aux quatre sections.

src/
├─ core/          logique pure, sans Svelte ni DOM (réutilisable par les quiz)
│  ├─ timing.ts       unités de durée (point, trait, silences) + WPM
│  ├─ morse-engine.ts motif/texte -> ligne de temps d'évènements lampe
│  └─ types.ts
├─ data/
│  ├─ alphabets/  international.json (base) + fr.json (ajouts accentués)
│  └─ i18n/        fr.json (chaînes d'interface)
├─ lib/
│  ├─ alphabet.ts     fusion base + surcharges de langue
│  ├─ i18n.ts         store de traduction, t()
│  └─ transmission.ts contrôleur : joue une ligne de temps, expose l'état lampe
├─ renderers/     animations interchangeables (registre + tirage aléatoire)
│  └─ signalman/  le timonier (seul renderer pour l'instant)
├─ components/    MorsePattern, CharacterCard, TransmissionStage
└─ sections/
   └─ reference/  section 1

Deux axes de scalabilité

Ajouter une animation. Crée un composant dans src/renderers/ qui accepte les props lit (booléen) et playing, puis enregistre-le dans src/renderers/index.ts. pickRenderer() l'inclura au tirage aléatoire, sans rien changer d'autre.

Ajouter une langue. Le morse « français » recouvre deux choses distinctes : les libellés de l'interface et les caractères enseignés (les lettres accentuées ont leurs propres codes). D'où la séparation :

• interface : ajoute src/data/i18n/<lang>.json, référence-le dans lib/i18n.ts ;
• caractères : ajoute src/data/alphabets/<lang>.json (avec "extends": "international" et un tableau add), référence-le dans lib/alphabet.ts.

La base internationale (A–Z, chiffres, ponctuation, signaux de service) reste partagée et n'est jamais dupliquée.

Déploiement (GitHub Pages)

Le workflow .github/workflows/deploy.yml build et publie à chaque push sur main. Une fois le dépôt créé :

1. Pousse le code sur la branche main.
2. Dans Settings → Pages, choisis la source GitHub Actions.

Le site sera servi sur https://<utilisateur>.github.io/<dépôt>/. La config Vite utilise base: './' (chemins relatifs), donc rien à ajuster selon le nom du dépôt.

Données

Tout est stocké en fichiers JSON versionnés dans le dépôt : aucune base de données ni backend. Les fichiers sont importés au build.