API de eventos

O widget expõe uma API JavaScript que permite controlá-lo e reagir às ações do usuário diretamente do código do seu site.

Como funciona

Antes do widget carregar, window.Pliic é um array. Você empilha comandos nele com push(). Quando o widget termina de carregar, o array é substituído por um objeto com seu próprio método push(), e todos os comandos enfileirados são executados na ordem.

Esse padrão garante que você possa registrar eventos mesmo antes do script terminar de carregar.

<script>
  window.Pliic = window.Pliic || [];
  window.Pliic.push(['on', 'suggestion:created', function(data) {
    console.log('Nova sugestão:', data.title);
  }]);
</script>

Comandos disponíveis

Abrir o painel

window.Pliic.push(['open']);

Fechar o painel

window.Pliic.push(['close']);

Trocar a aba ativa

window.Pliic.push(['setTab', 'suggestions']);
window.Pliic.push(['setTab', 'support']);

Inscrever-se em um evento

window.Pliic.push(['on', 'widget:open', function() {
  console.log('Widget aberto');
}]);

Eventos

Evento	Payload	Descrição
widget:open	N/A	O painel do widget foi aberto.
widget:close	N/A	O painel do widget foi fechado.
widget:tab-change	{ tab: string }	A aba ativa foi alterada.
suggestion:created	{ id: number, title: string }	Uma nova sugestão foi enviada.
ticket:created	{ id: number, ticket_number: string }	Um novo ticket foi enviado.

Exemplo completo

<script>
  window.Pliic = window.Pliic || [];

  window.Pliic.push(['on', 'widget:open', function() {
    console.log('O usuário abriu o widget');
  }]);

  window.Pliic.push(['on', 'widget:tab-change', function(data) {
    console.log('Aba ativa:', data.tab);
  }]);

  window.Pliic.push(['on', 'suggestion:created', function(data) {
    console.log('Sugestão #' + data.id + ': ' + data.title);
  }]);

  window.Pliic.push(['on', 'ticket:created', function(data) {
    console.log('Ticket criado:', data.ticket_number);
  }]);
</script>

<script
  src="https://pliic.com/widget/v1.js"
  data-app-key="SUA_CHAVE_DO_APP"
  async
  defer
></script>

Próximos passos

• Autenticação de usuários: identifique usuários logados
• Solução de problemas: quando algo não funciona