Cleaned up media_cleaner_table.js and renamed to home.js. Updated table with no data to have a message.

2026-01-27 08:09:03 -07:00
parent 669f59db15
commit e77f7dcd5f
4 changed files with 155 additions and 154 deletions
--- a/Jellyfin.Plugin.MediaCleaner/Pages/home.js
+++ 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);
+}