cohost/userscripts/name-color.js

// ==UserScript==
// @name         name-color: cohost edition!
// @namespace    https://terezi.pyrope.net
// @version      2024-07-10
// @description  colors names based on `name-color:` statements in profiles. there are no other editions
// @author       mehbark
// @match        https://*.cohost.org/*
// @icon         https://www.google.com/s2/favicons?sz=64&domain=cohost.org
// @grant        none
// ==/UserScript==

const mentionee = elem => elem.href.split("/").at(-1);

function doit() {
    "use strict";

    // not just literal mentions btw
    const mentions = [
        ...document.querySelectorAll("a[href^='https://cohost.org/']"),
    ].filter(
        a =>
            !(
                a.href.includes("/rc/") ||
                // sorry, @post
                a.href.includes("/post/") ||
                // sorry, @tagged
                a.href.includes("/tagged/") ||
                // sorry, @ask
                a.href.endsWith("/ask") ||
                a.href.endsWith("/")
            )
    );

    const names = [...new Set(mentions.map(mentionee))];

    const requester = document
        .querySelector("header")
        .querySelector("span")
        .innerText.slice(1);

    const url = new URL("https://pyrope.net/name-color/style.css");

    url.searchParams.append("requester", requester);
    for (const name of names) {
        url.searchParams.append("name", name);
    }

    let style = document.head.querySelector("#name-color-stylesheet");
    if (!style) {
        style = document.createElement("link");
        style.id = "name-color-stylesheet";
        style.rel = "stylesheet";
        document.head.appendChild(style);
    }
    style.href = url.toString();
}

new MutationObserver(doit).observe(document, {
    subtree: true,
    childList: true,
});