From ac89e6b30b8da6a48a3b32ffd9b8955794f01ff9 Mon Sep 17 00:00:00 2001
From: "P.Varsha Sri" <22wh1a05c4@bvrithyderabad.edu.in>
Date: Fri, 8 Nov 2024 10:58:00 +0530
Subject: [PATCH] new chatbot changes are made

---
 chatbot.js | 15 +++++++++------
 index.html | 17 +++++++++++++++++
 2 files changed, 26 insertions(+), 6 deletions(-)

diff --git a/chatbot.js b/chatbot.js
index c8242c1..3c9d77e 100644
--- a/chatbot.js
+++ b/chatbot.js
@@ -55,20 +55,21 @@ function displayBotMessage(message) {
   chat.scrollTop = chat.scrollHeight;
 }
 
+// Send the user message and get the bot response
 // Send the user message and get the bot response
 async function sendMessage() {
   let input = document.getElementById("chatbot-input").value;
   if (input) {
     displayUserMessage(input);
     
+    // Clear the input field immediately after displaying the user message
+    document.getElementById("chatbot-input").value = "";
+
     // Wait for the chatbot response
-    let output = await chatbot(input); // Ensure this line is awaited
+    let output = await chatbot(input);
 
-    setTimeout(function () {
-      displayBotMessage(output);
-    }, 1000);
-    
-    document.getElementById("chatbot-input").value = "";
+    // Display the bot's response
+    displayBotMessage(output);
   }
 }
 
@@ -85,3 +86,5 @@ document
       sendMessage();
     }
   });
+
+  
diff --git a/index.html b/index.html
index 97f2605..b0e00e8 100644
--- a/index.html
+++ b/index.html
@@ -536,6 +536,23 @@ <h2>What type of transportation do you prefer for your travels?</h2>
         <input type="text" class="chatbot-input" id="chatbot-input" placeholder="Type your message here...." />
         <button class="chatbot-button" id="chatbot-button"><i class="fa-brands fa-telegram"></i></button>
     </div>
+    <script>
+        document.getElementById("chatbot-button").onclick = function() {
+            const inputField = document.getElementById("chatbot-input");
+            const message = inputField.value.trim();
+            
+            if (message) {
+                const chatContainer = document.getElementById("chatbot-chat");
+                const userMessage = document.createElement("div");
+                userMessage.className = "user-message";  // Add styling class as needed
+                userMessage.textContent = message;
+                chatContainer.appendChild(userMessage);
+    
+                // Clear the input field
+                inputField.value = "";
+            }
+        };
+    </script>
     <button onclick="moveToTop()" id="topBtn" title="Go to top"
         style="display:flex; position: fixed;  right: 30px; z-index: 100000;">
         <i class="fa fa-arrow-up" aria-hidden="true"></i>