Update app.py

app.py

@@ -3,13 +3,12 @@ import re
 import uuid
 import json
 import time
-import queue
 import threading
 import subprocess
 import sqlite3
 from pathlib import Path
 from urllib.parse import urlparse, unquote
-from flask import Flask, request, jsonify, send_from_directory, render_template_string, Response, stream_with_context
+from flask import Flask, request, jsonify, send_from_directory, render_template_string
 
 app = Flask(__name__)
 
@@ -21,24 +20,6 @@ DB_FILE = Path("swiftload.db")
 _live_cache = {}
 _cache_lock = threading.Lock()
 
-# SSE subscriber queues — each connected client gets one queue
-_sse_subscribers: list[queue.Queue] = []
-_sse_lock = threading.Lock()
-
-
-def sse_broadcast(event_type: str, data: dict):
-    """Push an SSE event to all connected clients. Dead queues are pruned."""
-    msg = f"event: {event_type}\ndata: {json.dumps(data)}\n\n"
-    with _sse_lock:
-        alive = []
-        for q in _sse_subscribers:
-            try:
-                q.put_nowait(msg)
-                alive.append(q)
-            except queue.Full:
-                pass  # client too slow — drop it
-        _sse_subscribers[:] = alive
-
 
 # ─── Database ────────────────────────────────────────────────────────────────
 
