Skip to main content

Live gala screen

Pour :Administrateur

The Gala module is designed to run a live fundraising evening. It provides two complementary screens: one for the audience projected on a big screen, one for the presenter backstage.

The two screens at a glance​

ScreenURLTarget audience
Pledges (gala)/app/campagne/gala/promesses?campagneId=[id]Production team, entry during the gala
Presenter/app/campagne/gala/presentateur?campagneId=[id]Presenter backstage, live moderation

Both screens automatically refresh every 5 seconds via the endpoint GET /campagnes/[id]/gala/paiements.

Pledges screen (live entry)​

The main screen /app/campagne/gala/promesses is for the production team. It has three tabs.

Pledges tab​

List of contacts with, for each one, the possibility to enter a new pledge live. Components available per contact:

  • Product buttons: clicking on a pre-filled product pre-fills the amount
  • Display field: name to show on the audience screen (editable)
  • Anonymous donation checkbox: replaces the name with "Anonymous"
  • Show on screen checkbox: if checked, the donation appears immediately on the audience screen
  • Amount field: donation value
  • Add a pledge button: saves via POST /campagnes/[id]/gala/create_promesse

The contact's pledge history appears on the left, with the ability to:

  • Edit the amount of an existing pledge (modal Modal.confirm)
  • Cancel a pledge (permanent deletion)
  • Hide or show each donation on the audience screen

Table tab​

Comprehensive summary table (component GalaTableau) with all contributions of the evening: contact, amount, source, team, type (payment or pledge).

Screen tab​

Iframe displaying the audience screen of the campaign live (/[slug]/__screen). Handy to quickly check what the audience sees without changing tabs.

Add a contact manually​

Add a contact button at the top of the screen: opens the ModalAddContact modal to create a contact on the fly during the gala (typical case: a donor not yet in the database).

A search bar at the top of the list filters contacts by name or first name using Fuse.js (typo-tolerant search).

Presenter screen (moderation)​

The screen /app/campagne/gala/presentateur is designed for the presenter backstage. Characteristics:

  • Native fullscreen (the admin layout is automatically hidden via onBlankLayout)
  • No navigation bar: no risk of clicking accidentally
  • No campagne permission required on this URL: the organization's CAMPAIGN plan is enough. This lets an operator external to the backoffice (presenter, sound engineer) manage the screen without having to log in as admin.

List of donations to display​

The presenter screen lists donations pending display on the audience screen (by default, those with display === false).

For each donation:

  • Displayed name (or "Anonymous" if requested)
  • Amount (with multiplier if subscription, e.g. "100 [EUR] x 12")
  • Conversion to sponsorship if PARTNER mode is enabled
  • "X seconds ago" indicator (time elapsed since the donation)

Actions per donation​

ButtonEffect
Show (green)Push the donation on the audience screen via POST /campagnes/[id]/gala/changeDisplay with display: true
Hide (red)Remove the donation from the audience screen (display: false)

"Show only hidden donations" option​

A hideOnly checkbox filters the list to show only donations pending validation. Handy for the presenter who doesn't have time to scroll through all donations already displayed.

When hideOnly is disabled, the list shows all donations in chronological order (oldest to most recent), letting you remove a donation already displayed in case of error.

changeDisplay endpoint​

The API POST /campagnes/[id]/gala/changeDisplay accepts an object containing the payment or pledge identifier, plus a boolean display. All live screens (audience, presenter, dashboard) are synced via this API: a change made from the presenter screen appears within 5 seconds on the audience screen.

Organizational best practices​

Technical setup for the evening​

StepDetail
Video projector connectedDisplays the audience screen /[slug]/__screen or the "Screen" tab of the pledges screen
Presenter's computerOpens /app/campagne/gala/presentateur?campagneId=[id] in fullscreen mode
Entry team's computerOpens /app/campagne/gala/promesses?campagneId=[id] to enter contacts coming in person
Internet connectionFiber recommended, plan a 4G hotspot as backup

Human roles​

  • Presenter: announces donations, validates display via their screen
  • Entry team (2-4 people): record contacts and pledges as announcements come
  • Admin / coordinator: monitors the live dashboard, steps in if bugs occur