Página inicial
Mais

Português - Brasil ‎(pt_br)‎

English ‎(en)‎ Português - Brasil ‎(pt_br)‎

Acessar

Página inicial

Confirmar

Visitantes não podem acessar os perfis de usuário. Acesse com uma conta completa de usuário para continuar.

Conheça os serviços do CEAD:

Banco de elementos gráficos
Cursos de capacitação
Ferramentas digitais
Palestras e oficinas

Endereço do CEAD:

Campus Darcy Ribeiro, Gleba A, 70910-900, Brasília - DF, Brasil.

Email: cead@unb.br

Telefone: (61) 3107-5827

Redes sociais do CEAD:

Contate o suporte do site

Você acessou como visitante (Acessar)

Resumo de retenção de dados

Baixar o aplicativo móvel.

Darcy Widget Moderno - Integração Moodle

🤖 Darcy Widget Moderno - Integração Moodle

✅ Widget Dinâmico: Carrega o ModernChatWidget diretamente da Edge Function com design glassmorphism e funcionalidades avançadas.

🎨

Design Moderno

Interface glassmorphism com animações suaves

⚡

Performance

Carregamento dinâmico com cache inteligente

🔧

Customizável

Temas, cores e posições personalizáveis

📱

Responsivo

Funciona perfeitamente em todos os dispositivos

📋 Código HTML Adicional para Moodle

Copie o código abaixo e cole em Administração do Site → Aparência → HTML Adicional:

<!-- Darcy Widget Moderno - UnB CEAD -->
<script>
(function() {
    'use strict';
    
    // Configurações do widget
    const WIDGET_CONFIG = {
        url: 'https://bzkkonblfmdoqbumpsmo.supabase.co/functions/v1/widget-builder/widget',
        theme: 'light',           // 'light' ou 'dark'
        primaryColor: '#3b82f6',  // Cor principal (azul UnB)
        position: 'bottom-right', // 'bottom-right', 'bottom-left', 'top-right', 'top-left'
        version: '1.0.0'
    };
    
    // Função para carregar o widget
    function loadDarcyWidget() {
        // Evita carregamento duplo
        if (document.getElementById('darcy-widget-root')) {
            console.log('Darcy Widget já carregado');
            return;
        }
        
        // Constrói URL com parâmetros
        const params = new URLSearchParams({
            theme: WIDGET_CONFIG.theme,
            color: encodeURIComponent(WIDGET_CONFIG.primaryColor),
            position: WIDGET_CONFIG.position,
            version: WIDGET_CONFIG.version
        });
        
        const widgetUrl = `${WIDGET_CONFIG.url}?${params.toString()}`;
        
        // Carrega o widget via fetch para melhor controle
        fetch(widgetUrl)
            .then(response => {
                if (!response.ok) {
                    throw new Error(`HTTP ${response.status}: ${response.statusText}`);
                }
                return response.text();
            })
            .then(html => {
                // Cria container temporário para processar o HTML
                const tempDiv = document.createElement('div');
                tempDiv.innerHTML = html;
                
                // Extrai e adiciona os estilos
                const styles = tempDiv.querySelectorAll('style');
                styles.forEach(style => {
                    if (!document.querySelector(`style[data-darcy-widget]`)) {
                        const newStyle = document.createElement('style');
                        newStyle.setAttribute('data-darcy-widget', 'true');
                        newStyle.textContent = style.textContent;
                        document.head.appendChild(newStyle);
                    }
                });
                
                // Adiciona o container do widget
                const widgetContainer = tempDiv.querySelector('#darcy-widget-root');
                if (widgetContainer) {
                    document.body.appendChild(widgetContainer);
                }
                
                // Executa os scripts
                const scripts = tempDiv.querySelectorAll('script');
                scripts.forEach(script => {
                    if (script.src) {
                        // Script externo
                        const newScript = document.createElement('script');
                        newScript.src = script.src;
                        newScript.async = true;
                        document.head.appendChild(newScript);
                    } else if (script.textContent && !script.textContent.includes('createRoot')) {
                        // Script inline (exceto o de renderização)
                        const newScript = document.createElement('script');
                        newScript.textContent = script.textContent;
                        document.body.appendChild(newScript);
                    }
                });
                
                // Executa o script de renderização após carregar React
                setTimeout(() => {
                    const renderScript = Array.from(scripts).find(s => 
                        s.textContent && s.textContent.includes('createRoot')
                    );
                    if (renderScript) {
                        eval(renderScript.textContent);
                    }
                }, 1000);
                
                console.log('✅ Darcy Widget carregado com sucesso!');
            })
            .catch(error => {
                console.error('❌ Erro ao carregar Darcy Widget:', error);
                
                // Fallback: mostra mensagem de erro discreta
                const errorDiv = document.createElement('div');
                errorDiv.style.cssText = `
                    position: fixed;
                    bottom: 20px;
                    right: 20px;
                    background: #dc3545;
                    color: white;
                    padding: 10px 15px;
                    border-radius: 8px;
                    font-size: 12px;
                    z-index: 9998;
                    opacity: 0.8;
                    cursor: pointer;
                `;
                errorDiv.textContent = 'Widget Darcy temporariamente indisponível';
                errorDiv.onclick = () => errorDiv.remove();
                document.body.appendChild(errorDiv);
                
                // Remove mensagem após 5 segundos
                setTimeout(() => errorDiv.remove(), 5000);
            });
    }
    
    // Carrega quando o DOM estiver pronto
    if (document.readyState === 'loading') {
        document.addEventListener('DOMContentLoaded', loadDarcyWidget);
    } else {
        loadDarcyWidget();
    }
    
    console.log('🤖 Darcy Widget Moderno inicializado');
})();
</script>

            ⚡ Funcionalidades do Widget Moderno:
            🎨 Design Glassmorphism: Interface moderna com efeitos de vidro
💬 Chat Inteligente: Respostas contextuais e sugestões automáticas
🔊 Síntese de Voz: Ouça as respostas do Darcy
📋 Copiar Mensagens: Copie facilmente as respostas
⚡ Carregamento Dinâmico: Sem código local, tudo vem da Edge Function
📱 Totalmente Responsivo: Funciona em desktop, tablet e mobile
🎯 Posicionamento Flexível: 4 posições disponíveis
🌙 Modo Escuro/Claro: Suporte a temas

        

🎨 Personalização Avançada

Modifique as configurações no objeto WIDGET_CONFIG:

// Exemplos de personalização:
theme: 'dark'                    // Modo escuro
primaryColor: '#dc3545'          // Vermelho
position: 'bottom-left'          // Canto inferior esquerdo
version: '2.0.0'                 // Versão específica

🔧 Instalação no Moodle

Acesse Administração do Site
Navegue para Aparência → HTML Adicional
Cole o código JavaScript completo
Salve as configurações
O widget aparecerá em todas as páginas do Moodle

⚠️ Importante:

Este código deve ser adicionado no HTML Adicional do tema, não em páginas específicas
O widget carrega automaticamente em todas as páginas do Moodle
Certifique-se de que a Edge Function está deployada e funcionando

🎯 Preview do Widget

O widget aparecerá como um FAB (Floating Action Button) no canto da tela.

Ao clicar, abrirá uma janela de chat moderna com design glassmorphism.

💬

FAB flutuante com animação de pulso

🚀 Resultado Final:
• Widget moderno carregado dinamicamente
• Design responsivo e acessível
• Funcionalidades avançadas de chat
• Zero manutenção local
• Atualizações automáticas via Edge Function

Fornecido por Moodle

©Tema Trema