Écran live gala
Le module Gala est conçu pour animer une soirée de levée de fonds en direct. Il fournit deux écrans complémentaires : un pour le public projeté sur grand écran, un pour le présentateur en coulisse.
Les deux écrans en bref
| Écran | URL | Public visé |
|---|---|---|
| Promesses (gala) | /app/campagne/gala/promesses?campagneId=[id] | Équipe d'animation, saisie pendant le gala |
| Présentateur | /app/campagne/gala/presentateur?campagneId=[id] | Présentateur en coulisse, modération en direct |
Les deux écrans se rafraîchissent automatiquement toutes les 5
secondes via l'endpoint GET /campagnes/[id]/gala/paiements.
Écran promesses (saisie en direct)
L'écran principal /app/campagne/gala/promesses est destiné à l'équipe
d'animation. Il propose trois onglets.
Onglet Promesses
Liste des contacts avec, pour chacun, la possibilité de saisir une nouvelle promesse en direct. Composants disponibles par contact :
- Boutons produits : cliquer sur un produit pré-rempli pré-remplit le montant
- Champ Affichage : nom à afficher sur l'écran public (modifiable)
- Case Don anonyme : remplace le nom par "Anonyme"
- Case Afficher sur l'écran : si cochée, le don apparaît immédiatement sur l'écran public
- Champ Montant : valeur du don
- Bouton Ajouter une promesse : enregistre via
POST /campagnes/[id]/gala/create_promesse
L'historique des promesses du contact apparaît à gauche, avec la possibilité de :
- Modifier le montant d'une promesse existante (modal
Modal.confirm) - Annuler une promesse (suppression définitive)
- Masquer ou afficher chaque don sur l'écran public
Onglet Tableau
Tableau récapitulatif complet (composant GalaTableau) avec toutes les
contributions de la soirée : contact, montant, source, équipe, type
(paiement ou promesse).
Onglet Écran
Iframe qui affiche l'écran public de la campagne en direct
(/[slug]/__screen). Pratique pour vérifier d'un coup d'œil ce que voit
le public sans changer d'onglet.
Ajouter un contact manuellement
Bouton Ajouter un contact en haut de l'écran : ouvre la modal
ModalAddContact pour créer un contact à la volée pendant le gala (cas
typique : un donateur qui n'est pas encore dans la base).
Recherche rapide
Une barre de recherche en haut de la liste filtre les contacts par nom ou prénom avec Fuse.js (recherche tolérante aux fautes d'orthographe).
Écran présentateur (modération)
L'écran /app/campagne/gala/presentateur est conçu pour le présentateur
en coulisse. Caractéristiques :
- Plein écran natif (le layout admin est masqué automatiquement
via
onBlankLayout) - Pas de barre de navigation : pas de risque de cliquer accidentellement
- Aucune permission
campagnerequise sur cette URL : le forfait CAMPAGNE de l'organisation suffit. Cela permet à un opérateur externe au backoffice (présentateur, technicien son) de gérer l'écran sans avoir à se connecter en tant qu'admin.
Liste des dons à afficher
L'écran présentateur liste les dons en attente d'affichage public
(par défaut, ceux dont display === false).
Pour chaque don :
- Nom affiché (ou "Anonyme" si demandé)
- Montant (avec multiplicateur si abonnement, ex. "100 [EUR] x 12")
- Conversion en parrainage si le mode PARTNER est activé
- Indicateur "il y a X secondes" (temps écoulé depuis le don)
Actions par don
| Bouton | Effet |
|---|---|
| Afficher (vert) | Push le don sur l'écran public via POST /campagnes/[id]/gala/changeDisplay avec display: true |
| Masquer (rouge) | Retire le don de l'écran public (display: false) |
Option "Voir uniquement les dons masqués"
Une case à cocher hideOnly filtre la liste pour ne montrer que les dons en attente de validation. Pratique pour le présentateur qui n'a pas le temps de scroller dans tous les dons déjà affichés.
Quand hideOnly est désactivé, la liste affiche tous les dons dans
l'ordre chronologique (du plus ancien au plus récent), permettant de
retirer un don déjà affiché en cas d'erreur.
Endpoint changeDisplay
L'API POST /campagnes/[id]/gala/changeDisplay accepte un objet
contenant l'identifiant du paiement ou de la promesse, plus un booléen
display. Tous les écrans live (public, présentateur, dashboard) sont
synchronisés via cette API : un changement effectué depuis l'écran
présentateur apparaît dans les 5 secondes sur l'écran public.
Bonnes pratiques d'organisation
Setup technique du soir
| Étape | Détail |
|---|---|
| Vidéoprojecteur connecté | Affiche l'écran public /[slug]/__screen ou l'onglet "Écran" de l'écran promesses |
| Ordinateur du présentateur | Ouvre /app/campagne/gala/presentateur?campagneId=[id] en mode plein écran |
| Ordinateur de l'équipe de saisie | Ouvre /app/campagne/gala/promesses?campagneId=[id] pour saisir les contacts qui viennent en physique |
| Connexion internet | Fibre recommandée, prévoir un partage 4G en secours |
Rôles humains
- Présentateur : annonce les dons, valide l'affichage via son écran
- Équipe de saisie (2-4 personnes) : enregistre les contacts et promesses au fur et à mesure des annonces
- Admin / chef d'orchestre : surveille le dashboard live, intervient en cas de bug