Upload index.html
Browse files- templates /index.html +92 -0
templates /index.html
ADDED
@@ -0,0 +1,92 @@
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
1 |
+
<!DOCTYPE html>
|
2 |
+
<html lang="en">
|
3 |
+
<head>
|
4 |
+
<meta charset="UTF-8">
|
5 |
+
<title>BiDirectional Auto Regressive Transformer</title>
|
6 |
+
<link rel = "stylesheet" href ="{{url_for('static', filename ='style.css')}}">
|
7 |
+
</head>
|
8 |
+
|
9 |
+
<body>
|
10 |
+
<div class="container">
|
11 |
+
<div class = left-container>
|
12 |
+
|
13 |
+
<div class="upload-container">
|
14 |
+
<form action="{{url_for('upload_file')}}" method="post" enctype="multipart/form-data">
|
15 |
+
<label for="File-upload" class="upload-label">
|
16 |
+
Click here to upload PDF
|
17 |
+
</label>
|
18 |
+
<input type= "file" name ="file" id="file-upload" class="upload-input" accept="application/pdf">
|
19 |
+
<div class="button-container">
|
20 |
+
<button type="submit" class="upload-button">Upload PDF</button>
|
21 |
+
</div>
|
22 |
+
</form>
|
23 |
+
</div>
|
24 |
+
|
25 |
+
<div class="Output-container">
|
26 |
+
<label for="output-label" class="output-label">
|
27 |
+
<h3>Summarization :</h3>
|
28 |
+
</label>
|
29 |
+
<textarea id="summary-output" class="output-box" readonly>
|
30 |
+
{{ summary if summary else '' }}
|
31 |
+
</textarea>
|
32 |
+
</div>
|
33 |
+
|
34 |
+
</div>
|
35 |
+
|
36 |
+
<div class="right-container">
|
37 |
+
<div class="description-container">
|
38 |
+
<label for="input-label" class="input-label">
|
39 |
+
<h3>Enter Text :</h3>
|
40 |
+
</label>
|
41 |
+
</div>
|
42 |
+
|
43 |
+
<div class="input-container">
|
44 |
+
<textarea id="text-input" class="input-box" placeholder="Enter the text here...">
|
45 |
+
</textarea>
|
46 |
+
<button type="submit" style="--clr:#604cc3" class="enter-button" onclick="submitText()">
|
47 |
+
Enter
|
48 |
+
</button>
|
49 |
+
</div>
|
50 |
+
|
51 |
+
<div class="visual-container">
|
52 |
+
</div>
|
53 |
+
|
54 |
+
</div>
|
55 |
+
|
56 |
+
</div>
|
57 |
+
<script>
|
58 |
+
function typeText(element, text, speed){
|
59 |
+
let i = 0;
|
60 |
+
element.value = "";
|
61 |
+
|
62 |
+
function type(){
|
63 |
+
if(i < text.length){
|
64 |
+
element.value += text.charAt(i)
|
65 |
+
i++;
|
66 |
+
setTimeout(type, speed)
|
67 |
+
}
|
68 |
+
}
|
69 |
+
type();
|
70 |
+
}
|
71 |
+
|
72 |
+
function submitText() {
|
73 |
+
const inputText = document.getElementById('text-input').value;
|
74 |
+
const summaryOutput = document.getElementById('summary-output');
|
75 |
+
fetch('/summarize', {
|
76 |
+
method: 'POST',
|
77 |
+
headers: {
|
78 |
+
'Content-Type': 'application/json'
|
79 |
+
},
|
80 |
+
body: JSON.stringify({ text: inputText })
|
81 |
+
})
|
82 |
+
.then(response => response.json())
|
83 |
+
.then(data => {
|
84 |
+
summaryOutput.classList.add('updated')
|
85 |
+
typeText(summaryOutput, data.summary, 50);
|
86 |
+
setTimeout(() => summaryOutput.classList.remove('updated'), 1000);
|
87 |
+
})
|
88 |
+
.catch(error => console.error('Error:', error));
|
89 |
+
}
|
90 |
+
</script>
|
91 |
+
</body>
|
92 |
+
</html>
|