Pular para conteúdo

Módulo de Cenários Interativos para Moodle

Sobre o Projeto

Este repositório contém o código-fonte e a documentação técnica de uma solução de Frontend Desacoplado para criação de experiências de aprendizagem interativas (Image Maps) dentro do Moodle.

O objetivo principal é permitir que conteudistas insiram cenários visuais ricos (com hotspots, hover effects e navegação) através de arquivos JSON e HTML simples, sem depender de plugins pesados ou alterações no core do Moodle.

Uso Rápido

1. Incluir o script no ambiente (Moodle)

Adicione o script abaixo no cabeçalho do seu tema ou nas configurações de "HTML Adicional" do Moodle.

<script src="https://s3-middag-public.middag.com.br/app-unb-ecos/imunizamaisbrasil/latest/app.min.js" defer></script>

2. Criar o Elemento Gatilho

Dentro de qualquer atividade do Moodle (Página, Rótulo, Livro), alterne para o modo HTML e insira:

<div
        class="cenario-wrapper"
        data-cenario-map="cenario-gestores-modulo01"
        style="min-height: 400px; position: relative;"
>
    <p>Carregando experiência interativa...</p>
</div>

O script detectará automaticamente este elemento, buscará o arquivo cenario-gestores-modulo01.json e renderizará a interface.

Build e Distribuição (CDN)

O pipeline de CI/CD publica automaticamente os artefatos gerados na pasta dist/ para a CDN pública. Abaixo estão as tabelas contendo os endpoints de distribuição das versões publicadas no CDN.

Versão LATEST — Build Contínuo (sempre atualizada)

Sempre aponta para o último build da branch main. Ideal para integração contínua sem alterar código no Moodle.

Tipo de Arquivo URL
Bundle JS (produção) https://s3-middag-public.middag.com.br/app-unb-ecos/imunizamaisbrasil/latest/app.min.js
Source Map https://s3-middag-public.middag.com.br/app-unb-ecos/imunizamaisbrasil/latest/app.js.map
Assets da versão https://s3-middag-public.middag.com.br/app-unb-ecos/imunizamaisbrasil/latest/assets/

Uso recomendado: ambientes que sempre devem receber a versão mais recente sem alterações no Moodle.

Versão SEMVER — Build Imutável (versões fixas)

Use para garantir estabilidade histórica ou para testes A/B de versões específicas. Substitua v{VERSION} pela versão específica desejada.

Tipo de Arquivo URL
Bundle JS (versão fixa) https://s3-middag-public.middag.com.br/app-unb-ecos/imunizamaisbrasil/v{VERSION}/app.min.js
Assets da versão https://s3-middag-public.middag.com.br/app-unb-ecos/imunizamaisbrasil/v{VERSION}/assets/

Uso recomendado: experimentos A/B, validações de features, ambientes críticos e versionados.

Documentação Técnica

A documentação técnica segue o padrão MkDocs e está organizada em módulos dentro da pasta docs/:

Roadmap

Monitoramento de Conclusão (Checklist)

Atualmente, a API core_courseformat_get_state retorna informações de Acesso (uservisible), mas não fornece explicitamente o estado de Conclusão (se a atividade já foi feita, aprovada ou reprovada).

Para exibir indicadores de progresso (ex: ícone \(\checkmark\)), será necessário implementar uma segunda chamada à API:

  • Método: core_completion_get_activities_completion_***
  • Payload: { courseid: 123, userid: 456 }

No momento, o foco é garantir a navegação correta e o bloqueio de atividades restritas por segurança.

Desenvolvimento