From a801609eb9c245b2eab9fdb9a47c0626b21ecfc7 Mon Sep 17 00:00:00 2001
From: Clove Twilight <clovetwilight3@outlook.com>
Date: Tue, 16 Jun 2026 22:26:34 +0100
Subject: [PATCH] Mrow

---
 js/friends.js | 20 ++++++++++++++++++++
 1 file changed, 20 insertions(+)

diff --git a/js/friends.js b/js/friends.js
index 069de84..e292e39 100644
--- a/js/friends.js
+++ b/js/friends.js
@@ -52,6 +52,15 @@
   var root = document.getElementById("friends-root");
   if (!root) return;
 
+  // title → URL-safe anchor id, e.g. "Close Friends" -> "close-friends"
+  function slugify(str) {
+    return String(str == null ? "" : str)
+      .toLowerCase()
+      .trim()
+      .replace(/[^a-z0-9]+/g, "-")
+      .replace(/^-+|-+$/g, "");
+  }
+
   // ---- helpers (mirrors now-playing.js) -------------------------------
   function esc(str) {
     return String(str == null ? "" : str)
@@ -226,6 +235,7 @@
   FRIENDS.forEach(function (group) {
     var section = document.createElement("section");
     section.className = "section";
+    section.id = slugify(group.title); // anchor target, e.g. #alts
 
     var h2 = document.createElement("h2");
     h2.className = "section-title";
@@ -256,6 +266,16 @@
     root.appendChild(section);
   });
 
+  // ---- jump to anchor (sections are built after page load) ------------
+  function scrollToHash() {
+    var id = (location.hash || "").slice(1);
+    if (!id) return;
+    var target = document.getElementById(id);
+    if (target) target.scrollIntoView();
+  }
+  scrollToHash();
+  window.addEventListener("hashchange", scrollToHash);
+
   // ---- poll live members ----------------------------------------------
   if (liveMembers.length) {
     setInterval(function () {