Události v prohlížeči: on, off a události DOM

Widget oznamuje dění v chatu dvěma způsoby: přes ReactiveChat('on', …) a jako události DOM na window. Ani jeden nikdy neobsahuje text zprávy – pouze informaci, že se něco stalo. Pro obsah na vašem serveru použijte webhooky.

ReactiveChat('on') a ('off')

function beiNachricht(e) {
  if (e.direction === 'in') { document.title = '(1) ' + document.title; }
}
ReactiveChat('on', 'message', beiNachricht);
// later:
ReactiveChat('off', 'message', beiNachricht);

on můžete zavolat před načtením; odběr počká ve frontě. Ale: on je příkaz, a proto okamžitě načte jádro (spouštěč command). Widget zachytává chyby ve vašem callbacku; chat nenaruší. Neznámé názvy se tiše ignorují.

Události a jejich data:

• ready – { conversationId }. Spojení je navázané a widget lze používat. Vhodný okamžik pro příkazy s návratovou hodnotou.
• open – { trigger }. Okno se otevřelo; trigger uvádí, co ho otevřelo (výchozí api).
• close – {}. Okno se zavřelo.
• message – { direction }. Zpráva přišla (in, od týmu nebo asistenta) nebo odešla (out, od návštěvníka). Bez obsahu.
• unread – { count }. Změnil se počet nepřečtených zpráv.
• csat – { score }. Návštěvník udělil hodnocení (1 nebo -1).
• handoff – { reason, to }. Konverzace byla předána; to je agent, queue, bot nebo offline_form.
• proactive – { ruleId }. Pravidlo spustilo proaktivní zprávu.
• ab – { test, variant, qa }. Návštěvník byl přiřazen k variantě A/B testu.
• teaser:shown – { ruleId, ts }. Zobrazila se tooltipová bublina.
• teaser:click – { ruleId }. Kliknutí na bublinu.
• teaser:dismiss – { ruleId }. Bublina byla zavřena.
• teaser:reply – { ruleId, text }. Byla vybrána rychlá odpověď bubliny (text je text tlačítka, který jste sami zadali).
• promo:shown – { ort }. Reklamní karta byla viditelná (gespraech nebo start), jednou na umístění a zobrazení stránky a pouze při otevřeném okně.
• promo:click – { ziel, ort }. Kliknutí na tlačítko karty (knopf) nebo textový odkaz (link).

Příklad: předání událostí analytickému nástroji

['open', 'close', 'csat', 'handoff', 'promo:click'].forEach(function (name) {
  ReactiveChat('on', name, function (e) {
    window.dataLayer = window.dataLayer || [];
    window.dataLayer.push({ event: 'reactivechat_' + name.replace(':', '_'), rc: e });
  });
});

Události DOM na window

Nezávisle na on widget vyvolává události CustomEvent na window (neprobublávají, bubbles: false). Každé detail navíc obsahuje ts. Tyto události se hodí pro nástroje naslouchající událostem DOM, například správce značek.

• reactivechat:ready – { sessionId, visitorId, version }
• reactivechat:opened – { conversationId, trigger }
• reactivechat:closed – { conversationId }
• reactivechat:message – { conversationId, direction }, nikdy text
• reactivechat:bot_handoff – { conversationId, reason }
• reactivechat:csat – { score }
• reactivechat:proactive_shown – { ruleId }
• reactivechat:teaser_shown – { conversationId, ruleId }

window.addEventListener('reactivechat:opened', function (ev) {
  console.log('Chat open since', new Date(ev.detail.ts));
});

Události, kterým widget naslouchá

Pokud používáte MousePlayer, widget vyhodnocuje jeho události mouseplayer:ready, mouseplayer:frustration, mouseplayer:intent a mouseplayer:milestone; mouseplayer:frustration také předčasně načte jádro. Žádné další zdroje k tomu nepotřebujete.

Co neexistuje

• Žádný kanál postMessage pro vaši stránku – ani v režimu iframe.
• Žádná událost nesoucí text zprávy. Obsah získáte na straně serveru přes webhooky.

Dále: Identifikace návštěvníků a předávání kontextu