Справочник по Javascript Talk-Me (JS API)

Введение

Вызывать методы API можно сразу же после вставленного кода Online-чата, не дожидаясь его загрузки.

Инициализация чата

Перед вставленным кодом нашего чата, вы можете добавить объект с настройками чата:

<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>script</span><span class="token punctuation">&gt;</span></span><span class="token script language-javascript"> window<span class="token punctuation">.</span>TalkMeSetup <span class="token operator">=</span> <span class="token punctuation">{</span> language<span class="token punctuation">:</span> <span class="token string">"ru"</span><span class="token punctuation">,</span> foo<span class="token punctuation">:</span> <span class="token string">"bar"</span><span class="token punctuation">,</span> param<span class="token punctuation">:</span> <span class="token string">"value"</span> <span class="token punctuation">}</span><span class="token punctuation">;</span> </span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>

Параметры, которые можно передавать в TalkMeSetup:

  • language - идентификатор желаемого языка виджета. Этот параметр используется только в случае, если на один домен у вас подключено несколько виджетов с разными языками. (en - English, pt - Português, ru - Русский, ua - Українська)

  • clientId - уникальный идентификатор посетителя. Если не передать это значение, то мы сгенерируем его самостоятельно.

    returnMobileTriggerTimeout - количество миллисекунд, после которого мобильный ярлык, скрытый при касании экрана, появляется снова (по умолчанию - 1000).

    С помощью передачи этого параметра вы можете объединять чаты нескольких посетителей в один (допустим, руководствуясь тем, под каким логином авторизован пользователь у Вас на сайте).

    Не допускайте того, чтобы clientId можно было подобрать перебором!

Посетитель

Изменение информации о посетителе

С помощью Javascript-метода Вы можете передать в операторскую программу важную информацию о посетителе.

<code class="language-javascript"><span class="token function">TalkMe</span><span class="token punctuation">(</span><span class="token string">"setClientInfo"</span><span class="token punctuation">,</span> info<span class="token punctuation">)</span><span class="token punctuation">;</span></code>

Этот метод принимает в качестве параметра объект info.

Он может содержать следующие ключи:

<span class="token punctuation">{</span>
	name<span class="token punctuation">:</span> <span class="token string">"Имя"</span><span class="token punctuation">,</span>
	phone<span class="token punctuation">:</span> <span class="token string">"8-900-000-00000"</span><span class="token punctuation">,</span>
	email<span class="token punctuation">:</span> <span class="token string">"polina@mail.ru"</span><span class="token punctuation">,</span>
	skype<span class="token punctuation">:</span> <span class="token string">"polina"</span><span class="token punctuation">,</span>
	questionCategory<span class="token punctuation">:</span> <span class="token string">"Категория вопроса"</span><span class="token punctuation">,</span>
	custom<span class="token punctuation">:</span> <span class="token punctuation">{</span>
		login<span class="token punctuation">:</span> <span class="token string">"u_polina"</span><span class="token punctuation">,</span>
		registrationDate<span class="token punctuation">:</span> <span class="token string">"2014-04-12 15:20:22"</span><span class="token punctuation">,</span>
		anotherKey<span class="token punctuation">:</span> <span class="token string">"Любая информация"</span>
	<span class="token punctuation">}</span>
<span class="token punctuation">}</span>

Ни один из ключей не является обязательным, должен быть передан хотя бы один.

В ключе custom можно передать объект, содержащий ваши собственные произвольные данные о посетителе, которые могут быть любопытны оператору.

Пример изменения контактных данных посетителя:

<code class="language-javascript"><span class="token function">TalkMe</span><span class="token punctuation">(</span><span class="token string">"setClientInfo"</span><span class="token punctuation">,</span> <span class="token punctuation">{</span>
	name<span class="token punctuation">:</span> <span class="token string">"Имя"</span><span class="token punctuation">,</span>
	email<span class="token punctuation">:</span> <span class="token string">"polina@mail.ru"</span>
<span class="token punctuation">}</span><span class="token punctuation">)</span><span class="token punctuation">;</span></code>

