From 1d526e83652ba76a3899ce008091cad652041eb6 Mon Sep 17 00:00:00 2001
From: mehbark <terezi@pyrope.net>
Date: Wed, 10 Jul 2024 19:50:07 -0400
Subject: [PATCH] name-color 0.2

---
 serverside/name-color.ts  |  2 +-
 userscripts/name-color.js | 27 ++++++++++++++++++++-------
 2 files changed, 21 insertions(+), 8 deletions(-)

diff --git a/serverside/name-color.ts b/serverside/name-color.ts
index ad0c365..215b23b 100644
--- a/serverside/name-color.ts
+++ b/serverside/name-color.ts
@@ -67,7 +67,7 @@ function cssify({ requester }: { requester?: string }): string {
         if (!color) continue;
         vars += `--name-color-${name}: ${color};\n`;
         classes +=
-            `a[href$='${name}']{color: var(--name-color-${name}) !important;}\n`;
+            `a[href$='/${name}']{color: var(--name-color-${name}) !important;}\n`;
     }
     vars += "}\n\n";
     return preamble + vars + classes;
diff --git a/userscripts/name-color.js b/userscripts/name-color.js
index dd9af52..b9f4564 100644
--- a/userscripts/name-color.js
+++ b/userscripts/name-color.js
@@ -1,7 +1,7 @@
 // ==UserScript==
 // @name         name-color: cohost edition!
 // @namespace    https://terezi.pyrope.net
-// @version      2024-07-10
+// @version      0.2
 // @description  colors names based on `name-color:` statements in profiles. there are no other editions
 // @author       mehbark
 // @match        https://*.cohost.org/*
@@ -32,6 +32,7 @@ function doit() {
     );
 
     const names = [...new Set(mentions.map(mentionee))];
+    names.sort();
 
     const requester = document
         .querySelector("header")
@@ -39,23 +40,35 @@ function doit() {
         .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) {
+    let style = document.head.querySelector(".name-color-stylesheet");
+    if (style) {
+        const style2 = document.createElement("link");
+        style2.rel = "stylesheet";
+        style2.href = url.toString();
+        style2.onload = () => {
+            document.head.querySelectorAll(".name-color-stylesheet").forEach(s => s.remove());
+            style2.className = "name-color-stylesheet";
+        };
+        style2.count = style.count + 1;
+        console.log(style2.count);
+        document.head.appendChild(style2);
+    } else {
         style = document.createElement("link");
-        style.id = "name-color-stylesheet";
+        style.className = "name-color-stylesheet";
         style.rel = "stylesheet";
+        style.href = url.toString();
+        style.count = 0;
         document.head.appendChild(style);
     }
-    style.href = url.toString();
 }
 
-new MutationObserver(doit).observe(document, {
+new MutationObserver(doit).observe(document.body, {
     subtree: true,
     childList: true,
 });