Spaces:
Sleeping
Sleeping
| <html> | |
| <head> | |
| <title>OCR Results</title> | |
| <link href="/static/style.css" rel="stylesheet"> | |
| <script> | |
| document.addEventListener("DOMContentLoaded", function() { | |
| const results = {{ results | tojson | safe }}; | |
| const resultsContainer = document.getElementById('results-container'); | |
| results.forEach(result => { | |
| const pageDiv = document.createElement('div'); | |
| pageDiv.className = 'page-result'; | |
| pageDiv.innerHTML = ` | |
| <h2>Page ${result.page_number}</h2> | |
| <div class="loading-indicator" id="loading-indicator-${result.page_number}">Loading...</div> | |
| <div class="result-content" id="result-content-${result.page_number}" style="display: none;"> | |
| ${result.html} | |
| </div> | |
| `; | |
| resultsContainer.appendChild(pageDiv); | |
| }); | |
| // Simulate loading for each page | |
| results.forEach((result, index) => { | |
| const contentDiv = document.getElementById(`result-content-${result.page_number}`); | |
| const loadingDiv = document.getElementById(`loading-indicator-${result.page_number}`); | |
| // Simulate a delay to mimic loading | |
| setTimeout(() => { | |
| loadingDiv.style.display = 'none'; | |
| contentDiv.style.display = 'block'; | |
| }, index * 2000); // Adjust the delay as needed | |
| }); | |
| }); | |
| </script> | |
| </head> | |
| <body> | |
| <h1>OCR Results</h1> | |
| <div id="results-container" class="scrollable-results"></div> | |
| </body> | |
| </html> |