Пометить посетителя целевым

<code class="language-javascript"><span class="token function">TalkMe</span><span class="token punctuation">(</span><span class="token string">"setTarget"</span><span class="token punctuation">,</span> reason<span class="token punctuation">)</span><span class="token punctuation">;</span></code>

reason - строка, содержащая причину, по которой посетитель помечен целевым.

Получение контактных данных

<code class="language-javascript"><span class="token function">TalkMe</span><span class="token punctuation">(</span><span class="token string">"getContacts"</span><span class="token punctuation">,</span> callback<span class="token punctuation">)</span><span class="token punctuation">;</span></code>

Например:

<code class="language-javascript"><span class="token function">TalkMe</span><span class="token punctuation">(</span><span class="token string">"getContacts"</span><span class="token punctuation">,</span> <span class="token keyword">function</span><span class="token punctuation">(</span>data<span class="token punctuation">)</span><span class="token punctuation">{</span>
	console<span class="token punctuation">.</span><span class="token function">log</span><span class="token punctuation">(</span>data<span class="token punctuation">)</span><span class="token punctuation">;</span>	
<span class="token punctuation">}</span><span class="token punctuation">)</span><span class="token punctuation">;</span></code>

Содержимое параметра data:

  • name - Имя
  • phone - Номер телефона
  • email - Email
  • skype - Skype

Окно чата

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

Открытие чата

<code class="language-javascript"><span class="token function">TalkMe</span><span class="token punctuation">(</span><span class="token string">"openSupport"</span><span class="token punctuation">)</span><span class="token punctuation">;</span></code>

Например:

<code class="language-markup"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>a</span> <span class="token attr-name">href</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>#<span class="token punctuation">"</span></span> <span class="token attr-name">onClick</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>TalkMe(<span class="token punctuation">'</span>openSupport<span class="token punctuation">'</span>); return false;<span class="token punctuation">"</span></span><span class="token punctuation">&gt;</span></span>Задать вопрос<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>a</span><span class="token punctuation">&gt;</span></span></code>

Отобразить форму для отзыва

<code class="language-javascript"><span class="token function">TalkMe</span><span class="token punctuation">(</span><span class="token string">"openReviewsTab"</span><span class="token punctuation">)</span><span class="token punctuation">;</span></code>

Например:

<code class="language-markup"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>a</span> <span class="token attr-name">href</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>#<span class="token punctuation">"</span></span> <span class="token attr-name">onClick</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>TalkMe(<span class="token punctuation">'</span>openReviewsTab<span class="token punctuation">'</span>); return false;<span class="token punctuation">"</span></span><span class="token punctuation">&gt;</span></span>Задать вопрос<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>a</span><span class="token punctuation">&gt;</span></span></code>

Изменение размера окна чата

<code class="language-javascript"><span class="token function">TalkMe</span><span class="token punctuation">(</span><span class="token string">"setDimensions"</span><span class="token punctuation">,</span> width<span class="token punctuation">,</span> height<span class="token punctuation">)</span><span class="token punctuation">;</span></code>

Например:

