acharyaaditya26 commited on
Commit
da60b63
1 Parent(s): 305b703
Files changed (4) hide show
  1. app.py +3 -5
  2. static/style.css +9 -18
  3. templates/index.html +0 -1
  4. 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
- html_output = "".join([result["html"] for result in results])
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, html_output = run_GOT(temp_pdf_path)
118
  temp_dir.cleanup()
119
 
120
- return templates.TemplateResponse("result.html", {"request": request, "json_output": json_output, "html_output": html_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
- h1, h2 {
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
- iframe {
27
- border: 1px solid #ccc;
28
- border-radius: 5px;
 
 
 
 
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 Result</title>
6
  <link href="/static/style.css" rel="stylesheet">
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
7
  </head>
8
  <body>
9
- <h1>OCR Result</h1>
10
- <div id="json-output">
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>