Update static/index.html

static/index.html

@@ -19,7 +19,7 @@
         form {
             margin-bottom: 20px;
         }
-        input[type="file"], input[type="text"], button {
+        input[type="file"], input[type="text"], textarea, button {
             display: block;
             margin: 10px 0;
             padding: 10px;
@@ -41,27 +41,31 @@
         <h2>Document Summarization</h2>
         <form id="summarizeForm">
             <input type="file" id="document" name="document" accept=".pdf,.docx">
+            <p>Or</p>
+            <textarea id="manualText" name="text" placeholder="Enter text manually"></textarea>
             <button type="submit">Summarize</button>
         </form>
         <div class="result" id="summaryResult"></div>
 
-        <!-- Image Captioning -->
-        <h2>Image Captioning</h2>
-        <form id="captionForm">
-            <input type="file" id="image" name="image" accept=".jpg,.jpeg,.png">
-            <button type="submit">Generate Caption</button>
-        </form>
-        <div class="result" id="captionResult"></div>
-
         <!-- Text-Based Question Answering -->
         <h2>Text-Based Question Answering</h2>
         <form id="qaForm">
             <input type="file" id="qaDocument" name="document" accept=".pdf,.docx">
+            <p>Or</p>
+            <textarea id="qaText" name="text" placeholder="Enter text manually"></textarea>
             <input type="text" id="question" name="question" placeholder="Enter your question">
             <button type="submit">Ask</button>
         </form>
         <div class="result" id="qaResult"></div>
 
+        <!-- Image Captioning -->
+        <h2>Image Captioning</h2>
+        <form id="captionForm">
+            <input type="file" id="image" name="image" accept=".jpg,.jpeg,.png">
+            <button type="submit">Generate Caption</button>
+        </form>
+        <div class="result" id="captionResult"></div>
+
         <!-- Visual Question Answering -->
         <h2>Visual Question Answering</h2>
         <form id="vqaForm">
@@ -78,11 +82,20 @@
             event.preventDefault();
             const formData = new FormData();
             const fileInput = event.target.querySelector('input[type="file"]');
-            const textInput = event.target.querySelector('input[type="text"]');
+            const textInput = event.target.querySelector('textarea');
+            const questionInput = event.target.querySelector('input[type="text"]');
+
+            if (fileInput.files[0]) {
+                formData.append("file", fileInput.files[0]);
+            } else if (textInput && textInput.value) {
+                formData.append("text", textInput.value);
+            } else {
+                alert("Please upload a file or enter text manually.");
+                return;
+            }
 
-            formData.append("file", fileInput.files[0]);
-            if (textInput) {
-                formData.append("question", textInput.value);
+            if (questionInput) {
+                formData.append("question", questionInput.value);
             }
 
             const response = await fetch(endpoint, {
@@ -95,8 +108,8 @@
 
         // Attach event listeners to forms
         document.getElementById("summarizeForm").onsubmit = (e) => handleFormSubmit(e, "/summarize", "summaryResult");
-        document.getElementById("captionForm").onsubmit = (e) => handleFormSubmit(e, "/caption", "captionResult");
         document.getElementById("qaForm").onsubmit = (e) => handleFormSubmit(e, "/answer", "qaResult");
+        document.getElementById("captionForm").onsubmit = (e) => handleFormSubmit(e, "/caption", "captionResult");
         document.getElementById("vqaForm").onsubmit = (e) => handleFormSubmit(e, "/vqa", "vqaResult");
     </script>
 </body>