@@ -81,10 +62,6 @@ def db_upsert_task(task_id, url, filename, save_path, status="queued", progress=
                 updated_at=excluded.updated_at
         """, (task_id, url, filename, str(save_path), status, progress, size, error, now, now))
         conn.commit()
-    # Notify all open clients about the new task immediately
-    task = db_get_task(task_id)
-    if task:
-        sse_broadcast("task_update", {**task, "speed": "–", "eta": "–"})
 
 
 def db_update_task(task_id, **kwargs):
@@ -96,15 +73,6 @@ def db_update_task(task_id, **kwargs):
     with get_db() as conn:
         conn.execute(f"UPDATE tasks SET {set_clause} WHERE task_id=?", values)
         conn.commit()
-    # Push live update to all SSE clients — no client polling needed
-    task = db_get_task(task_id)
-    if task:
-        with _cache_lock:
-            live = _live_cache.get(task_id, {})
-        sse_broadcast("task_update", {**task,
-            "speed": live.get("speed", "–") if task["status"] == "downloading" else "–",
-            "eta":   live.get("eta",   "–") if task["status"] == "downloading" else "–",
-        })
 
 
 def db_get_task(task_id):
@@ -206,16 +174,6 @@ def download_with_wget(task_id, url, save_path):
                     _live_cache[task_id]["speed"] = speed_match.group(1)
                 if eta_match:
                     _live_cache[task_id]["eta"] = eta_match.group(1)
-                live_snap = dict(_live_cache.get(task_id, {}))
-
-            # Push speed/eta live (no DB write needed for these)
-            if speed_match or eta_match:
-                task = db_get_task(task_id)
-                if task:
-                    sse_broadcast("task_update", {**task,
-                        "speed": live_snap.get("speed", "–"),
-                        "eta":   live_snap.get("eta",   "–"),
-                    })
 
         process.wait()
 
@@ -297,46 +255,21 @@ def all_tasks():
     for t in tasks:
         with _cache_lock:
             live = _live_cache.get(t["task_id"], {})
-        result.append({**t,
+        result.append({
+            "task_id": t["task_id"],
+            "url": t["url"],
+            "filename": t["filename"],
+            "status": t["status"],
+            "progress": t["progress"],
+            "size": t["size"],
+            "error": t["error"],
+            "created_at": t["created_at"],
             "speed": live.get("speed", "–") if t["status"] == "downloading" else "–",
-            "eta":   live.get("eta",   "–") if t["status"] == "downloading" else "–",
+            "eta": live.get("eta", "–") if t["status"] == "downloading" else "–",
         })
     return jsonify(result)
 
 
-@app.route("/stream")
-def sse_stream():
-    """Server-Sent Events endpoint. Clients connect once; server pushes all updates."""
-    q: queue.Queue = queue.Queue(maxsize=64)
-    with _sse_lock:
-        _sse_subscribers.append(q)
-
-    def generate():
-        # Immediately send full current state so the client is in sync
-        tasks = db_all_tasks()
-        for t in tasks:
-            with _cache_lock:
-                live = _live_cache.get(t["task_id"], {})
-            payload = {**t,
-                "speed": live.get("speed", "–") if t["status"] == "downloading" else "–",
-                "eta":   live.get("eta",   "–") if t["status"] == "downloading" else "–",
-            }
-            yield f"event: task_update\ndata: {json.dumps(payload)}\n\n"
-
-        # Then stream subsequent events as they arrive
-        while True:
-            try:
-                msg = q.get(timeout=25)   # 25s timeout → send keepalive
-                yield msg
-            except queue.Empty:
-                yield ": keepalive\n\n"   # prevents proxy/browser timeout
-
-    resp = Response(stream_with_context(generate()), mimetype="text/event-stream")
-    resp.headers["Cache-Control"] = "no-cache"
-    resp.headers["X-Accel-Buffering"] = "no"
-    return resp
-
-
 @app.route("/dl/<task_id>")
 def download_file(task_id):
     task = db_get_task(task_id)
@@ -755,138 +688,125 @@ input[type="text"]::placeholder{color:var(--muted);}
 </div>
 
 <script>
-// ── State ─────────────────────────────────────────────────────────────────────
-// taskMap: task_id → task object (latest snapshot from server)
-const taskMap = {};
-let evtSource = null;
-
-// ── SSE Connection ─────────────────────────────────────────────────────────────
-function connectSSE() {
-  if (evtSource) evtSource.close();
-  evtSource = new EventSource('/stream');
+// ── State ────────────────────────────────────────────────────────────────────
+const POLL_INTERVAL = 900;  // ms between full refresh
+let allTasks = [];           // latest snapshot from server
+let pollTimer = null;
+let activePolling = new Set(); // task_ids currently downloading
+
+// ── Boot ─────────────────────────────────────────────────────────────────────
+(async function init() {
+  await refreshAll();
+  startPolling();
+})();
+
+function startPolling() {
+  if (pollTimer) return;
+  pollTimer = setInterval(async () => {
+    if (activePolling.size > 0) {
+      await refreshAll();
+    }
+  }, POLL_INTERVAL);
+}
+
+// ── Full refresh ──────────────────────────────────────────────────────────────
+async function refreshAll() {
+  try {
+    const res = await fetch('/tasks/all');
+    allTasks = await res.json();
 
-  evtSource.addEventListener('task_update', e => {
-    const task = JSON.parse(e.data);
-    taskMap[task.task_id] = task;
-    renderAll();
-  });
+    activePolling.clear();
+    allTasks.forEach(t => {
+      if (t.status === 'downloading' || t.status === 'queued') {
+        activePolling.add(t.task_id);
+      }
+    });
 
-  evtSource.onerror = () => {
-    // Connection dropped — reconnect after 3s
-    evtSource.close();
-    setTimeout(connectSSE, 3000);
-  };
+    renderActive();
+    renderHistory();
+  } catch(e) {}
 }
 
-// ── Boot ──────────────────────────────────────────────────────────────────────
-connectSSE();
-
-// Reconnect when tab regains visibility (SSE may have been killed by browser)
-document.addEventListener('visibilitychange', () => {
-  if (!document.hidden && (!evtSource || evtSource.readyState === 2)) {
-    connectSSE();
-  }
-});
-
-// ── Render ────────────────────────────────────────────────────────────────────
-function renderAll() {
-  const all = Object.values(taskMap).sort((a,b) => b.created_at.localeCompare(a.created_at));
-  const active = all.filter(t => t.status === 'downloading' || t.status === 'queued');
-  const hist   = all.filter(t => t.status !== 'downloading' && t.status !== 'queued');
-
+// ── Render helpers ────────────────────────────────────────────────────────────
+function renderActive() {
+  const active = allTasks.filter(t => t.status === 'downloading' || t.status === 'queued');
   document.getElementById('active-count').textContent = active.length;
-  document.getElementById('hist-count').textContent   = hist.length;
-
-  const activeEl = document.getElementById('active-list');
-  const histEl   = document.getElementById('history-list');
-
+  const container = document.getElementById('active-list');
   if (!active.length) {
-    activeEl.innerHTML = '<div class="empty"><div class="empty-icon">📡</div>No active downloads</div>';
-  } else {
-    // Update cards in-place when possible to avoid flicker
-    active.forEach(t => {
-      const existing = document.getElementById(`card-${t.task_id}`);
-      if (existing) {
-        updateCardInPlace(existing, t);
-      } else {
-        activeEl.innerHTML = active.map(buildCard).join('');
-      }
-    });
-    // Remove stale cards
-    activeEl.querySelectorAll('[id^="card-"]').forEach(el => {
-      const id = el.id.replace('card-', '');
-      if (!active.find(t => t.task_id === id)) el.remove();
-    });
+    container.innerHTML = '<div class="empty"><div class="empty-icon">📡</div>No active downloads</div>';
+    return;
   }
-
-  histEl.innerHTML = hist.length
-    ? hist.map(buildCard).join('')
-    : '<div class="empty"><div class="empty-icon">📂</div>No download history</div>';
+  container.innerHTML = active.map(t => buildCard(t, true)).join('');
 }
 
-function updateCardInPlace(el, t) {
-  // Only update fields that change during download — avoids full re-render flicker
-  const pct = t.status === 'done' ? 100 : (t.progress || 0);
-  const fill = el.querySelector('.progress-fill');
-  const badge = el.querySelector('.badge');
-
-  if (fill) {
-    fill.style.width = pct + '%';
-    fill.className = 'progress-fill ' + (t.status === 'downloading' ? 'downloading' : t.status === 'done' ? 'done' : t.status === 'error' ? 'error' : 'interrupted');
-  }
-  if (badge) {
-    const labels = {downloading:'DOWNLOADING',done:'DONE',error:'ERROR',interrupted:'INTERRUPTED',queued:'QUEUED'};
-    const classes = {downloading:'badge-downloading',done:'badge-done',error:'badge-error',interrupted:'badge-interrupted',queued:'badge-queued'};
-    badge.textContent = labels[t.status] || t.status.toUpperCase();
-    badge.className = 'badge ' + (classes[t.status] || 'badge-queued');
-  }
-
-  const speedEl = el.querySelector('.speed-val');
-  const etaEl   = el.querySelector('.eta-val');
-  const pctEl   = el.querySelector('.pct-val');
-  const sizeEl  = el.querySelector('.size-val');
-  if (speedEl) speedEl.textContent = t.speed || '–';
-  if (etaEl)   etaEl.textContent   = t.eta   || '–';
-  if (pctEl)   pctEl.textContent   = pct + '%';
-  if (sizeEl && t.size) sizeEl.textContent = t.size;
-
-  // If status changed to done/error, refresh whole card to show actions
-  const oldStatus = el.dataset.status;
-  if (oldStatus !== t.status) {
-    el.outerHTML = buildCard(t);
-  } else {
-    el.dataset.status = t.status;
+function renderHistory() {
+  const hist = allTasks.filter(t => t.status !== 'downloading' && t.status !== 'queued');
+  document.getElementById('hist-count').textContent = hist.length;
+  const container = document.getElementById('history-list');
+  if (!hist.length) {
+    container.innerHTML = '<div class="empty"><div class="empty-icon">📂</div>No download history</div>';
+    return;
   }
-}
-
-function buildCard(t) {
-  const badgeClass = {downloading:'badge-downloading',done:'badge-done',error:'badge-error',interrupted:'badge-interrupted',queued:'badge-queued'}[t.status] || 'badge-queued';
-  const badgeLabel = {downloading:'DOWNLOADING',done:'DONE',error:'ERROR',interrupted:'INTERRUPTED',queued:'QUEUED'}[t.status] || t.status.toUpperCase();
-  const fillClass  = {downloading:'downloading',done:'done',error:'error',interrupted:'interrupted'}[t.status] || '';
-  const pct = t.status === 'done' ? 100 : (t.progress || 0);
-  const shortUrl = t.url.length > 60 ? t.url.slice(0,57) + '…' : t.url;
+  container.innerHTML = hist.map(t => buildCard(t, false)).join('');
+}
+
+function buildCard(t, isActive) {
+  const badgeClass = {
+    downloading: 'badge-downloading',
+    done: 'badge-done',
+    error: 'badge-error',
+    interrupted: 'badge-interrupted',
+    queued: 'badge-queued',
+  }[t.status] || 'badge-queued';
+
+  const badgeLabel = {
+    downloading: 'DOWNLOADING',
+    done: 'DONE',
+    error: 'ERROR',
+    interrupted: 'INTERRUPTED',
+    queued: 'QUEUED',
+  }[t.status] || t.status.toUpperCase();
+
+  const fillClass = {
+    downloading: 'downloading',
+    done: 'done',
+    error: 'error',
+    interrupted: 'interrupted',
+  }[t.status] || '';
+
+  const pct = t.progress || 0;
+  const displayPct = t.status === 'done' ? 100 : pct;
+
+  const shortUrl = t.url.length > 60 ? t.url.slice(0, 57) + '…' : t.url;
 
   let metaHtml = `
-    <span>📦 <span class="val size-val">${t.size || '–'}</span></span>
-    <span class="pct-val pct">${pct}%</span>
+    <span>📦 <span class="val">${t.size || '–'}</span></span>
+    <span class="pct">${displayPct}%</span>
   `;
   if (t.status === 'downloading') {
     metaHtml += `
-      <span>⚡ <span class="val speed-val">${t.speed || 'connecting…'}</span></span>
-      <span>⏱ <span class="val eta-val">${t.eta || '–'}</span></span>
+      <span>⚡ <span class="val">${t.speed || '–'}</span></span>
+      <span>⏱ ETA: <span class="val">${t.eta || '–'}</span></span>
     `;
   }
-  if (t.created_at) metaHtml += `<span class="ts">${t.created_at}</span>`;
+  if (t.created_at) {
+    metaHtml += `<span>${t.created_at}</span>`;
+  }
 
   let actionsHtml = '';
   if (t.status === 'done') {
     actionsHtml = `<a class="btn-sm primary" href="/dl/${t.task_id}" download>⬇ Save File</a>`;
   } else if (t.status === 'error' || t.status === 'interrupted') {
-    actionsHtml = `<button class="btn-sm retry" onclick="retryDownload('${esc(t.url)}')">↺ Retry</button>`;
+    actionsHtml = `<button class="btn-sm retry" onclick="retryDownload('${esc(t.task_id)}','${esc(t.url)}')">↺ Retry</button>`;
+  }
+
+  let errorHtml = '';
+  if (t.error) {
+    errorHtml = `<div class="error-msg">⚠ ${esc(t.error)}</div>`;
   }
 
   return `
-    <div class="dl-card status-${t.status}" id="card-${t.task_id}" data-status="${t.status}">
+    <div class="dl-card status-${t.status}" id="card-${t.task_id}">
       <div class="dl-header">
         <div>
           <div class="dl-filename">${fileIcon(t.filename)} ${esc(t.filename)}</div>
@@ -895,34 +815,38 @@ function buildCard(t) {
         <span class="badge ${badgeClass}">${badgeLabel}</span>
       </div>
       <div class="progress-track">
-        <div class="progress-fill ${fillClass}" style="width:${pct}%"></div>
+        <div class="progress-fill ${fillClass}" style="width:${displayPct}%"></div>
       </div>
       <div class="dl-meta">${metaHtml}</div>
-      ${t.error ? `<div class="error-msg">⚠ ${esc(t.error)}</div>` : ''}
+      ${errorHtml}
       ${actionsHtml ? `<div class="dl-actions">${actionsHtml}</div>` : ''}
-    </div>`;
+    </div>
+  `;
 }
 
-// ── Download action ────────────────────────────────────────────────────────────
+// ── Download ─────────────────────────────────────────────────────────────────
 async function startDownload() {
   const input = document.getElementById('url-input');
-  const btn   = document.getElementById('dl-btn');
-  const url   = input.value.trim();
+  const btn = document.getElementById('dl-btn');
+  const url = input.value.trim();
   if (!url) return;
 
   btn.disabled = true;
   btn.textContent = 'Starting…';
+
   try {
-    const res  = await fetch('/download', {
+    const res = await fetch('/download', {
       method: 'POST',
-      headers: {'Content-Type':'application/json'},
+      headers: {'Content-Type': 'application/json'},
       body: JSON.stringify({url}),
     });
     const data = await res.json();
     if (data.error) { showToast('Error: ' + data.error, true); return; }
+
     input.value = '';
     showToast('Download started!');
-    // SSE will push the new task automatically — no manual refresh needed
+    activePolling.add(data.task_id);
+    await refreshAll();
   } catch(e) {
     showToast('Request failed', true);
   } finally {
@@ -931,19 +855,23 @@ async function startDownload() {
   }
 }
 
-async function retryDownload(url) {
-  document.getElementById('url-input').value = url;
+async function retryDownload(taskId, url) {
+  showToast('Retrying…');
+  // Reuse startDownload logic via POST
+  const input = document.getElementById('url-input');
+  input.value = url;
   await startDownload();
 }
 
+// ── Utils ─────────────────────────────────────────────────────────────────────
 document.getElementById('url-input').addEventListener('keydown', e => {
   if (e.key === 'Enter') startDownload();
 });
 
-// ── Utilities ─────────────────────────────────────────────────────────────────
 function esc(str) {
   return String(str||'').replace(/&/g,'&amp;').replace(/</g,'&lt;').replace(/>/g,'&gt;').replace(/"/g,'&quot;');
 }
+
 function fileIcon(name) {
   const ext = (name||'').split('.').pop().toLowerCase();
   if (['mp4','mkv','avi','mov','webm'].includes(ext)) return '🎬';
@@ -955,13 +883,19 @@ function fileIcon(name) {
   if (['py','js','ts','html','css','json','sh'].includes(ext)) return '💻';
   return '📁';
 }
-function showToast(msg, isErr=false) {
+
+function showToast(msg, isErr = false) {
   const t = document.createElement('div');
   t.className = 'toast' + (isErr ? ' err' : '');
   t.textContent = msg;
   document.body.appendChild(t);
   setTimeout(() => t.remove(), 3500);
 }
+
+// Immediately poll if tab becomes visible again
+document.addEventListener('visibilitychange', () => {
+  if (!document.hidden) refreshAll();
+});
 </script>
 </body>
 </html>"""