// Generator app — vlastní směnka „bez protestu" (single A4 list).
// § 75 zákona č. 191/1950 Sb., zákon směnečný a šekový (ZSŠ).
const GenApp = () => {
  // Strany — výstavce vlastní směnky je zároveň dlužníkom (§ 75 ZSŠ).
  const [creditor, setCreditor] = React.useState({ type: 'person' });
  const [debtor, setDebtor] = React.useState({ type: 'person' });
  const [aval, setAval] = React.useState({ type: 'person' });

  const [withAval, setWithAval] = React.useState(false);
  const [email, setEmail] = React.useState('');

  const [activeArticle, setActiveArticle] = React.useState('art-header');
  const [activeTipKey, setActiveTipKey] = React.useState(null);
  const [tipModalKey, setTipModalKey] = React.useState(null);
  const [progress, setProgress] = React.useState(0);

  const handleTipClick = React.useCallback((key) => {
    setActiveTipKey(key);
    setTipModalKey(key);
  }, []);

  // Document title
  React.useEffect(() => {
    if (window.VZOR_TITLE) {
      document.title = window.VZOR_TITLE.replace(/\(\d{4}\)/, '(' + new Date().getFullYear() + ')');
    }
  }, []);

  // Progress: count visible .ed[data-placeholder] + non-empty <input type="date"|"email">.
  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);
      const dates = Array.from(paper.querySelectorAll('input.ed-date'))
        .filter(el => el.offsetParent !== null);
      const total = eds.length + dates.length;
      if (!total) { setProgress(0); return; }
      const filledEds = eds.filter(el => (el.textContent || '').trim().length > 0).length;
      const filledDates = dates.filter(el => (el.value || '').trim().length > 0).length;
      const pct = Math.round(((filledEds + filledDates) / total) * 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();
    };
  }, []);

  return (
    <>
      <GenHeader progress={progress} />
      <div className="gen-shell">
        <Paper
          creditor={creditor} setCreditorType={(t) => setCreditor({ type: t })}
          debtor={debtor} setDebtorType={(t) => setDebtor({ type: t })}
          withAval={withAval} setWithAval={setWithAval}
          aval={aval} setAvalType={(t) => setAval({ type: t })}
          email={email} setEmail={setEmail}
          setActiveArticle={(id) => { setActiveArticle(id); }}
          setActiveTipKey={setActiveTipKey}
          onTipClick={handleTipClick}
          activeTipKey={activeTipKey}
        />
        <RightSidebar
          activeArticle={activeArticle}
          activeTipKey={activeTipKey}
          clearTipKey={() => setActiveTipKey(null)}
          withAval={withAval}
        />
      </div>
      {window.LEGAL_TEXTS && window.LEGAL_TEXTS.html && (
        <section
          className="legal-article"
          dangerouslySetInnerHTML={{ __html: window.LEGAL_TEXTS.html }}
        />
      )}
      <TipModal
        tipKey={tipModalKey}
        onClose={() => { setTipModalKey(null); setActiveTipKey(null); }}
      />
    </>
  );
};

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

// ------------------------------------------------------------
// Copy / "Save as Word" sanitizer — same as zápůjčka, kept verbatim.
// ------------------------------------------------------------
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);

  const liveSelects = paper.querySelectorAll('select.ed-select');
  const clonedSelects = wrap.querySelectorAll('select.ed-select');
  const liveInRange = [];
  for (const s of liveSelects) {
    const r = document.createRange();
    r.selectNode(s);
    if (range.compareBoundaryPoints(Range.END_TO_START, r) <= 0 &&
        range.compareBoundaryPoints(Range.START_TO_END, r) >= 0) {
      liveInRange.push(s);
    }
  }
  clonedSelects.forEach((cs, i) => {
    const live = liveInRange[i];
    const val = live ? live.value : cs.value;
    const picked = Array.from(cs.querySelectorAll('option')).find(o => o.value === val)
                || cs.querySelector('option[selected]')
                || cs.querySelector('option');
    const label = picked ? picked.textContent : '';
    const textNode = document.createTextNode(label);
    cs.parentNode.replaceChild(textNode, cs);
  });

  // Replace <input type="date"> with the formatted Czech date words
  const liveDates = paper.querySelectorAll('input.ed-date');
  const clonedDates = wrap.querySelectorAll('input.ed-date');
  const liveDatesInRange = [];
  for (const d of liveDates) {
    const r = document.createRange();
    r.selectNode(d);
    if (range.compareBoundaryPoints(Range.END_TO_START, r) <= 0 &&
        range.compareBoundaryPoints(Range.START_TO_END, r) >= 0) {
      liveDatesInRange.push(d);
    }
  }
  clonedDates.forEach((cd, i) => {
    const live = liveDatesInRange[i];
    const iso = live ? live.value : cd.value;
    const text = (window.formatCzechDate ? window.formatCzechDate(iso) : iso) || '';
    const tn = document.createTextNode(text);
    cd.parentNode.replaceChild(tn, cd);
  });

  // Strip non-content chrome.
  wrap.querySelectorAll('.tip-btn, .tip-pin, .party-remove, .party-add, .seg-toggle, .seg-add, .no-copy, .party-type-switches, .ed-select-print, .smenka-date-words').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();
});