Files
spotizerr-dev/static/html/album.html
cool.gitter.not.me.again.duh ee261c28f4 huh?
2025-05-28 15:31:58 -06:00

65 lines
2.4 KiB
HTML

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Album Viewer - Spotizerr</title>
<!-- Add the new base.css first -->
<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/album/album.css') }}" />
</head>
<body>
<div class="app-container">
<div id="album-header" class="content-header hidden">
<!-- Album Image -->
<img id="album-image" class="header-image" alt="Album cover" onerror="this.src='/static/images/placeholder.jpg'">
<!-- Album Info -->
<div id="album-info" class="header-info">
<h1 id="album-name" class="header-title"></h1>
<p id="album-artist" class="header-subtitle"></p>
<p id="album-stats" class="header-subtitle"></p>
<p id="album-copyright" class="album-copyright"></p>
<!-- Download Button -->
<div class="header-actions">
<button id="downloadAlbumBtn" class="download-btn btn-primary">
<img src="{{ url_for('static', filename='images/download.svg') }}" alt="Download">
Download Full Album
</button>
</div>
</div>
</div>
<div id="tracks-container" class="hidden">
<h2 class="section-title">Tracks</h2>
<div id="tracks-list" class="tracks-list"></div>
</div>
<!-- Loading and Error states -->
<div id="loading" class="loading">
<div class="loading-indicator">Loading...</div>
</div>
<div id="error" class="error hidden">Error loading album</div>
</div>
<!-- Fixed floating buttons for home and queue -->
<button id="homeButton" class="btn-icon home-btn floating-icon settings-icon" aria-label="Return to home">
<img src="{{ url_for('static', filename='images/home.svg') }}" alt="Home">
</button>
<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 Icon">
</button>
<script type="module" src="{{ url_for('static', filename='js/album.js') }}"></script>
</body>
</html>