88 lines
2.8 KiB
TypeScript
88 lines
2.8 KiB
TypeScript
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<string | undefined> {
|
|
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 {
|
|
const preamble = `/* customized: ${
|
|
Object.entries(colors)
|
|
.filter(([_, { color }]) => color)
|
|
.map(([name, _]) => name)
|
|
.join(", ")
|
|
} */\n/* look, i don't like !important either, but i think it's a better choice than some lame .spec.ific.ity.hack.ing */\n\n`;
|
|
|
|
let vars = `:root {\n`;
|
|
if (requester && colors[requester]) {
|
|
vars += `--name-color: var(--name-color-${requester});\n`;
|
|
}
|
|
let classes = "";
|
|
for (const [name, { color }] of Object.entries(colors)) {
|
|
if (!color) continue;
|
|
vars += `--name-color-${name}: ${color};\n`;
|
|
classes +=
|
|
`a[href$='/${name}']{color: var(--name-color-${name}) !important;}\n`;
|
|
}
|
|
vars += "}\n\n";
|
|
return preamble + 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" } });
|
|
});
|