Update script.js

webui/static/script.js

@@ -19733,17 +19733,11 @@ async function handleMediaScanButtonClick() {
         const result = await response.json();
 
         if (result.success) {
-            // Update UI to show scan in progress
+            // Get delay from API response (graceful fallback to 60 if not provided)
-            phaseLabel.textContent = 'Scan in progress...';
+            const delaySeconds = (result.scan_info && result.scan_info.delay_seconds) || 60;
-            progressBar.style.width = '100%';
+            let remainingSeconds = delaySeconds;
-
+            let countdownInterval = null;
-            if (result.scan_info && result.scan_info.delay_seconds) {
+            let pollInterval = null;
-                progressLabel.textContent = `Scan scheduled (${result.scan_info.delay_seconds}s delay)`;
-                showToast(`📡 Media scan scheduled (${result.scan_info.delay_seconds}s delay)`, 'success', 5000);
-            } else {
-                progressLabel.textContent = 'Scan initiated successfully';
-                showToast('📡 Media scan initiated successfully', 'success', 3000);
-            }
 
             // Show auto database update message
             if (result.auto_database_update) {
@@ -19757,20 +19751,51 @@ async function handleMediaScanButtonClick() {
                 lastTimeEl.textContent = now.toLocaleTimeString();
             }
 
-            // Poll scan status for ~30 seconds
+            // Start countdown timer (visual feedback during delay)
+            phaseLabel.textContent = 'Scan scheduled...';
+            progressBar.style.width = '0%';
+
+            countdownInterval = setInterval(() => {
+                remainingSeconds--;
+
+                // Update progress bar (0% -> 100% over delay period)
+                const progress = ((delaySeconds - remainingSeconds) / delaySeconds) * 100;
+                progressBar.style.width = `${progress}%`;
+
+                // Update progress label with countdown
+                if (remainingSeconds > 0) {
+                    progressLabel.textContent = `Starting scan in ${remainingSeconds}s...`;
+                } else {
+                    progressLabel.textContent = 'Scan starting now...';
+                }
+
+                // When countdown reaches 0, start polling
+                if (remainingSeconds <= 0) {
+                    clearInterval(countdownInterval);
+
+                    // Transition to scanning phase
+                    phaseLabel.textContent = 'Scan in progress...';
+                    progressBar.style.width = '100%';
+                    progressLabel.textContent = 'Media server is scanning library...';
+                    showToast('📡 Media scan started', 'success', 3000);
+
+                    // Start polling for scan completion (5 minutes = 150 polls × 2s)
                     let pollCount = 0;
-            const pollInterval = setInterval(async () => {
+                    const maxPolls = 150; // 5 minutes
+
+                    pollInterval = setInterval(async () => {
                         pollCount++;
 
-                if (pollCount > 15) { // Stop after 30 seconds (15 * 2s)
+                        if (pollCount > maxPolls) {
+                            // Polling timeout after 5 minutes
                             clearInterval(pollInterval);
-                    // Reset UI
                             button.disabled = false;
                             phaseLabel.textContent = 'Scan completed';
                             progressBar.style.width = '0%';
                             progressLabel.textContent = 'Ready for next scan';
                             statusValue.textContent = 'Idle';
                             statusValue.style.color = '#b3b3b3';
+                            showToast('✅ Media scan completed', 'success', 3000);
                             return;
                         }
 
@@ -19783,10 +19808,10 @@ async function handleMediaScanButtonClick() {
 
                                 // Update status display
                                 if (status.is_scanning) {
-                            phaseLabel.textContent = 'Plex is scanning library...';
+                                    phaseLabel.textContent = 'Media server scanning...';
                                     progressLabel.textContent = status.progress_message || 'Scan in progress';
-                        } else {
+                                } else if (status.status === 'idle') {
-                            // Scan complete
+                                    // Scan completed
                                     clearInterval(pollInterval);
                                     button.disabled = false;
                                     phaseLabel.textContent = 'Scan completed successfully';
@@ -19801,6 +19826,8 @@ async function handleMediaScanButtonClick() {
                             console.debug('Scan status poll error:', pollError);
                         }
                     }, 2000); // Poll every 2 seconds
+                }
+            }, 1000); // Update countdown every second
 
         } else {
             // Error occurred