212 lines
7.8 KiB
Nim
212 lines
7.8 KiB
Nim
# 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 = "<!DOCTYPE html>\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
|