Update app.py

app.py

@@ -3,18 +3,18 @@ import re
 import xml.etree.ElementTree as ET
 import gradio as gr
 
-# If you use these in your env, keep them. Otherwise they're optional.
-# from huggingface_hub import hf_hub_download
-# from handwriting_api import InputData, validate_input
+# Your handwriting model wrapper
+from hand import Hand
 
-from hand import Hand  # your handwriting model wrapper
-
-# --- Setup --------------------------------------------------------------------
+# -----------------------------------------------------------------------------
+# Setup
+# -----------------------------------------------------------------------------
 os.makedirs("img", exist_ok=True)
 hand = Hand()
 
-# --- SVG helpers ---------------------------------------------------------------
-
+# -----------------------------------------------------------------------------
+# SVG helpers
+# -----------------------------------------------------------------------------
 def _extract_paths(svg_root_or_group):
     """Return a list of <path> elements (namespace-agnostic)."""
     return [el for el in svg_root_or_group.iter() if el.tag.endswith('path')]
@@ -41,12 +41,51 @@ def _translate_group(elem, dx, dy):
     t = f"translate({dx},{dy})"
     elem.set('transform', (prev + " " + t).strip())
 
-# --- Segment compositor (the key fix) -----------------------------------------
+# -----------------------------------------------------------------------------
+# Visual (raster) measurement for exact spacing
+# -----------------------------------------------------------------------------
+def _tight_width_via_raster(group_elem, stroke_color="#000", stroke_width=2):
+    """
+    Render a tiny SVG containing only this group, rasterize to PNG in-memory,
+    and return the non-transparent width in pixels. Produces pixel-accurate
+    width that's immune to relative path quirks.
+    """
+    import io
+    from PIL import Image
+    import cairosvg
+    import xml.etree.ElementTree as ET
+
+    # Build a tiny standalone SVG for the group (children are already paths)
+    svg = ET.Element('svg', {
+        'xmlns': 'http://www.w3.org/2000/svg',
+        'viewBox': '0 0 1200 400'
+    })
+    g = ET.Element('g')
+    for p in list(group_elem):
+        g.append(p)
+    svg.append(g)
+
+    svg_bytes = ET.tostring(svg, encoding='utf-8')
+
+    # Rasterize in memory
+    png_bytes = cairosvg.svg2png(bytestring=svg_bytes, scale=1.0, background_color="none")
+    img = Image.open(io.BytesIO(png_bytes)).convert('RGBA')
 
+    # Non-transparent bounding box
+    alpha = img.split()[-1]
+    bbox = alpha.getbbox()  # (left, top, right, bottom) or None
+    if not bbox:
+        return 0.0
+    left, top, right, bottom = bbox
+    return float(right - left)
+
+# -----------------------------------------------------------------------------
+# Segment compositor (key fix for underscores)
+# -----------------------------------------------------------------------------
 def _render_part_group(text_part, style, bias, color, stroke_width):
     """
-    Render a single text 'part' (no underscores) using the Hand model to a temp SVG,
-    pull out its paths, wrap them in a <g>, and return (group, bbox).
+    Render one underscore-free 'part' using the Hand model to a temp SVG,
+    extract its path group, and return (group, path_bbox).
     """
     # Avoid empty part causing errors: render a single space
     lines = [text_part if text_part else " "]
@@ -78,42 +117,49 @@ def render_line_with_underscores(
     underscore_len=22
 ):
     """
-    Compose a line that may include underscores by rendering surrounding segments,
-    measuring their true widths, and drawing the underscore at the baseline.
-    Returns (list_of_elements, rightmost_x).
+    Compose a line with underscores by rendering surrounding segments,
+    measuring their *visual* widths via rasterization, and drawing the
+    underscore at the baseline. Returns (list_of_elements, rightmost_x).
     """
     parts = line.split('_')
 
-    # Render every part and measure bboxes
-    part_groups, part_bboxes = [], []
+    part_groups, visual_widths, path_bboxes = [], [], []
+
+    # 1) Render each part to a <g>
     for part in parts:
         g, bbox = _render_part_group(part, style, bias, color, stroke_width)
         part_groups.append(g)
-        part_bboxes.append(bbox)
+        path_bboxes.append(bbox)
 
