import { openPageDialog } from './page-picker.js';
import { openDocuments } from './media.js';

/*
 * Ein Linkfeld in der Verwaltung: die Adresse bleibt ein Textfeld - eine fremde Seite tippt man
 * ein -, daneben „Seite wählen“ und „PDF wählen“. Ohne Skript bleibt das Textfeld allein.
 *
 * Markup: <div data-link-field> mit einem <input data-link-input> darin. Felder, die später
 * erscheinen (neue Menüeinträge), bekommen ihre Knöpfe beim ersten Fokus.
 */
const enhance = field => {
  if (field.dataset.linkReady) return;
  const input = field.querySelector('[data-link-input]');
  if (!input) return;
  field.dataset.linkReady = '1';
  const row = document.createElement('div'); row.className = 'link-field-actions';
  const choose = value => { input.value = value; input.dispatchEvent(new Event('input', { bubbles: true })); input.dispatchEvent(new Event('change', { bubbles: true })); input.focus(); };
  const page = document.createElement('button'); page.type = 'button'; page.className = 'text-button'; page.textContent = 'Seite wählen';
  page.addEventListener('click', () => openPageDialog({ onChoose: item => choose(item.path === 'home' ? '/' : `/${item.path}`) }));
  const pdf = document.createElement('button'); pdf.type = 'button'; pdf.className = 'text-button'; pdf.textContent = 'PDF wählen';
  pdf.addEventListener('click', () => openDocuments({ onChoose: item => choose(item.src) }));
  row.append(page, pdf); input.after(row);
};
const all = () => document.querySelectorAll('[data-link-field]').forEach(enhance);
all();
new MutationObserver(all).observe(document.body, { childList: true, subtree: true });