File size: 18,567 Bytes
bff3709
 
 
 
 
f9aef00
bff3709
 
 
68676d8
8df070d
 
bff3709
 
 
d18ae45
a7d9e19
bff3709
 
 
 
 
 
 
 
a7d9e19
 
8df070d
 
bff3709
d18ae45
bff3709
 
 
 
 
 
 
 
 
 
 
 
 
 
8df070d
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
f2998c3
bff3709
 
 
 
 
 
 
 
 
 
 
 
 
 
 
d18ae45
bff3709
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
d18ae45
bff3709
 
 
 
 
 
 
 
a7d9e19
 
bff3709
a7d9e19
 
 
 
 
 
bff3709
a7d9e19
 
bff3709
 
ddb227a
bff3709
 
d18ae45
f9aef00
bf68423
f9aef00
d18ae45
 
 
bff3709
 
 
ab4f707
bff3709
 
a7d9e19
bff3709
a7d9e19
bff3709
 
a7d9e19
bff3709
d18ae45
bff3709
 
d18ae45
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
bff3709
d18ae45
 
 
bff3709
 
 
d18ae45
bff3709
 
 
d18ae45
bff3709
 
d18ae45
bff3709
d18ae45
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
68676d8
8df070d
d18ae45
bff3709
 
d18ae45
bff3709
d18ae45
bff3709
 
 
d18ae45
bff3709
 
 
 
 
 
 
 
 
 
 
 
d18ae45
bff3709
87fcc8a
 
feb46ff
 
bff3709
d18ae45
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
bf68423
 
 
87fcc8a
 
bff3709
 
d18ae45
 
f2998c3
d18ae45
bff3709
 
 
 
 
 
 
09cbe60
bff3709
 
 
 
 
 
 
 
 
 
 
 
 
 
 
d18ae45
 
bff3709
 
 
 
 
 
09cbe60
bff3709
 
 
 
 
 
 
 
 
 
 
 
 
 
 
09cbe60
bff3709
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
667cb5b
d18ae45
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
import base64
import io
import json
import os
from typing import Dict, List, Tuple, Any, Optional
import time
import requests
from PIL import Image
import gradio as gr
import re


# =========================
# Config
# =========================
DEFAULT_API_URL = os.environ.get("API_URL")
TOKEN = os.environ.get("TOKEN")
LOGO_IMAGE_PATH = './assets/logo.jpg'
GOOGLE_FONTS_URL = "<link href='https://fonts.googleapis.com/css2?family=Noto+Sans+SC:wght@400;700&display=swap' rel='stylesheet'>"
LATEX_DELIMS = [
    {"left": "$$", "right": "$$", "display": True},
    {"left": "$",  "right": "$",  "display": False},
    {"left": "\\(", "right": "\\)", "display": False},
    {"left": "\\[", "right": "\\]", "display": True},
]
AUTH_HEADER = {"Authorization": f"bearer {TOKEN}"}
JSON_HEADERS = {**AUTH_HEADER, "Content-Type": "application/json"}


# =========================
# Base64 and Example Loading Logic
# =========================
def image_to_base64_data_url(filepath: str) -> str:
    """Reads a local image file and encodes it into a Base64 Data URL."""
    try:
        ext = os.path.splitext(filepath)[1].lower()
        mime_types = {'.jpg': 'image/jpeg', '.jpeg': 'image/jpeg', '.png': 'image/png', '.gif': 'image/gif'}
        mime_type = mime_types.get(ext, 'image/jpeg')
        with open(filepath, "rb") as image_file:
            encoded_string = base64.b64encode(image_file.read()).decode("utf-8")
        return f"data:{mime_type};base64,{encoded_string}"
    except Exception as e:
        print(f"Error encoding image to Base64: {e}")
        return ""

