import { DOMParser, } from "https://deno.land/x/deno_dom@v0.1.38/deno-dom-wasm.ts"; // maybe a bit high, maybe a bit low const MAX_AGE_MS = 10 * 60 * 1000; // > "light-dark(oklab(000, 000, 000), oklab(255, 255, 255))".length // 54 const MAX_COLOR_LEN = 64; const colors: Record< string, { color: string | undefined; last_checked: Date } > = {}; const dom_parser = new DOMParser(); async function get_name_color(name: string): Promise { console.log(`fetching ${name}...`); const resp = await fetch(`https://cohost.org/${name}`); if (!resp.ok) { console.log(`fetching https://cohost.org/${name} failed!`); return; } const body = await resp.text(); const dom = dom_parser.parseFromString(body, "text/html"); if (!dom) { console.log(`parsing https://cohost.org/${name} to the dom failed!`); return; } for (const p of dom.querySelectorAll("p")) { const text = p.textContent; if (text.startsWith("name-color: ")) { return text.split("name-color: ")[1] .slice(0, MAX_COLOR_LEN) .replaceAll(";", ""); } } } async function update_name_color(name: string) { const now = new Date(); if ( colors[name] && now.getTime() - colors[name].last_checked.getTime() <= MAX_AGE_MS ) { return; } const color = await get_name_color(name); colors[name] = { color, last_checked: now }; } function cssify({ requester }: { requester?: string }): string { let vars = `:root {\n`; if (requester && colors[requester]) { vars += `--name-color: var(--name-color-${requester});\n`; } let classes = ".name { color: var(--name-color); }\n"; for (const [name, { color }] of Object.entries(colors)) { if (!color) continue; vars += `--name-color-${name}: ${color};\n`; classes += `.name-${name}{--name-color:var(--name-color-${name})}`; } vars += "}\n"; return vars + classes; } // TODO: ONE BIG REQUEST/RESPONSE DUHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHh Deno.serve({ port: 61266 }, async (req) => { const url = new URL(req.url); const names = url.searchParams.getAll("name").filter((name) => !name.match(/\/\?/) ); await Promise.all(names.map(update_name_color)); const css = cssify({ requester: url.searchParams.get("requester") ?? undefined, }); return new Response(css, { headers: { "content-type": "text/css" } }); });