O Arcano Hyperview
Arquivo estatico para o RPG dark fantasy O Arcano, com interface glass dark,
menu lateral recolhivel e pagina inicial de apresentacao.
Abrir
Abra index.html no navegador ou use o servidor local em http://127.0.0.1:5173/.
Nao ha etapa de build.
Customizar conteudo
Edite assets/js/content.js.
A pagina inicial fica em index. Cada registro fica em entries e usa uma aba em tab:
IndexItensMagiasBestiarioPaisesCenariosErasSistemasPersonaHistoriasRacasMapaDeuses
Para adicionar uma pagina:
- Copie um objeto existente em
entries.
- Troque
id, tab, title, summary, fields e body.
- Coloque imagens novas em
assets/images e referencie o caminho em image.
Estrutura
index.html: marcacao principal.assets/css/styles.css: menu lateral recolhivel, interface glass dark e responsividade.assets/js/content.js: dados customizaveis da wiki.assets/js/app.js: menu, busca e renderizacao dos templates.assets/images: imagens geradas e simbolo do projeto.
Supabase (migrations SQL)
Rode os arquivos abaixo UMA VEZ no Supabase > SQL Editor, na ordem:
supabase-access-requests.sql — tabelas base (stories, index_config, access_requests) + RLS.supabase-tags.sql — coluna tags em stories.supabase-itens.sql — colunas subtype e fields em stories.supabase-master-palette.sql — paleta de cores personalizada do Mestre (necessaria para salvar cores no editor de texto). Se o site já estiver publicado e mostrar PGRST205/schema cache ao salvar uma cor, rode este arquivo novamente no SQL Editor: ele cria a tabela se faltar, concede o acesso da Data API e recarrega o esquema.supabase-characters.sql — tabela characters (fichas de personagem dos jogadores) + RLS. Depende da funcao criada em supabase-access-requests.sql.supabase-characters-sheet.sql — colunas da ficha interativa (vitals, statuses, inventory, spells) na tabela characters.
Persona — criador de personagens
A aba Persona deixou de ser uma categoria de NPCs e virou o criador de fichas de
personagem dos jogadores. Cada ficha fica vinculada ao usuario (coluna user_id):
- Qualquer conta aprovada cria/edita as proprias fichas (varias por conta); o Mestre
(admin) ve as fichas de todos os jogadores.
- A ficha tem: raca (puxa HP por parte do corpo e Mana do dossie da raca, editaveis),
atributos (todos comecam em 10 + 6 pontos para distribuir; a cada 2 pontos acima da
base, +1d6 nos testes; o
Modificador da raca soma dados), DA configuravel por
atributo, O Despertar (ver abaixo), pericias/talentos e identidade narrativa
(papel, desejo, ferida e historia em rich-text).
O Despertar (mago / nao-mago)
Durante a criacao, o jogador rola 1d100 (ate 3 tentativas, mantem a ultima) com uma
animacao de ritual:
- 1–70: nasce Nao-Mago. 71–100: nasce Mago.
- Mago pode Aceitar a Mana (rola 1d100 da Escola: 1–50 Elemental, 51–85 Arcanista,
86–95 Druidico, 96–100 Celestial) ou Renunciar (vira nao-mago).
- Mago que aceitou: recebe Mana e escola arcana; ao chegar a 0 Mana, entra em
Colapso Arcano e fica inconsciente/incapaz de agir, lutar, conjurar ou mover-se sozinho.
- Fragilidade Arcana: mago sofre -1d6 apenas em testes de Resistencia para exaustao
prolongada, doenca, sangramento ou recuperacao fisica.
- Nao-Mago / renunciou: nao tem Mana natural, nao sofre Colapso Arcano, recebe +1
Nivel de HP e +1 ponto em um atributo aleatorio (rolado no Despertar, respeitando o
teto).
Para ajustar a lista de atributos, os numeros (base 10 / pool 6 / teto 16), as faixas/escolas
ou a reducao de DF/DM, edite as constantes CHAR_ATTRIBUTES, CHAR_ATTR_BASE,
CHAR_POINT_POOL, CHAR_ATTR_MAX, AWAKEN_MAGE_MIN, MAGIC_SCHOOLS e DEF_REDUCTION no
topo de assets/js/app.js.
Observacao: entradas antigas de stories com tab = 'Persona' (se existirem no banco) deixam
de aparecer nessa aba, que agora lista somente fichas da tabela characters.
Ficha viva (interativa)
Depois de criada, a ficha (#/Persona/<id>) funciona como um documento vivo, organizado em
abas: Visao Geral (atributos, despertar, identidade, pericias), Combate (DA, DF/DM, HP,
status), Inventario, Magias e Historia. Um cabecalho mostra retrato, nome e o resumo
(DA/DF/DM/HP/Mana).
O dono e o Mestre podem alterar; mudancas salvam sozinhas no Supabase:
- Pontos de Vida: cada parte do corpo tem uma barra (atual/maximo) com campo de valor e
botoes Dano/Curar; a Mana tem Gastar/Restaurar. Se a Mana de um mago cai a
0, a ficha adiciona o status automatico de Colapso Arcano; se a Mana voltar, remove o status.
- Testes e DA: atributos rolam
Nd6 + 1d12 de Destino. A aba Combate tem rolagem de
Dificuldade de Acerto usando o atributo base escolhido na criacao.
- DF / DM: a ficha separa Defesa Fisica e Defesa Magica. Cada uma soma nivel base
- itens equipados e mostra a porcentagem de reducao de dano conforme a tabela do sistema
(0%, 10%, 20%, 35%, 50%, 65%, 75%).
- Status: lista de condicoes (ex.: Sangramento) que da pra adicionar/remover. (Os efeitos
mecanicos de cada status serao desenvolvidos depois.)
- Inventario: dividido em Mochila (espaco ilimitado) e Equipado (ate 6 itens).
Da pra Equipar/Desequipar e ajustar quantidade. Itens vem da aba Itens (puxa
nome/resumo/DF/DM do codex e viram link) ou avulsos escritos a mao.
- Livro de Magias: adicione magias da aba Magias (vira link) ou avulsas; quando houver
custo em MP, a ficha permite gastar Mana pela propria magia.
Requer a migracao supabase-characters-sheet.sql. Se ela nao tiver rodado, a criacao de ficha
continua funcionando (sem o estado vivo) e a ficha avisa ao tentar salvar HP/status/itens.
Editor do Mestre (criar / editar entradas)
Em qualquer categoria criavel (Cenarios, Eras, Sistemas, Mapa, Deuses, Historias, Itens, Racas, Bestiario, Magias) o Mestre tem:
- Editor rich-text com negrito, italico, sublinhado, tachado, H2/H3, paragrafo, citacao (blockquote), listas com marcadores e numeradas, alinhamento, codigo inline, separador horizontal e cor do texto.
- Paleta de cores salvas: clique no
+ ao lado da paleta para guardar a cor atual; ela passa a aparecer na toolbar de todas as suas sessoes (sincroniza pelo Supabase, por usuario).
- Link interno: selecione um trecho de texto e clique no icone de corrente. Um modal mostra todas as historias do site para escolher o destino — o leitor podera clicar e ir direto.
- Tags reaproveitaveis: as tags ja usadas em outras entradas da MESMA categoria aparecem como sugestao logo abaixo do campo. Clicar em uma sugestao reaproveita label e cor.
- Editar uma entrada existente: na pagina de detalhe, o botao "Editar" leva ao mesmo formulario com tudo pre-preenchido. Salvar sobrescreve a entrada (a opcao de deletar continua disponivel).
Sistema narrativo: eras, acontecimentos e leitor
A aba Linha do Tempo (#/Eras) usa os registros reais de stories para montar o Cronoscópio. Não existe uma segunda base de dados: metadados narrativos ficam no JSON fields, que já faz parte da arquitetura do Codex.
O Cronoscópio não inclui um catálogo fixo de eras: nomes, limites, ordem e cor vêm exclusivamente das eras cadastradas pelo Mestre. A interface permanece modular para qualquer campanha ou cenário.
- Registros em
Eras usam Ordem, Início, Fim e Cor.
- Registros em
Historias usam Era, Data no mundo, Posição temporal, Realidade, Ponto de divergência e Importância.
- O Mestre cria eras em
#/Eras/criar e acontecimentos em #/Historias/criar.
- O editor rich-text aceita imagens entre parágrafos. No salvamento, imagens locais são otimizadas para WebP quando possível e enviadas ao bucket
banners antes de o HTML sanitizado ser persistido.
- Cada história abre no leitor imersivo em
#/Historias/<id>, com contexto temporal, modo focado e histórias relacionadas da mesma era.
Backup, testes e segurança
Backup do Codex (Mestre)
Na home, o Mestre tem dois botões: Backup (JSON) baixa tudo (entradas, apresentação e fichas) em um
arquivo restaurável, e Exportar (Markdown) baixa o texto do Codex, agrupado por categoria, para leitura
ou versionamento. Faça um backup antes de mudanças grandes no banco.
Testes de ponta a ponta (Playwright)
npm install
npm test
- Sem credenciais, roda o portão de acesso: carregamento sem erros de JavaScript, alternância entre
entrar e solicitar acesso, conteúdo protegido fechado, ausência de rolagem horizontal (celular, tablet
e desktop) e abertura animada uma vez por sessão.
- Com
E2E_EMAIL e E2E_PASSWORD (conta de teste aprovada, nunca a do Mestre), também percorre as
categorias, a linha do tempo e o diálogo de saída. Os testes só leem dados.
- Usa o Edge instalado (
E2E_CHANNEL=chrome para usar o Chrome); nada é baixado.
Erros inesperados
Erros de JavaScript e promessas rejeitadas viram um aviso discreto na tela (no máximo um por minuto) e
ficam completos no console do navegador. Não há serviço externo de monitoramento.
Segurança do Supabase (revisão de 25/10/2026)
- RLS ligado em todas as tabelas públicas; leitura só para contas aprovadas; escrita de conteúdo só do Mestre.
- Pendências no painel do Supabase (Authentication): ativar Leaked Password Protection.
current_arcano_role() é executável por usuários logados de propósito: as políticas de RLS dependem dela.
