# Événements

> Écoutez l’ouverture et la fermeture du checkout ainsi que le consentement enregistré avec on() et off(), et comprenez la règle d’un seul écouteur par événement.

Le checkout indique à votre page ce qu’il est en train de faire. Abonnez-vous avec `on()` :

```js
entase.on('checkout.ready', payload => {
  console.log('checkout open for', payload.context.eventID);
});
```

## Un écouteur par nom d’événement

`on()` enregistre **un** rappel par nom d’événement. Enregistrer un deuxième rappel pour le même nom remplace le premier – il ne s’y ajoute pas :

```js
entase.on('checkout.closed', a);
entase.on('checkout.closed', b);   // a is gone; only b runs
```

`off()` supprime tout ce qui est enregistré pour un nom. Cette méthode ignore tout rappel que vous lui transmettez ; ainsi, `off('checkout.closed', b)` et `off('checkout.closed')` produisent le même résultat.

Si plusieurs parties de votre page doivent réagir au même événement, enregistrez un seul rappel et répartissez les actions depuis celui-ci.

## S’abonner à plusieurs événements à la fois

Les deux méthodes acceptent une chaîne de caractères dont les noms sont séparés par des espaces ou un tableau de noms, et enregistrent le même rappel pour chacun :

```js
entase.on('checkout.ready checkout.closed', payload => {
  console.log(payload.name);
});

entase.off(['checkout.ready', 'checkout.closed']);
```

## La charge utile

Chaque rappel reçoit un objet :

| Champ | Type | Description |
|---|---|---|
| `name` | chaîne | Le nom de l’événement, utile lorsqu’un rappel en gère plusieurs. |
| `context` | objet | Contient `eventID` – l’événement auquel appartient ce checkout. |
| `data` | objet | Détails propres à l’événement. |

## Événements disponibles

| Nom | Déclenchement |
|---|---|
| `checkout.ready` | Le checkout est chargé et prêt à interagir. C’est également à ce moment que le client transmet le `clientContext` que vous avez passé à `book()`. |
| `checkout.closed` | Le checkout est fermé. Le client démonte le panneau ou la fenêtre et efface l’arrière-plan. |
| `checkout.consent` | Le visiteur a répondu à l’avis relatif aux conditions. `data.consent` vaut `true` lorsqu’il les a acceptées, et le client mémorise ce choix afin d’ignorer cette étape la prochaine fois. |

```js
entase.on('checkout.closed', () => {
  document.body.classList.remove('checkout-open');
});

entase.on('checkout.consent', payload => {
  if (payload.data.consent) console.log('terms accepted');
});
```

## Les écouteurs survivent aux réservations individuelles

Les écouteurs appartiennent à l’instance, et non à une réservation. Enregistrez-les une seule fois, après avoir créé le client, et ils s’appliquent à chaque appel de `book()`. Utilisez `payload.context.eventID` pour distinguer les réservations :

```js
const entase = new Entase({ pk: 'YOUR_PUBLISHABLE_KEY' });

entase.on('checkout.closed', payload => {
  refreshAvailability(payload.context.eventID);
});
```

L’appel de `destroy()` les arrête tous – l’instance cesse alors complètement d’écouter les messages du checkout.

## Les messages provenant d’autres sources sont ignorés

Le client n’accepte que les messages provenant de l’origine du checkout Entase ; le trafic `postMessage` non lié sur votre page n’atteindra donc jamais vos rappels.