From cc56d075ee953856f18c3131602eeee9e42e697c Mon Sep 17 00:00:00 2001
From: Kenneth Reitz <me@kennethreitz.org>
Date: Sat, 4 Apr 2026 08:29:40 -0400
Subject: [PATCH] Website: download all zip (built in Docker), duration, tab
 title
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Zip generated at Docker build time — not checked into git.
Album duration shown (83:58). Browser tab shows now playing.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
---
 Dockerfile      | 1 +
 site/index.html | 6 +++++-
 2 files changed, 6 insertions(+), 1 deletion(-)

diff --git a/Dockerfile b/Dockerfile
index aa81128..12d5ee9 100644
--- a/Dockerfile
+++ b/Dockerfile
@@ -1,3 +1,4 @@
 FROM nginx:alpine
 COPY site/ /usr/share/nginx/html/
+RUN cd /usr/share/nginx/html/mp3s && zip -0 ../interpretations-full-album.zip *.mp3
 EXPOSE 80
diff --git a/site/index.html b/site/index.html
index 98e24df..3ed451e 100644
--- a/site/index.html
+++ b/site/index.html
@@ -358,7 +358,7 @@
     <img src="cover.png" alt="Interpretations" class="cover">
     <div class="album-title">Interpretations</div>
     <div class="artist">Infinite State</div>
-    <div class="album-info">24 tracks · Written in Python · Generated from code</div>
+    <div class="album-info">24 tracks · 83:58 · Written in Python · Generated from code</div>
     <div class="streaming-links" id="streaming-links">
         <!-- Uncomment as links go live
         <a href="#" class="stream-btn">Spotify</a>
@@ -367,6 +367,7 @@
         <a href="#" class="stream-btn">YouTube Music</a>
         -->
         <a href="https://github.com/kennethreitz/interpretations" class="stream-btn">GitHub</a>
+        <a href="interpretations-full-album.zip" class="stream-btn" download>Download All (320 CBR MP3)</a>
     </div>
 </div>
 
@@ -538,6 +539,7 @@ function playTrack(index) {
     document.getElementById('player').style.display = 'flex';
     document.getElementById('player-title').textContent = t.title;
     document.getElementById('play-btn').textContent = '⏸';
+    document.title = `▶ ${t.title} — Interpretations`;
 }
 
 function togglePlay() {
@@ -546,10 +548,12 @@ function togglePlay() {
         audio.pause();
         isPlaying = false;
         document.getElementById('play-btn').textContent = '▶';
+        document.title = `⏸ ${TRACKS[currentTrack].title} — Interpretations`;
     } else {
         audio.play();
         isPlaying = true;
         document.getElementById('play-btn').textContent = '⏸';
+        document.title = `▶ ${TRACKS[currentTrack].title} — Interpretations`;
     }
 }