-    # Estimate line metrics from first non-empty part (fallbacks if needed)
+    # 2) Measure visual widths robustly (pixel-accurate)
+    for g in part_groups:
+        w = _tight_width_via_raster(g, stroke_color=color, stroke_width=stroke_width)
+        if w <= 0.1:  # fallback to path bbox width if needed
+            minx, _, maxx, _ = _bbox_of_paths(_extract_paths(g))
+            w = max(0.0, maxx - minx)
+        visual_widths.append(w)
+
+    # 3) Estimate line metrics for baseline
     line_height = 40.0
-    for bbox in part_bboxes:
-        minx, miny, maxx, maxy = bbox
+    for minx, miny, maxx, maxy in path_bboxes:
         if maxy - miny > 0.0:
             line_height = max(20.0, maxy - miny)
             break
     base_y = line_y + 0.8 * line_height
 
-    # Compose into positioned elements
+    # 4) Compose all elements left-to-right using measured widths
     composed = []
     cursor_x = x_start
 
-    for i, (g, bbox) in enumerate(zip(part_groups, part_bboxes)):
+    for i, (g, bbox, visw) in enumerate(zip(part_groups, path_bboxes, visual_widths)):
         minx, _, maxx, _ = bbox
-        width = max(0.0, maxx - minx)
 
-        # Place this segment at current cursor_x
+        # Align this group's left edge at cursor_x
         _translate_group(g, dx=(cursor_x - minx), dy=line_y)
         composed.append(g)
-        cursor_x += width
+        cursor_x += visw  # advance by visual width
 
-        # If there is an underscore after this part, draw it now
+        # Draw underscore between parts
         if i < len(part_groups) - 1:
             x0 = cursor_x + gap_left
             x1 = x0 + underscore_len
