Update static/script.js

static/script.js

@@ -45,27 +45,20 @@ function handleResponse(userInput) {
         botResponse = `Nice to meet you, ${userInput}! 😊 Let's create your perfect meal! What type of food would you prefer?`;
         options = [
             { text: 'Vegetarian', class: 'green' },
-            { text: 'Non-Vegetarian', class: 'red' }
+            { text: 'Non-Vegetarian', class: 'red' },
+            { text: 'Both', class: 'gray' }
         ];
-    } else if (lastMessage.includes('vegetarian') || lastMessage.includes('non-vegetarian')) {
-        if (lastMessage.includes('vegetarian')) {
-            conversation.push({ role: 'user', message: 'Vegetarian' });
-            console.log("Food preference selected: Vegetarian");
-            botResponse = 'Great choice! 🍽️ Here are some vegetarian ingredients:';
-            fetchIngredients('vegetable');
-        } else if (lastMessage.includes('non-vegetarian')) {
-            conversation.push({ role: 'user', message: 'Non-Vegetarian' });
-            console.log("Food preference selected: Non-Vegetarian");
-            botResponse = 'Great choice! 🍽️ Here are some non-vegetarian ingredients:';
-            fetchIngredients('non-vegetarian');
-        }
+    } else if (lastMessage.includes('vegetarian') || lastMessage.includes('non-vegetarian') || lastMessage.includes('both')) {
+        let dietaryPreference = lastMessage;
+        botResponse = `Great choice! 🍽️ These are the available ingredients for ${lastMessage}:`;
+        fetchIngredients(dietaryPreference);
         return;
     } else if (selectedIngredients.length > 0) {
         fetchMenuItemsByIngredients();
         return;
     } else if (lastMessage.includes('yes') && selectedMenuItem) {
         botResponse = 'Here are some ingredients to customize your dish:';
-        fetchIngredients('non-vegetarian'); // Fetch non-veg ingredients for customization
+        fetchIngredients('both'); // Allow customization from all ingredients
         return;
     } else if (lastMessage.includes('no') && selectedMenuItem) {
         addToCart(selectedMenuItem);
@@ -83,13 +76,13 @@ function handleResponse(userInput) {
     }
 }
 
-function fetchIngredients(foodPreference) {
+function fetchIngredients(dietaryPreference) {
     fetch('/get_ingredients', {
         method: 'POST',
         headers: {
             'Content-Type': 'application/json',
         },
-        body: JSON.stringify({ dietary_preference: foodPreference })
+        body: JSON.stringify({ dietary_preference: dietaryPreference.toLowerCase() })
     })
     .then(response => response.json())
     .then(data => {
@@ -97,9 +90,10 @@ function fetchIngredients(foodPreference) {
             addMessage('bot', `Sorry, there was an error fetching ingredients: ${data.error}`);
         } else {
             const ingredients = data.ingredients || [];
-            addMessage('bot', 'Please select ingredients:');
+            addMessage('bot', 'Great choice! These are available ingredients:');
             displayIngredientsList(ingredients);
             displaySelectedIngredients();
+            console.log(`Ingredients fetched for ${dietaryPreference}:`, ingredients);
         }
     })
     .catch(error => {
@@ -303,6 +297,8 @@ function displayOptions(options) {
         console.error('Chat messages container not found for options!');
         return;
     }
+    // Clear existing content
+    chatMessages.innerHTML = '';
     options.forEach(opt => {
         const button = document.createElement('button');
         button.textContent = opt.text;
@@ -310,9 +306,7 @@ function displayOptions(options) {
         button.onclick = () => {
             addMessage('user', opt.text);
             conversation.push({ role: 'user', message: opt.text });
-            chatMessages.innerHTML = '';
-            conversation.forEach(msg => addMessage(msg.role, msg.message));
-            setTimeout(() => handleResponse(opt.text), 500);
+            handleResponse(opt.text); // Process the selection immediately
         };
         chatMessages.appendChild(button);
     });
@@ -321,20 +315,27 @@ function displayOptions(options) {
     backButton.textContent = 'Go Back';
     backButton.className = 'option-button';
     backButton.onclick = () => {
-        conversation.pop();
+        // Reset conversation to initial state
+        const userName = conversation.length > 1 ? conversation[1].message : 'User';
+        conversation = [{ role: 'bot', message: `Hi there! I'm Chef Bot! May I know your name?` }, { role: 'user', message: userName }, { role: 'bot', message: `Nice to meet you, ${userName}! 😊 Let's create your perfect meal! What type of food would you prefer?` }];
         selectedIngredients = [];
-        selectedMenuItem = null;
         chatMessages.innerHTML = '';
         conversation.forEach(msg => addMessage(msg.role, msg.message));
-        setTimeout(() => handleResponse(conversation[conversation.length - 1].message), 500);
+        displayOptions([
+            { text: 'Vegetarian', class: 'green' },
+            { text: 'Non-Vegetarian', class: 'red' },
+            { text: 'Both', class: 'gray' }
+        ]);
     };
     chatMessages.appendChild(backButton);
 }
 
+// Add event listener for Enter key
 document.getElementById('userInput').addEventListener('keypress', function(e) {
     if (e.key === 'Enter') {
         sendMessage();
     }
 });
 
+// Initial load check
 console.log('Script loaded successfully');