Події JS API

Ви можете прив’язати callback-виклики до подій чату HelpCrunch
Написано Konstantine
Оновлено 1 місяць тому

Коли віджет HelpCrunch завантажено, ви можете прив’язати callback-виклики до подій чату HelpCrunch. Наприклад, це може бути корисно для додавання аналітики.

  1. onReady
  2. onChatOpen
  3. onChatClose
  4. onCustomerMessage
  5. onAgentMessage
  6. onNewUnreadChat
  7. onPreChatFormSubmit


onReady

Ця подія запускається під час ініціалізації віджета чату та завантаження даних програми.

Жодні параметри не передаються функції callback.

HelpCrunch('onReady', callback);

onChatOpen

Ця подія запускається, коли ваш клієнт відкриває чат.

Жодні параметри не передаються функції callback.

HelpCrunch('onChatOpen', callback);

onChatClose

Ця подія запускається, коли ваш клієнт закриває чат.

Жодні параметри не передаються функції callback.

HelpCrunch('onChatClose', callback(event));

onCustomerMessage

Ця подія запускається, коли ваш клієнт надсилає повідомлення в чаті.

Параметри:

  • customerMessage: об'єкт
  • detail: об'єкт
  • message: об'єкт
  • author_name: рядок (user name)
  • cid: рядок (user id)
  • text: рядок
  • time: рядок
  • file: об'єкт
HelpCrunch('onCustomerMessage', callback(customerMessage));

Приклад:

Ви хочете показати останнє повідомлення клієнта в блоці статусу вашого сайту:

HelpCrunch('onCustomerMessage', function (customerMessage) {
  var message = customerMessage.detail.message;
  document.getElementById('status-input').value = message.author_name + ': ' + message.text;
});

onAgentMessage

Ця подія запускається, коли ваш оператор надсилає повідомлення в чаті.

Параметри:

  • customerMessage: об'єкт
  • detail: об'єкт
  • message: об'єкт
  • author_name: рядок (user name)
  • cid: рядок (user id)
  • text: рядок
  • time: рядок
  • file: об'єкт
  • та інші...
HelpCrunch('onAgentMessage', callback(agentMessage));

Приклад#1:

Ви хочете показати останнє повідомлення оператора в блоці статусу вашого сайту:

HelpCrunch('onAgentMessage', function (agentMessage) {
  var message = agentMessage.detail.message;
  document.getElementById('status-input').value = message.author_name + ': ' + message.text;
});

Приклад#2:

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

Зверніть увагу, що onAgentMessage не працює з проактивними авто повідомленнями чату. Якщо вам потрібно включити їх також, скористайтеся цим методом:
HelpCrunch('onNewUnreadChat', function (event) {
        console.log('onNewUnreadChat');
        if (event.unreadChats) {
          HelpCrunch('showChatWidget');
        }
    });

onNewUnreadChat

Ця подія запускається, коли ваш клієнт отримує нове повідомлення в чаті:

Параметри:

  • event: об'єкт
  • unreadMessages: номер
HelpCrunch('onNewUnreadChat', callback(event));

Приклад:

Ви хочете показати велику червону бульбашку з непрочитаними чатами в рядку статусу користувача на вашому сайті:

 HelpCrunch('onNewUnreadChat', function (event) {
  var bigRedBubble = document.getElementById('big-red-bubble');
  if (event.unreadMessages > 0) {
    bigRedBubble.style.display = 'inline';
    bigRedBubble.textContent = event.unreadMessages;
  } else {
    bigRedBubble.style.display = 'none';
  }
});

onPreChatFormSubmit

Коли відвідувач надсилає форму перед чатом, ви отримаєте надіслану інформацію у зворотному виклику 'event.detail.userData'.

HelpCrunch('onPreChatFormSubmit', (event) => {
  // event.detail.userData;
});

Чи була наша стаття корисною?