Exemplo de código do widget

<html>
<head>
   <!-- Incluir os bundles -->
   <script src="https://cdn-apps.drimify.com/prod/widget/index.js" type="text/javascript"></script>

   <!-- Configurar o widget ao carregar a página -->
   <script>
       janela.addEventListener('load', function () {
           var widget = DigitaService.Widget.Create({
               autoscroll: true,
               element: 'gamification-widget',
               engine: 'https://apps.drimify.com/Rf6aGmBR/',
               fixed: false,
               altura:['auto'],
               sharingurl: 'https://apps.drimify.com/Rf6aGmBR/',
               largura: '100%',
           });
           widget.onReady = function (event) {};
           widget.onComplete = function (event) {};
           widget.onFirstInteraction = function () {};
           widget.onRouteChange = function (event) {};
           widget.onScrollToTop = function () {};
           widget.onClose = function () {};
           widget.onError = function (errorEvent) {};
           widget.load();
       });
   </script>
</head>
<body>
<div id="gamification-widget"></div>
</body>
</html>

Configuração

Crie um widget passando um objeto de opções à função Create:

var widget = DigitaService.Widget.Create(options);

Opções de configuração

Obrigatórias

Opcionais

Carregamento

Depois de configurar o widget, é necessário carregá-lo. Pode fazê-lo a qualquer momento.

Nota: configure os callbacks abaixo antes de carregar o widget para garantir que consegue captar todos os eventos.

widget.load();

Callbacks de eventos

onReady

Ao chamar widget.load(), o widget é carregado e inicializado. Quando este processo termina, é executado o callback opcional onReady.

Nota: onReady é acionado antes de o primeiro ecrã ser apresentado. O primeiro evento onRouteChange indica que o participante já consegue ver conteúdo. Se não for possível iniciar a experiência, onReady não é acionado e, em vez disso, é chamado onError.

widget.onReady = function (event) {
   // Carregado e pronto a utilizar
   console.log(event.type); // “ready”
   console.log(event.data); // {}
};

onError

Ao chamar widget.load(), o widget é carregado e inicializado. Qualquer erro fatal que ocorra a partir desse momento irá executar o callback opcional onError.

widget.onError = function (event) {
   console.log(event.data.message); // Por exemplo, "ERR_15"
};

onComplete

É acionado quando o jogo termina e o utilizador está a visualizar o último ecrã. Disponibiliza também um objeto de dados que descreve o que aconteceu durante o jogo.

Nota: se pretender executar uma ação neste momento, considere definir um tempo de espera no callback para dar ao utilizador tempo para ler o Ecrã Final, uma vez que o evento é acionado assim que esse ecrã é apresentado. Também pode utilizar onClose.

widget.onComplete = function (event) {
   console.log(event.type); // “complete”
   console.log(event.data); // {}
   console.log("A pontuação do utilizador foi: " + event.data.gameMetrics.score);
};

onResize

É acionado quando as dimensões da aplicação mudam e fornece a altura em píxeis.

widget.onResize = function (event) {
   console.log(event.type); // “resize”
   console.log(event.data); // {}
   console.log("Altura da aplicação: " + event.data.height);
};

onFirstInteraction

É acionado quando o utilizador interage pela primeira vez com a aplicação carregada, através de um toque ou clique.

widget.onFirstInteraction = function () {
   console.log("O utilizador interagiu com a aplicação pela primeira vez");
};

onRouteChange

É acionado quando a aplicação muda de rota dentro do widget, ou seja, quando navega entre ecrãs. Consoante o contexto, o evento pode ou não conter um objeto de dados.

widget.onRouteChange = function (event) {
   console.log(event.type) // “routechange”
   console.log(event.data) // {} ou undefined
   console.log("O utilizador navegou para um novo ecrã");
};

onScrollToTop

É acionado quando a aplicação tenta deslocar a página de volta ao topo. Pode ser utilizado na página que contém o widget para garantir que o deslocamento ocorre caso seja bloqueado por restrições de CORS, ou para o ajustar conforme necessário. O evento não contém um objeto de dados.

widget.onScrollToTop = function () {
   console.log("Deslocar para o topo");
};

Métricas

Segue-se uma lista das principais métricas que podem ser utilizadas consoante o tipo de jogo:

Credenciais

Tratamento de erros

Existem duas formas principais de detetar erros e obter informações sobre problemas que ocorram no widget:

Callback onError

O callback onError capta erros fatais que impedem a experiência de iniciar ou de recuperar. O código de erro encontra-se em event.data.message. Nestes casos, onReady não é acionado.