<code class="language-markup"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>script</span><span class="token punctuation">&gt;</span></span><span class="token script language-javascript">
	<span class="token function">TalkMe</span><span class="token punctuation">(</span><span class="token string">"setDimensions"</span><span class="token punctuation">,</span> <span class="token number">400</span><span class="token punctuation">,</span> <span class="token number">500</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
</span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span></code>

Изменение позиции окна чата

<code class="language-javascript"><span class="token function">TalkMe</span><span class="token punctuation">(</span><span class="token string">"setPosition"</span><span class="token punctuation">,</span> x<span class="token punctuation">,</span> y<span class="token punctuation">)</span><span class="token punctuation">;</span></code>

Например:

<code class="language-markup"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>script</span><span class="token punctuation">&gt;</span></span><span class="token script language-javascript">
	<span class="token function">TalkMe</span><span class="token punctuation">(</span><span class="token string">"setPosition"</span><span class="token punctuation">,</span> <span class="token number">100</span><span class="token punctuation">,</span> <span class="token number">200</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
</span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span></code>

Ярлык для открытия чата

В этом разделе собраны методы, позволяющие управлять ярлыком открытия Online-чата.

Изменение отступа ярлыка от границы экрана

<code class="language-javascript"><span class="token function">TalkMe</span><span class="token punctuation">(</span><span class="token string">"setTriggerPosition"</span><span class="token punctuation">,</span> side<span class="token punctuation">,</span> value<span class="token punctuation">)</span><span class="token punctuation">;</span>
 
<span class="token comment" spellcheck="true">/* side = "top", "bottom", "left" или "right" */</span></code>

Например:

<code class="language-markup"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>script</span><span class="token punctuation">&gt;</span></span><span class="token script language-javascript">
	<span class="token function">TalkMe</span><span class="token punctuation">(</span><span class="token string">"setTriggerPosition"</span><span class="token punctuation">,</span> <span class="token string">"top"</span><span class="token punctuation">,</span> <span class="token number">150</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
</span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span></code>

Сообщения

Отправка сообщения от имени клиента

<code class="language-javascript"><span class="token function">TalkMe</span><span class="token punctuation">(</span><span class="token string">"sendMessage"</span><span class="token punctuation">,</span> text<span class="token punctuation">)</span><span class="token punctuation">;</span></code>

Например:

<code class="language-markup"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>script</span><span class="token punctuation">&gt;</span></span><span class="token script language-javascript">
	<span class="token function">TalkMe</span><span class="token punctuation">(</span><span class="token string">"sendMessage"</span><span class="token punctuation">,</span> <span class="token string">"Здравствуйте! У меня серьёзная проблема!"</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
</span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span></code>

Отправка сообщения от имени оператора

<code class="language-javascript"><span class="token function">TalkMe</span><span class="token punctuation">(</span><span class="token string">"receiveMessage"</span><span class="token punctuation">,</span> text<span class="token punctuation">,</span> operator<span class="token punctuation">,</span> simulateTyping<span class="token punctuation">)</span><span class="token punctuation">;</span></code>
  • text - текст сообщения. Это единственный обязательный параметр.
  • operator - логин оператора, от которого придет сообщение. По умолчанию будет взят логин текущего выбранного оператора
  • simulateTyping - время в миллисекундах, которое уйдет на то, чтобы сообщение было "напечатано"

Например:

<code class="language-markup"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>script</span><span class="token punctuation">&gt;</span></span><span class="token script language-javascript">
	<span class="token function">TalkMe</span><span class="token punctuation">(</span><span class="token string">"receiveMessage"</span><span class="token punctuation">,</span> <span class="token string">"Мы уже спешим на помощь ;)"</span><span class="token punctuation">,</span> <span class="token keyword">null</span><span class="token punctuation">,</span> <span class="token number">2000</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
</span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span></code>

Операторы

Выбор любого оператора

С помощью этого метода вы можете назначить посетителю любого оператора, находящегося в сети:

<code class="language-javascript"><span class="token function">TalkMe</span><span class="token punctuation">(</span><span class="token string">"setOperator"</span><span class="token punctuation">,</span> <span class="token string">"Логин оператора"</span><span class="token punctuation">)</span><span class="token punctuation">;</span></code>

Отслеживание статусов операторов

Вы можете отслеживать список операторов, находящихся в данный момент в сети при помощи метода listenOperatorsStatus:

<code class="language-javascript"><span class="token function">TalkMe</span><span class="token punctuation">(</span><span class="token string">"listenOperatorsStatus"</span><span class="token punctuation">,</span> callback<span class="token punctuation">)</span><span class="token punctuation">;</span></code>

Например:

<code class="language-javascript"><span class="token function">TalkMe</span><span class="token punctuation">(</span><span class="token string">"listenOperatorsStatus"</span><span class="token punctuation">,</span> <span class="token keyword">function</span><span class="token punctuation">(</span>onlineOperators<span class="token punctuation">)</span><span class="token punctuation">{</span>
	console<span class="token punctuation">.</span><span class="token function">log</span><span class="token punctuation">(</span>onlineOperators<span class="token punctuation">)</span><span class="token punctuation">;</span>
<span class="token punctuation">}</span><span class="token punctuation">)</span><span class="token punctuation">;</span></code>

В параметр onlineOperators будет передан массив с логинами операторов, находящихся в сети

<code class="language-javascript"><span class="token punctuation">[</span><span class="token string">"operator1"</span><span class="token punctuation">,</span> <span class="token string">"operator2"</span><span class="token punctuation">]</span></code>

События

Вы можете получать уведомления о различных событиях, связанных с чатом.

<code class="language-javascript"><span class="token function">TalkMe</span><span class="token punctuation">(</span><span class="token string">"setCallback"</span><span class="token punctuation">,</span> event<span class="token punctuation">,</span> <span class="token keyword">function</span><span class="token punctuation">(</span>data<span class="token punctuation">)</span><span class="token punctuation">{</span>
	<span class="token comment" spellcheck="true">//Здесь вы можете вставить ваш Javascript код, обрабатывающий событие</span>
<span class="token punctuation">}</span><span class="token punctuation">)</span><span class="token punctuation">;</span></code>

Параметр event - это название события, которое Вы хотите отследить.

Список отслеживаемых событий, которые можно передать в параметр event выглядит следующим образом:

  • fullyLoaded - загрузка завершена
  • openSupport - было открыто окно чата
  • closeSupport - было закрыто окно чата

  • clientSendMessage - посетитель отправил сообщение оператору.

    Содержимое параметра data:

    • text - Текст сообщения
    • operator - Логин оператора
    • firstMessage - true / false

  • operatorSendMessage - оператор отправил сообщение посетителю.

    Содержимое параметра data:

    • text - Текст сообщения
    • operator - Логин оператора
    • id - уникальный ID сообщения

  • clientMakeSubscribe - посетитель заполнил форму.

    В параметр data будет передан объект, содержащий заполненные посетителем поля.

  • sendRate - посетитель отправил новый отзыв.

    Содержимое параметра data:

    • comment - Текст отзыва
    • rate - Оценка
    • operator - Логин оператора

  • contactsUpdated - посетитель обновил информацию о себе.

    Содержимое параметра data:

    • name - Имя посетителя
    • phone - Номер телефона
    • email - Email
    • skype - Skype
    • custom - объект с Вашими дополнительными полями

Например:

<code class="language-javascript"><span class="token function">TalkMe</span><span class="token punctuation">(</span><span class="token string">"setCallback"</span><span class="token punctuation">,</span> <span class="token string">"clientSendMessage"</span><span class="token punctuation">,</span> <span class="token keyword">function</span><span class="token punctuation">(</span>data<span class="token punctuation">)</span><span class="token punctuation">{</span>
	<span class="token function">alert</span><span class="token punctuation">(</span>data<span class="token punctuation">.</span>text<span class="token punctuation">)</span><span class="token punctuation">;</span>
<span class="token punctuation">}</span><span class="token punctuation">)</span><span class="token punctuation">;</span></code>

Получения типа устройства

device-type

TalkMe("getDevice", function(deviceType) {
    console.log(deviceType);
});

Возможные значения: "desktop" | "mobile" | "tablet"

Источник: https://lcab.talk-me.ru/online#online?site=l0042hdtzoheujv8kbd672zy84mm88qi/site/api/javascript/api-js-intro

Связаться с автором Поддержать деньгами (что?)