(() => {
const { Button, Icon } = window.RespectorGroupDesignSystem_21eac1;
const D = window.RGDATA;
const eur = n => n == null ? "—" : "€ " + Math.round(n).toLocaleString("de-DE");
const m2 = n => n == null || n === "" ? "—" : String(n).replace(".", ",") + " м²";
const STATUS = { free: "Свободна", held: "Забронирована", sold: "Продана" };
const contacts = () => { const s = D.settings || {}; return { tg: s.telegram || "@respectorgroup", mail: s.email || "sales@respectorgroup.org", site: "respectorgroup.org" }; };
const today = () => new Date().toLocaleDateString("ru-RU");

/* Ссылка на экран: #project/eleni, #apartment/eleni/Д-14 */
window.RGLink = (view, id, code) => location.href.split("#")[0] + "#" + [view, id, code].filter(Boolean).map(encodeURIComponent).join("/");

function ShareButton({ url, title, text, full, size = "md", variant = "secondary" }) {
  const [open, setOpen] = React.useState(false);
  const [copied, setCopied] = React.useState(false);
  const ref = React.useRef(null);
  React.useEffect(() => {
    if (!open) return;
    const h = e => { if (ref.current && !ref.current.contains(e.target)) setOpen(false); };
    const k = e => e.key === "Escape" && setOpen(false);
    document.addEventListener("mousedown", h); document.addEventListener("keydown", k);
    return () => { document.removeEventListener("mousedown", h); document.removeEventListener("keydown", k); };
  }, [open]);
  const click = async () => {
    if (navigator.share && matchMedia("(pointer: coarse)").matches) {
      try { await navigator.share({ title, text, url }); return; } catch (e) { if (e.name === "AbortError") return; }
    }
    setOpen(o => !o);
  };
  const copy = async () => {
    try { await navigator.clipboard.writeText(url); }
    catch (e) { const t = document.createElement("textarea"); t.value = url; document.body.appendChild(t); t.select(); document.execCommand("copy"); t.remove(); }
    setCopied(true); setTimeout(() => setCopied(false), 1800);
  };
  const msg = encodeURIComponent(text + " — " + url);
  const links = [
    { icon: "send", label: "Telegram", href: "https://t.me/share/url?url=" + encodeURIComponent(url) + "&text=" + encodeURIComponent(text) },
    { icon: "message-circle", label: "WhatsApp", href: "https://wa.me/?text=" + msg },
    { icon: "phone", label: "Viber", href: "viber://forward?text=" + msg },
    { icon: "mail", label: "Почта", href: "mailto:?subject=" + encodeURIComponent(title) + "&body=" + msg },
  ];
  return (
    <div className="rg-share" ref={ref}>
      <Button variant={variant} size={size} full={full} icon={<Icon name="share-2" size={16} />} onClick={click} aria-haspopup="menu" aria-expanded={open}>Поделиться</Button>
      {open && <div className="rg-share__menu" role="menu">
        <button type="button" className="rg-share__item" role="menuitem" onClick={copy}><Icon name={copied ? "check" : "link"} size={16} />{copied ? "Ссылка скопирована" : "Скопировать ссылку"}</button>
        {links.map(l => <a key={l.label} className="rg-share__item" role="menuitem" href={l.href} target="_blank" rel="noopener" onClick={() => setOpen(false)}><Icon name={l.icon} size={16} />{l.label}</a>)}
      </div>}
    </div>
  );
}

/* Печать документа в PDF: монтируем вёрстку A4 в body, ждём картинки, открываем диалог печати. */
function PdfButton({ build, name, full, size = "md", variant = "secondary", label = "PDF-презентация", icon = "file-down" }) {
  const [doc, setDoc] = React.useState(null);
  React.useEffect(() => {
    if (!doc) return;
    const prev = document.title; document.title = name;
    document.body.classList.add("rg-printing");
    const root = document.querySelector(".rg-print");
    const imgs = [...root.querySelectorAll("img")];
    const ready = Promise.all(imgs.map(i => i.complete ? 1 : new Promise(r => { i.onload = i.onerror = r; })));
    const done = () => { document.body.classList.remove("rg-printing"); document.title = prev; setDoc(null); };
    let gone = false;
    Promise.race([ready, new Promise(r => setTimeout(r, 4000))]).then(() => {
      if (gone) return;
      window.addEventListener("afterprint", done, { once: true });
      window.print();
    });
    return () => { gone = true; };
  }, [doc]);
  return (
    <>
      <Button variant={variant} size={size} full={full} icon={<Icon name={icon} size={16} />} onClick={() => setDoc(build())} disabled={!!doc}>{doc ? "Готовим PDF…" : label}</Button>
      {doc && ReactDOM.createPortal(<div className="rg-print">{doc}</div>, document.body)}
    </>
  );
}

function PdfHead({ kind }) {
  return (
    <header className="rg-pdf__head">
      <div className="rg-pdf__brand"><img src="../../assets/logo-seal-256.png" alt="" /><div><b>Respector Group</b><span>Строительная компания</span></div></div>
      <div className="rg-pdf__kind">{kind}<span>{today()}</span></div>
    </header>
  );
}
function PdfFoot({ code, page }) {
  const c = contacts();
  return <footer className="rg-pdf__foot"><span>{c.site} · {c.tg} · {c.mail}</span><span><b>{code}</b> · {page}</span></footer>;
}
function PdfContacts({ url }) {
  const c = contacts();
  return (
    <div className="rg-pdf__contacts">
      <div><b>Записаться на просмотр</b><span>Онлайн-показ или поездка. Отвечаем в течение часа.</span></div>
      <div className="rg-pdf__contactlist"><span>Telegram {c.tg}</span><span>{c.mail}</span><span className="rg-pdf__url">{"respectorgroup.org/" + (() => { const h = url.slice(url.indexOf("#")); try { return decodeURIComponent(h); } catch (e) { return h; } })()}</span></div>
    </div>
  );
}
const Plaque = ({ tone, children }) => <span className={"rg-pdf__plaque rg-pdf__plaque--" + tone}>{children}</span>;
const Img = ({ src, cls, contain }) => src ? <div className={cls}><img src={src} alt="" style={contain ? { objectFit: "contain" } : null} /></div> : <div className={cls + " rg-pdf__noimg"}>Фото появится позже</div>;

/* Презентация квартиры: код — главный элемент первой страницы и каждого колонтитула. */
function UnitPdf({ u, p }) {
  const sea = window.RGSeaM(p);
  const hero = (u.gallery || []).find(g => g !== u.plan) || u.image || p.image;
  const rest = (u.gallery || []).filter(g => g !== hero && g !== u.plan).slice(0, 3);
  const facts = [["Площадь", m2(u.area)], ["Этаж", u.floor || "—"], ["До моря", sea != null ? sea + " м" : "—"], ["Дом", p.name]];
  const specs = (u.specs || []).filter(([k]) => !/^(Общая площадь|Этаж)$/.test(k));
  const url = window.RGLink("apartment", p.id, u.code);
  return (
    <>
      <section className="rg-pdf__page">
        <PdfHead kind="Презентация квартиры" />
        <div className="rg-pdf__title">
          <div>
            <div className="rg-pdf__eyebrow">Код квартиры</div>
            <div className="rg-pdf__code">{u.code}</div>
            <div className="rg-pdf__sub">{u.type}{u.floor ? " · " + u.floor : ""}</div>
            <div className="rg-pdf__muted">{p.name} · {p.location}</div>
          </div>
          <div className="rg-pdf__pricebox">
            <Plaque tone={u.status || "free"}>{STATUS[u.status] || "Свободна"}</Plaque>
            <div className="rg-pdf__price">{u.status === "sold" ? "Продана" : u.price != null ? eur(u.price) : "Цена по запросу"}</div>
            {u.perM2 && u.status !== "sold" && <div className="rg-pdf__muted">{eur(u.perM2)} за м²</div>}
          </div>
        </div>
        <Img src={hero} cls="rg-pdf__hero" />
        <div className="rg-pdf__facts">{facts.map(([k, v]) => <div key={k}><span>{k}</span><b>{v}</b></div>)}</div>
        {!!specs.length && <div className="rg-pdf__specs">{specs.map(([k, v], i) => <div key={k + i}><span>{k}</span><b>{v}</b></div>)}</div>}
        <PdfFoot code={u.code} page="1 / 2" />
      </section>
      <section className="rg-pdf__page">
        <PdfHead kind="Презентация квартиры" />
        <div className="rg-pdf__h2">Планировка <b>{u.code}</b></div>
        <Img src={u.plan} cls="rg-pdf__plan" contain />
        {!!rest.length && <div className="rg-pdf__strip">{rest.map(g => <Img key={g} src={g} cls="rg-pdf__thumb" />)}</div>}
        <div className="rg-pdf__h2">О доме {p.name}</div>
        <p className="rg-pdf__lead">{p.lead}</p>
        {!!(p.features || []).length && <ul className="rg-pdf__features">{p.features.slice(0, 6).map(f => <li key={f}>{f}</li>)}</ul>}
        <PdfContacts url={url} />
        <PdfFoot code={u.code} page="2 / 2" />
      </section>
    </>
  );
}

/* Презентация проекта: обложка, цифры, описание; на второй странице — квартиры с кодами. */
function ProjectPdf({ p }) {
  const units = p.units || [];
  const st = window.RGPhaseSticker(p) || ["held", "В разработке"];
  const tone = st[0] === "sold" ? "navy" : st[0];
  const sea = window.RGSeaM(p);
  const gal = (p.gallery || []).filter(g => g && g !== p.image).slice(0, 3);
  const facts = [["Квартир в доме", p.totalCount || "—"], ["Свободно", p.freeCount || 0], ["Площадь до", m2(p.areaTo)], ["До моря", sea != null ? sea + " м" : "—"]];
  const s = p.specs || {};
  const specs = [["Площадь застройки", s.buildArea && m2(s.buildArea)], ["Этап", s.stage], ["Продажи", s.sales], ["Адрес", p.mapNote || p.location]].filter(r => r[1]);
  return (
    <>
      <section className="rg-pdf__page">
        <PdfHead kind="Презентация проекта" />
        <div className="rg-pdf__title">
          <div>
            <div className="rg-pdf__eyebrow">Резиденция</div>
            <div className="rg-pdf__code">{p.name}</div>
            <div className="rg-pdf__muted">{p.mapNote || p.location}</div>
          </div>
          <div className="rg-pdf__pricebox">
            <Plaque tone={tone}>{st[1]}</Plaque>
            <div className="rg-pdf__price">{p.priceFrom != null ? "от " + eur(p.priceFrom) : window.RGPhase(p) === "soon" ? "Цены — к старту продаж" : "Цена по запросу"}</div>
          </div>
        </div>
        <Img src={p.image} cls="rg-pdf__hero" />
        <div className="rg-pdf__facts">{facts.map(([k, v]) => <div key={k}><span>{k}</span><b>{v}</b></div>)}</div>
        <p className="rg-pdf__lead">{p.lead}</p>
        {!!(p.features || []).length && <ul className="rg-pdf__features">{p.features.slice(0, 6).map(f => <li key={f}>{f}</li>)}</ul>}
        <PdfFoot code={p.name} page="1" />
      </section>
      <section className="rg-pdf__page rg-pdf__page--flow">
        <PdfHead kind="Презентация проекта" />
        {!!gal.length && <div className="rg-pdf__strip">{gal.map(g => <Img key={g} src={g} cls="rg-pdf__thumb" />)}</div>}
        {!!specs.length && <div className="rg-pdf__specs">{specs.map(([k, v]) => <div key={k}><span>{k}</span><b>{v}</b></div>)}</div>}
        {!!units.length && <>
          <div className="rg-pdf__h2">Квартиры · {units.length}</div>
          <table className="rg-pdf__table">
            <thead><tr><th>Код</th><th>Этаж</th><th>Тип</th><th>Площадь</th><th>Цена</th><th>Статус</th></tr></thead>
            <tbody>{units.map(x => (
              <tr key={x.code}><td className="rg-pdf__tcode">{x.code}</td><td>{x.floor}</td><td>{x.type}</td><td>{m2(x.area)}</td>
                <td>{x.status === "sold" ? "—" : x.price != null ? eur(x.price) : "по запросу"}</td><td><Plaque tone={x.status}>{STATUS[x.status]}</Plaque></td></tr>
            ))}</tbody>
          </table>
        </>}
        <PdfContacts url={window.RGLink("project", p.id)} />
      </section>
    </>
  );
}

/* Пара кнопок «Поделиться» + «PDF» для страниц проекта и квартиры. */
function RGShareBar({ kind, p, u, full, size }) {
  const unit = kind === "unit";
  const url = unit ? window.RGLink("apartment", p.id, u.code) : window.RGLink("project", p.id);
  const title = unit ? u.code + " — " + (u.type || "квартира") + " в " + p.name : p.name + " — Respector Group";
  const text = unit ? "Квартира " + u.code + " · " + m2(u.area) + " · " + p.name + ", " + p.location : p.name + " · " + p.location;
  return (
    <div className="rg-sharebar" style={full ? { display: "grid", gridTemplateColumns: "1fr 1fr" } : null}>
      <ShareButton url={url} title={title} text={text} full={full} size={size} />
      <PdfButton full={full} size={size} name={"Respector Group — " + (unit ? u.code + " · " + p.name : p.name)}
        build={() => unit ? <UnitPdf u={u} p={p} /> : <ProjectPdf p={p} />} />
    </div>
  );
}
Object.assign(window, { RGShareBar, RGShareButton: ShareButton, RGPdfButton: PdfButton, RGPdfHead: PdfHead, RGPdfFoot: PdfFoot });
})();
