From 54b20cf016ec16a26d6ec4f47db1c482b00d2ae6 Mon Sep 17 00:00:00 2001
From: Liam <liam@fascinated.cc>
Date: Thu, 25 Apr 2024 08:30:50 +0100
Subject: [PATCH] make the script work when changing pages

---
 scoresaber-utils.user.js | 30 ++++++++++++++++++++----------
 1 file changed, 20 insertions(+), 10 deletions(-)

diff --git a/scoresaber-utils.user.js b/scoresaber-utils.user.js
index 7dc2f5d..8ebbb31 100644
--- a/scoresaber-utils.user.js
+++ b/scoresaber-utils.user.js
@@ -16,7 +16,7 @@
  * Fetches data from an API endpoint.
  *
  * @param {string} url The URL of the API endpoint
- * @returns The JSON response from the API
+ * @returns {Promise<any>} The JSON response from the API
  */
 async function fetchData(url) {
   const response = await fetch(url);
@@ -35,7 +35,7 @@ function addStat(containerSelector, stat, value, hoverText) {
   const container = document.querySelector(containerSelector);
   if (!container) return;
 
-  const svelteClass = container.getAttribute("class").split(" ")[1];
+  const svelteClass = container.classList.item(1);
 
   const statElement = document.createElement("div");
   statElement.className = `stat-item ${svelteClass}`;
@@ -51,7 +51,7 @@ function addStat(containerSelector, stat, value, hoverText) {
  * Delays execution for the specified duration.
  *
  * @param {number} ms The duration to delay in milliseconds
- * @returns A promise that resolves after the delay
+ * @returns {Promise<void>} A promise that resolves after the delay
  */
 function sleep(ms) {
   return new Promise((resolve) => setTimeout(resolve, ms));
@@ -60,8 +60,12 @@ function sleep(ms) {
 /**
  * Loads ScoreSaber Utils data on player pages.
  */
-async function loadPlayerData() {
-  const path = window.location.pathname;
+async function loadPlayerData(path) {
+  if (!path) {
+    path = window.location.pathname;
+  }
+  path = path.replace("https://scoresaber.com", "");
+
   const isPlayerPage = path.startsWith("/u/");
 
   if (!isPlayerPage) {
@@ -76,12 +80,13 @@ async function loadPlayerData() {
   const playerId = path.split("/")[2];
 
   // Get the title element
+  await sleep(250);
   const titleElement = document.querySelector(".title.is-5.player.has-text-centered-mobile");
-  if (!titleElement) return;
-  const svelteClass = titleElement
-    .getAttribute("class")
-    .split(" ")
-    .find((c) => c.startsWith("svelte"));
+  if (!titleElement) {
+    console.error("Failed to find title element");
+    return;
+  }
+  const svelteClass = titleElement.classList.item(1);
 
   // Add a loading indicator
   const loadingElement = document.createElement("span");
@@ -105,3 +110,8 @@ async function loadPlayerData() {
 }
 
 loadPlayerData();
+
+// Watch for URL changes
+window.navigation.addEventListener("navigate", (event) => {
+  loadPlayerData(event.destination.url);
+});