UI: uniform background + add Paste Text mode; API: accept text & strip <think>

app.py

@@ -1,262 +1,3 @@
-# #!/usr/bin/env python3
-# """
-# Flask Web Application for Article Summarizer with TTS
-# """
-
-# from flask import Flask, render_template, request, jsonify, send_file, url_for
-# import os
-# import sys
-# import torch
-# import trafilatura
-# import soundfile as sf
-# import time
-# import threading
-# from datetime import datetime
-# from transformers import AutoModelForCausalLM, AutoTokenizer
-# from kokoro import KPipeline
-# import logging
-
-# # Configure logging
-# logging.basicConfig(level=logging.INFO)
-# logger = logging.getLogger(__name__)
-
-# app = Flask(__name__)
-# app.config['SECRET_KEY'] = 'your-secret-key-here'
-
-# # Global variables to store models (load once, use many times)
-# qwen_model = None
-# qwen_tokenizer = None
-# kokoro_pipeline = None
-# model_loading_status = {"loaded": False, "error": None}
-
-# # Create directories for generated files
-# os.makedirs("static/audio", exist_ok=True)
-# os.makedirs("static/summaries", exist_ok=True)
-
-# def load_models():
-#     """Load Qwen and Kokoro models on startup"""
-#     global qwen_model, qwen_tokenizer, kokoro_pipeline, model_loading_status
-    
-#     try:
-#         logger.info("Loading Qwen3-0.6B model...")
-#         model_name = "Qwen/Qwen3-0.6B"
-        
-#         qwen_tokenizer = AutoTokenizer.from_pretrained(model_name)
-#         qwen_model = AutoModelForCausalLM.from_pretrained(
-#             model_name,
-#             torch_dtype="auto",
-#             device_map="auto"
-#         )
-        
-#         logger.info("Loading Kokoro TTS model...")
-#         kokoro_pipeline = KPipeline(lang_code='a')
-        
-#         model_loading_status["loaded"] = True
-#         logger.info("All models loaded successfully!")
-        
-#     except Exception as e:
-#         model_loading_status["error"] = str(e)
-#         logger.error(f"Failed to load models: {e}")
-
-# def scrape_article_text(url: str) -> tuple[str, str]:
-#     """
-#     Scrape article and return (content, error_message)
-#     """
-#     try:
-#         downloaded = trafilatura.fetch_url(url)
-#         if downloaded is None:
-#             return None, "Failed to download the article content."
-        
-#         article_text = trafilatura.extract(downloaded, include_comments=False, include_tables=False)
-#         if article_text:
-#             return article_text, None
-#         else:
-#             return None, "Could not find main article text on the page."
-            
-#     except Exception as e:
-#         return None, f"Error scraping article: {str(e)}"
-
-# def summarize_with_qwen(text: str) -> tuple[str, str]:
-#     """
-#     Generate summary and return (summary, error_message)
-#     """
-#     try:
-#         prompt = f"""
-#         Please provide a concise and clear summary of the following article. 
-#         Focus on the main points, key findings, and conclusions. The summary should be 
-#         easy to understand for someone who has not read the original text.
-
-#         ARTICLE:
-#         {text}
-#         """
-        
-#         messages = [{"role": "user", "content": prompt}]
-        
-#         text_input = qwen_tokenizer.apply_chat_template(
-#             messages,
-#             tokenize=False,
-#             add_generation_prompt=True,
-#             enable_thinking=False 
-#         )
-        
-#         model_inputs = qwen_tokenizer([text_input], return_tensors="pt").to(qwen_model.device)
-        
-#         generated_ids = qwen_model.generate(
-#             **model_inputs,
-#             max_new_tokens=512,
-#             temperature=0.7,
-#             top_p=0.8,
-#             top_k=20
-#         )
-        
-#         output_ids = generated_ids[0][len(model_inputs.input_ids[0]):]
-#         summary = qwen_tokenizer.decode(output_ids, skip_special_tokens=True).strip()
-        
-#         return summary, None
-        
-#     except Exception as e:
-#         return None, f"Error generating summary: {str(e)}"
-
-# def generate_speech(summary: str, voice: str) -> tuple[str, str, float]:
-#     """
-#     Generate speech and return (filename, error_message, duration)
-#     """
-#     try:
-#         generator = kokoro_pipeline(summary, voice=voice)
-        
-#         audio_chunks = []
-#         total_duration = 0
-        
-#         for i, (gs, ps, audio) in enumerate(generator):
-#             audio_chunks.append(audio)
-#             total_duration += len(audio) / 24000
-        
-#         if len(audio_chunks) > 1:
-#             combined_audio = torch.cat(audio_chunks, dim=0)
-#         else:
-#             combined_audio = audio_chunks[0]
-        
-#         # Generate unique filename
-#         timestamp = int(time.time())
-#         filename = f"summary_{timestamp}.wav"
-#         filepath = os.path.join("static", "audio", filename)
-        
-#         sf.write(filepath, combined_audio.numpy(), 24000)
-        
-#         return filename, None, total_duration
-        
-#     except Exception as e:
-#         return None, f"Error generating speech: {str(e)}", 0
-
-# @app.route('/')
-# def index():
-#     """Main page"""
-#     return render_template('index.html')
-
-# @app.route('/status')
-# def status():
-#     """Check if models are loaded"""
-#     return jsonify(model_loading_status)
-
-# @app.route('/process', methods=['POST'])
-# def process_article():
-#     """Process article URL - scrape, summarize, and optionally generate speech"""
-    
-#     if not model_loading_status["loaded"]:
-#         return jsonify({
-#             "success": False,
-#             "error": "Models not loaded yet. Please wait."
-#         })
-    
-#     data = request.get_json()
-#     url = data.get('url', '').strip()
-#     generate_audio = data.get('generate_audio', False)
-#     voice = data.get('voice', 'af_heart')
-    
-#     if not url:
-#         return jsonify({"success": False, "error": "Please provide a valid URL."})
-    
-#     # Step 1: Scrape article
-#     article_content, scrape_error = scrape_article_text(url)
-#     if scrape_error:
-#         return jsonify({"success": False, "error": scrape_error})
-    
-#     # Step 2: Generate summary
-#     summary, summary_error = summarize_with_qwen(article_content)
-#     if summary_error:
-#         return jsonify({"success": False, "error": summary_error})
-    
-#     # Prepare response
-#     response_data = {
-#         "success": True,
-#         "summary": summary,
-#         "article_length": len(article_content),
-#         "summary_length": len(summary),
-#         "compression_ratio": round(len(summary) / len(article_content) * 100, 1),
-#         "timestamp": datetime.now().strftime("%Y-%m-%d %H:%M:%S")
-#     }
-    
-#     # Step 3: Generate speech if requested
-#     if generate_audio:
-#         audio_filename, audio_error, duration = generate_speech(summary, voice)
-#         if audio_error:
-#             response_data["audio_error"] = audio_error
-#         else:
-#             response_data["audio_file"] = f"/static/audio/{audio_filename}"
-#             response_data["audio_duration"] = round(duration, 2)
-    
-#     return jsonify(response_data)
-
-# @app.route('/voices')
-# def get_voices():
-#     """Get available voice options"""
-#     voices = [
-#         {"id": "af_heart", "name": "Female - Heart", "grade": "A", "description": "❤️ Warm female voice (best quality)"},
-#         {"id": "af_bella", "name": "Female - Bella", "grade": "A-", "description": "🔥 Energetic female voice"},
-#         {"id": "af_nicole", "name": "Female - Nicole", "grade": "B-", "description": "🎧 Professional female voice"},
-#         {"id": "am_michael", "name": "Male - Michael", "grade": "C+", "description": "Clear male voice"},
-#         {"id": "am_fenrir", "name": "Male - Fenrir", "grade": "C+", "description": "Strong male voice"},
-#         {"id": "af_sarah", "name": "Female - Sarah", "grade": "C+", "description": "Gentle female voice"},
-#         {"id": "bf_emma", "name": "British Female - Emma", "grade": "B-", "description": "🇬🇧 British accent"},
-#         {"id": "bm_george", "name": "British Male - George", "grade": "C", "description": "🇬🇧 British male voice"}
-#     ]
-#     return jsonify(voices)
-# # Kick off model loading when running under Gunicorn/containers
-# if os.environ.get("RUNNING_GUNICORN", "0") == "1":
-#     threading.Thread(target=load_models, daemon=True).start()
-
-
-# if __name__ == '__main__':
-#     import argparse
-    
-#     # Parse command line arguments
-#     parser = argparse.ArgumentParser(description='AI Article Summarizer Web App')
-#     parser.add_argument('--port', type=int, default=5001, help='Port to run the server on (default: 5001)')
-#     parser.add_argument('--host', type=str, default='0.0.0.0', help='Host to bind to (default: 0.0.0.0)')
-#     args = parser.parse_args()
-    
-#     # Load models in background thread
-#     threading.Thread(target=load_models, daemon=True).start()
-    
-#     # Run Flask app
-#     print("🚀 Starting Article Summarizer Web App...")
-#     print("📚 Models are loading in the background...")
-#     print(f"🌐 Open http://localhost:{args.port} in your browser")
-    
-#     try:
-#         app.run(debug=True, host=args.host, port=args.port)
-#     except OSError as e:
-#         if "Address already in use" in str(e):
-#             print(f"❌ Port {args.port} is already in use!")
-#             print("💡 Try a different port:")
-#             print(f"   python app.py --port {args.port + 1}")
-#             print("📱 Or disable AirPlay Receiver in System Preferences → General → AirDrop & Handoff")
-#         else:
-#             raise
-
-
-
-
 #!/usr/bin/env python3
 """
 Flask Web Application for Article Summarizer with TTS
@@ -269,13 +10,14 @@ import threading
 import logging
 from datetime import datetime
 import re
+from pathlib import Path
 
 import torch
 import trafilatura
 import soundfile as sf
+import requests
 from transformers import AutoModelForCausalLM, AutoTokenizer
 from kokoro import KPipeline
-import requests  # ensure requests>=2.32.0 in requirements.txt
 
 # ---------------- Logging ----------------
 logging.basicConfig(level=logging.INFO)
@@ -310,12 +52,7 @@ BROWSER_HEADERS = {
     "Accept-Language": "en-US,en;q=0.9",
 }
 
-# Create output dirs
-# os.makedirs("static/audio", exist_ok=True)
-# os.makedirs("static/summaries", exist_ok=True)
-
 # Create output dirs (robust, relative to this file)
-from pathlib import Path
 BASE_DIR = Path(__file__).parent.resolve()
 STATIC_DIR = BASE_DIR / "static"
 AUDIO_DIR = STATIC_DIR / "audio"
@@ -327,7 +64,6 @@ for p in (AUDIO_DIR, SUMM_DIR):
     except PermissionError:
         logger.warning("No permission to create %s (will rely on image pre-created dirs).", p)
 
-
 # ---------------- Helpers ----------------
 def _get_device():
     # Works for both CPU/GPU; safer than qwen_model.device
@@ -350,8 +86,7 @@ _THINK_TAGS_RE = re.compile(r"</?\s*(think|reasoning|thought)\b[^>]*>", re.IGNOR
 def _strip_reasoning(text: str) -> str:
     cleaned = _THINK_BLOCK_RE.sub("", text)          # remove full blocks
     cleaned = _THINK_TAGS_RE.sub("", cleaned)        # remove any stray tags
-    # optionally collapse leftover triple-backtick blocks that only had think text
-    cleaned = re.sub(r"```(?:\w+)?\s*```", "", cleaned)
+    cleaned = re.sub(r"```(?:\w+)?\s*```", "", cleaned)  # collapse empty fenced blocks
     return cleaned.strip()
 
 def _normalize_url_for_proxy(u: str) -> str:
@@ -359,6 +94,17 @@ def _normalize_url_for_proxy(u: str) -> str:
     u2 = u.replace("https://", "").replace("http://", "")
     return f"https://r.jina.ai/http://{u2}"
 
+def _maybe_extract_from_html(pasted: str) -> str:
+    """If the pasted text looks like HTML, try to extract the main text via trafilatura."""
+    looks_html = bool(re.search(r"</?(html|div|p|article|section|span|body|h1|h2)\b", pasted, re.I))
+    if not looks_html:
+        return pasted
+    try:
+        extracted = trafilatura.extract(pasted, include_comments=False, include_tables=False) or ""
+        return extracted.strip() or pasted
+    except Exception:
+        return pasted
+
 # ---------------- Model Load ----------------
 def load_models():
     """Load Qwen and Kokoro models on startup (idempotent)."""
@@ -427,7 +173,7 @@ def scrape_article_text(url: str) -> tuple[str | None, str | None]:
             try:
                 pr = requests.get(proxy_url, headers=BROWSER_HEADERS, timeout=15)
                 if pr.status_code == 200 and pr.text:
-                    extracted = trafilatura.extract(pr.text) or pr.text
+                    extracted = trafilatura.extract(pr.text, include_comments=False, include_tables=False) or pr.text
                     if extracted and extracted.strip():
                         return extracted.strip(), None
             except requests.RequestException as e:
@@ -470,7 +216,7 @@ def summarize_with_qwen(text: str) -> tuple[str | None, str | None]:
                     "Do not include analysis, steps, or <think> tags."
                 ),
             },
-            {"role": "user", "content": user_content},  # <-- important: pass the TRIMMED content
+            {"role": "user", "content": user_content},
         ]
 
         # Build the chat prompt text (disable thinking if supported)
@@ -524,8 +270,8 @@ def generate_speech(summary: str, voice: str) -> tuple[str | None, str | None, f
 
         ts = int(time.time())
         filename = f"summary_{ts}.wav"
-        filepath = os.path.join("static", "audio", filename)
-        sf.write(filepath, combined.numpy(), 24000)
+        filepath = AUDIO_DIR / filename
+        sf.write(str(filepath), combined.numpy(), 24000)
 
         return filename, None, total_duration
     except Exception as e:
@@ -546,15 +292,23 @@ def process_article():
         return jsonify({"success": False, "error": "Models not loaded yet. Please wait."})
 
     data = request.get_json(force=True, silent=True) or {}
+
+    # New: accept raw pasted text
+    pasted_text = (data.get("text") or "").strip()
     url = (data.get("url") or "").strip()
     generate_audio = bool(data.get("generate_audio", False))
     voice = (data.get("voice") or "af_heart").strip()
 
-    if not url:
-        return jsonify({"success": False, "error": "Please provide a valid URL."})
+    if not pasted_text and not url:
+        return jsonify({"success": False, "error": "Please paste text or provide a valid URL."})
+
+    # 1) Resolve content: prefer pasted text if provided
+    if pasted_text:
+        article_content = _maybe_extract_from_html(pasted_text)
+        scrape_error = None
+    else:
+        article_content, scrape_error = scrape_article_text(url)
 
-    # 1) Scrape
-    article_content, scrape_error = scrape_article_text(url)
     if scrape_error:
         return jsonify({"success": False, "error": scrape_error})
 
@@ -612,7 +366,7 @@ if __name__ == "__main__":
     # Load models in background thread
     threading.Thread(target=load_models, daemon=True).start()
 
-    # Respect platform env PORT when present
+    # Respect platform env PORT when present (HF Spaces: 7860)
     port = int(os.environ.get("PORT", args.port))
 
     print("🚀 Starting Article Summarizer Web App…")

templates/index.html

@@ -9,232 +9,133 @@
   <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&display=swap" rel="stylesheet" />
   <style>
     :root{
-      --bg-0:#0b0f17;
-      --bg-1:#0f1624;
-      --bg-2:#121a2b;
+      --bg-0:#0b0f17; --bg-1:#0f1624; --bg-2:#121a2b;
       --glass: rgba(255,255,255,.04);
-      --muted: #9aa4bf;
-      --text: #e7ecf8;
-      --accent-1:#6d6aff;
-      --accent-2:#7b5cff;
-      --accent-3:#00d4ff;
-      --ok:#21d19f;
-      --warn:#ffb84d;
-      --err:#ff6b6b;
+      --muted: #9aa4bf; --text: #e7ecf8;
+      --accent-1:#6d6aff; --accent-2:#7b5cff; --accent-3:#00d4ff;
+      --ok:#21d19f; --warn:#ffb84d; --err:#ff6b6b;
       --ring: 0 0 0 1px rgba(255,255,255,.07), 0 0 0 6px rgba(124, 58, 237, .12);
       --shadow: 0 20px 60px rgba(0,0,0,.45), 0 8px 20px rgba(0,0,0,.35);
-      --radius-xl:22px;
-      --radius-lg:16px;
-      --radius-md:12px;
-      --radius-sm:10px;
-      --grad: conic-gradient(from 220deg at 50% 50%, var(--accent-1), var(--accent-2), var(--accent-3), var(--accent-1));
+      --radius-xl:22px; --radius-lg:16px; --radius-md:12px; --radius-sm:10px;
     }
     *{box-sizing:border-box}
     html,body{height:100%}
     body{
       margin:0;
-      font-family:Inter, system-ui, -apple-system, Segoe UI, Roboto, Ubuntu, Cantarell, Noto Sans, Helvetica, Arial, "Apple Color Emoji", "Segoe UI Emoji";
+      font-family:Inter, system-ui, -apple-system, Segoe UI, Roboto, Ubuntu, Cantarell, Noto Sans, Helvetica, Arial;
       color:var(--text);
+      /* smoothed background (no mid-page band) */
       background:
-        radial-gradient(1200px 600px at -10% -10%, rgba(109,106,255,.20), transparent 50%),
-        radial-gradient(900px 500px at 120% -10%, rgba(0,212,255,.16), transparent 55%),
-        radial-gradient(1200px 900px at 50% 120%, rgba(123,92,255,.18), transparent 60%),
-        linear-gradient(180deg, var(--bg-0), var(--bg-1) 50%, var(--bg-2));
+        radial-gradient(1200px 600px at -10% -10%, rgba(109,106,255,.18), transparent 52%),
+        radial-gradient(900px 500px at 120% -10%, rgba(0,212,255,.14), transparent 56%),
+        radial-gradient(1200px 900px at 50% 120%, rgba(123,92,255,.14), transparent 62%),
+        linear-gradient(180deg, var(--bg-0) 0%, var(--bg-1) 38%, var(--bg-2) 100%);
+      background-attachment: fixed, fixed, fixed, fixed;
       overflow-y:auto;
     }
 
-    /* Top progress bar */
-    .bar{
-      position:fixed; inset:0 0 auto 0; height:3px; z-index:9999;
+    .bar{position:fixed; inset:0 0 auto 0; height:3px; z-index:9999;
       background: linear-gradient(90deg, var(--accent-3), var(--accent-2), var(--accent-1));
-      background-size:200% 100%;
-      transform:scaleX(0); transform-origin:left;
-      box-shadow:0 0 18px rgba(0,212,255,.45);
-      transition:transform .2s ease-out;
+      background-size:200% 100%; transform:scaleX(0); transform-origin:left;
+      box-shadow:0 0 18px rgba(0,212,255,.45); transition:transform .2s ease-out;
       animation:bar-move 2.2s linear infinite;
     }
     @keyframes bar-move{0%{background-position:0 0}100%{background-position:200% 0}}
-
-    .wrap{
-      max-width:1080px; margin:72px auto; padding:0 24px;
-    }
-    .hero{
-      display:flex; flex-direction:column; align-items:center; gap:14px; margin-bottom:28px; text-align:center;
-    }
-    .hero-badge{
-      display:inline-flex; align-items:center; gap:10px; padding:8px 12px; border-radius:999px;
+    .wrap{max-width:1080px; margin:72px auto; padding:0 24px}
+    .hero{display:flex; flex-direction:column; align-items:center; gap:14px; margin-bottom:28px; text-align:center}
+    .hero-badge{display:inline-flex; align-items:center; gap:10px; padding:8px 12px; border-radius:999px;
       background:linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.02));
-      border:1px solid rgba(255,255,255,.08);
-      backdrop-filter: blur(8px);
-      box-shadow: var(--shadow);
-    }
+      border:1px solid rgba(255,255,255,.08); backdrop-filter: blur(8px); box-shadow: var(--shadow)}
     .dot{width:8px;height:8px;border-radius:50%; background:var(--warn); box-shadow:0 0 0 6px rgba(255,184,77,.14)}
     .dot.ready{background:var(--ok); box-shadow:0 0 0 6px rgba(33,209,159,.14)}
     .hero h1{font-size: clamp(28px, 5vw, 44px); margin:0; font-weight:800; letter-spacing:-.02em; line-height:1.05}
-    .grad-text{
-      background: linear-gradient(92deg, #f0f3ff, #bfc8ff 30%, #9ad8ff 60%, #c2b5ff 90%);
-      -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent;
-    }
+    .grad-text{background: linear-gradient(92deg, #f0f3ff, #bfc8ff 30%, #9ad8ff 60%, #c2b5ff 90%);
+      -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent}
     .hero p{margin:0; color:var(--muted); font-size:15.5px}
 
+    /* uniform glass surface on the card */
     .panel{
-      position:relative;
-      background:linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.03));
-      border:1px solid rgba(255,255,255,.08);
-      border-radius: var(--radius-xl);
-      padding:24px;
-      box-shadow: var(--shadow);
-      overflow:hidden;
+      position:relative; background:rgba(255,255,255,.04);
+      border:1px solid rgba(255,255,255,.08); border-radius: var(--radius-xl);
+      padding:24px; box-shadow: var(--shadow); overflow:hidden
     }
-    .panel::before{
-      content:"";
-      position:absolute; inset:-1px;
-      border-radius:inherit;
-      padding:1px;
+    .panel::before{content:""; position:absolute; inset:-1px; border-radius:inherit; padding:1px;
       background:linear-gradient(180deg, rgba(175,134,255,.35) 0%, rgba(0,212,255,.18) 100%);
       -webkit-mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
-      -webkit-mask-composite:xor; mask-composite: exclude;
-      pointer-events:none;
-    }
-
-    .form-grid{display:grid; grid-template-columns:1fr auto; gap:12px; align-items:center}
-    .input{
-      width:100%;
-      background:rgba(0,0,0,.35);
-      border:1px solid rgba(255,255,255,.12);
-      border-radius:var(--radius-lg);
-      padding:14px 16px;
-      color:var(--text);
-      font-size:15.5px;
-      outline:none;
+      -webkit-mask-composite:xor; mask-composite: exclude; pointer-events:none; opacity:.85}
+
+    .seg{display:inline-flex; padding:6px; background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.09);
+      border-radius:999px; gap:6px}
+    .seg button{border:0; border-radius:999px; padding:10px 14px; color:var(--text);
+      background:transparent; cursor:pointer; font-weight:700; font-size:14px}
+    .seg button.active{background:linear-gradient(135deg, #7b5cff 0%, #00d4ff 100%); color:#0b0f17}
+
+    .grid{display:grid; grid-template-columns:1fr auto; gap:12px; align-items:center}
+    .input, .textarea{
+      width:100%; background:rgba(0,0,0,.35); border:1px solid rgba(255,255,255,.12);
+      border-radius:16px; padding:14px 16px; color:var(--text); font-size:15.5px; outline:none;
       transition:border .2s ease, box-shadow .2s ease, background .2s ease;
     }
-    .input::placeholder{color:#7f8aad}
-    .input:focus{border-color:rgba(0,212,255,.55); box-shadow: var(--ring)}
-
-    .btn{
-      position:relative;
-      display:inline-flex; align-items:center; justify-content:center; gap:10px;
-      padding:14px 18px;
-      border-radius:var(--radius-lg);
-      border:1px solid rgba(255,255,255,.12);
+    .input::placeholder, .textarea::placeholder{color:#7f8aad}
+    .input:focus, .textarea:focus{border-color:rgba(0,212,255,.55); box-shadow: var(--ring)}
+    .textarea{min-height:160px; resize:vertical}
+    .hint{color:var(--muted); font-size:12.5px; margin-top:6px}
+
+    .btn{position:relative; display:inline-flex; align-items:center; justify-content:center; gap:10px;
+      padding:14px 18px; border-radius:16px; border:1px solid rgba(255,255,255,.12);
       color:#0b0f17; font-weight:700; letter-spacing:.02em;
       background: linear-gradient(135deg, #7b5cff 0%, #00d4ff 100%);
       box-shadow: 0 10px 30px rgba(0,212,255,.35), inset 0 1px 0 rgba(255,255,255,.15);
-      cursor:pointer; user-select:none;
-      transition: transform .08s ease, filter .15s ease, box-shadow .2s ease, opacity .2s ease;
-    }
+      cursor:pointer; user-select:none; transition: transform .08s ease, filter .15s ease, box-shadow .2s ease, opacity .2s ease}
     .btn:hover{transform: translateY(-1px)}
     .btn:active{transform: translateY(0)}
     .btn:disabled{opacity:.55; cursor:not-allowed; filter:grayscale(.2)}
 
     .row{display:flex; flex-wrap:wrap; gap:12px; align-items:center; margin-top:14px}
-
-    /* Switch */
-    .switch{
-      display:inline-flex; align-items:center; gap:12px; cursor:pointer; user-select:none;
-      padding:10px 12px; border-radius:999px; background:rgba(255,255,255,.04); border:1px solid rgba(255,255,255,.08);
-    }
-    .switch .track{
-      width:44px; height:24px; background:rgba(255,255,255,.12); border-radius:999px; position:relative; transition: background .2s ease;
-    }
-    .switch .thumb{
-      width:18px; height:18px; border-radius:50%; background:white; position:absolute; top:3px; left:3px;
-      box-shadow:0 4px 16px rgba(0,0,0,.45);
-      transition:left .18s ease, background .2s ease, transform .18s ease;
-    }
+    .switch{display:inline-flex; align-items:center; gap:12px; cursor:pointer; user-select:none;
+      padding:10px 12px; border-radius:999px; background:rgba(255,255,255,.04); border:1px solid rgba(255,255,255,.08)}
+    .switch .track{width:44px; height:24px; background:rgba(255,255,255,.12); border-radius:999px; position:relative; transition: background .2s ease}
+    .switch .thumb{width:18px; height:18px; border-radius:50%; background:white; position:absolute; top:3px; left:3px;
+      box-shadow:0 4px 16px rgba(0,0,0,.45); transition:left .18s ease, background .2s ease, transform .18s ease}
     .switch input{display:none}
     .switch input:checked + .track{background:linear-gradient(90deg, #00d4ff, #7b5cff)}
     .switch input:checked + .track .thumb{left:23px; background:#0b0f17; transform:scale(1.05)}
 
-    /* Collapsible voice panel */
-    .collapse{
-      overflow:hidden; max-height:0; opacity:0; transform: translateY(-4px);
-      transition:max-height .35s ease, opacity .25s ease, transform .25s ease;
-    }
+    .collapse{overflow:hidden; max-height:0; opacity:0; transform: translateY(-4px); transition:max-height .35s ease, opacity .25s ease, transform .25s ease}
     .collapse.open{max-height:520px; opacity:1; transform:none}
 
-    .voices{
-      display:grid; gap:12px; margin-top:12px;
-      grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
-    }
-    .voice{
-      position:relative; padding:14px; border-radius:var(--radius-md);
-      background:rgba(255,255,255,.03); border:1px solid rgba(255,255,255,.08);
-      transition: transform .12s ease, box-shadow .2s ease, border .2s ease, background .2s ease;
-      cursor:pointer;
-    }
+    .voices{display:grid; gap:12px; margin-top:12px; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr))}
+    .voice{position:relative; padding:14px; border-radius:12px; background:rgba(255,255,255,.03);
+      border:1px solid rgba(255,255,255,.08); transition: transform .12s ease, box-shadow .2s ease, border .2s ease, background .2s ease; cursor:pointer}
     .voice:hover{transform: translateY(-2px); box-shadow: var(--shadow); border-color: rgba(0,212,255,.25)}
     .voice.selected{background:linear-gradient(180deg, rgba(0,212,255,.08), rgba(123,92,255,.08)); border-color: rgba(123,92,255,.55)}
     .voice .name{font-weight:700; letter-spacing:.01em}
     .voice .meta{color:var(--muted); font-size:12.5px; margin-top:6px; display:flex; gap:10px; align-items:center}
-    .voice .badge{
-      font-size:11px; padding:3px 8px; border-radius:999px; border:1px solid rgba(255,255,255,.14);
-      background:rgba(255,255,255,.05);
-    }
+    .voice .badge{font-size:11px; padding:3px 8px; border-radius:999px; border:1px solid rgba(255,255,255,.14); background:rgba(255,255,255,.05)}
 
-    /* Results */
     .results{margin-top:18px}
     .chips{display:flex; flex-wrap:wrap; gap:10px}
-    .chip{
-      font-size:12.5px; color:#cdd6f6;
-      padding:8px 12px; border-radius:999px; border:1px solid rgba(255,255,255,.08); background:rgba(255,255,255,.03);
-    }
-    .toolbar{
-      display:flex; gap:10px; flex-wrap:wrap; margin-top:12px
-    }
-    .tbtn{
-      display:inline-flex; align-items:center; gap:8px; padding:8px 12px; border-radius:10px;
-      background:rgba(255,255,255,.04); border:1px solid rgba(255,255,255,.1); color:var(--text);
-      cursor:pointer; font-size:13px; transition: background .15s ease, transform .08s ease;
-    }
-    .tbtn:hover{background:rgba(255,255,255,.08)}
-    .tbtn:active{transform: translateY(1px)}
-
-    .summary{
-      margin-top:14px;
-      background:rgba(0,0,0,.35);
-      border:1px solid rgba(255,255,255,.1);
-      border-radius:var(--radius-lg);
-      padding:18px;
-      line-height:1.7;
-      font-size:15.5px;
-      white-space:pre-wrap;
-      min-height:120px;
-    }
-
-    /* Skeleton */
-    .skeleton{
-      position:relative; overflow:hidden; background:rgba(255,255,255,.06); border-radius:10px;
-    }
-    .skeleton::after{
-      content:""; position:absolute; inset:0;
-      background:linear-gradient(100deg, transparent, rgba(255,255,255,.10), transparent);
-      transform:translateX(-100%); animation:shine 1.2s infinite;
-    }
+    .chip{font-size:12.5px; color:#cdd6f6; padding:8px 12px; border-radius:999px; border:1px solid rgba(255,255,255,.08); background:rgba(255,255,255,.03)}
+    .toolbar{display:flex; gap:10px; flex-wrap:wrap; margin-top:12px}
+    .tbtn{display:inline-flex; align-items:center; gap:8px; padding:8px 12px; border-radius:10px; background:rgba(255,255,255,.04);
+      border:1px solid rgba(255,255,255,.1); color:var(--text); cursor:pointer; font-size:13px; transition: background .15s ease, transform .08s ease}
+    .tbtn:hover{background:rgba(255,255,255,.08)} .tbtn:active{transform: translateY(1px)}
+
+    .summary{margin-top:14px; background:rgba(0,0,0,.35); border:1px solid rgba(255,255,255,.1); border-radius:16px; padding:18px; line-height:1.7; font-size:15.5px; white-space:pre-wrap; min-height:120px}
+    .skeleton{position:relative; overflow:hidden; background:rgba(255,255,255,.06); border-radius:10px}
+    .skeleton::after{content:""; position:absolute; inset:0; background:linear-gradient(100deg, transparent, rgba(255,255,255,.10), transparent);
+      transform:translateX(-100%); animation:shine 1.2s infinite}
     @keyframes shine{to{transform:translateX(100%)}}
 
-    /* Messages */
-    .msg{
-      margin-top:14px; padding:12px 14px; border-radius:12px; border:1px solid rgba(255,255,255,.08);
-      display:none; font-size:14px;
-    }
+    .msg{margin-top:14px; padding:12px 14px; border-radius:12px; border:1px solid rgba(255,255,255,.08); display:none; font-size:14px}
     .msg.err{display:block; color:#ffd8d8; background:rgba(255,107,107,.08)}
     .msg.ok{display:block; color:#d9fff4; background:rgba(33,209,159,.08)}
-
-    /* Audio card */
-    .audio{
-      margin-top:14px; padding:16px;
-      background:rgba(255,255,255,.03);
-      border:1px solid rgba(255,255,255,.08); border-radius:var(--radius-lg);
-    }
+    .audio{margin-top:14px; padding:16px; background:rgba(255,255,255,.03); border:1px solid rgba(255,255,255,.08); border-radius:16px}
     audio{width:100%; height:40px; outline:none}
-
-    /* Footer note */
     .foot{margin-top:14px; text-align:center; color:#7f8aad; font-size:12.5px}
 
     @media (max-width:720px){
-      .form-grid{grid-template-columns: 1fr}
+      .grid{grid-template-columns:1fr}
       .btn{width:100%}
     }
   </style>
@@ -253,13 +154,29 @@
     </header>
 
     <section class="panel">
+      <!-- Mode switch -->
+      <div class="row" style="justify-content:center; margin-bottom:12px">
+        <div class="seg" role="tablist" aria-label="Input mode">
+          <button id="modeUrlBtn" class="active" role="tab" aria-selected="true">URL</button>
+          <button id="modeTextBtn" role="tab" aria-selected="false">Paste Text</button>
+        </div>
+      </div>
+
       <form id="summarizerForm" autocomplete="on">
-        <div class="form-grid">
+        <!-- URL mode -->
+        <div id="urlMode" class="grid">
           <input id="articleUrl" class="input" type="url" inputmode="url"
-                 placeholder="Paste an article URL (https://…)" required />
-          <button id="submitBtn" class="btn" type="submit">
-            ✨ Summarize
-          </button>
+                 placeholder="Paste an article URL (https://…)" />
+          <button id="submitBtn" class="btn" type="submit">✨ Summarize</button>
+        </div>
+
+        <!-- Text mode -->
+        <div id="textMode" style="display:none; margin-top:12px">
+          <textarea id="articleText" class="textarea" placeholder="Paste the article text here…"></textarea>
+          <div class="hint"><span id="charCount">0</span> characters</div>
+          <div style="margin-top:12px">
+            <button id="submitBtnText" class="btn" type="submit">✨ Summarize Text</button>
+          </div>
         </div>
 
         <div class="row">
@@ -274,9 +191,7 @@
         </div>
 
         <div id="voiceSection" class="collapse" aria-hidden="true">
-          <div class="voices" id="voiceGrid">
-            <!-- Injected -->
-          </div>
+          <div class="voices" id="voiceGrid"></div>
         </div>
       </form>
 
@@ -321,12 +236,11 @@
     let modelsReady = false;
     let selectedVoice = localStorage.getItem("voiceId") || "af_heart";
     const bar = document.getElementById("bar");
+    let inputMode = "url"; // "url" | "text"
 
     // --------------- Utilities --------------
     const $ = (sel) => document.querySelector(sel);
-    function showBar(active) {
-      bar.style.transform = active ? "scaleX(1)" : "scaleX(0)";
-    }
+    function showBar(active) { bar.style.transform = active ? "scaleX(1)" : "scaleX(0)"; }
     function setStatus(ready, error){
       const dot = $("#statusDot");
       const text = $("#statusText");
@@ -337,13 +251,8 @@
         badge.style.borderColor = "rgba(255,107,107,.45)";
         return;
       }
-      if (ready){
-        dot.classList.add("ready");
-        text.textContent = "Models ready";
-      } else {
-        dot.classList.remove("ready");
-        text.textContent = "Loading AI models…";
-      }
+      if (ready){ dot.classList.add("ready"); text.textContent = "Models ready"; }
+      else { dot.classList.remove("ready"); text.textContent = "Loading AI models…"; }
     }
     function chip(text){ const span = document.createElement("span"); span.className="chip"; span.textContent=text; return span; }
     function fmt(x){ return new Intl.NumberFormat().format(x); }
@@ -387,9 +296,7 @@
           });
           grid.appendChild(el);
         });
-      }catch(e){
-        // ignore
-      }
+      }catch(e){ /* ignore */ }
     }
 
     // ------------- Collapsible voices --------
@@ -402,6 +309,33 @@
     generateAudio.addEventListener("change", e=> toggleVoices(e.target.checked));
     toggleVoices(generateAudio.checked); // on load
 
+    // ------------- Mode switching ------------
+    const urlMode = $("#urlMode");
+    const textMode = $("#textMode");
+    const modeUrlBtn = $("#modeUrlBtn");
+    const modeTextBtn = $("#modeTextBtn");
+    const urlInput = $("#articleUrl");
+    const textArea = $("#articleText");
+    const charCount = $("#charCount");
+
+    function setMode(m){
+      inputMode = m;
+      if (m === "url"){
+        urlMode.style.display = "grid";
+        textMode.style.display = "none";
+        modeUrlBtn.classList.add("active");
+        modeTextBtn.classList.remove("active");
+      } else {
+        urlMode.style.display = "none";
+        textMode.style.display = "block";
+        modeTextBtn.classList.add("active");
+        modeUrlBtn.classList.remove("active");
+      }
+    }
+    modeUrlBtn.addEventListener("click", ()=> setMode("url"));
+    modeTextBtn.addEventListener("click", ()=> setMode("text"));
+    textArea.addEventListener("input", ()=> { charCount.textContent = (textArea.value || "").length; });
+
     // ------------- Form submit ----------------
     const form = $("#summarizerForm");
     const loading = $("#loadingSection");
@@ -409,7 +343,7 @@
     const errorBox = $("#errorMessage");
     const okBox = $("#successMessage");
     const submitBtn = $("#submitBtn");
-    const urlInput = $("#articleUrl");
+    const submitBtnText = $("#submitBtnText");
 
     form.addEventListener("submit", async (e)=>{
       e.preventDefault();
@@ -420,10 +354,29 @@
         errorBox.style.display = "block";
         return;
       }
-      const url = urlInput.value.trim();
-      if (!url){ return; }
 
-      submitBtn.disabled = true;
+      const url = (urlInput.value || "").trim();
+      const text = (textArea.value || "").trim();
+
+      if (!text && !url){
+        errorBox.textContent = "Please paste text or provide a valid URL.";
+        errorBox.style.display = "block";
+        return;
+      }
+
+      if (inputMode === "url" && !url){
+        errorBox.textContent = "Please provide a valid URL or switch to Paste Text.";
+        errorBox.style.display = "block";
+        return;
+      }
+      if (inputMode === "text" && !text){
+        errorBox.textContent = "Please paste the article text or switch to URL.";
+        errorBox.style.display = "block";
+        return;
+      }
+
+      if (submitBtn) submitBtn.disabled = true;
+      if (submitBtnText) submitBtnText.disabled = true;
       showBar(true);
       loading.style.display = "block";
       result.style.display = "none";
@@ -433,7 +386,7 @@
           method: "POST",
           headers: {"Content-Type":"application/json"},
           body: JSON.stringify({
-            url,
+            url, text,
             generate_audio: generateAudio.checked,
             voice: selectedVoice
           })
@@ -441,7 +394,8 @@
         const data = await res.json();
 
         loading.style.display = "none";
-        submitBtn.disabled = false;
+        if (submitBtn) submitBtn.disabled = false;
+        if (submitBtnText) submitBtnText.disabled = false;
         showBar(false);
 
         if (!data.success){
@@ -456,7 +410,8 @@
 
       }catch(err){
         loading.style.display="none";
-        submitBtn.disabled=false;
+        if (submitBtn) submitBtn.disabled = false;
+        if (submitBtnText) submitBtnText.disabled = false;
         showBar(false);
         errorBox.textContent = "Network error: " + (err?.message || err);
         errorBox.style.display = "block";
@@ -473,17 +428,14 @@
     const copyBtn = $("#copyBtn");
 
     function renderResult(r){
-      // Stats
       stats.innerHTML = "";
       stats.appendChild(chip(`📄 ${fmt(r.article_length)} → ${fmt(r.summary_length)} chars`));
       stats.appendChild(chip(`📉 ${r.compression_ratio}% compression`));
       stats.appendChild(chip(`🕒 ${r.timestamp}`));
 
-      // Summary
       summaryEl.textContent = r.summary || "";
       result.style.display = "block";
 
-      // Audio
       if (r.audio_file){
         audioEl.src = r.audio_file;
         audioWrap.style.display = "block";
@@ -503,15 +455,12 @@
         await navigator.clipboard.writeText(summaryEl.textContent || "");
         copyBtn.textContent = "✅ Copied";
         setTimeout(()=> copyBtn.textContent = "📋 Copy summary", 900);
-      }catch(e){
-        // ignore
-      }
+      }catch(e){ /* ignore */ }
     });
 
-    // ------------- Quality of life -------------
-    // Paste on Cmd/Ctrl+V if input empty
+    // ------------- QoL -------------
     window.addEventListener("paste", (e)=>{
-      if(document.activeElement !== urlInput && !urlInput.value){
+      if (inputMode === "url" && document.activeElement !== urlInput && !urlInput.value){
         const t = (e.clipboardData || window.clipboardData).getData("text");
         if (t?.startsWith("http")){ urlInput.value = t; }
       }
@@ -520,8 +469,9 @@
     // Init
     document.addEventListener("DOMContentLoaded", ()=>{
       checkModelStatus();
-      // Restore voice toggle state hint
       if (localStorage.getItem("voiceId")) selectedVoice = localStorage.getItem("voiceId");
+      setMode("url"); // default
+      charCount.textContent = "0";
     });
   </script>
 </body>

test.py

@@ -0,0 +1,385 @@
+#!/usr/bin/env python3
+"""
+Flask Web Application for Article Summarizer with TTS
+"""
+
+from flask import Flask, render_template, request, jsonify
+import os
+import time
+import threading
+import logging
+from datetime import datetime
+import re
+from pathlib import Path
+
+import torch
+import trafilatura
+import soundfile as sf
+import requests
+from transformers import AutoModelForCausalLM, AutoTokenizer
+from kokoro import KPipeline
+
+# ---------------- Logging ----------------
+logging.basicConfig(level=logging.INFO)
+logger = logging.getLogger("summarizer")
+
+# ---------------- Flask ----------------
+app = Flask(__name__)
+app.config["SECRET_KEY"] = os.environ.get("SECRET_KEY", "change-me")
+
+# ---------------- Globals ----------------
+qwen_model = None
+qwen_tokenizer = None
+kokoro_pipeline = None
+
+model_loading_status = {"loaded": False, "error": None}
+_load_lock = threading.Lock()
+_loaded_once = False  # idempotence guard across threads
+
+# Voice whitelist
+ALLOWED_VOICES = {
+    "af_heart", "af_bella", "af_nicole", "am_michael",
+    "am_fenrir", "af_sarah", "bf_emma", "bm_george"
+}
+
+# HTTP headers to look like a real browser for sites that block bots
+BROWSER_HEADERS = {
+    "User-Agent": (
+        "Mozilla/5.0 (Macintosh; Intel Mac OS X 13_5) AppleWebKit/537.36 "
+        "(KHTML, like Gecko) Chrome/119.0.0.0 Safari/537.36"
+    ),
+    "Accept": "text/html,application/xhtml+xml,application/xml;q=0.9,*/*;q=0.8",
+    "Accept-Language": "en-US,en;q=0.9",
+}
+
+# Create output dirs (robust, relative to this file)
+BASE_DIR = Path(__file__).parent.resolve()
+STATIC_DIR = BASE_DIR / "static"
+AUDIO_DIR = STATIC_DIR / "audio"
+SUMM_DIR = STATIC_DIR / "summaries"
+
+for p in (AUDIO_DIR, SUMM_DIR):
+    try:
+        p.mkdir(parents=True, exist_ok=True)
+    except PermissionError:
+        logger.warning("No permission to create %s (will rely on image pre-created dirs).", p)
+
+# ---------------- Helpers ----------------
+def _get_device():
+    # Works for both CPU/GPU; safer than qwen_model.device
+    return next(qwen_model.parameters()).device
+
+def _safe_trim_to_tokens(text: str, tokenizer, max_tokens: int) -> str:
+    ids = tokenizer.encode(text, add_special_tokens=False)
+    if len(ids) <= max_tokens:
+        return text
+    ids = ids[:max_tokens]
+    return tokenizer.decode(ids, skip_special_tokens=True)
+
+# Remove any leaked <think>…</think> (with optional attributes) or similar tags
+_THINK_BLOCK_RE = re.compile(
+    r"<\s*(think|reasoning|thought)\b[^>]*>.*?<\s*/\s*\1\s*>",
+    re.IGNORECASE | re.DOTALL,
+)
+_THINK_TAGS_RE = re.compile(r"</?\s*(think|reasoning|thought)\b[^>]*>", re.IGNORECASE)
+
+def _strip_reasoning(text: str) -> str:
+    cleaned = _THINK_BLOCK_RE.sub("", text)          # remove full blocks
+    cleaned = _THINK_TAGS_RE.sub("", cleaned)        # remove any stray tags
+    cleaned = re.sub(r"```(?:\w+)?\s*```", "", cleaned)  # collapse empty fenced blocks
+    return cleaned.strip()
+
+def _normalize_url_for_proxy(u: str) -> str:
+    # r.jina.ai expects 'http://<host>/<path>' after it; unify scheme-less
+    u2 = u.replace("https://", "").replace("http://", "")
+    return f"https://r.jina.ai/http://{u2}"
+
+def _maybe_extract_from_html(pasted: str) -> str:
+    """If the pasted text looks like HTML, try to extract the main text via trafilatura."""
+    looks_html = bool(re.search(r"</?(html|div|p|article|section|span|body|h1|h2)\b", pasted, re.I))
+    if not looks_html:
+        return pasted
+    try:
+        extracted = trafilatura.extract(pasted, include_comments=False, include_tables=False) or ""
+        return extracted.strip() or pasted
+    except Exception:
+        return pasted
+
+# ---------------- Model Load ----------------
+def load_models():
+    """Load Qwen and Kokoro models on startup (idempotent)."""
+    global qwen_model, qwen_tokenizer, kokoro_pipeline, model_loading_status, _loaded_once
+    with _load_lock:
+        if _loaded_once:
+            return
+        try:
+            logger.info("Loading Qwen3-0.6B…")
+            model_name = "Qwen/Qwen3-0.6B"
+
+            qwen_tokenizer = AutoTokenizer.from_pretrained(model_name)
+            qwen_model = AutoModelForCausalLM.from_pretrained(
+                model_name,
+                torch_dtype="auto",
+                device_map="auto",  # CPU or GPU automatically
+            )
+            qwen_model.eval()  # inference mode
+
+            logger.info("Loading Kokoro TTS…")
+            kokoro_pipeline = KPipeline(lang_code="a")
+
+            model_loading_status["loaded"] = True
+            model_loading_status["error"] = None
+            _loaded_once = True
+            logger.info("✅ Models ready")
+        except Exception as e:
+            err = f"{type(e).__name__}: {e}"
+            model_loading_status["loaded"] = False
+            model_loading_status["error"] = err
+            logger.exception("Failed to load models: %s", err)
+
+# ---------------- Core Logic ----------------
+def scrape_article_text(url: str) -> tuple[str | None, str | None]:
+    """
+    Try to fetch & extract article text.
+    Strategy:
+      1) Trafilatura.fetch_url (vanilla)
+      2) requests.get with browser headers + trafilatura.extract
+      3) (optional) Proxy fallback if ALLOW_PROXY_FALLBACK=1
+    Returns (content, error)
+    """
+    try:
+        # --- 1) Direct fetch via Trafilatura ---
+        downloaded = trafilatura.fetch_url(url)
+        if downloaded:
+            text = trafilatura.extract(downloaded, include_comments=False, include_tables=False)
+            if text:
+                return text, None
+
+        # --- 2) Raw requests + Trafilatura extract ---
+        try:
+            r = requests.get(url, headers=BROWSER_HEADERS, timeout=15)
+            if r.status_code == 200 and r.text:
+                text = trafilatura.extract(r.text, include_comments=False, include_tables=False, url=url)
+                if text:
+                    return text, None
+            elif r.status_code == 403:
+                logger.info("Site returned 403; considering proxy fallback (if enabled).")
+        except requests.RequestException as e:
+            logger.info("requests.get failed: %s", e)
+
+        # --- 3) Optional proxy fallback (off by default) ---
+        if os.environ.get("ALLOW_PROXY_FALLBACK", "0") == "1":
+            proxy_url = _normalize_url_for_proxy(url)
+            try:
+                pr = requests.get(proxy_url, headers=BROWSER_HEADERS, timeout=15)
+                if pr.status_code == 200 and pr.text:
+                    extracted = trafilatura.extract(pr.text, include_comments=False, include_tables=False) or pr.text
+                    if extracted and extracted.strip():
+                        return extracted.strip(), None
+            except requests.RequestException as e:
+                logger.info("Proxy fallback failed: %s", e)
+
+        return None, (
+            "Failed to download the article content (site may block automated fetches). "
+            "Try another URL, paste the text manually, or set ALLOW_PROXY_FALLBACK=1."
+        )
+
+    except Exception as e:
+        return None, f"Error scraping article: {e}"
+
+def summarize_with_qwen(text: str) -> tuple[str | None, str | None]:
+    """Generate summary and return (summary, error)."""
+    try:
+        # Budget input tokens based on max context; fallback to 4096
+        try:
+            max_ctx = int(getattr(qwen_model.config, "max_position_embeddings", 4096))
+        except Exception:
+            max_ctx = 4096
+        # Leave room for prompt + output tokens
+        max_input_tokens = max(512, max_ctx - 1024)
+
+        prompt_hdr = (
+            "Please provide a concise and clear summary of the following article. "
+            "Focus on the main points, key findings, and conclusions. "
+            "Keep it easy to understand for someone who hasn't read the original.\n\nARTICLE:\n"
+        )
+
+        # Trim article to safe length
+        article_trimmed = _safe_trim_to_tokens(text, qwen_tokenizer, max_input_tokens)
+        user_content = prompt_hdr + article_trimmed
+
+        messages = [
+            {
+                "role": "system",
+                "content": (
+                    "You are a helpful assistant. Return ONLY the final summary as plain text. "
+                    "Do not include analysis, steps, or <think> tags."
+                ),
+            },
+            {"role": "user", "content": user_content},
+        ]
+
+        # Build the chat prompt text (disable thinking if supported)
+        try:
+            text_input = qwen_tokenizer.apply_chat_template(
+                messages, tokenize=False, add_generation_prompt=True, enable_thinking=False
+            )
+        except TypeError:
+            text_input = qwen_tokenizer.apply_chat_template(
+                messages, tokenize=False, add_generation_prompt=True
+            )
+
+        device = _get_device()
+        model_inputs = qwen_tokenizer([text_input], return_tensors="pt").to(device)
+
+        with torch.inference_mode():
+            generated_ids = qwen_model.generate(
+                **model_inputs,
+                max_new_tokens=512,
+                temperature=0.7,
+                top_p=0.8,
+                top_k=20,
+                do_sample=True,
+            )
+
+        output_ids = generated_ids[0][len(model_inputs.input_ids[0]):]
+        summary = qwen_tokenizer.decode(output_ids, skip_special_tokens=True).strip()
+        summary = _strip_reasoning(summary)  # <-- remove any leaked <think>…</think>
+        return summary, None
+    except Exception as e:
+        return None, f"Error generating summary: {e}"
+
+def generate_speech(summary: str, voice: str) -> tuple[str | None, str | None, float]:
+    """Generate speech and return (filename, error, duration_seconds)."""
+    try:
+        if voice not in ALLOWED_VOICES:
+            voice = "af_heart"
+        generator = kokoro_pipeline(summary, voice=voice)
+
+        audio_chunks = []
+        total_duration = 0.0
+
+        for _, _, audio in generator:
+            audio_chunks.append(audio)
+            total_duration += len(audio) / 24000.0
+
+        if not audio_chunks:
+            return None, "No audio generated.", 0.0
+
+        combined = audio_chunks[0] if len(audio_chunks) == 1 else torch.cat(audio_chunks, dim=0)
+
+        ts = int(time.time())
+        filename = f"summary_{ts}.wav"
+        filepath = AUDIO_DIR / filename
+        sf.write(str(filepath), combined.numpy(), 24000)
+
+        return filename, None, total_duration
+    except Exception as e:
+        return None, f"Error generating speech: {e}", 0.0
+
+# ---------------- Routes ----------------
+@app.route("/")
+def index():
+    return render_template("index.html")
+
+@app.route("/status")
+def status():
+    return jsonify(model_loading_status)
+
+@app.route("/process", methods=["POST"])
+def process_article():
+    if not model_loading_status["loaded"]:
+        return jsonify({"success": False, "error": "Models not loaded yet. Please wait."})
+
+    data = request.get_json(force=True, silent=True) or {}
+
+    # New: accept raw pasted text
+    pasted_text = (data.get("text") or "").strip()
+    url = (data.get("url") or "").strip()
+    generate_audio = bool(data.get("generate_audio", False))
+    voice = (data.get("voice") or "af_heart").strip()
+
+    if not pasted_text and not url:
+        return jsonify({"success": False, "error": "Please paste text or provide a valid URL."})
+
+    # 1) Resolve content: prefer pasted text if provided
+    if pasted_text:
+        article_content = _maybe_extract_from_html(pasted_text)
+        scrape_error = None
+    else:
+        article_content, scrape_error = scrape_article_text(url)
+
+    if scrape_error:
+        return jsonify({"success": False, "error": scrape_error})
+
+    # 2) Summarize
+    summary, summary_error = summarize_with_qwen(article_content)
+    if summary_error:
+        return jsonify({"success": False, "error": summary_error})
+
+    resp = {
+        "success": True,
+        "summary": summary,
+        "article_length": len(article_content or ""),
+        "summary_length": len(summary or ""),
+        "compression_ratio": round(len(summary) / max(len(article_content), 1) * 100, 1),
+        "timestamp": datetime.now().strftime("%Y-%m-%d %H:%M:%S"),
+    }
+
+    # 3) TTS
+    if generate_audio:
+        audio_filename, audio_error, duration = generate_speech(summary, voice)
+        if audio_error:
+            resp["audio_error"] = audio_error
+        else:
+            resp["audio_file"] = f"/static/audio/{audio_filename}"
+            resp["audio_duration"] = round(duration, 2)
+
+    return jsonify(resp)
+
+@app.route("/voices")
+def get_voices():
+    voices = [
+        {"id": "af_heart",   "name": "Female - Heart",   "grade": "A",  "description": "❤️ Warm female voice (best quality)"},
+        {"id": "af_bella",   "name": "Female - Bella",   "grade": "A-", "description": "🔥 Energetic female voice"},
+        {"id": "af_nicole",  "name": "Female - Nicole",  "grade": "B-", "description": "🎧 Professional female voice"},
+        {"id": "am_michael", "name": "Male - Michael",   "grade": "C+", "description": "Clear male voice"},
+        {"id": "am_fenrir",  "name": "Male - Fenrir",    "grade": "C+", "description": "Strong male voice"},
+        {"id": "af_sarah",   "name": "Female - Sarah",   "grade": "C+", "description": "Gentle female voice"},
+        {"id": "bf_emma",    "name": "British Female - Emma", "grade": "B-", "description": "🇬🇧 British accent"},
+        {"id": "bm_george",  "name": "British Male - George", "grade": "C",  "description": "🇬🇧 British male voice"},
+    ]
+    return jsonify(voices)
+
+# Kick off model loading when running under Gunicorn/containers
+if os.environ.get("RUNNING_GUNICORN", "0") == "1":
+    threading.Thread(target=load_models, daemon=True).start()
+
+# ---------------- Dev entrypoint ----------------
+if __name__ == "__main__":
+    import argparse
+    parser = argparse.ArgumentParser(description="AI Article Summarizer Web App")
+    parser.add_argument("--port", type=int, default=5001, help="Port to run the server on (default: 5001)")
+    parser.add_argument("--host", type=str, default="0.0.0.0", help="Host to bind to (default: 0.0.0.0)")
+    args = parser.parse_args()
+
+    # Load models in background thread
+    threading.Thread(target=load_models, daemon=True).start()
+
+    # Respect platform env PORT when present (HF Spaces: 7860)
+    port = int(os.environ.get("PORT", args.port))
+
+    print("🚀 Starting Article Summarizer Web App…")
+    print("📚 Models are loading in the background…")
+    print(f"🌐 Open http://localhost:{port} in your browser")
+
+    try:
+        app.run(debug=True, host=args.host, port=port)
+    except OSError as e:
+        if "Address already in use" in str(e):
+            print(f"❌ Port {port} is already in use!")
+            print("💡 Try a different port:")
+            print(f"   python app.py --port {port + 1}")
+            print("📱 Or disable AirPlay Receiver in System Settings → General → AirDrop & Handoff")
+        else:
+            raise

works.html

@@ -0,0 +1,528 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <meta charset="UTF-8" />
+  <meta name="viewport" content="width=device-width, initial-scale=1" />
+  <meta name="color-scheme" content="dark" />
+  <title>AI Article Summarizer · Qwen + Kokoro</title>
+  <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
+  <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&display=swap" rel="stylesheet" />
+  <style>
+    :root{
+      --bg-0:#0b0f17;
+      --bg-1:#0f1624;
+      --bg-2:#121a2b;
+      --glass: rgba(255,255,255,.04);
+      --muted: #9aa4bf;
+      --text: #e7ecf8;
+      --accent-1:#6d6aff;
+      --accent-2:#7b5cff;
+      --accent-3:#00d4ff;
+      --ok:#21d19f;
+      --warn:#ffb84d;
+      --err:#ff6b6b;
+      --ring: 0 0 0 1px rgba(255,255,255,.07), 0 0 0 6px rgba(124, 58, 237, .12);
+      --shadow: 0 20px 60px rgba(0,0,0,.45), 0 8px 20px rgba(0,0,0,.35);
+      --radius-xl:22px;
+      --radius-lg:16px;
+      --radius-md:12px;
+      --radius-sm:10px;
+      --grad: conic-gradient(from 220deg at 50% 50%, var(--accent-1), var(--accent-2), var(--accent-3), var(--accent-1));
+    }
+    *{box-sizing:border-box}
+    html,body{height:100%}
+    body{
+      margin:0;
+      font-family:Inter, system-ui, -apple-system, Segoe UI, Roboto, Ubuntu, Cantarell, Noto Sans, Helvetica, Arial, "Apple Color Emoji", "Segoe UI Emoji";
+      color:var(--text);
+      background:
+        radial-gradient(1200px 600px at -10% -10%, rgba(109,106,255,.20), transparent 50%),
+        radial-gradient(900px 500px at 120% -10%, rgba(0,212,255,.16), transparent 55%),
+        radial-gradient(1200px 900px at 50% 120%, rgba(123,92,255,.18), transparent 60%),
+        linear-gradient(180deg, var(--bg-0), var(--bg-1) 50%, var(--bg-2));
+      overflow-y:auto;
+    }
+
+    /* Top progress bar */
+    .bar{
+      position:fixed; inset:0 0 auto 0; height:3px; z-index:9999;
+      background: linear-gradient(90deg, var(--accent-3), var(--accent-2), var(--accent-1));
+      background-size:200% 100%;
+      transform:scaleX(0); transform-origin:left;
+      box-shadow:0 0 18px rgba(0,212,255,.45);
+      transition:transform .2s ease-out;
+      animation:bar-move 2.2s linear infinite;
+    }
+    @keyframes bar-move{0%{background-position:0 0}100%{background-position:200% 0}}
+
+    .wrap{
+      max-width:1080px; margin:72px auto; padding:0 24px;
+    }
+    .hero{
+      display:flex; flex-direction:column; align-items:center; gap:14px; margin-bottom:28px; text-align:center;
+    }
+    .hero-badge{
+      display:inline-flex; align-items:center; gap:10px; padding:8px 12px; border-radius:999px;
+      background:linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.02));
+      border:1px solid rgba(255,255,255,.08);
+      backdrop-filter: blur(8px);
+      box-shadow: var(--shadow);
+    }
+    .dot{width:8px;height:8px;border-radius:50%; background:var(--warn); box-shadow:0 0 0 6px rgba(255,184,77,.14)}
+    .dot.ready{background:var(--ok); box-shadow:0 0 0 6px rgba(33,209,159,.14)}
+    .hero h1{font-size: clamp(28px, 5vw, 44px); margin:0; font-weight:800; letter-spacing:-.02em; line-height:1.05}
+    .grad-text{
+      background: linear-gradient(92deg, #f0f3ff, #bfc8ff 30%, #9ad8ff 60%, #c2b5ff 90%);
+      -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent;
+    }
+    .hero p{margin:0; color:var(--muted); font-size:15.5px}
+
+    .panel{
+      position:relative;
+      background:linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.03));
+      border:1px solid rgba(255,255,255,.08);
+      border-radius: var(--radius-xl);
+      padding:24px;
+      box-shadow: var(--shadow);
+      overflow:hidden;
+    }
+    .panel::before{
+      content:"";
+      position:absolute; inset:-1px;
+      border-radius:inherit;
+      padding:1px;
+      background:linear-gradient(180deg, rgba(175,134,255,.35) 0%, rgba(0,212,255,.18) 100%);
+      -webkit-mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
+      -webkit-mask-composite:xor; mask-composite: exclude;
+      pointer-events:none;
+    }
+
+    .form-grid{display:grid; grid-template-columns:1fr auto; gap:12px; align-items:center}
+    .input{
+      width:100%;
+      background:rgba(0,0,0,.35);
+      border:1px solid rgba(255,255,255,.12);
+      border-radius:var(--radius-lg);
+      padding:14px 16px;
+      color:var(--text);
+      font-size:15.5px;
+      outline:none;
+      transition:border .2s ease, box-shadow .2s ease, background .2s ease;
+    }
+    .input::placeholder{color:#7f8aad}
+    .input:focus{border-color:rgba(0,212,255,.55); box-shadow: var(--ring)}
+
+    .btn{
+      position:relative;
+      display:inline-flex; align-items:center; justify-content:center; gap:10px;
+      padding:14px 18px;
+      border-radius:var(--radius-lg);
+      border:1px solid rgba(255,255,255,.12);
+      color:#0b0f17; font-weight:700; letter-spacing:.02em;
+      background: linear-gradient(135deg, #7b5cff 0%, #00d4ff 100%);
+      box-shadow: 0 10px 30px rgba(0,212,255,.35), inset 0 1px 0 rgba(255,255,255,.15);
+      cursor:pointer; user-select:none;
+      transition: transform .08s ease, filter .15s ease, box-shadow .2s ease, opacity .2s ease;
+    }
+    .btn:hover{transform: translateY(-1px)}
+    .btn:active{transform: translateY(0)}
+    .btn:disabled{opacity:.55; cursor:not-allowed; filter:grayscale(.2)}
+
+    .row{display:flex; flex-wrap:wrap; gap:12px; align-items:center; margin-top:14px}
+
+    /* Switch */
+    .switch{
+      display:inline-flex; align-items:center; gap:12px; cursor:pointer; user-select:none;
+      padding:10px 12px; border-radius:999px; background:rgba(255,255,255,.04); border:1px solid rgba(255,255,255,.08);
+    }
+    .switch .track{
+      width:44px; height:24px; background:rgba(255,255,255,.12); border-radius:999px; position:relative; transition: background .2s ease;
+    }
+    .switch .thumb{
+      width:18px; height:18px; border-radius:50%; background:white; position:absolute; top:3px; left:3px;
+      box-shadow:0 4px 16px rgba(0,0,0,.45);
+      transition:left .18s ease, background .2s ease, transform .18s ease;
+    }
+    .switch input{display:none}
+    .switch input:checked + .track{background:linear-gradient(90deg, #00d4ff, #7b5cff)}
+    .switch input:checked + .track .thumb{left:23px; background:#0b0f17; transform:scale(1.05)}
+
+    /* Collapsible voice panel */
+    .collapse{
+      overflow:hidden; max-height:0; opacity:0; transform: translateY(-4px);
+      transition:max-height .35s ease, opacity .25s ease, transform .25s ease;
+    }
+    .collapse.open{max-height:520px; opacity:1; transform:none}
+
+    .voices{
+      display:grid; gap:12px; margin-top:12px;
+      grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
+    }
+    .voice{
+      position:relative; padding:14px; border-radius:var(--radius-md);
+      background:rgba(255,255,255,.03); border:1px solid rgba(255,255,255,.08);
+      transition: transform .12s ease, box-shadow .2s ease, border .2s ease, background .2s ease;
+      cursor:pointer;
+    }
+    .voice:hover{transform: translateY(-2px); box-shadow: var(--shadow); border-color: rgba(0,212,255,.25)}
+    .voice.selected{background:linear-gradient(180deg, rgba(0,212,255,.08), rgba(123,92,255,.08)); border-color: rgba(123,92,255,.55)}
+    .voice .name{font-weight:700; letter-spacing:.01em}
+    .voice .meta{color:var(--muted); font-size:12.5px; margin-top:6px; display:flex; gap:10px; align-items:center}
+    .voice .badge{
+      font-size:11px; padding:3px 8px; border-radius:999px; border:1px solid rgba(255,255,255,.14);
+      background:rgba(255,255,255,.05);
+    }
+
+    /* Results */
+    .results{margin-top:18px}
+    .chips{display:flex; flex-wrap:wrap; gap:10px}
+    .chip{
+      font-size:12.5px; color:#cdd6f6;
+      padding:8px 12px; border-radius:999px; border:1px solid rgba(255,255,255,.08); background:rgba(255,255,255,.03);
+    }
+    .toolbar{
+      display:flex; gap:10px; flex-wrap:wrap; margin-top:12px
+    }
+    .tbtn{
+      display:inline-flex; align-items:center; gap:8px; padding:8px 12px; border-radius:10px;
+      background:rgba(255,255,255,.04); border:1px solid rgba(255,255,255,.1); color:var(--text);
+      cursor:pointer; font-size:13px; transition: background .15s ease, transform .08s ease;
+    }
+    .tbtn:hover{background:rgba(255,255,255,.08)}
+    .tbtn:active{transform: translateY(1px)}
+
+    .summary{
+      margin-top:14px;
+      background:rgba(0,0,0,.35);
+      border:1px solid rgba(255,255,255,.1);
+      border-radius:var(--radius-lg);
+      padding:18px;
+      line-height:1.7;
+      font-size:15.5px;
+      white-space:pre-wrap;
+      min-height:120px;
+    }
+
+    /* Skeleton */
+    .skeleton{
+      position:relative; overflow:hidden; background:rgba(255,255,255,.06); border-radius:10px;
+    }
+    .skeleton::after{
+      content:""; position:absolute; inset:0;
+      background:linear-gradient(100deg, transparent, rgba(255,255,255,.10), transparent);
+      transform:translateX(-100%); animation:shine 1.2s infinite;
+    }
+    @keyframes shine{to{transform:translateX(100%)}}
+
+    /* Messages */
+    .msg{
+      margin-top:14px; padding:12px 14px; border-radius:12px; border:1px solid rgba(255,255,255,.08);
+      display:none; font-size:14px;
+    }
+    .msg.err{display:block; color:#ffd8d8; background:rgba(255,107,107,.08)}
+    .msg.ok{display:block; color:#d9fff4; background:rgba(33,209,159,.08)}
+
+    /* Audio card */
+    .audio{
+      margin-top:14px; padding:16px;
+      background:rgba(255,255,255,.03);
+      border:1px solid rgba(255,255,255,.08); border-radius:var(--radius-lg);
+    }
+    audio{width:100%; height:40px; outline:none}
+
+    /* Footer note */
+    .foot{margin-top:14px; text-align:center; color:#7f8aad; font-size:12.5px}
+
+    @media (max-width:720px){
+      .form-grid{grid-template-columns: 1fr}
+      .btn{width:100%}
+    }
+  </style>
+</head>
+<body>
+  <div class="bar" id="bar"></div>
+
+  <div class="wrap">
+    <header class="hero">
+      <div class="hero-badge" id="statusBadge">
+        <span class="dot" id="statusDot"></span>
+        <span id="statusText">Loading AI models…</span>
+      </div>
+      <h1><span class="grad-text">AI Article Summarizer</span></h1>
+      <p>Qwen3-0.6B summarization · Kokoro neural TTS · smooth, private, fast</p>
+    </header>
+
+    <section class="panel">
+      <form id="summarizerForm" autocomplete="on">
+        <div class="form-grid">
+          <input id="articleUrl" class="input" type="url" inputmode="url"
+                 placeholder="Paste an article URL (https://…)" required />
+          <button id="submitBtn" class="btn" type="submit">
+            ✨ Summarize
+          </button>
+        </div>
+
+        <div class="row">
+          <label class="switch" title="Generate audio with Kokoro TTS">
+            <input id="generateAudio" type="checkbox" />
+            <span class="track"><span class="thumb"></span></span>
+            <span>🎵 Text-to-Speech</span>
+          </label>
+
+          <span class="chip">Models: Qwen3-0.6B · Kokoro</span>
+          <span class="chip">On-device processing</span>
+        </div>
+
+        <div id="voiceSection" class="collapse" aria-hidden="true">
+          <div class="voices" id="voiceGrid">
+            <!-- Injected -->
+          </div>
+        </div>
+      </form>
+
+      <!-- Loading skeleton -->
+      <div id="loadingSection" style="display:none; margin-top:18px">
+        <div class="skeleton" style="height:18px; width:42%; margin-bottom:10px"></div>
+        <div class="skeleton" style="height:14px; width:90%; margin-bottom:8px"></div>
+        <div class="skeleton" style="height:14px; width:86%; margin-bottom:8px"></div>
+        <div class="skeleton" style="height:14px; width:88%; margin-bottom:8px"></div>
+        <div class="skeleton" style="height:14px; width:60%; margin-bottom:8px"></div>
+      </div>
+
+      <!-- Results -->
+      <div id="resultSection" class="results" style="display:none">
+        <div class="chips" id="stats"></div>
+
+        <div class="toolbar">
+          <button class="tbtn" id="copyBtn" type="button">📋 Copy summary</button>
+          <a class="tbtn" id="downloadAudioBtn" href="#" download style="display:none">⬇️ Download audio</a>
+        </div>
+
+        <div id="summaryContent" class="summary"></div>
+
+        <div id="audioSection" class="audio" style="display:none">
+          <div style="display:flex; justify-content:space-between; align-items:center; margin-bottom:6px">
+            <strong>🎧 Audio Playback</strong>
+            <span id="duration" style="color:var(--muted); font-size:12.5px"></span>
+          </div>
+          <audio id="audioPlayer" controls preload="none"></audio>
+        </div>
+      </div>
+
+      <div id="errorMessage" class="msg err"></div>
+      <div id="successMessage" class="msg ok"></div>
+    </section>
+
+    <p class="foot">Tip: turn on TTS and pick a voice you like. We’ll remember your last choice.</p>
+  </div>
+
+  <script>
+    // ---------------- State ----------------
+    let modelsReady = false;
+    let selectedVoice = localStorage.getItem("voiceId") || "af_heart";
+    const bar = document.getElementById("bar");
+
+    // --------------- Utilities --------------
+    const $ = (sel) => document.querySelector(sel);
+    function showBar(active) {
+      bar.style.transform = active ? "scaleX(1)" : "scaleX(0)";
+    }
+    function setStatus(ready, error){
+      const dot = $("#statusDot");
+      const text = $("#statusText");
+      const badge = $("#statusBadge");
+      if (error){
+        dot.classList.remove("ready");
+        text.textContent = "Model error: " + error;
+        badge.style.borderColor = "rgba(255,107,107,.45)";
+        return;
+      }
+      if (ready){
+        dot.classList.add("ready");
+        text.textContent = "Models ready";
+      } else {
+        dot.classList.remove("ready");
+        text.textContent = "Loading AI models…";
+      }
+    }
+    function chip(text){ const span = document.createElement("span"); span.className="chip"; span.textContent=text; return span; }
+    function fmt(x){ return new Intl.NumberFormat().format(x); }
+
+    // ------------- Model status poll ---------
+    async function checkModelStatus(){
+      try{
+        const res = await fetch("/status");
+        const s = await res.json();
+        modelsReady = !!s.loaded;
+        setStatus(modelsReady, s.error || null);
+        if (!modelsReady && !s.error) setTimeout(checkModelStatus, 1500);
+        if (modelsReady) { await loadVoices(); }
+      }catch(e){
+        setTimeout(checkModelStatus, 2000);
+      }
+    }
+
+    // ------------- Voice loading -------------
+    async function loadVoices(){
+      try{
+        const res = await fetch("/voices");
+        const voices = await res.json();
+        const grid = $("#voiceGrid");
+        grid.innerHTML = "";
+        voices.forEach(v=>{
+          const el = document.createElement("div");
+          el.className = "voice" + (v.id === selectedVoice ? " selected":"");
+          el.dataset.voice = v.id;
+          el.innerHTML = `
+            <div class="name">${v.name}</div>
+            <div class="meta">
+              <span class="badge">Grade ${v.grade}</span>
+              <span>${v.description || ""}</span>
+            </div>`;
+          el.addEventListener("click", ()=>{
+            document.querySelectorAll(".voice").forEach(x=>x.classList.remove("selected"));
+            el.classList.add("selected");
+            selectedVoice = v.id;
+            localStorage.setItem("voiceId", selectedVoice);
+          });
+          grid.appendChild(el);
+        });
+      }catch(e){
+        // ignore
+      }
+    }
+
+    // ------------- Collapsible voices --------
+    const generateAudio = $("#generateAudio");
+    const voiceSection = $("#voiceSection");
+    function toggleVoices(open){
+      voiceSection.classList.toggle("open", !!open);
+      voiceSection.setAttribute("aria-hidden", open ? "false" : "true");
+    }
+    generateAudio.addEventListener("change", e=> toggleVoices(e.target.checked));
+    toggleVoices(generateAudio.checked); // on load
+
+    // ------------- Form submit ----------------
+    const form = $("#summarizerForm");
+    const loading = $("#loadingSection");
+    const result = $("#resultSection");
+    const errorBox = $("#errorMessage");
+    const okBox = $("#successMessage");
+    const submitBtn = $("#submitBtn");
+    const urlInput = $("#articleUrl");
+
+    form.addEventListener("submit", async (e)=>{
+      e.preventDefault();
+      errorBox.style.display="none"; okBox.style.display="none";
+
+      if (!modelsReady){
+        errorBox.textContent = "Please wait for the AI models to finish loading.";
+        errorBox.style.display = "block";
+        return;
+      }
+      const url = urlInput.value.trim();
+      if (!url){ return; }
+
+      submitBtn.disabled = true;
+      showBar(true);
+      loading.style.display = "block";
+      result.style.display = "none";
+
+      try{
+        const res = await fetch("/process", {
+          method: "POST",
+          headers: {"Content-Type":"application/json"},
+          body: JSON.stringify({
+            url,
+            generate_audio: generateAudio.checked,
+            voice: selectedVoice
+          })
+        });
+        const data = await res.json();
+
+        loading.style.display = "none";
+        submitBtn.disabled = false;
+        showBar(false);
+
+        if (!data.success){
+          errorBox.textContent = data.error || "Something went wrong.";
+          errorBox.style.display = "block";
+          return;
+        }
+        renderResult(data);
+        okBox.textContent = "Done!";
+        okBox.style.display = "block";
+        setTimeout(()=> okBox.style.display="none", 1800);
+
+      }catch(err){
+        loading.style.display="none";
+        submitBtn.disabled=false;
+        showBar(false);
+        errorBox.textContent = "Network error: " + (err?.message || err);
+        errorBox.style.display = "block";
+      }
+    });
+
+    // ------------- Render results -------------
+    const stats = $("#stats");
+    const summaryEl = $("#summaryContent");
+    const audioWrap = $("#audioSection");
+    const audioEl = $("#audioPlayer");
+    const dlBtn = $("#downloadAudioBtn");
+    const durationLabel = $("#duration");
+    const copyBtn = $("#copyBtn");
+
+    function renderResult(r){
+      // Stats
+      stats.innerHTML = "";
+      stats.appendChild(chip(`📄 ${fmt(r.article_length)} → ${fmt(r.summary_length)} chars`));
+      stats.appendChild(chip(`📉 ${r.compression_ratio}% compression`));
+      stats.appendChild(chip(`🕒 ${r.timestamp}`));
+
+      // Summary
+      summaryEl.textContent = r.summary || "";
+      result.style.display = "block";
+
+      // Audio
+      if (r.audio_file){
+        audioEl.src = r.audio_file;
+        audioWrap.style.display = "block";
+        durationLabel.textContent = `${r.audio_duration}s`;
+        dlBtn.style.display = "inline-flex";
+        dlBtn.href = r.audio_file;
+        dlBtn.download = r.audio_file.split("/").pop() || "summary.wav";
+      } else {
+        audioWrap.style.display = "none";
+        dlBtn.style.display = "none";
+      }
+    }
+
+    // Copy summary
+    copyBtn.addEventListener("click", async ()=>{
+      try{
+        await navigator.clipboard.writeText(summaryEl.textContent || "");
+        copyBtn.textContent = "✅ Copied";
+        setTimeout(()=> copyBtn.textContent = "📋 Copy summary", 900);
+      }catch(e){
+        // ignore
+      }
+    });
+
+    // ------------- Quality of life -------------
+    // Paste on Cmd/Ctrl+V if input empty
+    window.addEventListener("paste", (e)=>{
+      if(document.activeElement !== urlInput && !urlInput.value){
+        const t = (e.clipboardData || window.clipboardData).getData("text");
+        if (t?.startsWith("http")){ urlInput.value = t; }
+      }
+    });
+
+    // Init
+    document.addEventListener("DOMContentLoaded", ()=>{
+      checkModelStatus();
+      // Restore voice toggle state hint
+      if (localStorage.getItem("voiceId")) selectedVoice = localStorage.getItem("voiceId");
+    });
+  </script>
+</body>
+</html>

works.py

@@ -0,0 +1,372 @@
+#!/usr/bin/env python3
+"""
+Flask Web Application for Article Summarizer with TTS
+"""
+
+from flask import Flask, render_template, request, jsonify
+import os
+import time
+import threading
+import logging
+from datetime import datetime
+import re
+
+import torch
+import trafilatura
+import soundfile as sf
+from transformers import AutoModelForCausalLM, AutoTokenizer
+from kokoro import KPipeline
+import requests
+
+# ---------------- Logging ----------------
+logging.basicConfig(level=logging.INFO)
+logger = logging.getLogger("summarizer")
+
+# ---------------- Flask ----------------
+app = Flask(__name__)
+app.config["SECRET_KEY"] = os.environ.get("SECRET_KEY", "change-me")
+
+# ---------------- Globals ----------------
+qwen_model = None
+qwen_tokenizer = None
+kokoro_pipeline = None
+
+model_loading_status = {"loaded": False, "error": None}
+_load_lock = threading.Lock()
+_loaded_once = False  # idempotence guard across threads
+
+# Voice whitelist
+ALLOWED_VOICES = {
+    "af_heart", "af_bella", "af_nicole", "am_michael",
+    "am_fenrir", "af_sarah", "bf_emma", "bm_george"
+}
+
+# HTTP headers to look like a real browser for sites that block bots
+BROWSER_HEADERS = {
+    "User-Agent": (
+        "Mozilla/5.0 (Macintosh; Intel Mac OS X 13_5) AppleWebKit/537.36 "
+        "(KHTML, like Gecko) Chrome/119.0.0.0 Safari/537.36"
+    ),
+    "Accept": "text/html,application/xhtml+xml,application/xml;q=0.9,*/*;q=0.8",
+    "Accept-Language": "en-US,en;q=0.9",
+}
+
+# Create output dirs
+# os.makedirs("static/audio", exist_ok=True)
+# os.makedirs("static/summaries", exist_ok=True)
+
+# Create output dirs (robust, relative to this file)
+from pathlib import Path
+BASE_DIR = Path(__file__).parent.resolve()
+STATIC_DIR = BASE_DIR / "static"
+AUDIO_DIR = STATIC_DIR / "audio"
+SUMM_DIR = STATIC_DIR / "summaries"
+
+for p in (AUDIO_DIR, SUMM_DIR):
+    try:
+        p.mkdir(parents=True, exist_ok=True)
+    except PermissionError:
+        logger.warning("No permission to create %s (will rely on image pre-created dirs).", p)
+
+
+# ---------------- Helpers ----------------
+def _get_device():
+    # Works for both CPU/GPU; safer than qwen_model.device
+    return next(qwen_model.parameters()).device
+
+def _safe_trim_to_tokens(text: str, tokenizer, max_tokens: int) -> str:
+    ids = tokenizer.encode(text, add_special_tokens=False)
+    if len(ids) <= max_tokens:
+        return text
+    ids = ids[:max_tokens]
+    return tokenizer.decode(ids, skip_special_tokens=True)
+
+# Remove any leaked <think>…</think> (with optional attributes) or similar tags
+_THINK_BLOCK_RE = re.compile(
+    r"<\s*(think|reasoning|thought)\b[^>]*>.*?<\s*/\s*\1\s*>",
+    re.IGNORECASE | re.DOTALL,
+)
+_THINK_TAGS_RE = re.compile(r"</?\s*(think|reasoning|thought)\b[^>]*>", re.IGNORECASE)
+
+def _strip_reasoning(text: str) -> str:
+    cleaned = _THINK_BLOCK_RE.sub("", text)          # remove full blocks
+    cleaned = _THINK_TAGS_RE.sub("", cleaned)        # remove any stray tags
+    # optionally collapse leftover triple-backtick blocks that only had think text
+    cleaned = re.sub(r"```(?:\w+)?\s*```", "", cleaned)
+    return cleaned.strip()
+
+def _normalize_url_for_proxy(u: str) -> str:
+    # r.jina.ai expects 'http://<host>/<path>' after it; unify scheme-less
+    u2 = u.replace("https://", "").replace("http://", "")
+    return f"https://r.jina.ai/http://{u2}"
+
+# ---------------- Model Load ----------------
+def load_models():
+    """Load Qwen and Kokoro models on startup (idempotent)."""
+    global qwen_model, qwen_tokenizer, kokoro_pipeline, model_loading_status, _loaded_once
+    with _load_lock:
+        if _loaded_once:
+            return
+        try:
+            logger.info("Loading Qwen3-0.6B…")
+            model_name = "Qwen/Qwen3-0.6B"
+
+            qwen_tokenizer = AutoTokenizer.from_pretrained(model_name)
+            qwen_model = AutoModelForCausalLM.from_pretrained(
+                model_name,
+                torch_dtype="auto",
+                device_map="auto",  # CPU or GPU automatically
+            )
+            qwen_model.eval()  # inference mode
+
+            logger.info("Loading Kokoro TTS…")
+            kokoro_pipeline = KPipeline(lang_code="a")
+
+            model_loading_status["loaded"] = True
+            model_loading_status["error"] = None
+            _loaded_once = True
+            logger.info("✅ Models ready")
+        except Exception as e:
+            err = f"{type(e).__name__}: {e}"
+            model_loading_status["loaded"] = False
+            model_loading_status["error"] = err
+            logger.exception("Failed to load models: %s", err)
+
+# ---------------- Core Logic ----------------
+def scrape_article_text(url: str) -> tuple[str | None, str | None]:
+    """
+    Try to fetch & extract article text.
+    Strategy:
+      1) Trafilatura.fetch_url (vanilla)
+      2) requests.get with browser headers + trafilatura.extract
+      3) (optional) Proxy fallback if ALLOW_PROXY_FALLBACK=1
+    Returns (content, error)
+    """
+    try:
+        # --- 1) Direct fetch via Trafilatura ---
+        downloaded = trafilatura.fetch_url(url)
+        if downloaded:
+            text = trafilatura.extract(downloaded, include_comments=False, include_tables=False)
+            if text:
+                return text, None
+
+        # --- 2) Raw requests + Trafilatura extract ---
+        try:
+            r = requests.get(url, headers=BROWSER_HEADERS, timeout=15)
+            if r.status_code == 200 and r.text:
+                text = trafilatura.extract(r.text, include_comments=False, include_tables=False, url=url)
+                if text:
+                    return text, None
+            elif r.status_code == 403:
+                logger.info("Site returned 403; considering proxy fallback (if enabled).")
+        except requests.RequestException as e:
+            logger.info("requests.get failed: %s", e)
+
+        # --- 3) Optional proxy fallback (off by default) ---
+        if os.environ.get("ALLOW_PROXY_FALLBACK", "0") == "1":
+            proxy_url = _normalize_url_for_proxy(url)
+            try:
+                pr = requests.get(proxy_url, headers=BROWSER_HEADERS, timeout=15)
+                if pr.status_code == 200 and pr.text:
+                    extracted = trafilatura.extract(pr.text) or pr.text
+                    if extracted and extracted.strip():
+                        return extracted.strip(), None
+            except requests.RequestException as e:
+                logger.info("Proxy fallback failed: %s", e)
+
+        return None, (
+            "Failed to download the article content (site may block automated fetches). "
+            "Try another URL, paste the text manually, or set ALLOW_PROXY_FALLBACK=1."
+        )
+
+    except Exception as e:
+        return None, f"Error scraping article: {e}"
+
+def summarize_with_qwen(text: str) -> tuple[str | None, str | None]:
+    """Generate summary and return (summary, error)."""
+    try:
+        # Budget input tokens based on max context; fallback to 4096
+        try:
+            max_ctx = int(getattr(qwen_model.config, "max_position_embeddings", 4096))
+        except Exception:
+            max_ctx = 4096
+        # Leave room for prompt + output tokens
+        max_input_tokens = max(512, max_ctx - 1024)
+
+        prompt_hdr = (
+            "Please provide a concise and clear summary of the following article. "
+            "Focus on the main points, key findings, and conclusions. "
+            "Keep it easy to understand for someone who hasn't read the original.\n\nARTICLE:\n"
+        )
+
+        # Trim article to safe length
+        article_trimmed = _safe_trim_to_tokens(text, qwen_tokenizer, max_input_tokens)
+        user_content = prompt_hdr + article_trimmed
+
+        messages = [
+            {
+                "role": "system",
+                "content": (
+                    "You are a helpful assistant. Return ONLY the final summary as plain text. "
+                    "Do not include analysis, steps, or <think> tags."
+                ),
+            },
+            {"role": "user", "content": user_content},  # <-- important: pass the TRIMMED content
+        ]
+
+        # Build the chat prompt text (disable thinking if supported)
+        try:
+            text_input = qwen_tokenizer.apply_chat_template(
+                messages, tokenize=False, add_generation_prompt=True, enable_thinking=False
+            )
+        except TypeError:
+            text_input = qwen_tokenizer.apply_chat_template(
+                messages, tokenize=False, add_generation_prompt=True
+            )
+
+        device = _get_device()
+        model_inputs = qwen_tokenizer([text_input], return_tensors="pt").to(device)
+
+        with torch.inference_mode():
+            generated_ids = qwen_model.generate(
+                **model_inputs,
+                max_new_tokens=512,
+                temperature=0.7,
+                top_p=0.8,
+                top_k=20,
+                do_sample=True,
+            )
+
+        output_ids = generated_ids[0][len(model_inputs.input_ids[0]):]
+        summary = qwen_tokenizer.decode(output_ids, skip_special_tokens=True).strip()
+        summary = _strip_reasoning(summary)  # <-- remove any leaked <think>…</think>
+        return summary, None
+    except Exception as e:
+        return None, f"Error generating summary: {e}"
+
+def generate_speech(summary: str, voice: str) -> tuple[str | None, str | None, float]:
+    """Generate speech and return (filename, error, duration_seconds)."""
+    try:
+        if voice not in ALLOWED_VOICES:
+            voice = "af_heart"
+        generator = kokoro_pipeline(summary, voice=voice)
+
+        audio_chunks = []
+        total_duration = 0.0
+
+        for _, _, audio in generator:
+            audio_chunks.append(audio)
+            total_duration += len(audio) / 24000.0
+
+        if not audio_chunks:
+            return None, "No audio generated.", 0.0
+
+        combined = audio_chunks[0] if len(audio_chunks) == 1 else torch.cat(audio_chunks, dim=0)
+
+        ts = int(time.time())
+        filename = f"summary_{ts}.wav"
+        filepath = os.path.join("static", "audio", filename)
+        sf.write(filepath, combined.numpy(), 24000)
+
+        return filename, None, total_duration
+    except Exception as e:
+        return None, f"Error generating speech: {e}", 0.0
+
+# ---------------- Routes ----------------
+@app.route("/")
+def index():
+    return render_template("index.html")
+
+@app.route("/status")
+def status():
+    return jsonify(model_loading_status)
+
+@app.route("/process", methods=["POST"])
+def process_article():
+    if not model_loading_status["loaded"]:
+        return jsonify({"success": False, "error": "Models not loaded yet. Please wait."})
+
+    data = request.get_json(force=True, silent=True) or {}
+    url = (data.get("url") or "").strip()
+    generate_audio = bool(data.get("generate_audio", False))
+    voice = (data.get("voice") or "af_heart").strip()
+
+    if not url:
+        return jsonify({"success": False, "error": "Please provide a valid URL."})
+
+    # 1) Scrape
+    article_content, scrape_error = scrape_article_text(url)
+    if scrape_error:
+        return jsonify({"success": False, "error": scrape_error})
+
+    # 2) Summarize
+    summary, summary_error = summarize_with_qwen(article_content)
+    if summary_error:
+        return jsonify({"success": False, "error": summary_error})
+
+    resp = {
+        "success": True,
+        "summary": summary,
+        "article_length": len(article_content or ""),
+        "summary_length": len(summary or ""),
+        "compression_ratio": round(len(summary) / max(len(article_content), 1) * 100, 1),
+        "timestamp": datetime.now().strftime("%Y-%m-%d %H:%M:%S"),
+    }
+
+    # 3) TTS
+    if generate_audio:
+        audio_filename, audio_error, duration = generate_speech(summary, voice)
+        if audio_error:
+            resp["audio_error"] = audio_error
+        else:
+            resp["audio_file"] = f"/static/audio/{audio_filename}"
+            resp["audio_duration"] = round(duration, 2)
+
+    return jsonify(resp)
+
+@app.route("/voices")
+def get_voices():
+    voices = [
+        {"id": "af_heart",   "name": "Female - Heart",   "grade": "A",  "description": "❤️ Warm female voice (best quality)"},
+        {"id": "af_bella",   "name": "Female - Bella",   "grade": "A-", "description": "🔥 Energetic female voice"},
+        {"id": "af_nicole",  "name": "Female - Nicole",  "grade": "B-", "description": "🎧 Professional female voice"},
+        {"id": "am_michael", "name": "Male - Michael",   "grade": "C+", "description": "Clear male voice"},
+        {"id": "am_fenrir",  "name": "Male - Fenrir",    "grade": "C+", "description": "Strong male voice"},
+        {"id": "af_sarah",   "name": "Female - Sarah",   "grade": "C+", "description": "Gentle female voice"},
+        {"id": "bf_emma",    "name": "British Female - Emma", "grade": "B-", "description": "🇬🇧 British accent"},
+        {"id": "bm_george",  "name": "British Male - George", "grade": "C",  "description": "🇬🇧 British male voice"},
+    ]
+    return jsonify(voices)
+
+# Kick off model loading when running under Gunicorn/containers
+if os.environ.get("RUNNING_GUNICORN", "0") == "1":
+    threading.Thread(target=load_models, daemon=True).start()
+
+# ---------------- Dev entrypoint ----------------
+if __name__ == "__main__":
+    import argparse
+    parser = argparse.ArgumentParser(description="AI Article Summarizer Web App")
+    parser.add_argument("--port", type=int, default=5001, help="Port to run the server on (default: 5001)")
+    parser.add_argument("--host", type=str, default="0.0.0.0", help="Host to bind to (default: 0.0.0.0)")
+    args = parser.parse_args()
+
+    # Load models in background thread
+    threading.Thread(target=load_models, daemon=True).start()
+
+    # Respect platform env PORT when present
+    port = int(os.environ.get("PORT", args.port))
+
+    print("🚀 Starting Article Summarizer Web App…")
+    print("📚 Models are loading in the background…")
+    print(f"🌐 Open http://localhost:{port} in your browser")
+
+    try:
+        app.run(debug=True, host=args.host, port=port)
+    except OSError as e:
+        if "Address already in use" in str(e):
+            print(f"❌ Port {port} is already in use!")
+            print("💡 Try a different port:")
+            print(f"   python app.py --port {port + 1}")
+            print("📱 Or disable AirPlay Receiver in System Settings → General → AirDrop & Handoff")
+        else:
+            raise