Update templates/index.html

templates/index.html

@@ -313,7 +313,7 @@
             </div>  
         </div>  
 
-        <!-- Header -->  
+        <!-- Header   -->
         <div class="header">TAJ HOTEL CHATBOT</div>  
 
         <!-- Chatbox -->  
@@ -321,10 +321,18 @@
 
         <!-- Footer -->  
         <div class="footer">  
-            <input type="text" id="user-input" placeholder="Type your message..." />  
-            <button id="send-btn">Send</button>  
-            <button id="voice-btn">🎤 Start Voice Input</button>  
-        </div>  
+          <input type="text" id="user-input" placeholder="Type your message..." />  
+          <button id="send-btn">Send</button>  
+          <button id="voice-btn">🎤 Start Voice Input</button>  
+      
+          <!-- Language dropdown -->
+          <select id="language-select">
+              <option value="english" selected>English</option>
+              <option value="telugu">Telugu</option>
+              <option value="hindi">Hindi</option>
+          </select>
+        </div>
+       
     </div>  
 
     <script>  
@@ -333,6 +341,7 @@
         const sendBtn = document.getElementById('send-btn');  
         const userInput = document.getElementById('user-input');  
         const themeSelect = document.getElementById('theme-select');  
+        const languageSelect = document.getElementById('language-select');
 
         // Add message to chatbox with visual effects  
         function addMessage(sender, text) {  
@@ -368,26 +377,32 @@
             }  
         }  
 
-        // Send user input to backend (placeholder URL)  
-        function sendUserMessage(message) {  
-            fetch('/chat', {  
-                method: 'POST',  
-                headers: {  
-                    'Content-Type': 'application/json',  
-                },  
-                body: JSON.stringify({ message: message }),  
-            })  
-                .then(response => response.json())  
-                .then(data => {  
-                    const botResponse = data.response;  
-                    addMessage('bot-message', botResponse);  
-                    speakResponse(botResponse);  
-                })  
-                .catch(error => {  
-                    console.error("Error:", error);  
-                    addMessage('bot-message', "Sorry, I couldn't process that.");  
-                });  
-        }  
+        // Function to send user input and selected language to backend
+        function sendUserMessage(message) {
+            const selectedLanguage = languageSelect.value; // Get the selected language
+    
+            // Send the message and selected language to the backend
+            fetch('/chat', {
+                method: 'POST',
+                headers: {
+                    'Content-Type': 'application/json',
+                },
+                body: JSON.stringify({
+                    message: message,
+                    language: selectedLanguage, // Include the selected language in the request body
+                }),
+            })
+            .then(response => response.json())
+            .then(data => {
+                const botResponse = data.response;
+                addMessage('bot-message', botResponse);
+                speakResponse(botResponse);
+            })
+            .catch(error => {
+                console.error("Error:", error);
+                addMessage('bot-message', "Sorry, I couldn't process that.");
+            });
+        }
 
         // Text-to-Speech Function  
         function speakResponse(text) {