# イベント

> `on()` と `off()` を使ってチェックアウトのオープン、クローズ、同意の記録を監視し、イベント名ごとにリスナーは 1 つだけというルールを理解します。

チェックアウトは、実行中の処理をページに通知します。`on()` で購読します。

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

## イベント名ごとに 1 つのリスナー

`on()` は、イベント名ごとに **1 つの**コールバックを保存します。同じ名前で 2 つ目のコールバックを登録すると、最初のものは置き換えられます – 追加されるわけではありません。

```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')` は同じ動作をします。

ページ内の複数の部分で同じイベントに反応する必要がある場合は、コールバックを 1 つ登録し、その内部から処理を振り分けてください。

## 複数のイベントを一度に購読する

どちらのメソッドも、スペース区切りの文字列または名前の配列を受け取り、各イベントに同じコールバックを登録します。

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

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

## ペイロード

すべてのコールバックは 1 つのオブジェクトを受け取ります。

| フィールド | 型 | 説明 |
|---|---|---|
| `name` | string | イベント名。1 つのコールバックで複数のイベントを処理する際に役立ちます。 |
| `context` | object | `eventID` を含みます – このチェックアウトが属するイベントです。 |
| `data` | object | イベント固有の詳細情報。 |

## 利用可能なイベント

| 名前 | 発火するタイミング |
|---|---|
| `checkout.ready` | チェックアウトが読み込まれ、操作できる状態になったとき。クライアントが `book()` に渡した `clientContext` を引き渡すタイミングでもあります。 |
| `checkout.closed` | チェックアウトが閉じたとき。クライアントはパネルまたはウィンドウを破棄し、背景オーバーレイをクリアします。 |
| `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()` を呼び出すと、すべてのリスナーが停止します – インスタンスはチェックアウトからのメッセージを完全に受信しなくなります。

## 他の送信元からのメッセージは無視される

クライアントが受け付けるのは Entase チェックアウトのオリジンからのメッセージのみです。そのため、ページ上の無関係な `postMessage` トラフィックがコールバックに届くことはありません。