# Події

> Відстежуйте відкриття й закриття checkout, а також фіксуйте згоду за допомогою on() і off(); дізнайтеся про правило одного слухача на подію.

Checkout повідомляє вашій сторінці про свої дії. Підпишіться за допомогою `on()`:

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

## Один слухач на назву події

`on()` зберігає **один** зворотний виклик для кожної назви події. Реєстрація другого зворотного виклику з тією самою назвою замінює перший – вона не додає його:

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

`off()` видаляє все, що зареєстровано для певної назви. Вона ігнорує будь-який переданий їй зворотний виклик, тому `off('checkout.closed', b)` і `off('checkout.closed')` роблять те саме.

Якщо кільком частинам вашої сторінки потрібно реагувати на ту саму подію, зареєструйте один зворотний виклик і розподіляйте виклики з нього.

## Підписка на кілька подій одночасно

Обидва методи приймають рядок із назвами, розділеними пробілами, або масив назв і реєструють той самий зворотний виклик для кожної з них:

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

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

## Корисне навантаження

Кожен зворотний виклик отримує один об’єкт:

| Поле | Тип | Опис |
|---|---|---|
| `name` | string | Назва події; корисно, коли один зворотний виклик обробляє кілька подій. |
| `context` | object | Містить `eventID` – подію, до якої належить цей checkout. |
| `data` | object | Відомості, специфічні для події. |

## Доступні події

| Назва | Коли спрацьовує |
|---|---|
| `checkout.ready` | Checkout завантажено й він готовий до взаємодії. У цей момент клієнт також передає `clientContext`, який ви передали до `book()`. |
| `checkout.closed` | Checkout закрито. Клієнт закриває панель або вікно й прибирає фон. |
| `checkout.consent` | Відвідувач відповів на повідомлення про умови. `data.consent` має значення `true`, коли він прийняв умови, і клієнт запам’ятовує це, щоб наступного разу пропустити цей крок. |

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

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

## Слухачі зберігаються між окремими бронюваннями

Слухачі належать екземпляру, а не бронюванню. Зареєструйте їх один раз після створення клієнта, і вони застосовуватимуться до кожного виклику `book()`. Використовуйте `payload.context.eventID`, щоб розрізняти бронювання:

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

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

Виклик `destroy()` зупиняє їх усі – екземпляр повністю припиняє прослуховувати повідомлення від checkout.

## Повідомлення з інших джерел ігноруються

Клієнт приймає повідомлення лише від джерела checkout Entase, тому сторонній трафік `postMessage` на вашій сторінці ніколи не потрапить до ваших зворотних викликів.