Update templates/summarize.html

templates/summarize.html

@@ -47,7 +47,7 @@
 
     <textarea name="question" id="question" placeholder="Write your text here to summarize..."></textarea><br><br><br>
 
-    <button onclick=answer()>Start Summarizing</button>
+    <button onclick=answer() id="answer_button">Start Summarizing</button>
     <label for="type">Summarize to: </label>
     <select name="type" id="type">
         <option value="points">Points</option>
@@ -59,27 +59,33 @@
     <textarea name="answer" id="answer" placeholder="Summary will be displayed here..."></textarea>
     <script>
         async function answer() {
+            document.getElementById("answer_button").disabled = true
             const userInput = document.getElementById('question').value;
             if (userInput.trim() === '') return;
             const question = userInput;
             const type = document.getElementById("type").value;
             const num_of_lines_points = document.getElementById("lines_points").value;
-            const response = await fetch("/summarize", {
-                method: "POST",
-                headers: {
-                    "Content-Type": "application/x-www-form-urlencoded"
-                },
-                body: new URLSearchParams({ question: question, type: type, num_of_lines_points: num_of_lines_points })
-            });
-            const data = await response.json();
-            const answer_area = document.getElementById("answer");
-            if (data.answer) {
-                aiResponse = data.answer;
-                answer_area.value = aiResponse
-            } else if (data.error) {
-                aiResponse = "Error: " + data.error;
+            try {
+                const response = await fetch("/summarize", {
+                    method: "POST",
+                    headers: {
+                        "Content-Type": "application/x-www-form-urlencoded"
+                    },
+                    body: new URLSearchParams({ question: question, type: type, num_of_lines_points: num_of_lines_points })
+                });
+                const data = await response.json();
+                const answer_area = document.getElementById("answer");
+                if (data.answer) {
+                    aiResponse = data.answer;
+                } else if (data.error) {
+                    aiResponse = "Error: " + data.error;
+                }
                 answer_area.value = aiResponse
+            } catch (err) {
+                console.error("Fetch Error:", err);
+                document.getElementById("answer").value = err;
             }
+            document.getElementById("answer_button").disabled = false
         }
     </script>
 </body>