From e77f7dcd5f331e134526b693bcbd880d2e55c8b4 Mon Sep 17 00:00:00 2001
From: Thomas Gander <thomas@silverhat.ca>
Date: Tue, 27 Jan 2026 08:09:03 -0700
Subject: [PATCH] Cleaned up media_cleaner_table.js and renamed to home.js.
 Updated table with no data to have a message.

---
 Jellyfin.Plugin.MediaCleaner/Pages/home.html  |   4 +-
 Jellyfin.Plugin.MediaCleaner/Pages/home.js    | 151 ++++++++++++++++++
 .../Pages/media_cleaner_table.js              | 150 -----------------
 Jellyfin.Plugin.MediaCleaner/Plugin.cs        |   4 +-
 4 files changed, 155 insertions(+), 154 deletions(-)
 create mode 100644 Jellyfin.Plugin.MediaCleaner/Pages/home.js
 delete mode 100644 Jellyfin.Plugin.MediaCleaner/Pages/media_cleaner_table.js

diff --git a/Jellyfin.Plugin.MediaCleaner/Pages/home.html b/Jellyfin.Plugin.MediaCleaner/Pages/home.html
index 2e439f3..d4abb88 100644
--- a/Jellyfin.Plugin.MediaCleaner/Pages/home.html
+++ b/Jellyfin.Plugin.MediaCleaner/Pages/home.html
@@ -1,9 +1,9 @@
 <div data-role="page" class="page type-interior pluginConfigurationPage"
-     data-controller="__plugin/media_cleaner_table.js">
+     data-controller="__plugin/home.js">
 	<div data-role="content">
 		<div class="content-primary">
             <div id="loading">Loading...</div>
-            <div id="page" style="visibility: hidden;">
+            <div id="homepage" style="visibility: hidden;">
                 <button class="links" data-target="configurationpage?name=Settings">Settings</button>
                 <h2>Media Cleaner</h2>
 
