Update app.py, structured_ocr.py, and UI layout

app.py

@@ -531,7 +531,7 @@ if 'last_processed_file' not in st.session_state:
 if 'perform_reset' not in st.session_state:
     st.session_state.perform_reset = False
 
-# Check if we need to perform a complete reset (coming from "Close Document" button)
+# Check if we need to perform a complete reset (coming from "X Close" button)
 if 'perform_reset' in st.session_state and st.session_state.perform_reset:
     # List of all session state keys that should be reset, except previous_results
     reset_keys = [key for key in list(st.session_state.keys()) 
@@ -2290,7 +2290,7 @@ with main_tab1:
                             st.session_state.temp_file_paths = []
                     
                     # Create the close button with a callback
-                    st.button("✕ Close Document", 
+                    st.button("X Close", 
                               key="close_document_button", 
                               help="Clear current document and start over",
                               on_click=clear_document_state)
@@ -2519,22 +2519,18 @@ with main_tab1:
         # Sample document URLs dropdown with clearer label
         sample_urls = [
             "Select a sample document",
-            "https://huggingface.co/spaces/milwright/historical-ocr/resolve/main/input/a-la-carte.pdf",
             "https://huggingface.co/spaces/milwright/historical-ocr/resolve/main/input/magician-or-bottle-cungerer.jpg",
             "https://huggingface.co/spaces/milwright/historical-ocr/resolve/main/input/handwritten-letter.jpg",
             "https://huggingface.co/spaces/milwright/historical-ocr/resolve/main/input/magellan-travels.jpg",
-            "https://huggingface.co/spaces/milwright/historical-ocr/resolve/main/input/milgram-flier.png",
-            "https://huggingface.co/spaces/milwright/historical-ocr/resolve/main/input/baldwin-15st-north.jpg"
+            "https://huggingface.co/spaces/milwright/historical-ocr/resolve/main/input/milgram-flier.png"
         ]
         
         sample_names = [
             "Select a sample document",
-            "Restaurant Menu (PDF)",
             "The Magician (Image)",
             "Handwritten Letter (Image)",
             "Magellan Travels (Image)",
-            "Milgram Flier (Image)",
-            "Baldwin Street (Image)"
+            "Milgram Flier (Image)"
         ]
         
         # Initialize sample_document in session state if it doesn't exist

structured_ocr.py

@@ -469,9 +469,9 @@ class StructuredOCR:
                                     try:
                                         page_result = self._process_image(Path(tmp.name), False, None)
                                         if 'ocr_contents' in page_result and 'raw_text' in page_result['ocr_contents']:
-                                            # Add page text to combined text
+                                            # Add page text to combined text without obvious page markers
                                             page_text = page_result['ocr_contents']['raw_text']
-                                            combined_text.append(f"--- PAGE {page_num} ---\n{page_text}")
+                                            combined_text.append(f"{page_text}")
                                     except Exception as page_e:
                                         logger.warning(f"Error processing page {page_num}: {str(page_e)}")
                                     # Clean up temp file
@@ -729,9 +729,9 @@ class StructuredOCR:
                         page_num = idx + 1
                         
                     page_markdown = page.markdown if hasattr(page, 'markdown') else ""
-                    # Add page header if content exists
+                    # Add page content without obvious page markers
                     if page_markdown.strip():
-                        all_markdown.append(f"--- PAGE {page_num} ---\n{page_markdown}")
+                        all_markdown.append(f"{page_markdown}")
                     
                 # Join all pages with separation
                 combined_markdown = "\n\n".join(all_markdown)

ui/layout.py

@@ -1,172 +1,27 @@
+"""
+UI layout components for the OCR application.
+"""
+
+import os
 import streamlit as st
 from pathlib import Path
-import os
 
-# Load custom CSS
 def load_css():
-    css_file = Path(__file__).parent / "custom.css"
-    if css_file.exists():
-        with open(css_file) as f:
-            st.markdown(f"<style>{f.read()}</style>", unsafe_allow_html=True)
-    else:
-        st.warning("Custom CSS file not found. Some styles may be missing.")
-
-# Header component
-def header():
-    st.markdown("""
-    <div class="main-header">
-        <h1 class="title-text">Historical OCR Workshop</h1>
-    </div>
-    """, unsafe_allow_html=True)
-
-# Create a page wrapper similar to the React component
-def page_wrapper(content_function, current_module=1):
-    """
-    Creates a consistent page layout with navigation
-    Args:
-        content_function: Function that renders the page content
-        current_module: Current module number (1-6)
-    """
-    # Load custom CSS
-    load_css()
-    
-    # Display header
-    header()
+    """Load custom CSS for the application."""
+    # Get the directory of the current file
+    current_dir = Path(os.path.dirname(os.path.abspath(__file__)))
     
-    # Ensure session state for navigation
-    if 'current_module' not in st.session_state:
-        st.session_state.current_module = current_module
+    # Path to the CSS file
+    css_file = current_dir / "custom.css"
     
-    # Main content area with bottom padding for the nav
-    st.markdown('<div class="main-content">', unsafe_allow_html=True)
+    # Check if the file exists
+    if not css_file.exists():
+        st.warning(f"Custom CSS file not found at {css_file}")
+        return
     
-    # Call the content function to render the module content
-    content_function()
-    
-    # Add spacer for fixed nav
-    st.markdown('<div class="footer-spacer"></div>', unsafe_allow_html=True)
-    
-    # Navigation
-    render_navigation(current_module)
-    
-    st.markdown('</div>', unsafe_allow_html=True)
-
-# Navigation component
-def render_navigation(current_module):
-    # Define modules names like in React
-    modules = ['Introduction', 'Historical Context', 'Methodology', 'Case Studies', 'Interactive OCR', 'Conclusion']
-    
-    # Navigation container
-    st.markdown(f"""
-    <div class="nav-container">
-        <div class="nav-buttons">
-            {prev_button_html(current_module, modules)}
-            {next_button_html(current_module, modules)}
-        </div>
-        
-        <div class="nav-dots">
-            {nav_dots_html(current_module, modules)}
-        </div>
-    </div>
-    """, unsafe_allow_html=True)
-
-# Previous button HTML
-def prev_button_html(current_module, modules):
-    if current_module > 1:
-        prev_module = current_module - 1
-        return f"""
-        <button class="prev-button" 
-                onclick="document.getElementById('nav_prev_{prev_module}').click()"
-                aria-label="Go to previous module: {modules[prev_module-1]}">
-            ← Previous
-        </button>
-        """
-    return ""
-
-# Next button HTML
-def next_button_html(current_module, modules):
-    if current_module < len(modules):
-        next_module = current_module + 1
-        return f"""
-        <button class="next-button" 
-                onclick="document.getElementById('nav_next_{next_module}').click()"
-                aria-label="Go to next module: {modules[next_module-1]}">
-            Next →
-        </button>
-        """
-    return ""
-
-# Navigation dots HTML
-def nav_dots_html(current_module, modules):
-    dots_html = ""
-    for i, name in enumerate(modules, 1):
-        active_class = "active" if i == current_module else ""
-        dots_html += f"""
-        <a class="nav-dot {active_class}" 
-           onclick="document.getElementById('nav_dot_{i}').click()" 
-           aria-current="{i == current_module}" 
-           aria-label="Go to module {i}: {name}">
-            {i}
-        </a>
-        """
-    return dots_html
-
-# Helper functions for container styles
-def gray_container(content, padding="1.5rem"):
-    """Renders content in a gray container with consistent styling"""
-    st.markdown(f'<div class="content-container" style="padding:{padding};">{content}</div>', unsafe_allow_html=True)
-
-def blue_container(content, padding="1.5rem"):
-    """Renders content in a blue container with consistent styling"""
-    st.markdown(f'<div class="blue-container" style="padding:{padding};">{content}</div>', unsafe_allow_html=True)
-
-def yellow_container(content, padding="1.5rem"):
-    """Renders content in a yellow container with consistent styling"""
-    st.markdown(f'<div class="yellow-container" style="padding:{padding};">{content}</div>', unsafe_allow_html=True)
-
-def card_grid(cards):
-    """
-    Renders a responsive grid of cards
-    Args:
-        cards: List of HTML strings for each card
-    """
-    grid_html = '<div class="card-grid">'
-    for card in cards:
-        grid_html += f'<div class="card">{card}</div>'
-    grid_html += '</div>'
+    # Read the CSS content
+    with open(css_file) as f:
+        css_content = f.read()
     
-    st.markdown(grid_html, unsafe_allow_html=True)
-
-def module_card(number, title, description):
-    """Creates a styled module card"""
-    return f"""
-    <div class="module-card">
-        <div class="module-number">Module {number}</div>
-        <div class="module-title">{title}</div>
-        <p>{description}</p>
-    </div>
-    """
-
-def key_concept(content):
-    """Renders a key concept box"""
-    st.markdown(f'<div class="key-concept">{content}</div>', unsafe_allow_html=True)
-
-def research_question(content):
-    """Renders a research question box"""
-    st.markdown(f'<div class="research-question">{content}</div>', unsafe_allow_html=True)
-
-def quote(content, author=""):
-    """Renders a quote with optional author"""
-    quote_html = f'<div class="quote-container">{content}'
-    if author:
-        quote_html += f'<br/><br/><span style="font-size:0.9rem; text-align:right; display:block;">— {author}</span>'
-    quote_html += '</div>'
-    st.markdown(quote_html, unsafe_allow_html=True)
-
-def tool_container(content):
-    """Renders content in a tool container"""
-    st.markdown(f'<div class="tool-container">{content}</div>', unsafe_allow_html=True)
-
-def upload_container(content):
-    """Renders content in an upload container"""
-    st.markdown(f'<div class="upload-container">{content}</div>', unsafe_allow_html=True)
+    # Apply the CSS
+    st.markdown(f"<style>{css_content}</style>", unsafe_allow_html=True)