OmniMeetingSDK

O OmniMeetingSDK é uma lib que integra o atendimento de vídeo meeting em qualquer operadora. Apenas importando o script js com poucas linhas é possível utilizar o modal de atendimento.

Conhecendo o funcionamento básico do SDK

Abaixo um código de como usar o SDK no HTML:

<html> <head>..</head> <body> <div class="omni-meeting-room" data-id="idMeeting" data-variant="button" data-text="Iniciar chamada"></div> <script src="https://meeting-testing.sandbox.mosiaomnichannel.com.br/cdn/sdk.js"></script> <script> OmniMeeting.config({ userType: 'atendente', token: 'authToken', applicationInstance: '1|2', responsavelAtendimento: { nome: 'Dr. Pedro Paulo', descricao: 'Teleconsulta - Cardiologista', avatar: 'https://img.freepik.com/vetores-premium/medico-icone-ou-avatar-em-branco_136162-58.jpg?w=826' } }) </script> </body> </html>

No código acima vemos:

  1. Linha 04. Uma div com a class “omni-meeting-room“, é um widget que vai ser renderizado de acordo com a variação passada no atributo “data-variation“, mais na frente teremos um tópico destinado a falar apenas sobre os widgets e todos os atributos de cada variação.

  2. Linha 05. Após o widget, importamos o arquivo sdk que contém todo o código que carregará os widgets e o modal de atendimento.

  3. Linha 07. Após importar o sdk acionamos a função config() passando as configurações de autenticação e dados para o atendimento, essa função sempre deve carregar somente após os widgets.

Informações

AVISOS
  1. O campo "Obrigatório" esclarece quais regras / validações serão aplicadas ou quais os conteúdos serão permitidos ou rejeitados. As ações descritas aqui devem ser implementadas, evitando que os conteúdos inválidos sejam criticados pelo SDK.

CRITÉRIOS DE PREENCHIMENTO

Abreviação

Nome

Descrição

Abreviação

Nome

Descrição

M

Mandatório

O preenchimento do atributo é obrigatório. Caso o atributo esteja nulo ou em branco, seu "response" será rejeitado.

C

Condicional

O atributo pode tornar-se obrigatório quando um ou mais atributos auxiliares for preenchido / atualizado.

OP

Opcional

Seu preenchimento não é obrigatório. 

Funções disponíveis pelo SDK

Function

Descrição

Function

Descrição

config

Função para configurar (ou reconfigurar) a inicialização dos widgets, conexão com websocket e etc.

open

Função para abrir o modal de atendimento.

isOpen

Função que retorna se o modal está aberto com um valor boleano true ou false.

on

Função para inscrever e receber eventos enviados pelo embed do modal de atendimento.

close

Função para enviar um comando para o modal de vídeo atendimento.

Função config(object)

Função para configurar (ou reconfigurar) a inicialização dos widgets, conexão com websocket e etc.

Parâmetro

Obrigatório

Tipo

Descrição

Parâmetro

Obrigatório

Tipo

Descrição

token

M

string

Token de autenticação

applicationInstance

M

number

A instância da aplicação. Ex:
1 = sandbox
2 = produção

userType

M

string

Tipo de usuário. Ex: atendente

responsavelAtendimento

OP

object

Dados do atendente que será exibido ao ligar para o aplicativo.

Objeto responsavelAtendimento

Parâmetro

Obrigatório

Tipo

Descrição

Parâmetro

Obrigatório

Tipo

Descrição

nome

M

string

Nome do responsável pelo atendimento

descricao

M

string

Descrição livre que fica abaixo do nome na ligação.

avatar

M

string

URL da foto do responsável

Em uma lista dinâmica (em AJAX) de widgets, onde os widgets são atualizados sem atualização da página, essa função deve ser acionada sempre que a listagem atualizar. Dessa maneira o SDK será capaz de atualizar as salas das meetings no websocket.

Exemplo de uso no código:

