Spaces:
Sleeping
Sleeping
Commit
·
da60b63
1
Parent(s):
305b703
changes
Browse files- app.py +3 -5
- static/style.css +9 -18
- templates/index.html +0 -1
- templates/result.html +29 -11
app.py
CHANGED
|
@@ -85,8 +85,7 @@ def run_GOT(pdf_file):
|
|
| 85 |
if os.path.exists(pdf_path):
|
| 86 |
os.remove(pdf_path)
|
| 87 |
|
| 88 |
-
|
| 89 |
-
return json.dumps(results, indent=4), html_output
|
| 90 |
|
| 91 |
def cleanup_old_files():
|
| 92 |
current_time = time.time()
|
|
@@ -114,8 +113,7 @@ async def upload_file(request: Request, file: UploadFile = File(...)):
|
|
| 114 |
with open(temp_pdf_path, "wb") as buffer:
|
| 115 |
buffer.write(await file.read())
|
| 116 |
|
| 117 |
-
json_output,
|
| 118 |
temp_dir.cleanup()
|
| 119 |
|
| 120 |
-
return templates.TemplateResponse("result.html", {"request": request, "json_output": json_output, "
|
| 121 |
-
|
|
|
|
| 85 |
if os.path.exists(pdf_path):
|
| 86 |
os.remove(pdf_path)
|
| 87 |
|
| 88 |
+
return json.dumps(results, indent=4), results
|
|
|
|
| 89 |
|
| 90 |
def cleanup_old_files():
|
| 91 |
current_time = time.time()
|
|
|
|
| 113 |
with open(temp_pdf_path, "wb") as buffer:
|
| 114 |
buffer.write(await file.read())
|
| 115 |
|
| 116 |
+
json_output, results = run_GOT(temp_pdf_path)
|
| 117 |
temp_dir.cleanup()
|
| 118 |
|
| 119 |
+
return templates.TemplateResponse("result.html", {"request": request, "json_output": json_output, "results": results})
|
|
|
static/style.css
CHANGED
|
@@ -1,29 +1,20 @@
|
|
| 1 |
-
/* static/style.css */
|
| 2 |
body {
|
| 3 |
font-family: Arial, sans-serif;
|
| 4 |
margin: 20px;
|
| 5 |
}
|
| 6 |
|
| 7 |
-
|
| 8 |
-
color: #333;
|
| 9 |
-
}
|
| 10 |
-
|
| 11 |
-
form {
|
| 12 |
-
margin-bottom: 20px;
|
| 13 |
-
}
|
| 14 |
-
|
| 15 |
-
#json-output, #html-output {
|
| 16 |
margin-bottom: 20px;
|
| 17 |
-
|
| 18 |
-
|
| 19 |
-
pre {
|
| 20 |
-
background-color: #f4f4f4;
|
| 21 |
padding: 10px;
|
| 22 |
border-radius: 5px;
|
| 23 |
-
overflow-x: auto;
|
| 24 |
}
|
| 25 |
|
| 26 |
-
|
| 27 |
-
|
| 28 |
-
|
|
|
|
|
|
|
|
|
|
|
|
|
| 29 |
}
|
|
|
|
|
|
|
| 1 |
body {
|
| 2 |
font-family: Arial, sans-serif;
|
| 3 |
margin: 20px;
|
| 4 |
}
|
| 5 |
|
| 6 |
+
.page-result {
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
| 7 |
margin-bottom: 20px;
|
| 8 |
+
border: 1px solid #ccc;
|
|
|
|
|
|
|
|
|
|
| 9 |
padding: 10px;
|
| 10 |
border-radius: 5px;
|
|
|
|
| 11 |
}
|
| 12 |
|
| 13 |
+
.loading-indicator {
|
| 14 |
+
font-weight: bold;
|
| 15 |
+
color: #007bff;
|
| 16 |
+
}
|
| 17 |
+
|
| 18 |
+
.result-content {
|
| 19 |
+
margin-top: 10px;
|
| 20 |
}
|
templates/index.html
CHANGED
|
@@ -1,4 +1,3 @@
|
|
| 1 |
-
<!-- templates/index.html -->
|
| 2 |
<!DOCTYPE html>
|
| 3 |
<html>
|
| 4 |
<head>
|
|
|
|
|
|
|
| 1 |
<!DOCTYPE html>
|
| 2 |
<html>
|
| 3 |
<head>
|
templates/result.html
CHANGED
|
@@ -1,19 +1,37 @@
|
|
| 1 |
-
<!-- templates/result.html -->
|
| 2 |
<!DOCTYPE html>
|
| 3 |
<html>
|
| 4 |
<head>
|
| 5 |
-
<title>OCR
|
| 6 |
<link href="/static/style.css" rel="stylesheet">
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
| 7 |
</head>
|
| 8 |
<body>
|
| 9 |
-
<h1>OCR
|
| 10 |
-
<div id="
|
| 11 |
-
<h2>GOT Output</h2>
|
| 12 |
-
<pre>{{ json_output }}</pre>
|
| 13 |
-
</div>
|
| 14 |
-
<div id="html-output">
|
| 15 |
-
<h2>Rendered HTML</h2>
|
| 16 |
-
<iframe srcdoc="{{ html_output }}" width="100%" height="600px"></iframe>
|
| 17 |
-
</div>
|
| 18 |
</body>
|
| 19 |
</html>
|
|
|
|
|
|
|
| 1 |
<!DOCTYPE html>
|
| 2 |
<html>
|
| 3 |
<head>
|
| 4 |
+
<title>OCR Results</title>
|
| 5 |
<link href="/static/style.css" rel="stylesheet">
|
| 6 |
+
<script>
|
| 7 |
+
document.addEventListener("DOMContentLoaded", function() {
|
| 8 |
+
const results = {{ results | tojson | safe }};
|
| 9 |
+
const resultsContainer = document.getElementById('results-container');
|
| 10 |
+
|
| 11 |
+
results.forEach(result => {
|
| 12 |
+
const pageDiv = document.createElement('div');
|
| 13 |
+
pageDiv.className = 'page-result';
|
| 14 |
+
pageDiv.innerHTML = `
|
| 15 |
+
<h2>Page ${result.page_number}</h2>
|
| 16 |
+
<div class="loading-indicator" id="loading-indicator-${result.page_number}">Loading...</div>
|
| 17 |
+
<div class="result-content" id="result-content-${result.page_number}" style="display: none;">
|
| 18 |
+
${result.html}
|
| 19 |
+
</div>
|
| 20 |
+
`;
|
| 21 |
+
resultsContainer.appendChild(pageDiv);
|
| 22 |
+
});
|
| 23 |
+
|
| 24 |
+
results.forEach(result => {
|
| 25 |
+
const contentDiv = document.getElementById(`result-content-${result.page_number}`);
|
| 26 |
+
const loadingDiv = document.getElementById(`loading-indicator-${result.page_number}`);
|
| 27 |
+
loadingDiv.style.display = 'none';
|
| 28 |
+
contentDiv.style.display = 'block';
|
| 29 |
+
});
|
| 30 |
+
});
|
| 31 |
+
</script>
|
| 32 |
</head>
|
| 33 |
<body>
|
| 34 |
+
<h1>OCR Results</h1>
|
| 35 |
+
<div id="results-container"></div>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
| 36 |
</body>
|
| 37 |
</html>
|