@@ -124,12 +170,13 @@ def render_line_with_underscores(
             underscore.set('fill', 'none')
             underscore.set('stroke-linecap', 'round')
             composed.append(underscore)
-            cursor_x = x1 + gap_right  # advance cursor
+            cursor_x = x1 + gap_right
 
     return composed, cursor_x
 
-# --- Handwriting generation (multi-line + composition) ------------------------
-
+# -----------------------------------------------------------------------------
+# Handwriting generation (multi-line + composition)
+# -----------------------------------------------------------------------------
 def generate_handwriting(
     text,
     style,
@@ -139,18 +186,19 @@ def generate_handwriting(
     multiline=True
 ):
     """
-    Generate a composed SVG that places underscores geometrically between segments.
+    Generate a composed SVG that places underscores geometrically between
+    segments with pixel-accurate spacing.
     """
     try:
         lines = text.split('\n') if multiline else [text]
 
-        # Light validation and slash normalization (your old behavior)
+        # Validation + normalize slashes; KEEP underscores intact
         for idx, ln in enumerate(lines):
             if len(ln) > 75:
                 return f"Error: Line {idx + 1} is too long (max 75 characters)"
-            lines[idx] = ln.replace('/', '-').replace('\\', '-')  # keep underscores intact
+            lines[idx] = ln.replace('/', '-').replace('\\', '-')
 
-        # Create a fresh SVG root we control (no background rect -> transparent)
+        # Fresh SVG root (no white background -> transparent)
         svg_root = ET.Element('svg', {
             'xmlns': 'http://www.w3.org/2000/svg',
             'viewBox': '0 0 1200 800'
@@ -184,7 +232,6 @@ def generate_handwriting(
         svg_root.set('viewBox', f"0 0 {width} {height}")
 
         svg_content = ET.tostring(svg_root, encoding='unicode')
-        # Persist for download
         with open("img/output.svg", "w", encoding="utf-8") as f:
             f.write(svg_content)
         return svg_content
@@ -192,8 +239,9 @@ def generate_handwriting(
     except Exception as e:
         return f"Error: {str(e)}"
 
-# --- PNG export (transparent) --------------------------------------------------
-
+# -----------------------------------------------------------------------------
+# PNG export (transparent)
+# -----------------------------------------------------------------------------
 def export_to_png(svg_content):
     """Convert SVG to transparent PNG using CairoSVG and Pillow."""
     try:
@@ -203,12 +251,11 @@ def export_to_png(svg_content):
         if not svg_content or svg_content.startswith("Error:"):
             return None
 
-        # Ensure we write the current svg to disk (CairoSVG can read from file)
         tmp_svg = "img/temp.svg"
         with open(tmp_svg, "w", encoding="utf-8") as f:
             f.write(svg_content)
 
-        # Render at higher scale for crisp strokes
+        # High scale for crisp strokes
         cairosvg.svg2png(
             url=tmp_svg,
             write_to="img/output_temp.png",
@@ -220,7 +267,7 @@ def export_to_png(svg_content):
         if img.mode != 'RGBA':
             img = img.convert('RGBA')
 
-        # Optional: force near-white background fully transparent (safety)
+        # Ensure any near-white is transparent (safety)
         datas = img.getdata()
         new_data = []
         for item in datas:
@@ -233,7 +280,6 @@ def export_to_png(svg_content):
         out_path = "img/output.png"
         img.save(out_path, "PNG")
 
-        # cleanup
         try:
             os.remove("img/output_temp.png")
         except:
@@ -245,12 +291,12 @@ def export_to_png(svg_content):
         print(f"Error converting to PNG: {str(e)}")
         return None
 
-# --- Gradio UI ----------------------------------------------------------------
-
+# -----------------------------------------------------------------------------
+# Gradio UI
+# -----------------------------------------------------------------------------
 def generate_handwriting_wrapper(text, style, bias, color, stroke_width, multiline=True):
     svg = generate_handwriting(text, style, bias, color, stroke_width, multiline)
     png_path = export_to_png(svg)
-    # Display SVG inline; return file path for PNG
     return svg, png_path, "img/output.svg"
 
 css = """
@@ -262,13 +308,13 @@ css = """
 
 with gr.Blocks(css=css) as demo:
     gr.Markdown("# 🖋️ Handwriting Synthesis (Underscore-safe)")
-    gr.Markdown("Generate realistic handwritten text with **true** underscore alignment—no retraining required.")
+    gr.Markdown("Generate realistic handwritten text with **perfect underscore alignment**—no retraining required.")
 
     with gr.Row():
         with gr.Column(scale=2):
             text_input = gr.Textbox(
                 label="Text Input",
-                placeholder="Try: zeb_3asba or user_name → underscores render perfectly",
+                placeholder="Try: zeb_3asba, user_name, long__double__underscore",
                 lines=5,
                 max_lines=10,
             )
@@ -295,10 +341,9 @@ with gr.Blocks(css=css) as demo:
 
     gr.Markdown("""
     ### Notes
-    - Underscores are drawn **between** segments using real geometry → perfect alignment.
+    - Underscores are drawn between segments using **pixel-accurate measurements**.
     - Slashes (/, \\) are normalized to dashes (-) for model stability.
-    - Each line ≤ 75 characters.
-    - Transparent PNG export included.
+    - Each line ≤ 75 characters. Transparent PNG export included.
     """)
 
     generate_btn.click(
@@ -317,24 +362,25 @@ with gr.Blocks(css=css) as demo:
         outputs=[text_input, style_select, bias_slider, color_picker, stroke_width]
     )
 
-# --- Main ---------------------------------------------------------------------
-
+# -----------------------------------------------------------------------------
+# Main
+# -----------------------------------------------------------------------------
 if __name__ == "__main__":
     port = int(os.environ.get("PORT", 7860))
 
-    # Soft check for optional deps
-    missing_packages = []
+    # Soft check for optional deps used here and in measurer
+    missing = []
     try:
         import cairosvg  # noqa
     except ImportError:
-        missing_packages.append("cairosvg")
+        missing.append("cairosvg")
     try:
         from PIL import Image  # noqa
     except ImportError:
-        missing_packages.append("pillow")
+        missing.append("pillow")
 
-    if missing_packages:
-        print(f"WARNING: Missing packages for transparent PNG export: {', '.join(missing_packages)}")
-        print("Install with: pip install " + " ".join(missing_packages))
+    if missing:
+        print(f"WARNING: Missing packages for underscore alignment & PNG export: {', '.join(missing)}")
+        print("Install with: pip install " + " ".join(missing))
 
     demo.launch(server_name="0.0.0.0", server_port=port)