Guide 👨💼 Administrateur — préparer la course
⚠️ Document généré automatiquement par les tests E2E (
e2e/browser.test.ts). Toute modification manuelle sera écrasée au prochain run.
Tu es l'organisateur de la course. Avant le départ, tu crées la course, configures les durées de tour, génères les dossards et le mot de passe.
Sommaire
Configurer une course
1. Durées de tour & overrides per-lap
Depuis la page Configuration, le bloc Format Backyard te laisse choisir la durée par défaut d'un tour (en minutes), puis ajouter des durées spécifiques par tour pour surcharger certains tours individuellement. Saisis le numéro de tour et les minutes, puis clique Ajouter — chaque override apparaît sous forme de badge bleu suppressible.
Exemple typique pour un format backyard : tour 1 = 70 min (échauffement plus long) et tous les autres = 60 min.
2. Partager la course par QR codes
Depuis la page Configuration, le bouton 🔗 Partager (QR codes par rôle) ouvre une modale qui génère 5 QR codes prêts à imprimer ou afficher :
- 🎯 Directeur de course — accès au tableau de bord (départ, finalisation)
- 📱 Scanneur arrivée — direct sur Mode Arrivée pour les bénévoles
- 👥 Accompagnateurs — vue Résultats en lecture pure, sans aucun bouton d'édition (à partager aux familles / supporters)
- 👀 Spectateur — vue Résultats en lecture seule à partager au public
- 📊 Statistiques — page stats live + récap fin de course (records, attrition, médailles, courbes…). Lecture pure, accessible pendant ET après la course.
Chaque carte affiche aussi l'URL en clair (avec un bouton copier 📋) et un descriptif d'usage. Le bouton 🖨️ Imprimer sort une feuille A4 propre — plus aucune explication verbale aux bénévoles le jour J : ils scannent, ils sont sur le bon écran.
33. Visibilité : lieu & course publique
Le bloc Visibilité de la page Configuration contient le lieu de la course (texte libre, ex. Smarves, Vienne) et la case Course publique.
Une course publique apparaît, une fois terminée, dans l'archive des courses passées (/races) et sa page de résultats publics est proposée à Google (sitemap, page indexable). Une course non cochée reste accessible par son lien ou son QR code, mais n'est jamais indexée — c'est le réglage par défaut, pour que les courses de test restent privées. Clique Sauver pour enregistrer.
Démarrer une course
3. Splash : à quel rôle es-tu ?
Quand un téléphone arrive sur une course sans préciser la vue (par exemple via un lien WhatsApp partagé), un écran d'orientation s'affiche : « Quel est ton rôle sur cette course ? ». Quatre cartes : 🎯 Directeur, 📱 Scanneur, 👀 Spectateur, ⚙️ Administrateur.
Le choix est mémorisé sur ce téléphone — la prochaine fois qu'on revient sur la course, on est redirigé directement vers la bonne vue (sans repasser par ce splash). Les QR codes générés depuis la page Configuration mènent quant à eux directement sur la bonne vue, sans passer par ce splash.
4. Page d'accueil — pitch & contact
La page d'accueil de ttt-chrono.juulieen.fr est une page de présentation publique du projet. Elle s'ouvre sur un hero avec le pitch (« Chronométrer ta backyard, par un coureur, pour des organisateurs ») et deux CTA : Je veux ce système pour ma course (qui scrolle vers le formulaire de contact) et Voir comment ça marche.
La page raconte ensuite la genèse du projet (un coup de fil du club Run Event 86, une backyard à organiser, pas de solution abordable sur le marché), puis explique en 3 cartes comment ça marche : bracelets NFC scannés par téléphone Android, multi-téléphone hors-ligne, résultats live sur web et grand écran TV. Quatre chiffres clés rappellent le bilan de la Tic Tac Trail 2026 (177 coureurs, 1 201 tours, 17h de course, 1 finisher). Sous ces chiffres, deux liens : les résultats live de la Tic Tac Trail 2026, toujours en ligne, et l'archive des courses passées (/races).
Une mosaïque photos du jour J (arche départ, vainqueur, ambiance nuit, podium) précède le formulaire de contact présenté comme un service sur mesure : un orga peut écrire pour présenter sa course (format, date prévue, ordre de grandeur du nombre de coureurs, message). Le bouton Envoyer ouvre le client mail prérempli pour caler un appel et discuter du périmètre et des conditions ; un bouton secondaire propose WhatsApp. Email et téléphone sont assemblés en JS pour ne pas être moissonnés par les bots.
En bas, un encart 🙏 Merci Run Event 86 rend hommage explicitement au club, sans qui le projet n'existerait pas. Deux boutons sociaux y sont affichés : Instagram (@run_event_86) et Facebook (Run Event 86), qui s'ouvrent dans un nouvel onglet.
Une zone repliable 📂 Mes courses (en bas, ouverte par défaut) regroupe les outils admin : bouton + Nouvelle course, lien 📖 Guide vers cette documentation, panneau persona (4 cartes Administrateur / Directeur / Scanneur / Spectateur), et la liste de toutes les courses créées avec leurs boutons d'accès rapide selon leur statut (Tags NFC, Contrôle, Arrivée, Résultats, 📊 Stats). Sur chaque fiche course, en plus des boutons d'action, des compteurs indiquent le nombre de dossards et de scans enregistrés. Pour une course en cours, le tour actuel est affiché en accent (ex : Tour 3 en cours).
Pastille de synchronisation (en haut à droite, visible sur toutes les vues) : indique l'état du téléphone d'un coup d'œil. 🟢 Sync = toutes les données sont synchronisées avec le serveur. 🟡 N en attente = N scans en file d'attente, qui partiront automatiquement à la reconnexion (mode hors-ligne) — y compris si la course s'est terminée entre-temps : un scan fait pendant la course est toujours compté. Un scan ne quitte la file qu'une fois confirmé par le serveur ; s'il est refusé (par exemple horodaté après la fin de course), un message rouge l'indique avec le numéro de dossard. 🔴 Hors ligne = pas de connexion. Plus besoin de mémoriser un code couleur — le libellé est lisible directement.
Mot de passe d'une course
30. Section « Mot de passe » dans Configuration
Depuis la page Configuration d'une course, tu peux définir un mot de passe optionnel. Une fois défini, toutes les actions de contrôle (modifier la course, scanner depuis un nouveau téléphone, abandonner un coureur, etc.) demanderont ce mot de passe.
31. Course protégée par mot de passe
Une fois le mot de passe défini, le badge Protégée apparaît et le téléphone qui vient de le créer le mémorise automatiquement (pas besoin de le retaper). Les autres téléphones devront le saisir une fois pour pouvoir contrôler la course.
Fin de course
34. Archive des courses passées
La page Courses passées (/races, liée depuis la page d'accueil) liste toutes les courses publiques terminées, de la plus récente à la plus ancienne, avec leur date et leur lieu. Chaque carte mène au classement public de la course (lecture seule, sans bouton d'édition), avec un lien ← Toutes les courses pour revenir à l'archive. Sous chaque carte, deux liens directs : 🏁 Classement et 📊 Statistiques (survie, records, fiche de chaque coureur).
Ces pages sont rendues côté serveur : Google les lit directement, ce qui permet aux coureurs de retrouver leurs résultats en cherchant le nom de la course.