|
|
|
|
|
""" |
|
|
UltraData Math Parser - Hugging Face Space Demo |
|
|
A unified HTML parser optimized for extracting mathematical content. |
|
|
""" |
|
|
|
|
|
import gradio as gr |
|
|
from ultradata_math_parser import GeneralParser |
|
|
|
|
|
|
|
|
def parse_html( |
|
|
html_content: str, |
|
|
base_url: str = "", |
|
|
process_math: bool = True, |
|
|
include_tables: bool = True, |
|
|
enable_forum_assembly: bool = True, |
|
|
html_type: str = "unified", |
|
|
) -> dict: |
|
|
""" |
|
|
Parse HTML content using GeneralParser. |
|
|
|
|
|
Args: |
|
|
html_content: Raw HTML string to parse |
|
|
base_url: Base URL for resolving relative links |
|
|
process_math: Whether to process and convert math expressions |
|
|
include_tables: Whether to preserve table elements |
|
|
enable_forum_assembly: Whether to enable forum post assembly |
|
|
html_type: Parser type (unified/article/forum) |
|
|
|
|
|
Returns: |
|
|
Dictionary containing parsed results |
|
|
""" |
|
|
if not html_content or not html_content.strip(): |
|
|
return { |
|
|
"title": "", |
|
|
"html": "", |
|
|
"text": "", |
|
|
"text_length": 0, |
|
|
"xp_num": "", |
|
|
"fallback_strategy": "", |
|
|
"forum_assembled": False, |
|
|
"error": "Please provide HTML content to parse.", |
|
|
} |
|
|
|
|
|
parser = GeneralParser() |
|
|
|
|
|
try: |
|
|
result = parser.extract( |
|
|
html=html_content, |
|
|
base_url=base_url, |
|
|
process_math=process_math, |
|
|
include_tables=include_tables, |
|
|
enable_forum_assembly=enable_forum_assembly, |
|
|
html_type=html_type, |
|
|
) |
|
|
|
|
|
return { |
|
|
"title": result.get("title", ""), |
|
|
"html": result.get("html", ""), |
|
|
"text": result.get("text", ""), |
|
|
"text_length": result.get("text_length", 0), |
|
|
"xp_num": result.get("xp_num", ""), |
|
|
"fallback_strategy": result.get("fallback_strategy", ""), |
|
|
"forum_assembled": result.get("forum_assembled", False), |
|
|
"error": None, |
|
|
} |
|
|
except Exception as e: |
|
|
return { |
|
|
"title": "", |
|
|
"html": "", |
|
|
"text": "", |
|
|
"text_length": 0, |
|
|
"xp_num": "", |
|
|
"fallback_strategy": "", |
|
|
"forum_assembled": False, |
|
|
"error": str(e), |
|
|
} |
|
|
|
|
|
|
|
|
def format_output(result: dict) -> tuple: |
|
|
"""Format the parser output for Gradio display.""" |
|
|
if result.get("error"): |
|
|
return ( |
|
|
f"❌ Error: {result['error']}", |
|
|
"", |
|
|
"", |
|
|
"", |
|
|
"", |
|
|
) |
|
|
|
|
|
|
|
|
metadata = f"""📊 **Parsing Statistics** |
|
|
- **Title**: {result['title'] or 'N/A'} |
|
|
- **Text Length**: {result['text_length']} characters |
|
|
- **XPath Match**: {result['xp_num']} |
|
|
- **Fallback Strategy**: {result['fallback_strategy']} |
|
|
- **Forum Assembled**: {'✅ Yes' if result['forum_assembled'] else '❌ No'} |
|
|
""" |
|
|
|
|
|
return ( |
|
|
metadata, |
|
|
result.get("title", ""), |
|
|
result.get("html", ""), |
|
|
result.get("text", ""), |
|
|
result.get("html", ""), |
|
|
) |
|
|
|
|
|
|
|
|
def process_input(html_content, base_url, process_math, include_tables, enable_forum, html_type): |
|
|
"""Main processing function for Gradio interface.""" |
|
|
result = parse_html( |
|
|
html_content=html_content, |
|
|
base_url=base_url, |
|
|
process_math=process_math, |
|
|
include_tables=include_tables, |
|
|
enable_forum_assembly=enable_forum, |
|
|
html_type=html_type, |
|
|
) |
|
|
return format_output(result) |
|
|
|
|
|
|
|
|
|
|
|
EXAMPLE_HTML = """<!DOCTYPE html> |
|
|
<html> |
|
|
<head> |
|
|
<title>Quadratic Formula Example</title> |
|
|
</head> |
|
|
<body> |
|
|
<article class="post-content"> |
|
|
<h1>Understanding the Quadratic Formula</h1> |
|
|
<p>The quadratic formula is used to solve equations of the form ax² + bx + c = 0.</p> |
|
|
<p>The solution is given by:</p> |
|
|
<math xmlns="http://www.w3.org/1998/Math/MathML"> |
|
|
<mi>x</mi> |
|
|
<mo>=</mo> |
|
|
<mfrac> |
|
|
<mrow> |
|
|
<mo>-</mo> |
|
|
<mi>b</mi> |
|
|
<mo>±</mo> |
|
|
<msqrt> |
|
|
<mrow> |
|
|
<msup><mi>b</mi><mn>2</mn></msup> |
|
|
<mo>-</mo> |
|
|
<mn>4</mn> |
|
|
<mi>a</mi> |
|
|
<mi>c</mi> |
|
|
</mrow> |
|
|
</msqrt> |
|
|
</mrow> |
|
|
<mrow> |
|
|
<mn>2</mn> |
|
|
<mi>a</mi> |
|
|
</mrow> |
|
|
</mfrac> |
|
|
</math> |
|
|
<p>Where a, b, and c are coefficients of the quadratic equation.</p> |
|
|
<h2>Example Problem</h2> |
|
|
<p>Solve: x² - 5x + 6 = 0</p> |
|
|
<p>Here, a = 1, b = -5, c = 6</p> |
|
|
<p>Using the formula: x = (5 ± √(25-24))/2 = (5 ± 1)/2</p> |
|
|
<p>Therefore, x = 3 or x = 2</p> |
|
|
</article> |
|
|
<footer> |
|
|
<nav>Related articles...</nav> |
|
|
</footer> |
|
|
</body> |
|
|
</html>""" |
|
|
|
|
|
|
|
|
|
|
|
custom_css = """ |
|
|
@import url('https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@400;500&family=Space+Grotesk:wght@400;500;600;700&display=swap'); |
|
|
|
|
|
.gradio-container { |
|
|
font-family: 'Space Grotesk', sans-serif !important; |
|
|
background: linear-gradient(135deg, #0f0f23 0%, #1a1a3e 50%, #0f0f23 100%) !important; |
|
|
min-height: 100vh; |
|
|
} |
|
|
|
|
|
.main-title { |
|
|
font-family: 'Space Grotesk', sans-serif !important; |
|
|
font-weight: 700 !important; |
|
|
font-size: 2.5rem !important; |
|
|
background: linear-gradient(90deg, #00d4ff, #7c3aed, #f472b6) !important; |
|
|
-webkit-background-clip: text !important; |
|
|
-webkit-text-fill-color: transparent !important; |
|
|
background-clip: text !important; |
|
|
text-align: center !important; |
|
|
margin-bottom: 0.5rem !important; |
|
|
} |
|
|
|
|
|
.subtitle { |
|
|
text-align: center !important; |
|
|
color: #94a3b8 !important; |
|
|
font-size: 1.1rem !important; |
|
|
margin-bottom: 2rem !important; |
|
|
} |
|
|
|
|
|
.gr-box { |
|
|
border-radius: 12px !important; |
|
|
border: 1px solid rgba(124, 58, 237, 0.3) !important; |
|
|
background: rgba(15, 15, 35, 0.8) !important; |
|
|
backdrop-filter: blur(10px) !important; |
|
|
} |
|
|
|
|
|
.gr-input, .gr-textarea { |
|
|
font-family: 'JetBrains Mono', monospace !important; |
|
|
background: rgba(30, 30, 60, 0.6) !important; |
|
|
border: 1px solid rgba(124, 58, 237, 0.4) !important; |
|
|
border-radius: 8px !important; |
|
|
color: #e2e8f0 !important; |
|
|
} |
|
|
|
|
|
.gr-button-primary { |
|
|
background: linear-gradient(135deg, #7c3aed 0%, #00d4ff 100%) !important; |
|
|
border: none !important; |
|
|
font-weight: 600 !important; |
|
|
font-size: 1rem !important; |
|
|
padding: 12px 32px !important; |
|
|
border-radius: 8px !important; |
|
|
transition: all 0.3s ease !important; |
|
|
text-transform: uppercase !important; |
|
|
letter-spacing: 1px !important; |
|
|
} |
|
|
|
|
|
.gr-button-primary:hover { |
|
|
transform: translateY(-2px) !important; |
|
|
box-shadow: 0 8px 25px rgba(124, 58, 237, 0.4) !important; |
|
|
} |
|
|
|
|
|
.gr-button-secondary { |
|
|
background: transparent !important; |
|
|
border: 2px solid rgba(124, 58, 237, 0.5) !important; |
|
|
color: #a78bfa !important; |
|
|
font-weight: 500 !important; |
|
|
border-radius: 8px !important; |
|
|
} |
|
|
|
|
|
.section-header { |
|
|
color: #00d4ff !important; |
|
|
font-weight: 600 !important; |
|
|
font-size: 1.2rem !important; |
|
|
margin-bottom: 1rem !important; |
|
|
padding-bottom: 0.5rem !important; |
|
|
border-bottom: 2px solid rgba(0, 212, 255, 0.3) !important; |
|
|
} |
|
|
|
|
|
.output-box { |
|
|
background: rgba(20, 20, 45, 0.9) !important; |
|
|
border: 1px solid rgba(0, 212, 255, 0.3) !important; |
|
|
border-radius: 12px !important; |
|
|
padding: 1rem !important; |
|
|
} |
|
|
|
|
|
.gr-markdown { |
|
|
color: #e2e8f0 !important; |
|
|
} |
|
|
|
|
|
.gr-markdown code { |
|
|
background: rgba(124, 58, 237, 0.2) !important; |
|
|
padding: 2px 6px !important; |
|
|
border-radius: 4px !important; |
|
|
font-family: 'JetBrains Mono', monospace !important; |
|
|
} |
|
|
|
|
|
footer { |
|
|
display: none !important; |
|
|
} |
|
|
|
|
|
.gr-accordion { |
|
|
border: 1px solid rgba(124, 58, 237, 0.3) !important; |
|
|
border-radius: 8px !important; |
|
|
background: rgba(20, 20, 45, 0.6) !important; |
|
|
} |
|
|
|
|
|
.gr-check-radio { |
|
|
accent-color: #7c3aed !important; |
|
|
} |
|
|
|
|
|
label { |
|
|
color: #cbd5e1 !important; |
|
|
} |
|
|
""" |
|
|
|
|
|
|
|
|
with gr.Blocks(css=custom_css, title="UltraData Math Parser") as demo: |
|
|
gr.HTML('<h1 class="main-title">📐 UltraData Math Parser</h1>') |
|
|
gr.HTML('<p class="subtitle">Unified HTML Parser for Mathematical Content Extraction</p>') |
|
|
|
|
|
with gr.Row(): |
|
|
with gr.Column(scale=1): |
|
|
gr.HTML('<div class="section-header">📥 Input</div>') |
|
|
|
|
|
html_input = gr.Textbox( |
|
|
label="HTML Content", |
|
|
placeholder="Paste your HTML content here...", |
|
|
lines=15, |
|
|
max_lines=30, |
|
|
value=EXAMPLE_HTML, |
|
|
) |
|
|
|
|
|
base_url_input = gr.Textbox( |
|
|
label="Base URL (Optional)", |
|
|
placeholder="https://example.com/page", |
|
|
lines=1, |
|
|
) |
|
|
|
|
|
with gr.Accordion("⚙️ Advanced Options", open=False): |
|
|
html_type = gr.Radio( |
|
|
choices=["unified", "article", "forum"], |
|
|
value="unified", |
|
|
label="Parser Type", |
|
|
info="Select the parsing strategy", |
|
|
) |
|
|
process_math = gr.Checkbox( |
|
|
label="Process Math Expressions", |
|
|
value=True, |
|
|
info="Convert MathML and LaTeX to unified format", |
|
|
) |
|
|
include_tables = gr.Checkbox( |
|
|
label="Include Tables", |
|
|
value=True, |
|
|
info="Preserve table elements in output", |
|
|
) |
|
|
enable_forum = gr.Checkbox( |
|
|
label="Enable Forum Assembly", |
|
|
value=True, |
|
|
info="Assemble forum posts and comments", |
|
|
) |
|
|
|
|
|
with gr.Row(): |
|
|
parse_btn = gr.Button("🚀 Parse HTML", variant="primary", size="lg") |
|
|
clear_btn = gr.Button("🗑️ Clear", variant="secondary", size="lg") |
|
|
|
|
|
with gr.Column(scale=1): |
|
|
gr.HTML('<div class="section-header">📤 Output</div>') |
|
|
|
|
|
metadata_output = gr.Markdown( |
|
|
label="Parsing Statistics", |
|
|
elem_classes=["output-box"], |
|
|
) |
|
|
|
|
|
title_output = gr.Textbox( |
|
|
label="Extracted Title", |
|
|
lines=1, |
|
|
interactive=False, |
|
|
) |
|
|
|
|
|
with gr.Tabs(): |
|
|
with gr.TabItem("📝 Raw HTML"): |
|
|
html_output = gr.Textbox( |
|
|
label="Extracted HTML", |
|
|
lines=12, |
|
|
max_lines=20, |
|
|
interactive=False, |
|
|
) |
|
|
with gr.TabItem("📄 Plain Text"): |
|
|
text_output = gr.Textbox( |
|
|
label="Plain Text (w3m rendered)", |
|
|
lines=12, |
|
|
max_lines=20, |
|
|
interactive=False, |
|
|
) |
|
|
with gr.TabItem("👁️ Preview"): |
|
|
preview_output = gr.HTML( |
|
|
label="HTML Preview", |
|
|
) |
|
|
|
|
|
|
|
|
parse_btn.click( |
|
|
fn=process_input, |
|
|
inputs=[html_input, base_url_input, process_math, include_tables, enable_forum, html_type], |
|
|
outputs=[metadata_output, title_output, html_output, text_output, preview_output], |
|
|
) |
|
|
|
|
|
def clear_all(): |
|
|
return "", "", "", "", "", "", "" |
|
|
|
|
|
clear_btn.click( |
|
|
fn=clear_all, |
|
|
outputs=[html_input, base_url_input, metadata_output, title_output, html_output, text_output, preview_output], |
|
|
) |
|
|
|
|
|
|
|
|
gr.HTML(""" |
|
|
<div style="text-align: center; margin-top: 2rem; padding: 1rem; color: #64748b; font-size: 0.9rem;"> |
|
|
<p>🔬 <strong>UltraData Math Parser</strong> - Part of the UltraData-Math Project</p> |
|
|
<p>Specialized in extracting mathematical content from web pages with MathML, LaTeX, and formula support.</p> |
|
|
</div> |
|
|
""") |
|
|
|
|
|
|
|
|
if __name__ == "__main__": |
|
|
demo.launch() |
|
|
|