def _escape_inequalities_in_math(md: str) -> str:
    """
    Finds math blocks in a Markdown string and replaces < and > with
    their LaTeX equivalents, \lt and \gt, to prevent markdown parsing errors.
    """
    _MATH_PATTERNS = [
        re.compile(r"\$\$([\s\S]+?)\$\$"),
        re.compile(r"\$([^\$]+?)\$"),
        re.compile(r"\\\[([\s\S]+?)\\\]"),
        re.compile(r"\\\(([\s\S]+?)\\\)"),
    ]
    def fix(s: str) -> str:
        s = s.replace("<=", r" \le ").replace(">=", r" \ge ")
        s = s.replace("≤", r" \le ").replace("≥", r" \ge ")
        s = s.replace("<",  r" \lt ").replace(">",  r" \gt ")
        return s
    for pat in _MATH_PATTERNS:
        md = pat.sub(lambda m: m.group(0).replace(m.group(1), fix(m.group(1))), md)
    return md

def _get_examples_from_dir(dir_path: str) -> List[List[str]]:
    supported_exts = {".png", ".jpg", ".jpeg", ".bmp", ".webp"}
    examples = []
    if not os.path.exists(dir_path): return []
    for filename in sorted(os.listdir(dir_path)):
        if os.path.splitext(filename)[1].lower() in supported_exts:
            examples.append([os.path.join(dir_path, filename)])
    return examples

TARGETED_EXAMPLES_DIR = "examples/targeted"
COMPLEX_EXAMPLES_DIR = "examples/complex"
targeted_recognition_examples = _get_examples_from_dir(TARGETED_EXAMPLES_DIR)
complex_document_examples = _get_examples_from_dir(COMPLEX_EXAMPLES_DIR)

# =========================
# UI Helpers
# =========================
def render_uploaded_image_div(file_path: str) -> str:
    data_url = image_to_base64_data_url(file_path)
    return f"""
    <div class="uploaded-image">
        <img src="{data_url}" alt="Uploaded image" style="width:100%;height:100%;object-fit:contain;"/>
    </div>
    """

def update_preview_visibility(file_path: Optional[str]) -> Dict:
    if file_path:
        html_content = render_uploaded_image_div(file_path)
        return gr.update(value=html_content, visible=True)
    else:
        return gr.update(value="", visible=False)

def _on_gallery_select(example_paths: List[str], evt: gr.SelectData):
    try:
        idx = evt.index
        return example_paths[idx]
    except Exception:
        return None

# =========================
# API Call Logic
# =========================
def _file_to_b64_image_only(file_path: str) -> Tuple[str, int]:
    if not file_path: raise ValueError("Please upload an image first.")
    ext = os.path.splitext(file_path)[1].lower()
    if ext not in {".png", ".jpg", ".jpeg", ".bmp", ".webp"}: raise ValueError("Only image files are supported.")
    with open(file_path, "rb") as f:
        return base64.b64encode(f.read()).decode("utf-8"), 1

def _call_api(api_url: str, file_path: str, use_layout_detection: bool,
              prompt_label: Optional[str], use_chart_recognition: bool = False) -> Dict[str, Any]:
    b64, file_type = _file_to_b64_image_only(file_path)
    payload = {
        "file": b64,
        "useLayoutDetection": bool(use_layout_detection),
        "fileType": file_type,
        "layoutMergeBboxesMode": "union",
    }
    if not use_layout_detection:
        if not prompt_label:
            raise ValueError("Please select a recognition type.")
        payload["promptLabel"] = prompt_label.strip().lower()
    if use_layout_detection and use_chart_recognition:
        payload["useChartRecognition"] = True

    try:
        print(f"Sending API request to {api_url}...")
        start_time = time.time()
        resp = requests.post(api_url, json=payload, headers=JSON_HEADERS, timeout=600)
        end_time = time.time()
        duration = end_time - start_time
        print(f"Received API response in {duration:.2f} seconds.")
        
        resp.raise_for_status()
        data = resp.json()
    except requests.exceptions.RequestException as e:
        raise gr.Error(f"API request failed:{e}")
    except json.JSONDecodeError:
        raise gr.Error(f"Invalid JSON response from server:\n{getattr(resp, 'text', '')}")

    if data.get("errorCode", -1) != 0:
        raise gr.Error("API returned an error:")
    return data


# =========================
# API Response Processing
# =========================

