Início Rápido

1. Injetando o script

Para realizar a instalação, é necessário adicionar uma tag script ao final do seu arquivo HTML utilizando um dos canais de distribuição. Há duas formas principais de fazer isso:

1. Diretamente pelo HTML:

<!-- Adicionar dentro do body após todo o código -->
<script src="https://api-cdn.handtalk.me/sdk/beta/ht-api-sdk.min.js"></script>

2. Utilizando Javascript:

const script = document.createElement("script");

script.src = "https://api-cdn.handtalk.me/sdk/beta/ht-api-sdk.min.js";

document.body.appendChild(script);

Independente do método, quando o script for carregado, a classe HTApi vai estar disponível no objeto global window.

Dica: Aguardar carregamento do script

Se você tentar instanciar a classe HTApi imediatamente após a inserção da tag script, pode receber um erro informando que a classe não está disponível. Isso ocorre, pois o carregamento do script não é síncrono. Para corrigir isso, recomendamos utilizar o segundo método de injeção de script e utilizar a função onload para aguardar a conclusão do carregamento e assim, garantir que a classe HTApi esteja disponível.

const script = document.createElement("script");

script.src = "https://api-cdn.handtalk.me/sdk/beta/ht-api-sdk.min.js";

document.body.appendChild(script);

script.onload = () => {
	// Inicie a biblioteca aqui
};

2. Instanciando a classe

Agora que a biblioteca foi carregada em seu código, só resta instanciar a classe HTApi e utilizar os seus métodos. No código abaixo, vamos instanciar o HTApi com o mínimo de informações necessárias, iniciar a biblioteca e realizar uma tradução simples:

const htapi = new window.HTApi({ token: "SEU TOKEN" });

htapi.active();

// Simula um tempo de carregamento da biblioteca
setTimeout(() => {
	htapi.translate("Olá mundo!");
}, 2000);

3. Exemplo completo

Juntando todos os trechos de código teremos algo parecido com o exemplo abaixo:

const script = document.createElement("script");

script.src = "https://api-cdn.handtalk.me/sdk/beta/ht-api-sdk.min.js";

document.body.appendChild(script);

script.onload = () => {
	const htapi = new window.HTApi({ token: "SEU TOKEN" });

	htapi.active();

	// Simula um tempo de carregamento da biblioteca
	setTimeout(() => {
		htapi.translate("Olá mundo!");
	}, 2000);
};