Human Request: Tipo Publicador, Correções no Menus e Novo Módulo de Galerias (req-018)

Esta especificação define o lote de trabalho req-018 (BATCH-018) para o Engenheiro Executor. Ele engloba a evolução do módulo de menus (adição do tipo Publicador e correções de bugs) e a criação do novo módulo de galleries (Galerias de Imagens).

1. Evolução e Correções no Módulo de Menus

1.1 Tipo de Item Publicador (publicador)

• Campos no Formulário (HTML × pt-br/en):

  • Adicionar a opção "Publicador" (ou "Publisher") no dropdown #menu_item_type.

  • Exibir os campos abaixo condicionalmente apenas quando o tipo "Publicador" for selecionado:

  • Seletor de Publicador: Dropdown populado dinamicamente com #publisher_id_options# (carrega registros da tabela publisher).

  • Limite: Input numérico para definir a quantidade máxima de itens filhos (count, padrão 5, mínimo 1).

  • Ordenação: Dropdown com opções para definir a ordem das publicações (order_by com opções date_desc, date_asc, title_asc, title_desc).

• Árvore de Menus (menus.js):

  • Salvar no schema os dados do item tipo publicador: publisher_id, count e order_by (além de id, type, label e css_classes).

  • Renderizar na árvore visual a barra do item indicando o tipo (ex: Publicador: Notícias (limite: 5)).

  • Impedir que o usuário arraste ou insira manualmente sub-itens sob o nó do tipo publicador na árvore visual.

  • Expor as opções corretas de edição inline no painel de configurações do item (Rótulo, Publicador, Limite, Ordenação, Classes CSS).

• Popular Publicadores (menus.php):

  • Criar menus_publisher_options($selected_id) para buscar publicadores ativos da tabela publisher (idioma corrente) e substituir #publisher_id_options# no HTML.

  • Chamar essa função nos métodos CRUD (menus_adicionar, menus_editar, menus_clonar).

• Resolução em Runtime (menus.widget.php):

  • Na renderização inline, inspecionar a árvore e, para cada nó do tipo publicador, buscar dinamicamente as páginas via banco (paginas.publisher_id = '<ID>' filtrado por status e idioma) limitadas por count e ordenadas por order_by. Injetar essas páginas como nós filhos temporários de type = 'pagina' em children antes de renderizar recursivamente.

• Simulação no Editor HTML (html-editor-interface.js & simulation htmls):

  • Adaptar a simulação recursiva: se o nó for do tipo publicador, gerar dinamicamente $count sub-itens simulados de tipo pagina sob o nó para o preview do editor HTML.

  • Atualizar os arquivos de componente de simulação de menus (pt-br e en) para incluir um exemplo demonstrativo de item publicador na árvore mockada.

1.2 Correções Adicionais no Menus

• Ajuste no Template ID:

  • Quando a opção de modelo visual template_id for alterada, garantir que o conteúdo HTML/CSS do CodeMirror do Editor HTML seja atualizado corretamente, mesmo se a aba do editor estiver focada no momento da mudança.

• Ajuste no Alternador de Tipo de Item (item_type):

  • Corrigir a lógica de alternar campos de entrada do formulário. Ao trocar para link personalizado, cabeçalho, separador, etc., exibir apenas as caixas correspondentes (ex: add-field-label, add-field-url, etc.) e ocultar as opções de busca de páginas.