# 【改动点】: 这个函数现在不再需要,因为我们不再将URL下载为PIL Image对象。
# def url_to_pil_image(url: str) -> Optional[Image.Image]:
#     """Downloads an image from a URL and returns it as a PIL Image object for the Gradio Image component."""
#     if not url or not url.startswith(('http://', 'https://')):
#         print(f"Warning: Invalid URL provided for visualization image: {url}")
#         return None
#     try:
#         start_time = time.time()
#         response = requests.get(url, timeout=600)
#         end_time = time.time()
#         print(f"Fetched visualization image from {url} in {end_time - start_time:.2f} seconds.")
#
#         response.raise_for_status()
#         image_bytes = response.content
#         pil_image = Image.open(io.BytesIO(image_bytes)).convert("RGB")
#         return pil_image
#     except requests.exceptions.RequestException as e:
#         print(f"Error fetching visualization image from URL {url}: {e}")
#         return None
#     except Exception as e:
#         print(f"Error processing visualization image from URL {url}: {e}")
#         return None

def _process_api_response_page(result: Dict[str, Any]) -> Tuple[str, str, str]:
    """
    Processes the API response.
    1. Replaces markdown image placeholders with their direct URLs.
    2. Constructs an HTML <img> tag string for the visualization image URL.
    """
    layout_results = (result or {}).get("layoutParsingResults", [])
    if not layout_results:
        return "No content was recognized.", "<p>No visualization available.</p>", ""

    page0 = layout_results[0] or {}

    # Step 1: Process Markdown content (unchanged from previous optimization)
    md_data = page0.get("markdown") or {}
    md_text = md_data.get("text", "") or ""
    md_images_map = md_data.get("images", {})
    if md_images_map:
        for placeholder_path, image_url in md_images_map.items():
            md_text = md_text.replace(f'src="{placeholder_path}"', f'src="{image_url}"') \
                             .replace(f']({placeholder_path})', f']({image_url})')

    # 【核心改动点】 Step 2: Process Visualization images by creating an HTML string
    output_html = "<p style='text-align:center; color:#888;'>No visualization image available.</p>"
    out_imgs = page0.get("outputImages") or {}
    
    # Get all image URLs and sort them
    sorted_urls = [img_url for _, img_url in sorted(out_imgs.items()) if img_url]

    # Logic to select the final visualization image URL
    output_image_url: Optional[str] = None
    if len(sorted_urls) >= 2:
        output_image_url = sorted_urls[1]
    elif sorted_urls:
        output_image_url = sorted_urls[0]

    # If a URL was found, create the <img> tag
    if output_image_url:
        print(f"Found visualization image URL: {output_image_url}")
        # The CSS will style this `img` tag because of the `#vis_image_doc img` selector
        output_html = f'<img src="{output_image_url}" alt="Detection Visualization">'
    else:
        print("Warning: No visualization image URL found in the API response.")

    md_text = _escape_inequalities_in_math(md_text)
    return md_text or "(Empty result)", output_html, md_text

# =========================
# Handlers
# =========================
def handle_complex_doc(file_path: str, use_chart_recognition: bool) -> Tuple[str, str, str]:
    if not file_path: raise gr.Error("Please upload an image first.")
    data = _call_api(DEFAULT_API_URL, file_path, use_layout_detection=True, prompt_label=None, use_chart_recognition=use_chart_recognition)
    result = data.get("result", {})
    # Note the return types now align with the new function signature
    return _process_api_response_page(result)

def handle_targeted_recognition(file_path: str, prompt_choice: str) -> Tuple[str, str]:
    if not file_path: raise gr.Error("Please upload an image first.")
    mapping = {"Text Recognition": "ocr", "Formula Recognition": "formula", "Table Recognition": "table", "Chart Recognition": "chart"}
    label = mapping.get(prompt_choice, "ocr")
    data = _call_api(DEFAULT_API_URL, file_path, use_layout_detection=False, prompt_label=label)
    result = data.get("result", {})
    md_preview, _, md_raw = _process_api_response_page(result)
    return md_preview, md_raw

