// Generator app — mounted on pages that render the contract editor.
// Initial doctype resolution:
//   1) window.__INITIAL_DOCTYPE  (set inline by /vzor/*.html)
//   2) ?type= URL param          (back-compat on /vzor.html)
//   3) 'auto'                    (default)
const GenApp = () => {
  const [doctype, setDoctype] = React.useState(() => {
    if (window.__INITIAL_DOCTYPE) return window.__INITIAL_DOCTYPE;
    const u = new URLSearchParams(location.search);
    const raw = u.get('type') || 'auto';
    // back-compat aliasy: stavba/dom/byt/nebyt/pozemok → auto (fallback default)
    const allowed = ['auto', 'motorka', 'dodavka', 'pripojne'];
    return allowed.includes(raw) ? raw : 'auto';
  });
  const [sellers, setSellers] = React.useState([{ id: 1, type: 'person' }]);
  const [buyers, setBuyers] = React.useState([{ id: 2, type: 'person' }]);

  const [optionals, setOptionals] = React.useState({
    'c-protocol': true,   // preberací protokol pri odovzdaní (Čl. IV bod 4.3)
    'c-penalty':  false,  // zmluvná pokuta pri omeškaní s platbou (Čl. III)
    'c-warranty': true,   // vyhlásenie kupujúceho o oboznámení sa so stavom (Čl. VII bod 7.4)
  });
  const [activeArticle, setActiveArticle] = React.useState('art-1');
  const [activeTipKey, setActiveTipKey] = React.useState(null);
  const [tipModalKey, setTipModalKey] = React.useState(null);
  const [progress, setProgress] = React.useState(0);

  // Click na TIP tlačidlo: aktualizuj sidebar (desktop) aj otvor modal (mobile).
  // Scroll-spy v Paper si naďalej volá iba setActiveTipKey, takže modal nereaguje
  // na rolovanie — otvorí sa len na zámerný klik.
  const handleTipClick = React.useCallback((key) => {
    setActiveTipKey(key);
    setTipModalKey(key);
  }, []);

  // Pri zmene doctype aktualizuj URL (history.pushState) a document.title
  // podľa konfigurácie v config.js.
  React.useEffect(() => {
    const url = window.VZOR_URLS && window.VZOR_URLS[doctype];
    const title = window.VZOR_TITLES && window.VZOR_TITLES[doctype];
    if (title) {
      document.title = title.replace(/\(\d{4}\)/, '(' + new Date().getFullYear() + ')');
    }
    if (url && location.pathname !== url) {
      history.pushState({ doctype }, '', url);
    }
  }, [doctype]);

  // Reverzné mapovanie pre tlačidlo Späť/Dopredu v prehliadači.
  React.useEffect(() => {
    const handler = () => {
      const entries = Object.entries(window.VZOR_URLS || {});
      const match = entries.find(([, url]) => url === location.pathname);
      if (match && match[0] !== doctype) setDoctype(match[0]);
    };
    window.addEventListener('popstate', handler);
    return () => window.removeEventListener('popstate', handler);
  }, [doctype]);

  // Compute progress from filled .ed fields inside .paper.
  React.useEffect(() => {
    const compute = () => {
      const paper = document.querySelector('article.paper');
      if (!paper) return;
      const eds = Array.from(paper.querySelectorAll('.ed[data-placeholder]'))
        .filter(el => el.offsetParent !== null);
      if (!eds.length) { setProgress(0); return; }
      const filled = eds.filter(el => (el.textContent || '').trim().length > 0).length;
      const pct = Math.round((filled / eds.length) * 100);
      setProgress(pct);
    };

    const t = setTimeout(compute, 150);
    const handler = () => compute();
    document.addEventListener('input', handler, true);
    document.addEventListener('change', handler, true);
    const mo = new MutationObserver(() => { clearTimeout(window.__progTimer); window.__progTimer = setTimeout(compute, 50); });
    const paper = document.querySelector('article.paper');
    if (paper) mo.observe(paper, { childList: true, subtree: true, attributes: true, attributeFilter: ['class', 'style'] });

    return () => {
      clearTimeout(t);
      document.removeEventListener('input', handler, true);
      document.removeEventListener('change', handler, true);
      mo.disconnect();
    };
  }, []);

  const toggleOptional = (id) => setOptionals(o => ({ ...o, [id]: !o[id] }));

  return (
    <>
      <GenHeader doctype={doctype} setDoctype={setDoctype} progress={progress} />
      <div className="gen-shell">
        <Paper
          doctype={doctype}
          sellers={sellers} setSellers={setSellers}
          buyers={buyers} setBuyers={setBuyers}
          optionals={optionals}
          setActiveArticle={(id) => { setActiveArticle(id); }}
          setActiveTipKey={setActiveTipKey}
          onTipClick={handleTipClick}
          activeTipKey={activeTipKey}
        />
        <RightSidebar
          doctype={doctype}
          optionals={optionals}
          toggleOptional={toggleOptional}
          activeArticle={activeArticle}
          activeTipKey={activeTipKey}
          clearTipKey={() => setActiveTipKey(null)}
        />
      </div>
      {window.LEGAL_TEXTS && window.LEGAL_TEXTS[doctype] && (
        <section
          className="legal-article"
          dangerouslySetInnerHTML={{ __html: window.LEGAL_TEXTS[doctype].html }}
        />
      )}
      <TipModal
        doctype={doctype}
        optionals={optionals}
        tipKey={tipModalKey}
        onClose={() => { setTipModalKey(null); setActiveTipKey(null); }}
      />
    </>
  );
};

ReactDOM.createRoot(document.getElementById('gen-root')).render(<GenApp />);

// ------------------------------------------------------------
// Copy / "Save as Word" sanitizer — zachovaný z pôvodného projektu.
// Pri kopírovaní z .paper sa každý <select> nahradí len aktuálne zvoleným textom.
// ------------------------------------------------------------
document.addEventListener('copy', (e) => {
  const sel = document.getSelection();
  if (!sel || sel.rangeCount === 0 || sel.isCollapsed) return;
  const range = sel.getRangeAt(0);
  const paper = document.querySelector('article.paper');
  if (!paper || !paper.contains(range.commonAncestorContainer) && !paper.contains(range.startContainer)) return;

  const frag = range.cloneContents();
  const wrap = document.createElement('div');
  wrap.appendChild(frag);

  // Custom dropdown: button text (.ed-select-text) UŽ obsahuje selected label,
  // takže pri copy stačí odstrániť skrytý <select.ed-select-native>, popup
  // (ak je otvorený) a print mirror — ostane jednorazovo button text.
  wrap.querySelectorAll('.tip-btn, .tip-pin, .party-remove, .party-add, .seg-toggle, .seg-add, .no-copy, .party-type-switches, .ed-select-print, .ed-select-popup, .ed-select-native').forEach(el => el.remove());

  const html = wrap.innerHTML;
  const text = wrap.innerText || wrap.textContent || '';

  e.clipboardData.setData('text/html', html);
  e.clipboardData.setData('text/plain', text);
  e.preventDefault();
});