req-075: Dashboard Site Toolbar, Agendamento de Páginas e Extensões do Editor HTML

Descrição do Problema / Contexto

Este lote consolidado de modificações agrupa três grandes metas de evolução do ecossistema conn2flow relacionadas com a navegação administrativa, agendamento de publicações e edição em tempo de execução:

1. Acessar Site do Layout Administrativo: Adicionar um botão no cabeçalho do layout administrativo para facilitar a navegação rápida do administrador de volta para a raiz pública do site.

2. Dashboard Site Toolbar (Iframe): Uma barra superior flutuante de ~30px (estilo WordPress admin bar) injetada em páginas públicas para usuários logados com permissão de edição. Ela abrigará botões para:

   • Edição visual/live da página HTML atual.

   • Atalho inteligente de edição avançada no painel administrativo (redirecionando para publisher-pages ou admin-paginas dependendo do tipo da página).

3. Agendamento e Datas Customizadas: Permitir nos formulários do admin-paginas e publisher-pages o agendamento de visibilidade (início e fim da publicação) e a alteração retroativa das datas de criação (data_criacao) e modificação (data_modificacao).

4. Atalhos de Gestão de Widgets no Editor HTML: Permitir no editor visual de HTML (tanto no novo via toolbar quanto no clássico dos módulos) que o usuário acesse diretamente a página administrativa de edição do widget selecionado via botão específico para isso (ex: ir para o módulo menus ao selecionar um widget do tipo menu).

Proposta de Alterações Detalhada

Meta 1: Botão "Acessar Site" no Layout Administrativo

• Arquivos Alvo:

  • pt-br/layout-administrativo-do-gestor.html

  • en/layout-administrativo-do-gestor.html

