Update static/script.js

static/script.js

@@ -1,8 +1,48 @@
+let chatHistory = []; // Keep track of chat history
+
+// Function to append new message to the chat
+function appendMessage(message, sender) {
+    const chatbotDiv = document.getElementById('chatbot');
+    const messageDiv = document.createElement('div');
+    messageDiv.classList.add('chat-message', `${sender}-message`);
+    messageDiv.innerHTML = message;
+    chatHistory.push({ sender, message });
+    chatbotDiv.appendChild(messageDiv);
+    chatbotDiv.scrollTop = chatbotDiv.scrollHeight; // Scroll to bottom
+}
+
+// Function to send user message
 function sendMessage() {
     const input = document.getElementById('user-input').value;
-    if (input) {
-        // Send message to Flask server (This would be integrated with Gradio's response mechanism)
-        // Placeholder for now
-        alert('Message sent: ' + input);
+    if (input.trim()) {
+        appendMessage(`You: ${input} 🎤`, 'user');
+        document.getElementById('user-input').value = ''; // Clear input field
+
+        // Simulate bot response
+        setTimeout(() => botReply(input), 1000);
+    }
+}
+
+// Function to simulate the chatbot's reply
+function botReply(userInput) {
+    let response = "";
+
+    // Fun, interactive bot responses with emojis
+    if (/yes|yeah/i.test(userInput)) {
+        response = "Yay! 🥳 Let's start customizing your meal! 🍽️";
+    } else if (/vegetarian/i.test(userInput)) {
+        response = "Yum, vegetarian food is so tasty! 🥦🍅 What do you want as your main ingredient? 🍆";
+    } else if (/non-vegetarian/i.test(userInput)) {
+        response = "Mmmm... Non-veg food incoming! 🍗🐟 What type of meat are you feeling today? 🥩";
+    } else if (/chicken/i.test(userInput)) {
+        response = "Nice choice! 🍗 You can go for a spicy chicken curry or grilled chicken! 😋";
+    } else if (/fish/i.test(userInput)) {
+        response = "Fish it is! 🐟 Grilled salmon or spicy fish curry? 🐠";
+    } else if (/cart/i.test(userInput)) {
+        response = "You got it! 🛒 Your cart is ready to go!";
+    } else {
+        response = "Hmm... I'm not sure about that. Can you ask something else? 🤔";
     }
+
+    appendMessage(response, 'bot');
 }