Upload src/app.py

src/app.py

@@ -0,0 +1,174 @@
+import streamlit as st
+import torch
+from transformers import TrOCRProcessor, VisionEncoderDecoderModel
+from PIL import Image, UnidentifiedImageError
+import time
+import io
+import platform
+import sys
+import cv2
+import numpy as np
+import os
+
+# --- 1. SYSTEM CONFIG ---
+st.set_page_config(page_title="Handwriting Analysis", layout="wide", initial_sidebar_state="collapsed")
+
+if 'debug_log' not in st.session_state:
+    st.session_state.debug_log = [f"[{time.strftime('%H:%M:%S')}] === SYSTEM BOOT ({platform.system()}) ==="]
+if 'img_buffer' not in st.session_state:
+    st.session_state.img_buffer = None
+
+def log(msg):
+    st.session_state.debug_log.append(f"[{time.strftime('%H:%M:%S')}] {msg}")
+
+# CSS: Dark loading spinner and UI
+st.markdown("""
+    <style>
+    @import url('https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@300;500;700&family=Manrope:wght@300;400;600&display=swap');
+    @import url('https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:wght,FILL@100..700,0..1&display=swap');
+
+    .stApp { background-color: #0c0e12; color: #f6f6fc; font-family: 'Manrope', sans-serif; }
+    .block-container { padding-top: 1rem !important; padding-bottom: 0rem !important; max-width: 95% !important; }
+    .hero-title { font-family: 'Space Grotesk'; font-size: clamp(34px, 4vw, 60px); font-weight: 300; line-height: 0.9; margin-bottom: 25px; }
+    .hero-accent { color: #8ff5ff; font-weight: 700; font-style: italic; text-shadow: 0 0 20px rgba(143, 245, 255, 0.4); }
+    .strike { text-decoration: line-through; color: #46484d; opacity: 0.4; }
+
+    .uploader-wrapper { position: relative; width: 100%; max-width: 400px; margin: 0 auto; }
+    .ingest-card { height: 250px; background: #171a1f; border: 1px solid rgba(143, 245, 255, 0.1); border-radius: 4px; padding: 20px; text-align: center; display: flex; flex-direction: column; align-items: center; justify-content: center; pointer-events: none; }
+    .dashed-border { border: 1px dashed rgba(143, 245, 255, 0.15); border-radius: 2px; padding: 15px; margin-bottom: 12px; }
+    .cyan-btn { background-color: #8ff5ff; color: #003f43; font-family: 'Space Grotesk'; font-weight: 700; text-transform: uppercase; padding: 8px 25px; border-radius: 2px; font-size: 10px; letter-spacing: 1px; }
+
+    div[data-testid="stFileUploader"] { margin-top: -250px !important; height: 250px !important; opacity: 0.01 !important; z-index: 99 !important; cursor: pointer !important; }
+    div[data-testid="stFileUploader"] section { height: 100% !important; padding: 0 !important; }
+
+    .stat-card { background: #000; padding: 15px; border-radius: 2px; text-align: center; }
+    .stat-val { color: #8ff5ff; font-size: 24px; font-weight: 700; font-family: 'Space Grotesk'; }
+    .stat-lbl { font-size: 9px; color: #46484d; text-transform: uppercase; letter-spacing: 1.5px; }
+    .output-box { border-left: 3px solid #8ff5ff; background: #171a1f; padding: 20px; font-family: 'Space Grotesk'; font-size: clamp(16px, 1.5vw, 20px); color: #f6f6fc; margin-top: 15px; line-height: 1.5; min-height: 100px; white-space: pre-wrap; }
+    
+    .stButton>button { background-color: transparent !important; border: 1px solid #8ff5ff !important; color: #8ff5ff !important; width: 100%; border-radius: 2px; font-family: 'Space Grotesk'; text-transform: uppercase; font-size: 10px; margin-top: 10px; }
+
+    /* Dark Spinner fix */
+    [data-testid="stStatus"] { background-color: transparent !important; }
+    [data-testid="stSpinner"] { background-color: #171a1f !important; color: #8ff5ff !important; border: 1px solid rgba(143, 245, 255, 0.2); padding: 15px; border-radius: 4px; }
+    [data-testid="stSpinner"] > div { border-top-color: #8ff5ff !important; }
+
+    [data-testid="stHeader"], footer, .stFileUploader label { visibility: hidden; display: none; }
+    </style>
+""", unsafe_allow_html=True)
+
+# --- 2. ENGINE ---
+@st.cache_resource
+def load_engine():
+    local_path = "./final_handwriting_model"
+    cloud_path = "Hypernova823/ReadAI"
+    path = local_path if os.path.exists(local_path) else cloud_path
+    log(f"ENGINE: Loading from {path}")
+
+    device = "cuda" if torch.cuda.is_available() else "cpu"
+    try:
+        proc = TrOCRProcessor.from_pretrained(path)
+        model = VisionEncoderDecoderModel.from_pretrained(path).to(device)
+        return proc, model, device
+    except Exception as e:
+        log(f"CRASH: {e}")
+        return None, None, None
+
+def segment_handwriting(pil_image):
+    img_cv = np.array(pil_image.convert('RGB'))[:, :, ::-1].copy()
+    gray = cv2.cvtColor(img_cv, cv2.COLOR_BGR2GRAY)
+    blur = cv2.GaussianBlur(gray, (7,7), 0)
+    thresh = cv2.adaptiveThreshold(blur, 255, cv2.ADAPTIVE_THRESH_GAUSSIAN_C, cv2.THRESH_BINARY_INV, 21, 10)
+    kernel = cv2.getStructuringElement(cv2.MORPH_RECT, (60, 5)) 
+    dilated = cv2.dilate(thresh, kernel, iterations=1)
+    contours, _ = cv2.findContours(dilated, cv2.RETR_EXTERNAL, cv2.CHAIN_APPROX_SIMPLE)
+    boxes = [cv2.boundingRect(c) for c in contours]
+    boxes = [b for b in boxes if b[2] > 50 and b[3] > 15] 
+    boxes.sort(key=lambda b: b[1]) 
+    
+    lines = []
+    for x, y, w, h in boxes:
+        pad_x, pad_y = 15, 15
+        x1, y1 = max(0, x - pad_x), max(0, y - pad_y)
+        x2, y2 = min(img_cv.shape[1], x + w + pad_x), min(img_cv.shape[0], y + h + pad_y)
+        lines.append(pil_image.crop((x1, y1, x2, y2)))
+    return lines if lines else [pil_image]
+
+def render_tts_button(text, voice_choice, speed, volume):
+    safe_text = text.replace("'", "\\'").replace('\n', ' ')
+    html_code = f"""
+    <div style="padding: 2px;">
+        <button onclick="playTTS()" style="box-sizing: border-box; background-color: transparent; border: 1px solid #8ff5ff; color: #8ff5ff; width: 100%; border-radius: 2px; font-family: 'Space Grotesk', sans-serif; text-transform: uppercase; font-size: 10px; padding: 12px 0; cursor: pointer; transition: 0.3s;" onmouseover="this.style.backgroundColor='#8ff5ff'; this.style.color='#000';" onmouseout="this.style.backgroundColor='transparent'; this.style.color='#8ff5ff';"><span style="vertical-align: middle;">Generate Audio Readout</span></button>
+    </div>
+    <script>
+    var systemVoices = [];
+    function loadVoices() {{ systemVoices = window.speechSynthesis.getVoices(); }}
+    window.speechSynthesis.onvoiceschanged = loadVoices; loadVoices();
+    function playTTS() {{
+        window.speechSynthesis.cancel();
+        var msg = new SpeechSynthesisUtterance('{safe_text}');
+        msg.rate = {speed}; msg.volume = {volume};
+        var targetVoice = '{voice_choice}';
+        var selectedVoice = null;
+        if (targetVoice === 'Aria (Neural)') {{ selectedVoice = systemVoices.find(v => v.name.toLowerCase().includes('female') || v.name.toLowerCase().includes('zira') || v.name.toLowerCase().includes('aria') || v.name.toLowerCase().includes('samantha')); }} 
+        else {{ selectedVoice = systemVoices.find(v => v.name.toLowerCase().includes('male') || v.name.toLowerCase().includes('david') || v.name.toLowerCase().includes('julian') || v.name.toLowerCase().includes('mark')); }}
+        if (selectedVoice) {{ msg.voice = selectedVoice; }}
+        window.speechSynthesis.speak(msg);
+    }}
+    </script>
+    """
+    st.components.v1.html(html_code, height=70)
+
+# --- 3. UI ---
+st.markdown('<div class="hero-title"><div class="strike">Handwronging</div><div class="hero-accent">Handwriting</div></div>', unsafe_allow_html=True)
+left, right = st.columns([1, 1], gap="large")
+
+with left:
+    if st.session_state.img_buffer is None:
+        st.markdown('<div class="uploader-wrapper"><div class="ingest-card"><div class="dashed-border"><span class="material-symbols-outlined" style="font-size:28px; color:#8ff5ff;">add_a_photo</span></div><div class="cyan-btn">Browse Local Storage</div></div>', unsafe_allow_html=True)
+        # Bypassing HF File Drop issues with explicit rerun
+        img_file = st.file_uploader(" ", type=["jpg", "png", "jpeg", "jfif", "webp"], label_visibility="collapsed")
+        st.markdown('</div>', unsafe_allow_html=True)
+        if img_file:
+            st.session_state.img_buffer = img_file.getvalue()
+            st.rerun()
+    else:
+        st.image(Image.open(io.BytesIO(st.session_state.img_buffer)), width=300, caption="Source Input")
+        if st.button("UPLOAD ANOTHER PHOTO"):
+            st.session_state.img_buffer = None
+            st.rerun()
+
+with right:
+    if st.session_state.img_buffer is not None:
+        proc, model, dev = load_engine()
+        if model:
+            stats_ph = st.empty()
+            text_ph = st.empty()
+            
+            line_images = segment_handwriting(Image.open(io.BytesIO(st.session_state.img_buffer)).convert("RGB"))
+            full_text = ""
+            t_start = time.perf_counter()
+            
+            with st.spinner(f"Decoding {len(line_images)} lines..."):
+                for idx, line_img in enumerate(line_images):
+                    pix = proc(line_img, return_tensors="pt").pixel_values.to(dev)
+                    # REVERTED: Original generate logic
+                    out = model.generate(pix)
+                    pred = proc.batch_decode(out, skip_special_tokens=True)[0]
+                    full_text += pred + " "
+                    text_ph.markdown(f'<div class="output-box">{full_text}</div>', unsafe_allow_html=True)
+            
+            latency = time.perf_counter() - t_start
+            with stats_ph.container():
+                s1, s2 = st.columns(2)
+                with s1: st.markdown(f'<div class="stat-card"><div class="stat-val">SYNC</div><div class="stat-lbl">Neural Status</div></div>', unsafe_allow_html=True)
+                with s2: st.markdown(f'<div class="stat-card"><div class="stat-val">{latency:.2f}s</div><div class="stat-lbl">Latency</div></div>', unsafe_allow_html=True)
+
+            c1, c2, c3 = st.columns(3)
+            with c1: voice = st.selectbox("Voice", ["Aria (Neural)", "Julian (Natural)"], label_visibility="collapsed")
+            with c2: speed = st.slider("Rate", 0.5, 2.0, 1.0, 0.1)
+            with c3: vol = st.slider("Vol", 0.1, 1.0, 1.0, 0.1)
+            render_tts_button(full_text, voice, speed, vol)
+
+log_html = f"<div class='debug-terminal'>{''.join([f'<div>{e}</div>' for e in st.session_state.debug_log])}</div>"
+st.markdown(log_html, unsafe_allow_html=True)