Update static/script.js

static/script.js

@@ -47,8 +47,8 @@ function handleResponse(userInput) {
             { text: 'Both', class: 'gray' }
         ];
     } else if (lastMessage.includes('vegetarian') || lastMessage.includes('non-vegetarian') || lastMessage.includes('both')) {
-        botResponse = `Great choice! 🍽️ These are the available ingredients for ${lastMessage}:`;
-        fetchIngredients(lastMessage);
+        botResponse = `Great choice! 🍽️ These are the available ingredients for ${lastMessage} (including any "Both" category):`;
+        fetchIngredients(lastMessage.toLowerCase());
         return;
     }
 
@@ -75,6 +75,7 @@ function fetchIngredients(dietaryPreference) {
             addMessage('bot', 'Great choice! These are available ingredients:');
             displayIngredientsList(ingredients);
             displaySelectedIngredients();
+            // Log ingredients to console for debugging
             console.log(`Ingredients fetched for ${dietaryPreference}:`, ingredients);
         }
     })
@@ -106,7 +107,7 @@ function displayIngredientsList(ingredients) {
         img.src = ingredient.image_url || 'https://via.placeholder.com/80';
         img.alt = ingredient.name;
         const name = document.createElement('div');
-        name.textContent = ingredient.name;
+        name.textContent = ingredient.name; // Removed category from display
         name.style.textAlign = 'center';
         name.style.marginTop = '5px';
         name.style.fontSize = '12px';
@@ -143,7 +144,7 @@ function displaySelectedIngredients() {
 
     selectedIngredients.forEach(ingredient => {
         const div = document.createElement('div');
-        div.textContent = ingredient.name;
+        div.textContent = ingredient.name; // Removed category from display
         selectedArea.appendChild(div);
     });
 }
@@ -154,8 +155,6 @@ function displayOptions(options) {
         console.error('Chat messages container not found for options!');
         return;
     }
-    // Clear existing options and messages
-    chatMessages.innerHTML = '';
     options.forEach(opt => {
         const button = document.createElement('button');
         button.textContent = opt.text;
@@ -163,7 +162,9 @@ function displayOptions(options) {
         button.onclick = () => {
             addMessage('user', opt.text);
             conversation.push({ role: 'user', message: opt.text });
-            handleResponse(opt.text); // Directly handle response without clearing
+            chatMessages.innerHTML = ''; // Clear previous messages
+            conversation.forEach(msg => addMessage(msg.role, msg.message));
+            setTimeout(() => handleResponse(opt.text), 500);
         };
         chatMessages.appendChild(button);
     });
@@ -172,16 +173,11 @@ function displayOptions(options) {
     backButton.textContent = 'Go Back';
     backButton.className = 'option-button';
     backButton.onclick = () => {
-        conversation = [{ role: 'bot', message: 'Hi there! I\'m Chef Bot! May I know your name?' }]; // Reset conversation
+        conversation.pop(); // Remove last user input
         selectedIngredients = []; // Clear selected ingredients
-        chatMessages.innerHTML = ''; // Clear messages
-        const userName = conversation[0].message.split('!')[0].split('name?')[0].trim().split(' ')[4]; // Extract name
-        addMessage('bot', `Nice to meet you, ${userName}! 😊 Let's create your perfect meal! What type of food would you prefer?`);
-        displayOptions([
-            { text: 'Vegetarian', class: 'green' },
-            { text: 'Non-Vegetarian', class: 'red' },
-            { text: 'Both', class: 'gray' }
-        ]);
+        chatMessages.innerHTML = ''; // Clear previous messages
+        conversation.forEach(msg => addMessage(msg.role, msg.message));
+        setTimeout(() => handleResponse(conversation[conversation.length - 1].message), 500);
     };
     chatMessages.appendChild(backButton);
 }