Update templates/customdish.html

templates/customdish.html

@@ -391,35 +391,30 @@
 
     <script>
         let currentStep = 'greeting';  // other possible values: 'food_type', 'select_ingredients', 'menu_display', 'customization', 'post_cart'
-
-        let conversation = [
-            { role: 'bot', message: "Hi there! I'm Chef Bot! May I know your name?" }
-        ];
+        let conversation = [];
         let selectedIngredients = [];
         let selectedMenuItem = null;
         let cart = [];
-        // Simulate sending a message automatically when the page loads
+        
         window.onload = function() {
-            // You can check if the name is in the sessionStorage and decide when to send a message
+            // Check if the name is in sessionStorage
             if (sessionStorage.getItem('user_name')) {
-                // If user is logged in and name exists in sessionStorage, greet the user
-                setTimeout(() => {
-                    const userInput = sessionStorage.getItem('user_name');  // Get the user's name from session
-                    addMessage('user', userInput);  // Optionally, you can add the user's name to the chat
-                    handleResponse(userInput);  // Automatically call handleResponse to continue the conversation
-                }, 500);  // Delay before sending the message automatically
+                // If the user is logged in and name exists in sessionStorage, greet the user
+                const userName = sessionStorage.getItem('user_name');  // Get the user's name from session
+                conversation.push({ role: 'bot', message: `Nice to meet you, ${userName}! 😊 Let's create your perfect meal! What type of food would you prefer?` });
+                displayConversation();  // Function to display the conversation
+                displayOptions([
+                    { text: 'Vegetarian', class: 'green' },
+                    { text: 'Non-Vegetarian', class: 'red' }
+                ]);
             } else {
                 // If name is not in session, ask for the name
-                setTimeout(() => {
-                    const message = "Hi there! I'm Chef Bot! May I know your name?";  // Set the default message
-                    addMessage('bot', message);  // Add this message to the chat
-                }, 500);
-            }
+                conversation.push({ role: 'bot', message: "Hi there! I'm Chef Bot! May I know your name?" });
+                displayConversation();  // Function to display the conversation
+                    }
         };
-
-
-
-
+        
+        // Function to add messages to the chat
         function addMessage(role, message) {
             const chatMessages = document.getElementById('chatMessages');
             if (!chatMessages) {
@@ -431,10 +426,22 @@
             messageDiv.textContent = message;
             chatMessages.appendChild(messageDiv);
             chatMessages.scrollTop = chatMessages.scrollHeight;
-            console.log(`Added ${role} message: ${message}`);
         }
 
-        // Modified sendMessage function to be triggered automatically
+        // Function to display all conversation messages
+        function displayConversation() {
+            const chatMessages = document.getElementById('chatMessages');
+            chatMessages.innerHTML = '';  // Clear previous messages
+            conversation.forEach(msg => {
+                const messageDiv = document.createElement('div');
+                messageDiv.className = msg.role === 'bot' ? 'bot-message' : 'user-message';
+                messageDiv.textContent = msg.message;
+                chatMessages.appendChild(messageDiv);
+            });
+            chatMessages.scrollTop = chatMessages.scrollHeight;  // Scroll to bottom
+        }
+        
+        // Modified sendMessage function to be triggered automatically or by the user
         function sendMessage() {
             const userInput = document.getElementById('userInput').value.trim();
             if (userInput) {