diff --git a/Jellyfin.Plugin.MediaCleaner/Pages/home.js b/Jellyfin.Plugin.MediaCleaner/Pages/home.js
new file mode 100644
index 0000000..ea248fd
--- /dev/null
+++ b/Jellyfin.Plugin.MediaCleaner/Pages/home.js
@@ -0,0 +1,151 @@
+document.addEventListener('pageshow', async () => {
+    await fetchHomepageCSS();
+    await updateMediaCleanerState();
+
+    var moviesTitle = document.getElementById("moviesTitle");
+    var seriesTitle = document.getElementById("seriesTitle");
+
+    moviesTitle.innerHTML = await getMediaCleanerMoviesTitle();
+    seriesTitle.innerHTML = await getMediaCleanerSeriesTitle();
+
+    await populateTables();
+    addClickHandlersToLinks();
+    finishLoading();
+});
+
+const getMediaCleanerSeriesInfo = async () => {
+    const response = await fetch("/mediacleaner/state/getSeriesInfo");
+
+    if(!response.ok){
+        throw new Error(`Response status: ${response.status}`)
+    }
+
+    return response.json();
+};
+
+const getMediaCleanerMovieInfo = async () => {
+    const response = await fetch("/mediacleaner/state/getMovieInfo");
+
+    if(!response.ok){
+        throw new Error(`Response status: ${response.status}`)
+    }
+
+    return response.json();
+};
+
+const updateMediaCleanerState = async () => {
+    const response = await fetch("/mediacleaner/state/updateState");
+
+    if(!response.ok){
+        throw new Error(`Response status: ${response.status}`)
+    }
+
+    return response.json();
+};
+
+const getMediaCleanerSeriesTitle = async () => {
+    const response = await fetch("/mediacleaner/state/getSeriesTitle");
+
+    if(!response.ok){
+        throw new Error(`Response status: ${response.status}`);
+    }
+
+    return response.json();
+};
+
+const getMediaCleanerMoviesTitle = async () => {
+    const response = await fetch("/mediacleaner/state/getMoviesTitle");
+
+    if(!response.ok){
+        throw new Error(`Response status: ${response.status}`);
+    }
+
+    return response.json();
+};
+
+const populateTables = async () => {
+    var moviesInfo = await getMediaCleanerMovieInfo();
+    var seriesInfo = await getMediaCleanerSeriesInfo();
+
+    var seriesTableBody = seriesTable.getElementsByTagName('tbody')[0];
+    seriesTableBody.replaceChildren();
+
+    var moviesTableBody = moviesTable.getElementsByTagName('tbody')[0];
+    moviesTableBody.replaceChildren();
+
+    if (moviesInfo.length > 0){
+        for(let i = 0; i < moviesInfo.length; i++){
+            var row = moviesTableBody.insertRow(-1);
+            var cell1 = row.insertCell(0);
+            var cell2 = row.insertCell(1);
+            cell1.innerHTML = moviesInfo[i].Name;
+            // Will need to be enabled once radarr and sonarr integration is enabled.
+            // Maybe change this to an element to remove hard coding.
+            cell2.innerHTML = "<button type=\"button\" disabled>Delete</button>";
+        }
+    }
+    else{
+        var columnCount = moviesTable.tHead.rows[0].cells.length;
+        var row = moviesTableBody.insertRow(-1);
+        var cell1 = row.insertCell(0);
+        cell1.colSpan = columnCount;
+        cell1.innerHTML = "No stale movies found.";
+    }
+
+    if(seriesInfo.length > 0){
+        for(let i = 0; i < seriesInfo.length; i++){
+            var row = seriesTableBody.insertRow(-1);
+            var cell1 = row.insertCell(0);
+            var cell2 = row.insertCell(1);
+            var cell3 = row.insertCell(2);
+            cell1.innerHTML = seriesInfo[i].Name;
+            cell2.innerHTML = seriesInfo[i].Seasons.map(season => season.replace("Season ", "")).join(", ");
+            // Will need to be enabled once radarr and sonarr integration is enabled.
+            // Maybe change this to an element to remove hard coding.
+            cell3.innerHTML = "<button type=\"button\" disabled>Delete</button>";
+            cell3.className = "actions-cell";
+        }
+    }
+    else{
+        var columnCount = seriesTable.tHead.rows[0].cells.length;
+        var row = seriesTableBody.insertRow(-1);
+        var cell1 = row.insertCell(0);
+        cell1.colSpan = columnCount;
+        cell1.innerHTML = "No stale series found.";
+    }
+};
+
+const addClickHandlersToLinks = () => {
+    const linkbtns = document.querySelectorAll("button.links")
+    linkbtns.forEach(btn => {
+        btn.addEventListener("click", () => {
+            const target = btn.dataset.target;
+            if (!target) return;
+            window.location.hash = target;
+        })
+    })
+}
+
+const finishLoading = () => {
+    const loadingElement = document.getElementById("loading");
+
+    const homepage = document.getElementById("homepage");
+    loadingElement.style.visibility = "hidden";
+    homepage.style.visibility = "visible";
+
+    console.log("Loading element: ", loadingElement);
+    console.log("Homepage element: ", homepage);
+}
+
+const fetchHomepageCSS = async () => {
+    const response = await fetch('/web/configurationpage?name=home.css')
+
+    if(!response.ok){
+        throw new Error(`Response status: ${response.status}`);
+    }
+
+    const css = await response.text();
+    const styles = document.createElement('style');
+    styles.textContent = css;
+    document.head.appendChild(styles);
+}
diff --git a/Jellyfin.Plugin.MediaCleaner/Pages/media_cleaner_table.js b/Jellyfin.Plugin.MediaCleaner/Pages/media_cleaner_table.js
deleted file mode 100644
index 10995f5..0000000
--- a/Jellyfin.Plugin.MediaCleaner/Pages/media_cleaner_table.js
+++ /dev/null
@@ -1,150 +0,0 @@
-document.addEventListener('pageshow', async () => {
-    var moviesTitle = document.getElementById("moviesTitle");
-    var seriesTitle = document.getElementById("seriesTitle");
-    var moviesTable = document.getElementById("moviesTable");
-    var seriesTable = document.getElementById("seriesTable");
-
-    const getMediaCleanerSeriesInfo = async () => {
-        const response = await fetch("/mediacleaner/state/getSeriesInfo");
-
-        if(!response.ok){
-            throw new Error(`Response status: ${response.status}`)
-        }
-
-        return response.json();
-    };
-
-    const getMediaCleanerMovieInfo = async () => {
-        const response = await fetch("/mediacleaner/state/getMovieInfo");
-
-        if(!response.ok){
-            throw new Error(`Response status: ${response.status}`)
-        }
-
-        return response.json();
-    };
-
-    const updateMediaCleanerState = async () => {
-        const response = await fetch("/mediacleaner/state/updateState");
-
-        if(!response.ok){
-            throw new Error(`Response status: ${response.status}`)
-        }
-
-        return response.json();
-    };
-
-    const getMediaCleanerSeriesTitle = async () => {
-        const response = await fetch("/mediacleaner/state/getSeriesTitle");
-
-        if(!response.ok){
-            throw new Error(`Response status: ${response.status}`);
-        }
-
-        return response.json();
-    };
-
-    const getMediaCleanerMoviesTitle = async () => {
-        const response = await fetch("/mediacleaner/state/getMoviesTitle");
-
-        if(!response.ok){
-            throw new Error(`Response status: ${response.status}`);
-        }
-
-        return response.json();
-    };
-
-    const populateTables = () => {
-        var seriesTableBody = seriesTable.getElementsByTagName('tbody')[0];
-        seriesTableBody.replaceChildren();
-        seriesTableBody.style.border = "1px solid";
-        seriesTableBody.style.borderCollapse = "collapse";
-
-        var moviesTableBody = moviesTable.getElementsByTagName('tbody')[0];
-        moviesTableBody.replaceChildren();
-        moviesTableBody.style.border = "1px solid";
-
-        for(let i = 0; i < moviesInfo.length; i++){
-            var row = moviesTableBody.insertRow(-1);
-            var cell1 = row.insertCell(0);
-            var cell2 = row.insertCell(1);
-            cell1.innerHTML = moviesInfo[i].Name;
-            // Will need to be enabled once radarr and sonarr integration is enabled.
-            // Maybe change this to an element to remove hard coding.
-            cell2.innerHTML = "<button type=\"button\" disabled>Delete</button>";
-        }
-
-        for(let i = 0; i < seriesInfo.length; i++){
-            var row = seriesTableBody.insertRow(-1);
-            var cell1 = row.insertCell(0);
-            var cell2 = row.insertCell(1);
-            var cell3 = row.insertCell(2);
-            cell1.innerHTML = seriesInfo[i].Name;
-            cell2.innerHTML = seriesInfo[i].Seasons.map(season => season.replace("Season ", "")).join(", ");
-            // Will need to be enabled once radarr and sonarr integration is enabled.
-            // Maybe change this to an element to remove hard coding.
-            cell3.innerHTML = "<button type=\"button\" disabled>Delete</button>";
-            cell3.className = "actions-cell";
-        }
-    };
-
-    // const styleTables = () => {
-    //     const tables = document.querySelectorAll("table");
-    //     const cells = document.querySelectorAll("th, td");
-
-    //     tables.forEach(table => {
-    //         table.style.border = "1px solid";
-    //         table.style.borderCollapse = "collapse";
-    //     })
-
-    //     cells.forEach(cell => {
-    //         cell.style.border = "1px solid";
-    //         cell.style.padding = "0.5rem 0.75rem";
-    //         cell.style.textAlign = "left"
-    //     });
-    // };
-
-    const addClickHandlersToLinks = () => {
-        const linkbtns = document.querySelectorAll("button.links")
-        linkbtns.forEach(btn => {
-            btn.addEventListener("click", () => {
-                const target = btn.dataset.target;
-                if (!target) return;
-                window.location.hash = target;
-            })
-        })
-    }
-
-    const showElements = () => {
-        const loadingElement = document.querySelector("#loading");
-        const elements = document.querySelectorAll("div #page");
-        elements.forEach(element => {
-            element.style.visibility = "visible";
-        })
-        loadingElement.style.visibility = "hidden";
-    }
-
-    const fetchCss = async () => {
-        const response = await fetch('/web/configurationpage?name=home.css')
-
-        if(!response.ok){
-            throw new Error(`Response status: ${response.status}`);
-        }
-
-        const css = await response.text();
-        const styles = document.createElement('style');
-        styles.textContent = css;
-        document.head.appendChild(styles);
-    }
-
-    moviesTitle.innerHTML = await getMediaCleanerMoviesTitle();
-    seriesTitle.innerHTML = await getMediaCleanerSeriesTitle();
-
-    await updateMediaCleanerState();
-    var moviesInfo = await getMediaCleanerMovieInfo();
-    var seriesInfo = await getMediaCleanerSeriesInfo();
-    populateTables();
-    addClickHandlersToLinks();
-    showElements();
-    fetchCss();
-});
diff --git a/Jellyfin.Plugin.MediaCleaner/Plugin.cs b/Jellyfin.Plugin.MediaCleaner/Plugin.cs
index 14bbe7e..0c29674 100644
--- a/Jellyfin.Plugin.MediaCleaner/Plugin.cs
+++ b/Jellyfin.Plugin.MediaCleaner/Plugin.cs
@@ -57,8 +57,8 @@ public class Plugin : BasePlugin<PluginConfiguration>, IHasWebPages
             },
             new PluginPageInfo
             {
-                Name = "media_cleaner_table.js",
-                EmbeddedResourcePath = string.Format(CultureInfo.InvariantCulture, "{0}.Pages.media_cleaner_table.js", GetType().Namespace),
+                Name = "home.js",
+                EmbeddedResourcePath = string.Format(CultureInfo.InvariantCulture, "{0}.Pages.home.js", GetType().Namespace),
             },
             new PluginPageInfo
             {