• Inclusão de Variáveis nos Templates:

  • Integrar os placeholders de variáveis [[item#slug]] e [[item#css_classes]] (escritos como @[[item#slug]]@ e @[[item#css_classes]]@ no banco/templates) em todos os 12 templates do módulo menus (em pt-br e en) para que as classes e slugs sejam renderizados no HTML final.

2. Criação do Módulo de Galerias de Imagens (galleries)

2.1 Clonagem e Registro

• Nomenclatura: Identificador de módulo 'galleries' (Galerias de Imagens).

• Clone de Destaques: Clonar a estrutura do módulo publisher-highlights para criar o novo módulo, removendo colunas e regras vinculadas a publisher (sem coluna publisher_id).

• Banco de Dados: Criar migração Phinx para a tabela galleries (id_galleries, name, fields_schema, html, css, status, language, versao, data_criacao, data_modificacao).

• Registro de Módulos: Registrar o novo módulo em gestor/db/data/ModulosData.json sob o grupo de administração gestor, com o ícone "images" e rótulos "Galerias de Imagens" / "Image Galleries".

2.2 Curadoria e Seleção de Múltiplas Imagens (galleries.js)

• Seleção em Lote:

  • Um botão "Selecionar Imagens do Servidor" abrirá o modal de iframe padrão (admin-arquivos).

  • Adicionar listener customizado para mensagens postMessage vindas do iframe do gerenciador de arquivos.

  • Ao receber uma imagem, o script deve validar seu formato de imagem e adicioná-la à lista de itens selecionados da galeria.

  • Comportamento em Lote: O script de recepção não deve fechar o modal automaticamente ao selecionar uma imagem. O modal deve permanecer aberto para permitir que o usuário clique em múltiplas imagens sequencialmente. O usuário fechará o modal de busca manualmente clicando em "Fechar" ou fora do modal.

• Dados de Imagem na Lista:

  • Cada imagem selecionada na lista deve exibir: seu thumbnail visual (imgSrc), nome do arquivo original, input de texto para Legenda (legenda) personalizada, e botão de remoção ("x").

• Reordenação Drag-and-Drop:

  • Utilizar a biblioteca Sortable.js (CDN) para permitir a reordenação das imagens na galeria.

• Serialização do Schema:

  • Salvar no input oculto fields_schema a lista final de imagens no formato:

    {
    "template_id": "...",
    "selected_items": [
    {
      "id": "file_123456",
      "caminho": "caminho/para/imagem.jpg",
      "imgSrc": "url/para/imagem.jpg",
      "nome": "imagem.jpg",
      "legenda": "Minha legenda personalizada"
    }
    ]
    }

2.3 Backend: Integração do ImagePick (galleries.php)

• Lógica:

  • Integrar os dados de parametrização do widget de seleção de imagem em galleries.php nas funções de CRUD (adicionar, editar e clonar), permitindo a abertura do gerenciador de arquivos em modo modal.

2.4 Renderização de Galerias no Widget (galleries.widget.php)

• Lógica:

  • Na função de renderização, decodificar fields_schema obtendo a lista de imagens de selected_items.

  • Processar os delimitadores no-item (se galeria estiver vazia) e item.

  • Para cada item de imagem, substituir as variáveis no delimitador item:

  • [[item#img-src]] -> URL completa da imagem para renderizar na tag src.

  • [[item#caminho]] -> Caminho relativo do arquivo.

  • [[item#nome]] -> Nome original do arquivo de imagem.

  • [[item#legenda]] -> Texto da legenda customizada.

• Templates Padrão:

  • Criar templates de galeria na pasta resources/{pt-br,en}/templates/ (ex: galleries-grid, galleries-carousel, galleries-masonry, galleries-slider) com blocos item e no-item.

2.5 Simulação e Variáveis no Editor HTML

• Lógica:

  • Habilitar o painel de Simulação/Variáveis no editor HTML para o alvo galleries.

  • Criar os componentes de simulação mockados (pt-br e en) na pasta de recursos com lista fictícia de imagens do Picsum contendo legendas, nomes e URLs para alimentar o preview ao vivo.

3. Regras e Versionamento

• RECURSOS: Ao finalizar, executar a rotina de atualização de recursos (atualizacao-dados-recursos.php) para compilar e registrar os novos templates e o módulo de galerias.

• RESTRIÇÃO: Sem commits ou pushes automáticos no Git; as alterações permanecem locais no executor.