# =========================
# CSS & UI
# =========================
custom_css = """
/* 全局字体 */
body, .gradio-container {
  font-family: "Noto Sans SC", "Microsoft YaHei", "PingFang SC", sans-serif;
}
/* ... (rest of the CSS is unchanged) ... */
.app-header { text-align: center; max-width: 900px; margin: 0 auto 8px !important; }
.gradio-container { padding: 4px 0 !important; }
.gradio-container [data-testid="tabs"], .gradio-container .tabs { margin-top: 0 !important; }
.gradio-container [data-testid="tabitem"], .gradio-container .tabitem { padding-top: 4px !important; }
.quick-links { text-align: center; padding: 8px 0; border: 1px solid #e5e7eb; border-radius: 8px; margin: 8px auto; max-width: 900px; }
.quick-links a { margin: 0 12px; font-size: 14px; font-weight: 600; color: #3b82f6; text-decoration: none; }
.quick-links a:hover { text-decoration: underline; }
.prompt-grid { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 6px; }
.prompt-grid button { height: 40px !important; padding: 0 12px !important; border-radius: 8px !important; font-weight: 600 !important; font-size: 13px !important; letter-spacing: 0.2px; }
#image_preview_vl, #image_preview_doc { height: 400px !important; overflow: auto; }
#image_preview_vl img, #image_preview_doc img, #vis_image_doc img { width: 100% !important; height: auto !important; object-fit: contain !important; display: block; }
#md_preview_vl, #md_preview_doc { max-height: 540px; min-height: 180px; overflow: auto; scrollbar-gutter: stable both-edges; }
#md_preview_vl .prose, #md_preview_doc .prose { line-height: 1.7 !important; }
#md_preview_vl .prose img, #md_preview_doc .prose img { display: block; margin: 0 auto; max-width: 100%; height: auto; }
.notice { margin: 8px auto 0; max-width: 900px; padding: 10px 12px; border: 1px solid #e5e7eb; border-radius: 8px; background: #f8fafc; font-size: 14px; line-height: 1.6; }
.notice strong { font-weight: 700; }
.notice a { color: #3b82f6; text-decoration: none; }
.notice a:hover { text-decoration: underline; }
"""

