feat: admin users can view all downloads with user badges

- Admin users (Emby IsAdministrator) see a 'Show all users' toggle
- When toggled, all tagged downloads are shown regardless of user
- Each download card shows the tagged user's name as a badge
- Non-admin users see only their own downloads (unchanged behavior)
- Backend accepts ?showAll=true query param (admin-only)
This commit is contained in:
2026-05-15 20:46:56 +01:00
parent 6463c6b3d1
commit 0957f83411
5 changed files with 89 additions and 16 deletions
+21 -1
View File
@@ -2,6 +2,8 @@ let currentUser = null;
let downloads = [];
let refreshInterval = null;
let currentRefreshRate = 5000; // default 5 seconds
let isAdmin = false;
let showAll = false;
// Apply saved theme immediately (before DOMContentLoaded to avoid flash)
(function() {
@@ -17,6 +19,7 @@ document.addEventListener('DOMContentLoaded', () => {
document.getElementById('login-form').addEventListener('submit', handleLogin);
document.getElementById('logout-btn').addEventListener('click', handleLogout);
document.getElementById('refresh-rate').addEventListener('change', handleRefreshRateChange);
document.getElementById('show-all-toggle').addEventListener('change', handleShowAllToggle);
});
function initThemeSwitcher() {
@@ -48,6 +51,11 @@ function handleRefreshRateChange(e) {
startAutoRefresh();
}
function handleShowAllToggle(e) {
showAll = e.target.checked;
fetchUserDownloads(true);
}
function stopAutoRefresh() {
if (refreshInterval) {
clearInterval(refreshInterval);
@@ -62,6 +70,7 @@ async function checkAuthentication() {
if (data.authenticated) {
currentUser = data.user;
isAdmin = !!data.user.isAdmin;
showDashboard();
fetchUserDownloads(true);
startAutoRefresh();
@@ -93,6 +102,7 @@ async function handleLogin(e) {
if (data.success) {
currentUser = data.user;
isAdmin = !!data.user.isAdmin;
showDashboard();
fetchUserDownloads(true);
startAutoRefresh();
@@ -129,6 +139,7 @@ function showDashboard() {
document.getElementById('login-container').style.display = 'none';
document.getElementById('dashboard-container').style.display = 'block';
document.getElementById('currentUser').textContent = currentUser.name || '-';
document.getElementById('admin-controls').style.display = isAdmin ? 'flex' : 'none';
}
function showLoginError(message) {
@@ -149,10 +160,12 @@ async function fetchUserDownloads(isInitialLoad = false) {
hideError();
try {
const response = await fetch('/api/dashboard/user-downloads');
const url = showAll ? '/api/dashboard/user-downloads?showAll=true' : '/api/dashboard/user-downloads';
const response = await fetch(url);
const data = await response.json();
currentUser = data.user;
isAdmin = !!data.isAdmin;
downloads = data.downloads;
// Debug: log first download to see what fields are present
@@ -348,6 +361,13 @@ function createDownloadCard(download) {
movie.textContent = `Movie: ${download.movieName}`;
infoDiv.appendChild(movie);
}
if (showAll && download.userTag) {
const userBadge = document.createElement('span');
userBadge.className = 'download-user-badge';
userBadge.textContent = download.userTag;
header.appendChild(userBadge);
}
const details = document.createElement('div');
details.className = 'download-details';
+6
View File
@@ -46,6 +46,12 @@
<option value="0">Off</option>
</select>
</div>
<div id="admin-controls" class="admin-controls" style="display: none;">
<label class="toggle-label">
<input type="checkbox" id="show-all-toggle">
<span>Show all users</span>
</label>
</div>
<div class="user-info">
<span class="user-label">Current User:</span>
<span class="user-name" id="currentUser">-</span>
+36
View File
@@ -577,6 +577,42 @@ body {
background: var(--accent-hover);
}
/* ===== Admin Controls ===== */
.admin-controls {
display: flex;
align-items: center;
}
.toggle-label {
display: flex;
align-items: center;
gap: 6px;
cursor: pointer;
font-size: 0.8rem;
color: var(--text-secondary);
background: var(--surface-alt);
padding: 4px 12px;
border-radius: 14px;
}
.toggle-label input[type="checkbox"] {
width: 14px;
height: 14px;
cursor: pointer;
accent-color: var(--accent);
}
.download-user-badge {
padding: 2px 8px;
border-radius: 10px;
font-size: 0.65rem;
font-weight: 600;
text-transform: capitalize;
background: var(--accent-light);
color: var(--accent);
margin-left: auto;
}
/* ===== Mobile ===== */
@media (max-width: 768px) {
.app-header {