From 47b74af6621c4eaf6d13858da1c0e8636754e07f Mon Sep 17 00:00:00 2001
From: Kenneth Reitz <me@kennethreitz.org>
Date: Sun, 30 Nov 2025 01:42:45 -0500
Subject: [PATCH] Show offline caching progress on page load
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- Service worker now responds to GET_CACHE_STATUS message
- /offline page queries caching status when it loads
- If download is in progress, shows progress bar immediately without requiring click

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>
---
 kjvstudy_org/static/sw.js           | 17 +++++++++++++++++
 kjvstudy_org/templates/offline.html | 16 ++++++++++++++++
 2 files changed, 33 insertions(+)

diff --git a/kjvstudy_org/static/sw.js b/kjvstudy_org/static/sw.js
index 02450f2..76d3b88 100644
--- a/kjvstudy_org/static/sw.js
+++ b/kjvstudy_org/static/sw.js
@@ -314,4 +314,21 @@ self.addEventListener('message', (event) => {
     console.log('[SW] Received START_CACHING request');
     startBackgroundCaching();
   }
+
+  // Report current caching status
+  if (event.data && event.data.type === 'GET_CACHE_STATUS') {
+    if (cachingInProgress) {
+      event.source.postMessage({
+        type: 'CACHE_PROGRESS',
+        cached: cachedCount,
+        total: totalToCache,
+        inProgress: true
+      });
+    } else {
+      event.source.postMessage({
+        type: 'CACHE_IDLE',
+        inProgress: false
+      });
+    }
+  }
 });
diff --git a/kjvstudy_org/templates/offline.html b/kjvstudy_org/templates/offline.html
index c5b6548..525bf20 100644
--- a/kjvstudy_org/templates/offline.html
+++ b/kjvstudy_org/templates/offline.html
@@ -498,23 +498,39 @@
             navigator.serviceWorker.addEventListener('message', function(event) {
                 const data = event.data;
                 if (data.type === 'CACHE_STATUS') {
+                    cacheProgress.classList.add('active');
                     progressText.textContent = data.status;
                 } else if (data.type === 'CACHE_PROGRESS') {
+                    // Show progress bar if caching is in progress
+                    cacheProgress.classList.add('active');
+                    startCacheBtn.disabled = true;
+                    startCacheBtn.textContent = 'Downloading...';
+
                     const pct = Math.round((data.cached / data.total) * 100);
                     progressFill.style.width = pct + '%';
                     progressText.textContent = 'Downloading: ' + data.cached.toLocaleString() + ' / ' + data.total.toLocaleString() + ' pages (' + pct + '%)';
                 } else if (data.type === 'CACHE_COMPLETE') {
+                    cacheProgress.classList.add('active');
                     progressFill.style.width = '100%';
                     progressText.innerHTML = '<span class="cache-complete">✓ Download complete! ' + data.total.toLocaleString() + ' pages available offline.</span>';
                     startCacheBtn.textContent = 'Downloaded!';
+                    startCacheBtn.disabled = true;
                     // Refresh the cache list
                     setTimeout(checkCaches, 500);
                 } else if (data.type === 'CACHE_ERROR') {
+                    cacheProgress.classList.add('active');
                     progressText.innerHTML = '<span class="status-error">Error: ' + data.error + '</span>';
                     startCacheBtn.disabled = false;
                     startCacheBtn.textContent = 'Try Again';
                 }
             });
+
+            // Check if caching is already in progress when page loads
+            navigator.serviceWorker.ready.then(function(registration) {
+                if (registration.active) {
+                    registration.active.postMessage({ type: 'GET_CACHE_STATUS' });
+                }
+            });
         }
 
         // Bible Reader functionality