T-Gander/jellyfin-plugin-mediacleaner
1
0
Fork 0
Code Issues 2 Pull Requests Actions Packages Projects Releases 11 Wiki Activity

Media-Cleaner-Homepage-and-Api #7

Merged
T-Gander merged 12 commits from Media-Cleaner-Homepage-and-Api into main 2026-01-27 08:16:01 -07:00
Conversation 0 Commits 12 Files Changed 16 +99 -32
2 changed files with 99 additions and 32 deletions
Download Patch File Download Diff File Expand all files Collapse all files
Showing only changes of commit e99ce96563 - Show all commits

56
Jellyfin.Plugin.MediaCleaner/Pages/home.html
View File

@@ -1,34 +1,36 @@
<div data-role="page" class="page type-interior pluginConfigurationPage withTabs" <div data-role="page" class="page type-interior pluginConfigurationPage"
data-controller="__plugin/media_cleaner_table.js"> data-controller="__plugin/media_cleaner_table.js">
<div data-role="content"> <div data-role="content">
<div class="content-primary"> <div class="content-primary">
<div> <div id="loading">Loading...</div>
<a href="#configurationpage?name=Settings">Settings</a> <div id="page" style="visibility: hidden;">
<button class="links" data-target="#configurationpage?name=Settings">Settings</button>
<h2>Media Cleaner</h2>
<h3 id="moviesTitle"></h3>
<table id="moviesTable">
<thead>
<tr>
<th>Name</th>
<th class="actions-cell">Actions</th>
</tr>
</thead>
<tbody></tbody>
</table>
<br>
<h3 id="seriesTitle"></h3>
<table id="seriesTable">
<thead>
<tr>
<th>Name</th>
<th>Seasons</th>
<th class="actions-cell">Actions</th>
</tr>
</thead>
<tbody></tbody>
</table>
</div> </div>
<h2>Media Cleaner</h2>
<h3 id="moviesTitle"></h3>
<table id="moviesTable">
<thead>
<tr>
<th>Name</th>
</tr>
</thead>
<tbody></tbody>
</table>
<br>
<br>
<h3 id="seriesTitle"></h3>
<table id="seriesTable">
<thead>
<tr>
<th>Name</th>
<th>Seasons</th>
</tr>
</thead>
<tbody></tbody>
</table>
</div> </div>
</div> </div>
</div> </div>

75
Jellyfin.Plugin.MediaCleaner/Pages/media_cleaner_table.js
View File

@@ -12,7 +12,7 @@ document.addEventListener('pageshow', async () => {
} }
return response.json(); return response.json();
} };
const getMediaCleanerMovieInfo = async () => { const getMediaCleanerMovieInfo = async () => {
const response = await fetch("/mediacleaner/state/getMovieInfo"); const response = await fetch("/mediacleaner/state/getMovieInfo");
@@ -22,7 +22,7 @@ document.addEventListener('pageshow', async () => {
} }
return response.json(); return response.json();
} };
const updateMediaCleanerState = async () => { const updateMediaCleanerState = async () => {
const response = await fetch("/mediacleaner/state/updateState"); const response = await fetch("/mediacleaner/state/updateState");
@@ -32,7 +32,7 @@ document.addEventListener('pageshow', async () => {
} }
return response.json(); return response.json();
} };
const getMediaCleanerSeriesTitle = async () => { const getMediaCleanerSeriesTitle = async () => {
const response = await fetch("/mediacleaner/state/getSeriesTitle"); const response = await fetch("/mediacleaner/state/getSeriesTitle");
@@ -42,7 +42,7 @@ document.addEventListener('pageshow', async () => {
} }
return response.json(); return response.json();
} };
const getMediaCleanerMoviesTitle = async () => { const getMediaCleanerMoviesTitle = async () => {
const response = await fetch("/mediacleaner/state/getMoviesTitle"); const response = await fetch("/mediacleaner/state/getMoviesTitle");
@@ -52,14 +52,17 @@ document.addEventListener('pageshow', async () => {
} }
return response.json(); return response.json();
} };
const populateTables = () => { const populateTables = () => {
var seriesTableBody = seriesTable.getElementsByTagName('tbody')[0]; var seriesTableBody = seriesTable.getElementsByTagName('tbody')[0];
seriesTableBody.replaceChildren(); seriesTableBody.replaceChildren();
seriesTableBody.style.border = "1px solid";
seriesTableBody.style.borderCollapse = "collapse";
var moviesTableBody = moviesTable.getElementsByTagName('tbody')[0]; var moviesTableBody = moviesTable.getElementsByTagName('tbody')[0];
moviesTableBody.replaceChildren(); moviesTableBody.replaceChildren();
moviesTableBody.style.border = "1px solid";
for(let i = 0; i < moviesInfo.length; i++){ for(let i = 0; i < moviesInfo.length; i++){
var row = moviesTableBody.insertRow(-1); var row = moviesTableBody.insertRow(-1);
@@ -77,7 +80,66 @@ document.addEventListener('pageshow', async () => {
cell1.innerHTML = seriesInfo[i].Name; cell1.innerHTML = seriesInfo[i].Name;
cell2.innerHTML = seriesInfo[i].Seasons.map(season => season.replace("Season ", "")).join(", "); cell2.innerHTML = seriesInfo[i].Seasons.map(season => season.replace("Season ", "")).join(", ");
cell3.innerHTML = "<button>Delete</button>"; cell3.innerHTML = "<button>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 styleLinks = () => {
const linkbtns = document.querySelectorAll("button.links")
linkbtns.forEach(btn => {
btn.style.background = "#0f0f0f";
btn.style.border = '1px solid';
btn.style.padding = '1rem 2rem';
btn.style.fontSize = "1.2rem"
btn.style.color = "white";
btn.style.textDecoration = 'none';
btn.style.cursor = 'pointer';
btn.style.lineHeight = 'inherit';
btn.style.verticalAlign = 'baseline';
btn.style.transition = 'background 0.3s ease';
const hoverBg = '#2a2a2a';
const normalBg = btn.style.background;
btn.addEventListener("click", () => {
const target = btn.dataset.target;
if (!target) return;
window.location.hash = target;
})
btn.addEventListener('mouseenter', () => {
btn.style.background = hoverBg;
});
btn.addEventListener('mouseleave', () => {
btn.style.background = normalBg;
});
})
}
const showElements = () => {
const loadingElement = document.querySelector("#loading");
const elements = document.querySelectorAll("div #page");
elements.forEach(element => {
element.style.visibility = "visible";
})
loadingElement.style.visibility = "hidden";
} }
moviesTitle.innerHTML = await getMediaCleanerMoviesTitle(); moviesTitle.innerHTML = await getMediaCleanerMoviesTitle();
@@ -87,4 +149,7 @@ document.addEventListener('pageshow', async () => {
var moviesInfo = await getMediaCleanerMovieInfo(); var moviesInfo = await getMediaCleanerMovieInfo();
var seriesInfo = await getMediaCleanerSeriesInfo(); var seriesInfo = await getMediaCleanerSeriesInfo();
populateTables(); populateTables();
styleTables();
styleLinks();
showElements();
}); });