BlenderWiki - Site HTML Puro

Este é o BlenderWiki refatorado de React para HTML puro + JavaScript, conforme solicitado. O site agora é totalmente estático e pode ser hospedado na Vercel ou qualquer outro serviço de hospedagem estática.

🚀 Funcionalidades Implementadas

✅ Conversão de React para HTML Puro

• Páginas separadas: Cada seção agora é um arquivo HTML independente
  • index.html - Página principal (Documentos)
  • api.html - Documentação da API
  • forum.html - Fórum da comunidade
  • settings.html - Configurações do usuário

✅ Sistema de Autenticação com Avatares

• Cadastro com gênero: Campo obrigatório para seleção de gênero (Masculino/Feminino)
• Avatares automáticos: Gerados dinamicamente usando:
  • https://avatar.iran.liara.run/public/boy?username={NomeUsuario} (Masculino)
  • https://avatar.iran.liara.run/public/girl?username={NomeUsuario} (Feminino)
• Persistência: Dados salvos no localStorage do navegador

✅ Sistema de Documentação em Markdown

• Parser JavaScript: Implementado parser próprio para renderizar Markdown
• Carregamento dinâmico: Arquivos .md carregados via fetch
• Exemplo funcional: docs/api-exemplo.md com documentação completa
• Syntax highlighting: Suporte para blocos de código com diferentes linguagens

✅ Organização de Arquivos

blenderwiki-html/
├── index.html              # Página principal
├── api.html                # Página da API
├── forum.html              # Página do fórum
├── settings.html           # Página de configurações
├── styles.css              # Estilos globais
├── shared.js               # JavaScript compartilhado
├── app.js                  # JavaScript da página principal
├── api.js                  # JavaScript da página API
├── forum.js                # JavaScript da página do fórum
├── settings.js             # JavaScript das configurações
├── markdown-parser.js      # Parser de Markdown
├── docs/                   # Diretório para arquivos Markdown
│   └── api-exemplo.md      # Exemplo de documentação
└── README.md               # Este arquivo

🛠️ Como Usar

Desenvolvimento Local

1. Navegue até o diretório do projeto:

   cd blenderwiki-html

2. Inicie um servidor HTTP local:

   python3 -m http.server 8000

3. Acesse no navegador:

   http://localhost:8000
   

Deploy na Vercel

1. Faça upload dos arquivos para um repositório Git
2. Conecte o repositório à Vercel
3. Configure o diretório raiz como blenderwiki-html
4. Deploy automático será realizado

📝 Adicionando Nova Documentação

Para adicionar uma nova documentação em Markdown:

1. Crie o arquivo .md no diretório docs/:

   docs/minha-nova-doc.md

2. Adicione a seção no arquivo api.js:

   const initialApiSections = [
     // ... seções existentes
     {
       id: 'minha-nova-doc',
       title: 'Minha Nova Documentação',
       description: 'Descrição da nova documentação',
       markdownFile: 'docs/minha-nova-doc.md'
     }
   ];

3. Formato do Markdown: Use Markdown padrão com suporte para:

   • Headers (#, ##, ###)
   • Parágrafos
   • Listas (- ou *)
   • Código inline (`código`)
   • Blocos de código (```linguagem)
   • Links ([texto](url))
   • Negrito (**texto**) e itálico (*texto*)

👤 Sistema de Usuários

Cadastro

• Nome de usuário (único)
• Senha
• Nome completo
• Email
• Cargo/Função
• Gênero (para geração do avatar)

Login

• Nome de usuário
• Senha

Dados Persistidos

Os dados são salvos no localStorage do navegador:

• blenderwiki_users - Lista de usuários cadastrados
• blenderwiki_current_user - Usuário logado atualmente
• blenderwiki_posts - Posts da página principal
• blenderwiki_forum_posts - Posts do fórum
• blenderwiki_user_settings - Configurações do usuário

🎨 Personalização

Estilos

• CSS: Editável em styles.css
• Framework: Tailwind CSS via CDN
• Ícones: Lucide Icons via CDN

JavaScript

• Modular: Cada página tem seu próprio arquivo JS
• Compartilhado: Funcionalidades comuns em shared.js
• Extensível: Fácil adição de novas funcionalidades

🔧 Funcionalidades Técnicas

Parser de Markdown

• Suporte completo: Headers, parágrafos, listas, código, links
• Syntax highlighting: Diferentes cores para linguagens
• Botão copiar: Em todos os blocos de código
• Responsivo: Adaptado para mobile

Navegação

• SPA-like: Navegação fluida entre páginas
• Estado persistente: Login mantido entre páginas
• Responsivo: Funciona em desktop e mobile

Compatibilidade

• Navegadores modernos: Chrome, Firefox, Safari, Edge
• Mobile: Totalmente responsivo
• Estático: Não requer servidor backend

📱 Responsividade

O site é totalmente responsivo e funciona bem em:

• Desktop: Layout completo com sidebar
• Tablet: Layout adaptado
• Mobile: Menu colapsável e interface otimizada

🚀 Performance

• Carregamento rápido: Arquivos otimizados
• Cache: Aproveitamento do cache do navegador
• CDN: Bibliotecas carregadas via CDN
• Lazy loading: Markdown carregado sob demanda

🔒 Segurança

• Client-side: Toda autenticação é local
• Sem backend: Não há servidor para atacar
• Dados locais: Informações ficam no navegador do usuário

📄 Licença

Este projeto é uma refatoração do BlenderWiki original para HTML puro, mantendo todas as funcionalidades principais e adicionando o sistema de avatares baseado em gênero conforme solicitado.