devatar commited on
Commit
77a6099
·
verified ·
1 Parent(s): 5a61fda

Update templates/index.html

Browse files
Files changed (1) hide show
  1. templates/index.html +111 -0
templates/index.html CHANGED
@@ -0,0 +1,111 @@
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ <!DOCTYPE html>
2
+ <html lang="en">
3
+ <head>
4
+ <meta charset="UTF-8">
5
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
+ <title>PDF Translator</title>
7
+ <style>
8
+ body {
9
+ font-family: Arial, sans-serif;
10
+ max-width: 800px;
11
+ margin: 0 auto;
12
+ padding: 20px;
13
+ }
14
+ h1 {
15
+ text-align: center;
16
+ }
17
+ .form-container {
18
+ border: 1px solid #ccc;
19
+ padding: 20px;
20
+ border-radius: 5px;
21
+ }
22
+ label {
23
+ display: block;
24
+ margin: 10px 0 5px;
25
+ }
26
+ input, button {
27
+ width: 100%;
28
+ padding: 8px;
29
+ margin-bottom: 10px;
30
+ }
31
+ button {
32
+ background-color: #4CAF50;
33
+ color: white;
34
+ border: none;
35
+ cursor: pointer;
36
+ }
37
+ button:hover {
38
+ background-color: #45a049;
39
+ }
40
+ #status {
41
+ margin-top: 20px;
42
+ font-weight: bold;
43
+ }
44
+ #download-links {
45
+ margin-top: 20px;
46
+ }
47
+ .download-link {
48
+ display: block;
49
+ margin: 5px 0;
50
+ color: #007BFF;
51
+ text-decoration: none;
52
+ }
53
+ </style>
54
+ </head>
55
+ <body>
56
+ <h1>PDF Translator</h1>
57
+ <p>Upload a PDF and translate it into Hindi, Tamil, or Telugu.</p>
58
+ <div class="form-container">
59
+ <form id="translate-form" enctype="multipart/form-data">
60
+ <label for="pdf_file">Upload PDF:</label>
61
+ <input type="file" id="pdf_file" name="pdf_file" accept=".pdf" required>
62
+
63
+ <label for="entities">Entities to Preserve (comma-separated):</label>
64
+ <input type="text" id="entities" name="entities" placeholder="Optional">
65
+
66
+ <label for="languages">Target Languages (comma-separated):</label>
67
+ <input type="text" id="languages" name="languages" placeholder="Hindi, Tamil, Telugu" value="Hindi,Tamil,Telugu">
68
+
69
+ <button type="submit">Translate</button>
70
+ </form>
71
+ <div id="status"></div>
72
+ <div id="download-links"></div>
73
+ </div>
74
+
75
+ <script>
76
+ document.getElementById('translate-form').addEventListener('submit', async (e) => {
77
+ e.preventDefault();
78
+ const formData = new FormData();
79
+ formData.append('pdf_file', document.getElementById('pdf_file').files[0]);
80
+ formData.append('entities', document.getElementById('entities').value);
81
+ formData.append('languages', document.getElementById('languages').value);
82
+
83
+ document.getElementById('status').textContent = 'Translating...';
84
+ document.getElementById('download-links').innerHTML = '';
85
+
86
+ try {
87
+ const response = await fetch('/translate', {
88
+ method: 'POST',
89
+ body: formData
90
+ });
91
+ const result = await response.json();
92
+ if (response.ok) {
93
+ document.getElementById('status').textContent = result.message;
94
+ result.files.forEach(file => {
95
+ const link = document.createElement('a');
96
+ link.href = `/download/${file}`;
97
+ link.textContent = `Download ${file}`;
98
+ link.className = 'download-link';
99
+ document.getElementById('download-links').appendChild(link);
100
+ });
101
+ } else {
102
+ document.getElementById('status').textContent = `Error: ${result.error}`;
103
+ }
104
+ } catch (error) {
105
+ document.getElementById('status').textContent = 'Error: Something went wrong.';
106
+ console.error(error);
107
+ }
108
+ });
109
+ </script>
110
+ </body>
111
+ </html>