OmniMeeting.config({ userType: 'atendente', token: 'authToken', applicationInstance: '1|2', responsavelAtendimento: { nome: 'Dr. Pedro Paulo', descricao: 'Teleconsulta - Cardiologista', avatar: 'https://img.freepik.com/vetores-premium/medico-icone-ou-avatar-em-branco_136162-58.jpg?w=826' } })

Função open(object)

Função para abrir o modal de atendimento.

Parâmetro

Obrigatório

Tipo

Descrição

Parâmetro

Obrigatório

Tipo

Descrição

meetingId

M

string

Token de autenticação

responsavelAtendimento

C

object

Dados do atendente que será exibido ao ligar para o aplicativo. O campo é obrigatório somente quando não é informado na função config()

Objeto responsavelAtendimento

Parâmetro

Obrigatório

Tipo

Descrição

Parâmetro

Obrigatório

Tipo

Descrição

nome

M

string

Nome do responsável pelo atendimento

descricao

M

string

Descrição livre que fica abaixo do nome na ligação.

avatar

M

string

URL da foto do responsável

Essa função só deve ser acionada após a função config()

Exemplo de uso no código:

<button onClick="javascript:OmniMeeting.open({meetingId: '7bd87bf1-9980-4410-8db1-878dd59bc045'})">Iniciar atendimento</button>

Função isOpen()

Função que retorna se o modal está aberto com um valor boleano true ou false.

Função on(event, callback)

Função para inscrever e receber eventos enviados pelo embed do modal de atendimento.

Função close()

Função para enviar um comando para o modal de vídeo atendimento.

Exemplo de uso no código:

Parâmetro

Obrigatório

Tipo

Descrição

Parâmetro

Obrigatório

Tipo

Descrição

event

M

string

Evento que deseja ouvir atualizações

callback

M

function

Função que será acionada quando o evento acontecer

Eventos disponíveis

Evento

Descrição

Evento

Descrição

openModal

Esse evento é acionado sempre que o modal abre.

exit

Esse evento é acionado sempre que o modal é fechado (não necessariamente por encerramento por parte do atendente).

finish

Esse evento é acionado sempre que o atendimento é encerrado.

ready

Esse evento é acionado quando o token informado é autenticado com sucesso no realtime.

error

Esse evento é acionado quando ocorre algum erro no realtime ou no sdk que impede o funcionamento do mesmo.

Callback do evento openModal(object)

Callback do evento exit(object)

Callback do evento finish(object)

Callback do evento ready()

Esse evento apenas sinaliza que o sdk carregou sem erros, não possui nenhum parâmetro com informações adicionais.

Callback do evento waitingRoom(object)

Callback do evento error(object)

Códigos de erros:

Código

Descrição

Código

Descrição

UNAUTHORIZED

Erro de autenticação, o token informado é inválido.

 

Essa função só deve ser acionada após a função config()

Exemplo de uso no código:

Widgets

Os widgets são elementos que são renderizados pelo SDK a partir das configurações passadas pela propriedade da tag <div>.

Os widgets possuem 3 variações, badge, button e text. Para definir uma variação, basta passar o atributo data-variation.

Exemplo:

Estrutura de configuração do widget

Para renderizar um widget é necessário que a class “omni-meeting-room“ seja sempre informada, seguida pelo data-id. Os principais atributos do widget são esses:

Atributo

Obrigatório

Tipo

Descrição

Atributo

Obrigatório

Tipo

Descrição

class

M

string

A class que usaremos para buscar e renderizar os widgets.

Sempre informar: omni-meeting-room

data-id

M

string

O id da meeting para entrar na sala do websocket.

data-variant

OP

string

Variação do widget. Por padrão é renderizado a variação “text“.

Variações disponíveis:

  • text

  • badge

  • button

  • label

Variação text

A variação text será renderizado apenas um texto por padrão ON|OFF, ON para sinalizar que beneficiário está na sala de espera e OFF para sinalizar que não está na sala de espera.

Atributos de configuração disponíveis para essa variação:

Atributo

Obrigatório

Tipo

Descrição

Atributo

Obrigatório

Tipo

Descrição

data-text-waiting-room-on

OP

string

Descrição do botão quando beneficiário está na sala de espera.

data-text-waiting-room-off

