Spaces:
Sleeping
Sleeping
File size: 3,183 Bytes
aceb54a da60b63 aceb54a da60b63 b68dea1 da60b63 aceb54a da60b63 555f91b aceb54a |
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 |
<!DOCTYPE html>
<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> |