JavaScript

Criação das pastas do projeto e do modelo HTML

Você começará criando um arquivo HTML, um arquivo JavaScript e um arquivo CSS. Esses três arquivos conterão, respectivamente, nosso layout, a lógica do aplicativo e alguns elementos visuais.

  1. Antes de começar a programar, crie uma nova pasta de projeto no seu computador para armazenar esses arquivos (o exemplo abaixo se chama meuprojeto (mas você pode dar o nome que quiser). Em seguida, adicione um /js e /css pasta, juntamente com arquivos vazios para index.html, app.js, e app.css na seguinte estrutura:
/myproject /js app.js /css app.css index.html

Depois de configurar seu projeto, abra a pasta principal do projeto no seu editor de código e vá até o index.html arquivo.

  1. Copie o código a seguir (usando o botão “Copiar”) e adicione-o ao seu arquivo index.html no editor de código:
<!DOCTYPE html>
<html>

<head>
    <title> OpenTok Signaling Sample </title>

    <script src="https://static.opentok.com/v2/js/opentok.min.js"></script>
    <link href="css/app.css" rel="stylesheet" type="text/css">
</head>

<body>
    <div id="textchat">
         <p id="history"></p>
         <form>
              <input type="text" placeholder="Input your text here" id="msgTxt"></input>
         </form>
    </div>
    <script type="text/javascript" src="js/app.js"></script>
</body>

</html>

O código acima inclui referências ao opentok.js biblioteca, bem como os arquivos JS e CSS que você criou. O código também inclui um div para o chat de texto e um formulário para você enviar mensagens.

Bate-papo básico por texto

Siga este tutorial para criar um chat de texto básico do zero usando a Video API da Vonage. Essa é a maneira mais rápida de desenvolver uma prova de conceito para essa funcionalidade na plataforma de vídeo.

Etapas
1
Visão geral
2
Antes de começar
3
Configurar um aplicativo de vídeo da Vonage
4
Criação das pastas do projeto e do modelo HTML
5
Configurando a autenticação
6
Conectando-se à sessão
7
Enviando um sinal
8
Recebimento de um sinal
9
Testando seu código em um navegador
10
Algumas pequenas personalizações em CSS
11
Conclusão