widget.onError = function (event) {
    if (event.data && typeof event.data.message !== 'undefined') {
        mudar (event.data.message) {
            padrão:
                // Não fazer nada
                break;
            case 'ERR_04':
                console.log("Limite de visualizações atingido");
                break;
            case 'ERR_05':
                console.log("Erro de segurança");
                break;
            case 'ERR_07':
                console.log("Aplicação não publicada");
                break;
            case 'ERR_08':
                console.log("Aplicação Premium indisponível");
                break;
            case 'ERR_09':
                console.log("UID da sessão não detetado");
                break;
            case 'ERR_10':
                console.log("UID da sessão não autorizado");
                break;
            case 'ERR_13':
                console.log("A chamada SSO falhou");
                break;
            case 'ERR_14':
                console.log("Idioma indisponível");
                break;
            case 'ERR_15':
                console.log("A página não existe");
                break;
            case 'ERR_17':
                console.log("Configuração de LOGIN SSO inválida");
                break;
            case 'ERR_21':
                console.log("Nenhum jogo associado ao Combo ou ao Dynamic Path");
                break;
        }
    }
};

Callback onRouteChange

O callback onRouteChange é acionado quando a aplicação navega entre os diferentes ecrãs do widget. É útil para monitorizar erros relacionados com o estado da aplicação e a disponibilidade do conteúdo.

widget.onRouteChange = function (event) {
    if (event.data && typeof event.data.errorCode !== 'undefined') {
        mudar (event.data.errorCode) {
            padrão:
                // Não fazer nada
                break;
            case 'ERR_02':
                console.log("O conteúdo ainda não está disponível");
                break;
            case 'ERR_03':
                console.log("O conteúdo expirou");
                break;
            case 'ERR_04':
                console.log("Limite de visualizações atingido");
                break;
            case 'ERR_16':
                console.log("Não há perguntas disponíveis");
                break;
            case 'ERR_18':
                console.log("Entre dois períodos de ativação");
                break;
            case 'ERR_19':
                console.log("Fora do horário de funcionamento");
                break;
        }
    }
};

errorCode só está presente nestes ecrãs de indisponibilidade. Outros ecrãs que impedem o participante de jogar, por já ter jogado, por restrições de acesso ou por recusa de formulários, não têm errorCode: identifique-os pelo nome em event.data.screen.

Para consultar a lista completa de nomes dos ecrãs, a ordem dos eventos durante o carregamento, o comportamento de session_uid e os tempos limite de carregamento, consulte Ciclo de vida do widget e tratamento de erros.

Obter informações do utilizador no Ecrã Final (onRouteChange)

Ao utilizar Dynamic Path™, Advent Calendar ou Combo™, pode obter informações do utilizador no final de qualquer jogo através do callback onRouteChange.

É obrigatório utilizar este método porque o evento padrão onComplete só é acionado quando toda a experiência de várias etapas estiver concluída, e não no final de cada jogo integrado.

Desta forma, o seu sistema pode receber os resultados completos do jogo (através de gameInfo) quando o utilizador chega ao ecrã final da experiência.

Configuração

Depois de criar o widget:

var widget = DigitaService.Widget.Create(options);

Adicione o listener onRouteChange:

widget.onRouteChange = function (event) {
    console.log(event.type);   // "routechange"
    console.log(event.data);   // { ... } ou undefined
    console.log("O utilizador navegou para um novo ecrã");
};

```# Detetar a Tela Final

Quando o utilizador chega à tela final do jogo, o widget devolve uma rota que corresponde a:

event.data.screen === 'screen_end-YOUR_APP_ID'

Substitua `YOUR_APP_ID` pelo ID da sua aplicação.

# Obter as Informações do Utilizador (`gameInfo`)

Após detetar a tela final, pode extrair os dados:

event.data.gameInfo

`gameInfo` contém um **array com informações do utilizador**, que pode incluir:
* Dados introduzidos pelo utilizador
* Resultados ou pontuações do jogo
* Campos recolhidos durante a experiência

Estes dados só estão disponíveis na tela final de experiências utilizadas no **Dynamic Path**, **Advent Calendar** ou **Combo**.

# Exemplo

widget.onRouteChange = function (event) {
if (event.data && event.data.screen === 'screen_end-12345') {
const dados = event.data.gameInfo;
console.log("End tela info:", data);
// Processe ou encaminhe estas informações conforme necessário
}
};

Actualizado em: 29/10/2026