# Отваряне на страницата за плащане

> Методът book() отваря страницата за плащане за едно събитие и приема замествания за конкретното извикване, както и клиентски контекст, който можете да пренесете към собствените си системи.

`book()` е методът, който отваря страницата за плащане. Всичко останало в клиента я конфигурира или следи.

```js
entase.book(eventID);
entase.book(eventID, options);
```

`eventID` е идентификаторът на насроченото събитие, за което ще се продават билети. Това е същият идентификатор, който се използва в кодовете за споделяне и вграждане на събитието ви.

Извикването се връща веднага – отваря панела или прозореца и не изчаква посетителят да приключи. Използвайте [събития](/developers/js-client/events.md), за да реагирате на това, което се случва след това.

## Опции

| Име | Тип | По подразбиране | Описание |
|---|---|---|---|
| `checkoutMode` | низ | стойност на инстанцията | `'pane'` или `'popup'` само за тази резервация. |
| `clientContext` | обект | `null` | Произволни данни, предадени на страницата за плащане, когато е готова. Вижте по-долу. |
| `collectConsent` | булева стойност | стойност на инстанцията | Дали да се поиска от посетителя да приеме известието за условията. |
| `backdrop` | булева стойност | стойност на инстанцията | Дали страницата зад страницата за плащане да бъде затъмнена. |
| `backdropColor` | низ | стойност на инстанцията | Цветът на затъмнената област. |
| `pane` | обект | стойност на инстанцията | `{ width, height }` за вградения панел. |
| `popup` | обект | стойност на инстанцията | `{ width, height }` за изскачащия прозорец. |

Всичко, което пропуснете, се връща към стойността, с която е създадена инстанцията, така че опциите за конкретното извикване се добавят, вместо да представляват заместващ набор.

```js
entase.book('EVENT_ID', {
  pane: { width: '60vw' },
  backdrop: false,
  clientContext: { source: 'homepage-hero' }
});
```

## Клиентски контекст

`clientContext` е обект по ваш дизайн. Клиентът го съхранява, докато страницата за плащане не подаде сигнал, че е готова, след което ѝ го предава. Използвайте го, за да пренесете до сесията на страницата за плащане информация, която знае само вашата страница – кой бутон е бил натиснат, от коя кампания е дошъл посетителят, вътрешна референция за клиент.

Контекстът се съхранява за всеки идентификатор на събитие поотделно, така че резервирането на две различни събития от една и съща страница запазва контекстите им отделни.

Не поставяйте в него чувствителна информация. Той се прехвърля до страницата за плащане през браузъра и е видим за всеки, който инспектира страницата.

## Отваряне на няколко събития от една страница

Една инстанция обработва произволен брой събития. Създайте я веднъж и всеки път подавайте различен идентификатор:

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

document.querySelectorAll('[data-event-id]').forEach(button => {
  button.addEventListener('click', () => {
    entase.book(button.dataset.eventId, {
      clientContext: { source: button.dataset.source }
    });
  });
});
```

## След унищожаване на клиента

Извикването на `book()` за инстанция, която вече сте унищожили, записва грешка в конзолата и не отваря нищо. Това е умишлено – унищожената инстанция вече не следи за съобщения от страницата за плащане, така че прозорецът, който е отворила, не би могъл да бъде затворен или наблюдаван. Вместо това създайте нова инстанция.

## Затваряне на страницата за плащане

Посетителят сам затваря страницата за плащане: с Escape или чрез щракване върху затъмнената област в режим на панел, чрез контролите на прозореца в режим на изскачащ прозорец. Страницата за плащане се затваря и сама, когато резервацията приключи.

Няма публичен метод за затварянето ѝ от вашия код. Ако трябва да знаете кога е затворена, следете за събитието `checkout.closed`.