• Localização no HTML: Dentro da div .menu-controls (ao lado direito dos botões #menu-dashboard3d-btn e #menu-close-btn).

• Especificação:

  • Adicionar um botão para acessar a raiz do site público (@[[pagina#url-raiz]]@).

  • Utilizar um ícone apropriado (ex: home ou external alternate) e um tooltip curto localizado em pt-br e en ("Acessar site" / "Visit site").

Meta 2: Dashboard Site Toolbar (Iframe e Rota)

• Bootstrap e Injeção (Backend PHP):

  • Em gestor.php, verificar se id_usuarios > 0 e se o usuário tem permissão gestor_acesso('editar', 'admin-paginas').

  • Se positivo, injetar a tag <iframe> apontando para a nova rota dashboard-site-toolbar/ no topo/rodapé da página pública, com estilo fixed inline e z-index elevado. Use o skeleton fn gestor_dashboard_toolbar() para encapsular a lógica de injeção.

  • Injetar JS auxiliar [REDACTED] para compensar o topo com margin-top: 30px na página hospedeira.

• Controlador e Rota (Dashboard):

  • Rota registrada: dashboard-site-toolbar/.

  • Mapeamento de funções em dashboard.php:

  • dashboard_site_toolbar(): Carrega e popula o template HTML da toolbar do iframe.

  • dashboard_site_toolbar_menu(): Renderiza o menu suspenso de módulos. Use como base o template para criar o menu menus-dropdown.html.

  • Arquivos HTML e JS do Iframe (pt-br e en):

  • dashboard-site-toolbar.html (e versão en).

  • Garantir que todas as tags <a> no iframe usem target="_parent" ou target="_top".

Meta 3: Edição Visual Live da Página via Toolbar

• Assets e Lógica de Edição:

  • O editor de páginas visual clássico (editorHtmlVisual) utiliza a biblioteca html-editor.php e os arquivos JavaScript html-editor.js e html-editor-interface.js.

  • Criar versões específicas ou adaptadas desses JSs na mesma pasta de assets para funcionar sob o contexto da toolbar/iframe (salvamento via AJAX diretamente na página atual).

  • Botão "Editar Página" na Toolbar: Ao ser clicado, ativa a interface de edição visual in-place na página principal por meio de chamadas AJAX/postMessage.

Meta 4: Atalho de Edição Avançada Inteligente

• Especificação:

  • Adicionar o botão "Editar Página Avançado" na Toolbar.

  • Lógica de Redirecionamento:

  • Se a página ativa do site foi gerenciada/gerada pelo módulo do publicador de páginas (verificando no banco de dados na tabela paginas se possui metadados ou flag de publisher_id), o botão deve abrir a página de edição do módulo publisher-pages.

  • Caso contrário (página comum do sistema), abrir o módulo admin-paginas diretamente no registro em questão.

  • Use o campo id e publisher_id para acessar a página no módulo correto, formando a URL de edição como:

    • admin-paginas/editar/?id={id} ou

    • /publisher-pages/editar/?id={publisher_id}.

  • O link usará target="_parent" para abrir no navegador principal.

Meta 5: Agendamento de Páginas e Edição de Datas Retroativas

• Módulos Afetados:

  • admin-paginas (adicionar, editar, clonar) em pt-br e en.

  • publisher-pages (adicionar, editar, clonar) em pt-br e en.

• Posicionamento: Inserir uma sessão logo abaixo do marcador <!-- permissao-pagina > --> </div> em todos os templates de adicionar/editar/clonar de ambos os módulos.

• Novos Campos:

  • Opções de Publicação:

  • Publicado Agora (padrão).

  • Publicar a Partir de (data/hora de início de exibição).

  • Expirar/Despublicar em (data/hora de término de exibição).

  • Controle Retroativo de Datas:

  • Campo editável para Data de Criação (data_criacao).

  • Campo editável para Data de Modificação (data_modificacao).

• Regra de Negócio (Roteador/Consulta pública):

  • No roteamento de páginas de ambos os módulos, a query SQL de busca de páginas ativas deve verificar se a data e hora atual do servidor (NOW()) está entre o período de publicação (se configurado). Se estiver fora da janela, retornar erro 404 (página indisponível).

  • Tratar as datas retroativas customizadas informadas pelo usuário ao persistir os dados no banco.

  • Os campos de data são DATETIME no banco de dados, e devem ser validados para formato correto antes de salvar. Porém, mostrar o formato amigável no front nos formulários (ex: dd/mm/yyyy hh:mm).

Meta 6: Atalhos para Edição Administrativa de Widgets

• Especificação:

  • No editor HTML visual (tanto o clássico quanto o novo via toolbar), ao selecionar um widget (onde atualmente há a engrenagem/lápis para alterar o slug) dentro do menu html-editor-floating-toolbar, adicionar um ícone botão/atalho para a página administrativa correspondente daquele widget.

  • O editor deve mapear o tipo de widget selecionado (ex: widget de menu) e abrir a URL de gerenciamento (ex: menus/editar/?id={id} passando o identificador ou ID do menu configurado naquele widget).

Validação e Testes

1. Verificação Estática:

   • Rodar php -l em todos os arquivos modificados.

   • Verificar integridade sintática e fechamento de tags HTML nos templates de tradução pt-br/en.

2. Teste Funcional da Toolbar:

   • Logar no sistema e verificar se o iframe da toolbar é renderizado no topo da página pública com o menu populado.

   • Clicar em "Editar Página" e conferir se a biblioteca html-editor é acionada in-place.

   • Testar o redirecionamento inteligente ("Editar Página Avançado") para página comum (admin-paginas) e para página com flag/tipo publisher (publisher-pages).

3. Teste Funcional de Agendamento:

   • Cadastrar página agendada para o futuro e validar que o acesso público retorna 404.

   • Cadastrar página com expiração passada e verificar que retorna 404.

   • Salvar uma página com datas de criação/modificação retroativas e validar se os valores foram gravados corretamente no banco de dados.

4. Teste de Link do Layout:

   • Clicar no botão do layout administrativo e certificar que redireciona corretamente para a home pública do site.