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); | |
| }); | |
| // Load MathJax and MathPix Markdown-It scripts | |
| const script1 = document.createElement('script'); | |
| script1.src = "https://cdn.jsdelivr.net/npm/[email protected]/es5/bundle.js"; | |
| document.head.appendChild(script1); | |
| script1.onload = function() { | |
| const script2 = document.createElement('script'); | |
| script2.src = "https://polyfill.io/v3/polyfill.min.js?features=es6"; | |
| document.head.appendChild(script2); | |
| script2.onload = function() { | |
| const script3 = document.createElement('script'); | |
| script3.type = 'text/javascript'; | |
| script3.textContent = ` | |
| window.onload = function() { | |
| const isLoaded = window.loadMathJax(); | |
| if (isLoaded) { | |
| console.log('Styles loaded!'); | |
| } | |
| const results = ${JSON.stringify(results)}; | |
| results.forEach(result => { | |
| const contentDiv = document.getElementById(\`result-content-\${result.page_number}\`); | |
| const loadingDiv = document.getElementById(\`loading-indicator-\${result.page_number}\`); | |
| if (contentDiv) { | |
| const options = { | |
| htmlTags: true | |
| }; | |
| const html = window.render(result.text, options); | |
| contentDiv.innerHTML = html; | |
| loadingDiv.style.display = 'none'; | |
| contentDiv.style.display = 'block'; | |
| } | |
| }); | |
| }; | |
| `; | |
| document.head.appendChild(script3); | |
| }; | |
| }; | |
| }); | |
| </script> | |
| </head> | |
| <body> | |
| <h1>OCR Results</h1> | |
| <div id="results-container" class="scrollable-results"></div> | |
| </body> | |
| </html> |