"""HTML fragments shared by several pages (mirrored in assets/site.js so
config.js edits re-render the same markup)."""
import html
from build import pic
import content as C

def esc(s): return html.escape(str(s or ""))

def hub_item(n, compact=False):
    ext = n["url"].startswith("http")
    tgt = ' target="_blank" rel="noopener"' if ext else ''
    if n.get("kind") == "video":
        media = f'<div class="video"><iframe src="{esc(n["url"])}" title="{esc(n["title"])}" allowfullscreen loading="lazy" allow="fullscreen; picture-in-picture"></iframe></div>'
        link = n.get("link")
        h3 = f'<h3><a href="{esc(link)}" target="_blank" rel="noopener">{esc(n["title"])}</a></h3>' if link else f'<h3>{esc(n["title"])}</h3>'
        more = f'<a class="more" href="{esc(link)}" target="_blank" rel="noopener">Read more ↗</a>' if link else ''
    else:
        img = n.get("image")
        media = f'<div class="ph">{pic("hub-" + n["id"], img, n["title"]) if img else ""}</div>' if img else ''
        h3 = f'<h3><a href="{esc(n["url"])}"{tgt}>{esc(n["title"])}</a></h3>'
        more = f'<a class="more" href="{esc(n["url"])}"{tgt}>{"Read the original ↗" if ext else "Read more →"}</a>'
    return (f'<article class="hub-item card" id="{esc(n["id"])}" data-tag="{esc(n["tag"])}">{media}'
            f'<div class="body"><div class="meta"><span class="chip teal">{esc(n["tag"])}</span><span>{esc(n["source"])}</span><span>·</span><time>{esc(n["date"])}</time></div>'
            f'{h3}<p>{esc(n["summary"])}</p>{more}</div></article>')

def hub_latest(tags, n=3):
    items = [x for x in C.HUB if (not tags or x["tag"] in tags)][:n]
    return "".join(hub_item(x) for x in items)

def partner_logos(cls="logo-strip"):
    return (f'<div class="{cls}" data-partners>' +
            "".join(f'<a href="{esc(p["url"])}" rel="noopener" target="_blank" title="{esc(p["name"])}">'
                    f'<img src="{esc(p["logo"])}" alt="{esc(p["name"])}" loading="lazy"></a>' for p in C.PARTNERS) + '</div>')

def person(p):
    email = f'<a href="mailto:{p["email"]}">{p["email"]}</a>' if p.get("email") else ''
    return (f'<div class="person"><div class="photo">{pic("board-" + p["photo"].split("/")[-1].split(".")[0], p["photo"], p["name"].replace("&amp;","&"))}</div>'
            f'<h3>{p["name"]}</h3><p class="role">{p["role"]}</p>{"<p class=small>" + email + "</p>" if email else ""}</div>')

def empty_note(text):
    return f'<p class="empty-note">{text}</p>'