OP

string

Descrição do botão quando beneficiário não está na sala de espera.

Exemplo:

Variação badge

A variação badge será renderizado um badge, que fica cinza quando o beneficiário não está na sala de espera e verde quando está.

Atributos de configuração disponíveis para essa variação:

Atributo

Obrigatório

Tipo

Descrição

Atributo

Obrigatório

Tipo

Descrição

data-badge-text

OP

string

Descrição do botão padrão.

data-badge-text-waiting-room-on

OP

string

Descrição do botão quando beneficiário está na sala de espera.

data-badge-text-waiting-room-off

OP

string

Descrição do botão quando beneficiário não está na sala de espera.

data-badge-color-on

OP

string

Cor (HEX) do badge quando o beneficiário está na sala de espera.

Padrão: #28b543

data-badge-color-off

OP

string

Cor (HEX) do badge quando o beneficiário não está na sala de espera.

Padrão: #BBBBBB

Exemplo:

Variação button

A variação button será renderizado um botão com um badge da sala de espera ao lado, ao clicar nesse botão será aberto o modal de atendimento, ao usar esse widget não é necessário usar a função OmniMeeting.open({meetingId}).

Atributos de configuração disponíveis para essa variação:

Atributo

Obrigatório

Tipo

Descrição

Atributo

Obrigatório

Tipo

Descrição

data-button-text

OP

string

Descrição do botão padrão.

data-button-text-waiting-room-on

OP

string

Descrição do botão quando beneficiário está na sala de espera.

data-button-text-waiting-room-off

OP

string

Descrição do botão quando beneficiário não está na sala de espera.

data-badge-color-on

OP

string

Cor (HEX) do badge quando o beneficiário está na sala de espera.

Padrão: #28b543

data-badge-color-off

OP

string

Cor (HEX) do badge quando o beneficiário não está na sala de espera.

Padrão: #BBBBBB

data-button-text-color

OP

string

Cor do texto do botão em hexadecimal;

data-button-bg-color

OP

string

Cor de fundo do botão em hexadecimal.

data-button-border-color

OP

string

Cor da borda do botão em hexadecimal.

data-button-border-width

OP

number

Tamanho da borda do botão em pixels.

Padrão: 1px

data-button-radius

OP

number

Tamanho do arredondamento do botão em pixels.

Padrão: 0

data-nome-responsavel-atendimento

C

string

Nome do responsável do atendimento.

Obrigatório quando não é informado na função config()

data-descricao-responsavel-atendimento

C

string

Descrição do responsável do atendimento.

Obrigatório quando não é informado na função config()

data-avatar-responsavel-atendimento

C

string

URL do avatar do responsável do atendimento.

Obrigatório quando não é informado na função config()

Exemplo:

Variação label

A variação label será renderizado uma etiqueta que mostra “SALA DE ESPERA“ quando o beneficiário acessa a sala de espera.

Atributos de configuração disponíveis para essa variação:

Atributo

Obrigatório

Tipo

Descrição

Atributo

Obrigatório

Tipo

Descrição

data-label-text-waiting-room-on

OP

string

Descrição do botão quando beneficiário está na sala de espera.

data-label-text-waiting-room-off

OP

string

Descrição do botão quando beneficiário não está na sala de espera.

data-label-bg-color-on

OP

string

Cor (HEX) de fundo da label quando o beneficiário está na sala de espera.

Padrão: #18AD2C

data-label-bg-color-off

OP

string

Cor (HEX) de fundo da label quando o beneficiário não está na sala de espera.

data-label-radius

OP

string

Tamanho do arredondamento do botão.

Padrão: 15px

data-label-color-on

OP

string

Cor do texto quando o beneficiário está na sala de espera.

Padrão: #fff

data-label-color-off

OP

string

Cor do texto quando o beneficiário não está na sala de espera.

data-label-padding

OP

string

Padding (espaçamento interno) da label para o texto.

Padrão: 5px 15px

data-label-font-size

OP

number

Tamanho do texto.

Padrão: 11px

Exemplo:

Mobile Saúde - Mosia Omnichannel