# SPDX-License-Identifier: AGPL-3.0-only import uri, strutils, strformat, times, options import karax/[karaxdsl, vdom] import renderutils import ".."/[utils, types, prefs, formatters] import jester const doctype = "\n" lp = readFile("public/lp.svg") proc toTheme(theme: string): string = theme.toLowerAscii.replace(" ", "_") proc renderNavbar(cfg: Config; req: Request; rss, canonical: string): VNode = var path = req.params.getOrDefault("referer") if path.len == 0: path = $(parseUri(req.path) ? filterParams(req.params)) if "/status/" in path: path.add "#m" buildHtml(nav): tdiv(class="inner-nav"): tdiv(class="nav-item"): a(class="site-name", href="/"): text cfg.title a(href="/"): img(class="site-logo", src="/logo.png", alt="Logo") tdiv(class="nav-item right"): icon "search", title="Search", href="/search" if cfg.enableRss and rss.len > 0: icon "rss-feed", title="RSS Feed", href=rss icon "bird", title="Open in Twitter", href=canonical a(href="https://liberapay.com/zedeus"): verbatim lp icon "info", title="About", href="/about" icon "cog", title="Preferences", href=("/settings?referer=" & encodeUrl(path)) proc renderHead*(prefs: Prefs; cfg: Config; req: Request; titleText=""; desc=""; video=""; images: seq[Image] = @[]; banner=""; ogTitle=""; rss=""; canonical=""; avatar=""; context=""; contextUrl=""; id=""; time: Option[DateTime] = none(DateTime); media="" ): VNode = var theme = prefs.theme.toTheme if "theme" in req.params: theme = req.params["theme"].toTheme let ogType = if video.len > 0: "video.other" #elif rss.len > 0: "object" elif images.len > 0: "photo" else: "article" let opensearchUrl = getUrlPrefix(cfg) & "/opensearch" buildHtml(head): link(rel="stylesheet", type="text/css", href="/css/style.css?v=20") link(rel="stylesheet", type="text/css", href="/css/fontello.css?v=2") link(rel="stylesheet", href="/css/baguetteBox.min.css") script(src="/js/baguetteBox.min.js", `async`="") script(src="/js/zoom.js") let isDiscord = req.headers.getOrDefault("User-Agent").toString().contains("Discordbot") if theme.len > 0: link(rel="stylesheet", type="text/css", href=(&"/css/themes/{theme}.css")) link(rel="icon", type="image/png", sizes="32x32", href=(&"{getUrlPrefix(cfg)}/favicon-32x32.png")) link(rel="icon", type="image/png", sizes="16x16", href=(&"{getUrlPrefix(cfg)}/favicon-16x16.png")) link(rel="apple-touch-icon", sizes="180x180", href="/apple-touch-icon.png?v=2") link(rel="manifest", href="/site.webmanifest") link(rel="mask-icon", href="/safari-pinned-tab.svg", color="#ff6c60") link(rel="search", type="application/opensearchdescription+xml", title=cfg.title, href=opensearchUrl) if canonical.len > 0: link(rel="canonical", href=canonical) if cfg.enableRss and rss.len > 0: link(rel="alternate", type="application/rss+xml", href=rss, title="RSS feed") if prefs.hlsPlayback: script(src="/js/hls.light.min.js", `defer`="") script(src="/js/hlsPlayback.js", `defer`="") if prefs.infiniteScroll: script(src="/js/infiniteScroll.js", `defer`="") title: if titleText.len > 0: text titleText & " | " & cfg.title else: text cfg.title let finalizedTitleText = (if ogTitle.len > 0: ogTitle else: titleText) let finalizedDesc = stripHtml(desc) meta(name="viewport", content="width=device-width, initial-scale=1.0") meta(name="theme-color", content="#1F1F1F") meta(property="og:type", content=ogType) if video.len > 0 and len(finalizedDesc) <= 67: meta(property="og:title", content=finalizedDesc) else: meta(property="og:title", content=finalizedTitleText) meta(property="og:description", content=finalizedDesc) meta(property="og:locale", content="en_US") var siteName = "Nitter" if time.isSome and not isDiscord: let timeObj = time.get let timeStr = $timeObj meta(property="og:article:published_time", content=timeStr) let formattedTime = timeObj.format("yyyy/MM/dd HH:mm:ss") siteName = &"Nitter • {formattedTime}" meta(property="og:site_name", content=siteName) if banner.len > 0 and not banner.startsWith('#'): let bannerUrl = getPicUrl(banner) link(rel="preload", type="image/png", href=bannerUrl, `as`="image") if images.len > 0: for imageObj in images: let url = imageObj.url preloadUrl = if "400x400" in url: getPicUrl(url) else: getSmallPic(url) link(rel="preload", type="image/png", href=preloadUrl, `as`="image") let image = getUrlPrefix(cfg) & getPicUrl(url) meta(property="og:image", content=image) meta(property="og:image:alt", content=imageObj.description) if video.len == 0: meta(property="twitter:image:src", content=image) meta(property="twitter:card", content="summary_large_image") else: meta(property="twitter:card", content="summary") elif avatar.len > 0: let avatarUrl = getUrlPrefix(cfg) & getPicUrl(avatar) meta(property="og:image", content=avatarUrl) if video.len > 0: meta(property="og:video:url", content=video) meta(property="og:video:secure_url", content=video) meta(property="og:video:type", content="video/mp4") var title = encodeUrl(finalizedDesc) author = encodeUrl(finalizedTitleText) url = req.path if len(finalizedDesc) > 67: title = author author = encodeUrl(finalizedDesc) if context != "": author = encodeUrl(context & "\n") & author if contextUrl != "": url = contextUrl link(rel="alternate", href=(&"{getUrlPrefix(cfg)}/oembed.json?type=video&provider={encodeUrl(siteName)}&title={title}&user={author}&url={encodeUrl(url)}"), type="application/json+oembed") elif context != "" and contextUrl != "": var title = encodeUrl(finalizedTitleText) author = encodeUrl(context) link(rel="alternate", href=(&"{getUrlPrefix(cfg)}/oembed.json?type=video&provider={encodeUrl(siteName)}&title={title}&user={author}&url={encodeUrl(contextUrl)}"), type="application/json+oembed") var fediUrl = &"{getUrlPrefix(cfg)}/users/i/statuses/" if media.len > 0: if media == "video": fediUrl &= "422209040515" # 42 + "video" else: let parts = media.split(":") fediUrl &= "421608152015" # 42 + "photo" if parts.len == 2: fediUrl &= parts[1] # + index fediUrl &= id link(rel="alternate", href=fediUrl, type="application/activity+json") # this is last so images are also preloaded # if this is done earlier, Chrome only preloads one image for some reason link(rel="preload", type="font/woff2", `as`="font", href="/fonts/fontello.woff2?21002321", crossorigin="anonymous") proc renderMain*(body: VNode; req: Request; cfg: Config; prefs=defaultPrefs; titleText=""; desc=""; ogTitle=""; rss=""; video=""; images: seq[Image] = @[]; banner=""; avatar=""; context=""; contextUrl=""; id=""; time: Option[DateTime] = none(DateTime); media=""): string = let canonical = getTwitterLink(req.path, req.params) let node = buildHtml(html(lang="en")): renderHead(prefs, cfg, req, titleText, desc, video, images, banner, ogTitle, rss, canonical, avatar, context, contextUrl, id, time, media) body: renderNavbar(cfg, req, rss, canonical) tdiv(class="container"): body result = doctype & $node proc renderError*(error: string): VNode = buildHtml(tdiv(class="panel-container")): tdiv(class="error-panel"): span: verbatim error