Как мы можем помочь?
Публичный JS API
В этом документе описывается общедоступный API-интерфейс JavaScript, который доступен клиентам для управления поведением виджета Teletype.
Пользовательские JavaScript события teletype.*
Для отслеживания информации, клиентам доступен ряд JavaScript событий, на которые они могут подписаться:
Виджет загружен, и готов к работе
document.addEventListener('teletype.ready', function() {
// Виджет готов к работе, и глобальный обьект window._teletypeWidget доступен для взаимодействия
});
Открытие и закрытие виджета
Пример:
document.addEventListener('teletype.opened', function() {
// Обработчик события открытия виджета
});
document.addEventListener('teletype.closed', function() {
// Обработчик события закрытия виджета
});
Персона начала новый диалог
Важно! Речь идёт именно о новом диалоге. То есть самом первом обращении. Если закрыть текущее обращение и персона начнёт новое, событие вызвано не будет.
document.addEventListener('teletype.dialogStarted', function(e) {
// Начало нового диалога. Событие содержит в себе информацию о сообщении
});
Персона отправила новое сообщение
document.addEventListener('teletype.messageSent', function(e) {
// Отправка нового сообщения. Событие содержит в себе информацию о сообщении
});
Получено сообщение от оператора в виджет
document.addEventListener('teletype.messageReceived', function(e) {
// Получено сообщение от оператора. Событие содержит в себе информацию о сообщении
});
Оператор завершил диалог
document.addEventListener('teletype.dialogClosed', function() {
// Обработчик завершения диалога
});
Персона поставила рейтинг диалогу
document.addEventListener('teletype.dialogRated', function(e) {
// Обработчик рейтинга диалога. Событие содержит в себе информацию о рейтинге
});
Персона нажала на кнопку канала
document.addEventListener('teletype.channelClicked', function(e) {
// Обработчик клика на канал. Событие содержит в себе информацию о канале
});
Глобальный обьект Виджета Teletype
Все взаимодействие с виджетом Teletype осуществляется с помощью глобального объекта _teletypeWidget
. Он создается при загрузке виджета.
После загрузки виджета на веб-страницу клиента он отправляет пользовательское событие с именем teletype.ready
, которое уведомит все обратные вызовы о том, что пришло время взаимодействовать с виджетом Teletype, чтобы передать ему данные.
Отправка данных персоны
Чтобы отправить персональные данные пользователя, клиенту необходимо использовать метод setPersonData
глобального объекта_teletypeWidget
.
Вот интерфейс объекта, который должен быть передан в этот метод:
interface AdditionalPersonInfo {
name?: string;
email?: string;
avatar?: string;
phone?: string;
payload?: { [key: string]: string; };
}
Пример:
window.addEventListener('teletype.ready', function() {
_teletypeWidget.setPersonData({
email: 'hello@mail.ru',
name: 'John Doe',
phone: '+7111111111'
avatar: 'https://www.gravatar.com/avatar/123',
payload: {
foo: 'bar'
}
});
});
Установка приветственных сообщений
Иногда требуется установить приветственные сообщения в дополнение к приглашениям. Для этого клиент может использовать метод greetingMessages
глобального объекта _teletypeWidget
, который принимает массив строк:
_teletypeWidget.greetingMessages(['Здравствуйте', 'Меня зовут Иван', 'Я помогу Вам с Вашим вопросом']);
Пример кода сгенерирует три отдельных сообщения от бот-оператора.
Программное открытие и закрытие виджета
Чтобы манипулировать состоянием виджета, клиент может использовать методы show
иhide
глобального объекта _teletypeWidget
.
Пример:
$(document).on("click", "#custom_widget_opener_button", function() {
window._teletypeWidget.show();
});
Кроме того, Teletype Widget генерирует пользовательские события для открытия или закрытия виджета.
Пример:
window.addEventListener('teletype.opened', function() {
// Обработчик события открытия виджета
});
window.addEventListener('teletype.closed', function() {
// Обработчик события закрытия виджета
});
Установка предопределенного сообщения в область ввода сообщения
Если клиенты хотят предварительно заполнить окно сообщения виджета, они могут использовать метод setMessage
глобального объекта_teletypeWidget
, который принимает строку как сообщение:
Пример:
$(document).on("click", "#need_help", function() {
window._teletypeWidget.setMessage('Нужна помощь!');
window._teletypeWidget.show();
});
Спрятать кнопку вызова виджета Teletype
Если клиенты не хотят показывать кнопку виджета Teletype по умолчанию, они могут скрыть ее, определив глобальную переменную в свойстве window
с именем teletypeButton
, которое должно быть равно ‘invisible’, чтобы скрыть кнопку виджета Teletype.
Example:
window.teletypeButton = 'invisible';
Принудительный язык онлайн-чата независимо от настроек браузера
Для онлайн-чата на русском языке добавить в код установки чата
window.teletypeLanguageForced = 'ru';
Для онлайн-чата на английском языке добавить в код установки чата
window.teletypeLanguageForced = 'en';