Files
spotizerr-dev/static/html/history.html
2025-06-07 18:47:18 +02:00

85 lines
3.7 KiB
HTML

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Download History</title>
<!-- Link to global stylesheets first -->
<link rel="stylesheet" href="{{ url_for('static', filename='css/main/base.css') }}">
<link rel="stylesheet" href="{{ url_for('static', filename='css/main/icons.css') }}">
<!-- Link to page-specific stylesheet -->
<link rel="stylesheet" href="{{ url_for('static', filename='css/history/history.css') }}">
<!-- Helper function for image errors, if not already in base.css or loaded globally -->
<script>
function handleImageError(img) {
img.onerror = null; // Prevent infinite loop if placeholder also fails
img.src = "{{ url_for('static', filename='images/placeholder.jpg') }}";
}
</script>
</head>
<body>
<div class="container">
<h1>Download History</h1>
<div class="filters">
<label for="status-filter">Status:</label>
<select id="status-filter">
<option value="">All</option>
<option value="COMPLETED">Completed</option>
<option value="ERROR">Error</option>
<option value="CANCELLED">Cancelled</option>
</select>
<label for="type-filter">Type:</label>
<select id="type-filter">
<option value="">All</option>
<option value="track">Track</option>
<option value="album">Album</option>
<option value="playlist">Playlist</option>
<option value="artist">Artist</option>
</select>
</div>
<table>
<thead>
<tr>
<th data-sort="item_name">Name</th>
<th data-sort="item_artist">Artist</th>
<th data-sort="download_type">Type</th>
<th data-sort="service_used">Service</th>
<th data-sort="quality_profile">Quality</th>
<th data-sort="status_final">Status</th>
<th data-sort="timestamp_added">Date Added</th>
<th data-sort="timestamp_completed">Date Completed/Ended</th>
<th>Details</th>
</tr>
</thead>
<tbody id="history-table-body">
<!-- Rows will be inserted here by JavaScript -->
</tbody>
</table>
<div class="pagination">
<button id="prev-page" disabled>Previous</button>
<span id="page-info">Page 1 of 1</span>
<button id="next-page" disabled>Next</button>
<select id="limit-select">
<option value="10">10 per page</option>
<option value="25" selected>25 per page</option>
<option value="50">50 per page</option>
<option value="100">100 per page</option>
</select>
</div>
</div>
<!-- Fixed floating buttons for home and queue -->
<a href="/" class="btn-icon home-btn floating-icon" aria-label="Return to home" title="Go to Home">
<img src="{{ url_for('static', filename='images/home.svg') }}" alt="Home" onerror="handleImageError(this)"/>
</a>
<!-- Link to the new TypeScript file (compiled to JS) -->
<script type="module" src="{{ url_for('static', filename='js/history.js') }}"></script>
<!-- Queue icon, assuming queue.js handles its own initialization if included -->
<!-- You might want to include queue.js here if the queue icon is desired on this page -->
<!-- <script type="module" src="{{ url_for('static', filename='js/queue.js') }}"></script> -->
</body>
</html>