Files
spotizerr-dev/static/html/watch.html
2025-06-03 14:02:04 -06:00

67 lines
2.8 KiB
HTML

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Watched Items - Spotizerr</title>
<link rel="stylesheet" href="{{ url_for('static', filename='css/main/base.css') }}">
<link rel="stylesheet" href="{{ url_for('static', filename='css/queue/queue.css') }}">
<link rel="stylesheet" href="{{ url_for('static', filename='css/main/icons.css') }}">
<link rel="stylesheet" href="{{ url_for('static', filename='css/watch/watch.css') }}">
<script>
// Helper function to handle image loading errors
function handleImageError(img) {
img.src = '/static/images/placeholder.jpg'; // Ensure this placeholder exists
}
</script>
</head>
<body>
<div class="app-container">
<div class="watch-header">
<h1>Watched Artists & Playlists</h1>
<button id="checkAllWatchedBtn" class="btn btn-secondary check-all-btn">
<img src="{{ url_for('static', filename='images/refresh-cw.svg') }}" alt="Refresh"> Check All
</button>
</div>
<div id="watchedItemsContainer" class="results-grid">
<!-- Watched items will be dynamically inserted here -->
</div>
<div id="loadingWatchedItems" class="loading hidden">
<div class="loading-indicator">Loading watched items...</div>
</div>
<div id="emptyWatchedItems" class="empty-state hidden">
<div class="empty-state-content">
<img src="{{ url_for('static', filename='images/binoculars.svg') }}" alt="Binoculars" class="empty-state-icon" />
<h2>Nothing to see here yet!</h2>
<p>Start watching artists or playlists, and they'll appear here.</p>
</div>
</div>
</div>
<!-- Fixed floating buttons for settings and queue -->
<a href="/history" class="btn-icon history-nav-btn floating-icon home-btn" aria-label="Download History" title="Go to Download History">
<img src="{{ url_for('static', filename='images/history.svg') }}" alt="History" onerror="handleImageError(this)"/>
</a>
<a href="/" class="btn-icon home-btn floating-icon settings-icon" aria-label="Return to Home" title="Return to Home">
<img src="{{ url_for('static', filename='images/home.svg') }}" alt="Home" onerror="handleImageError(this)"/>
</a>
<button
id="queueIcon"
class="btn-icon queue-icon floating-icon"
aria-label="Download queue"
aria-controls="downloadQueue"
aria-expanded="false"
>
<img src="{{ url_for('static', filename='images/queue.svg') }}" alt="Queue" onerror="handleImageError(this)"/>
</button>
<script type="module" src="{{ url_for('static', filename='js/watch.js') }}"></script>
<!-- Include queue.js if queueIcon functionality is desired on this page too -->
<script type="module" src="{{ url_for('static', filename='js/queue.js') }}"></script>
</body>
</html>