with gr.Blocks(head=GOOGLE_FONTS_URL, css=custom_css, theme=gr.themes.Soft()) as demo:
    logo_data_url = image_to_base64_data_url(LOGO_IMAGE_PATH) if os.path.exists(LOGO_IMAGE_PATH) else ""
    gr.HTML(f"""<div class="app-header"><img src="{logo_data_url}" alt="App Logo" style="max-height:10%; width: auto; margin: 10px auto; display: block;"></div>""")
    gr.HTML("""<div class="notice"><strong>Heads up:</strong> The Hugging Face demo can be slow at times. For a faster experience, please try <a href="https://aistudio.baidu.com/application/detail/98365" target="_blank" rel="noopener noreferrer">Baidu AI Studio</a> or <a href="https://modelscope.cn/studios/PaddlePaddle/PaddleOCR-VL_Online_Demo/summary" target="_blank" rel="noopener noreferrer">ModelScope</a>.</div>""")
    gr.HTML("""<div class="quick-links"><a href="https://github.com/PaddlePaddle/PaddleOCR" target="_blank">GitHub</a> | <a href="https://ernie.baidu.com/blog/publication/PaddleOCR-VL_Technical_Report.pdf" target="_blank">Technical Report</a> | <a href="https://huggingface.co/PaddlePaddle/PaddleOCR-VL" target="_blank">Model</a></div>""")
    
    with gr.Tabs():
        with gr.Tab("Document Parsing"):
            with gr.Row():
                with gr.Column(scale=5):
                    file_doc = gr.File(label="Upload Image", file_count="single", type="filepath", file_types=["image"])
                    preview_doc_html = gr.HTML(value="", elem_id="image_preview_doc", visible=False)
                    gr.Markdown("_( Use this mode for recognizing full-page documents with structured layouts, such as reports, papers, or magazines.)_")
                    gr.Markdown("💡 *To recognize a single, pre-cropped element (e.g., a table or formula), switch to the 'Element-level Recognition' tab for better results.*")
                    with gr.Row(variant="panel"):
                        chart_parsing_switch = gr.Checkbox(label="Enable chart parsing", value=False, scale=1)
                        btn_parse = gr.Button("Parse Document", variant="primary", scale=2)
                    if complex_document_examples:
                        complex_paths = [e[0] for e in complex_document_examples]
                        complex_state = gr.State(complex_paths)
                        gr.Markdown("**Document Examples (Click an image to load)**")
                        gallery_complex = gr.Gallery(value=complex_paths, columns=4, height=400, preview=False, label=None, allow_preview=False)
                        gallery_complex.select(fn=_on_gallery_select, inputs=[complex_state], outputs=[file_doc])

                with gr.Column(scale=7):
                    with gr.Tabs():
                        with gr.Tab("Markdown Preview"):
                            md_preview_doc = gr.Markdown("Please upload an image and click 'Parse Document'.", latex_delimiters=LATEX_DELIMS, elem_id="md_preview_doc")
                        with gr.Tab("Visualization"):
                            # 【核心改动点】: 将 gr.Image 替换为 gr.HTML
                            vis_image_doc = gr.HTML(label="Detection Visualization", elem_id="vis_image_doc")
                        with gr.Tab("Markdown Source"):
                            md_raw_doc = gr.Code(label="Markdown Source Code", language="markdown")

            file_doc.change(fn=update_preview_visibility, inputs=[file_doc], outputs=[preview_doc_html])
            btn_parse.click(fn=handle_complex_doc, inputs=[file_doc, chart_parsing_switch], outputs=[md_preview_doc, vis_image_doc, md_raw_doc])

        with gr.Tab("Element-level Recognition"):
            with gr.Row():
                with gr.Column(scale=5):
                    file_vl = gr.File(label="Upload Image", file_count="single", type="filepath", file_types=["image"])
                    preview_vl_html = gr.HTML(value="", elem_id="image_preview_vl", visible=False)
                    gr.Markdown("_(Best for images with a **simple, single-column layout** (e.g., pure text), or for a **pre-cropped single element** like a table, formula, or chart.)_")
                    gr.Markdown("Choose a recognition type:")
                    with gr.Row(elem_classes=["prompt-grid"]):
                        btn_ocr = gr.Button("Text Recognition", variant="secondary")
                        btn_formula = gr.Button("Formula Recognition", "secondary")
                    with gr.Row(elem_classes=["prompt-grid"]):
                        btn_table = gr.Button("Table Recognition", variant="secondary")
                        btn_chart = gr.Button("Chart Recognition", variant="secondary")
                    if targeted_recognition_examples:
                        targeted_paths = [e[0] for e in targeted_recognition_examples]
                        targeted_state = gr.State(targeted_paths)
                        gr.Markdown("**Element-level Recognition Examples (Click an image to load)**")
                        gallery_targeted = gr.Gallery(value=targeted_paths, columns=4, height=400, preview=False, label=None, allow_preview=False)
                        gallery_targeted.select(fn=_on_gallery_select, inputs=[targeted_state], outputs=[file_vl])

                with gr.Column(scale=7):
                    with gr.Tabs():
                        with gr.Tab("Recognition Result"):
                            md_preview_vl = gr.Markdown("Please upload an image and click a recognition type.", latex_delimiters=LATEX_DELIMS, elem_id="md_preview_vl")
                        with gr.Tab("Raw Output"):
                            md_raw_vl = gr.Code(label="Raw Output", language="markdown")

            file_vl.change(fn=update_preview_visibility, inputs=[file_vl], outputs=[preview_vl_html])
            btn_ocr.click(fn=handle_targeted_recognition, inputs=[file_vl, gr.State("Text Recognition")], outputs=[md_preview_vl, md_raw_vl])
            btn_formula.click(fn=handle_targeted_recognition, inputs=[file_vl, gr.State("Formula Recognition")], outputs=[md_preview_vl, md_raw_vl])
            btn_table.click(fn=handle_targeted_recognition, inputs=[file_vl, gr.State("Table Recognition")], outputs=[md_preview_vl, md_raw_vl])
            btn_chart.click(fn=handle_targeted_recognition, inputs=[file_vl, gr.State("Chart Recognition")], outputs=[md_preview_vl, md_raw_vl])

if __name__ == "__main__":
    port = int(os.getenv("PORT", "7860"))
    demo.queue(max_size=6).launch(server_name="0.0.0.0", server_port=port,share=False)