Update static/script.js

static/script.js

@@ -28,10 +28,7 @@ function sendMessage() {
         addMessage('user', message);
         conversation.push({ role: 'user', message: message });
         userInput.value = '';
-
-        setTimeout(() => {
-            handleResponse(message);
-        }, 500);
+        setTimeout(() => handleResponse(message), 500);
     } else {
         console.warn('Empty message!');
     }
@@ -49,27 +46,20 @@ function handleResponse(userInput) {
             { text: 'Non-Vegetarian', class: 'red' }
         ];
     } else if (lastMessage.includes('vegetarian')) {
-        botResponse = 'Great choice! 🍽️ We have some amazing vegetarian options! What\'s your dietary preference?';
-        options = [
-            { text: 'Vegan', class: '' },
-            { text: 'Gluten-Free', class: '' },
-            { text: 'Vegetarian', class: '' },
-            { text: 'Low Carb', class: '' },
-            { text: 'Dairy-Free', class: '' },
-            { text: 'Keto', class: '' },
-            { text: 'Halal', class: '' }
-        ];
+        botResponse = 'Great choice! 🍽️ Fetching vegetarian ingredients...';
+        fetchIngredients('veg');
     } else if (lastMessage.includes('non-vegetarian')) {
-        botResponse = 'Great choice! 🍽️ We have some amazing non-vegetarian options! What\'s your dietary preference?';
+        botResponse = 'Great choice! 🍽️ Fetching non-vegetarian ingredients...';
+        fetchIngredients('non-vegetarian');
+    } else if (selectedIngredients.length > 0 && lastMessage === 'suggest') {
+        botResponse = 'Generating food suggestions based on your ingredients...';
+        getFoodSuggestions();
+    } else if (lastMessage === 'done') {
+        botResponse = 'Thank you! Would you like to start over or suggest recipes with your selected ingredients?';
         options = [
-            { text: 'Low Carb', class: '' },
-            { text: 'Dairy-Free', class: '' },
-            { text: 'Keto', class: '' },
-            { text: 'Halal', class: '' }
+            { text: 'Start Over', class: '' },
+            { text: 'Suggest', class: '' }
         ];
-    } else if (lastMessage.includes('low carb') || lastMessage.includes('dairy-free') || lastMessage.includes('keto') || lastMessage.includes('halal') || lastMessage.includes('gluten-free') || lastMessage.includes('vegan') || lastMessage.includes('vegetarian')) {
-        fetchIngredients(lastMessage);
-        return; // Exit early to handle ingredients fetch
     }
 
     addMessage('bot', botResponse);
@@ -92,9 +82,9 @@ function fetchIngredients(dietaryPreference) {
             addMessage('bot', `Sorry, there was an error fetching ingredients: ${data.error}`);
         } else {
             const ingredients = data.ingredients || [];
-            addMessage('bot', 'Great choice! These are available ingredients:');
+            addMessage('bot', 'Here are the available ingredients:');
             displayIngredientsList(ingredients);
-            displaySelectedIngredients();
+            addMessage('bot', 'Please select ingredients (click to add) and type "done" when finished, or type "suggest" to get recipe ideas.');
         }
     })
     .catch(error => {
@@ -109,7 +99,6 @@ function displayIngredientsList(ingredients) {
         return;
     }
 
-    // Create or update ingredients list
     let ingredientsList = document.querySelector('.ingredients-list');
     if (!ingredientsList) {
         ingredientsList = document.createElement('div');
@@ -139,7 +128,6 @@ function displaySelectedIngredients() {
         return;
     }
 
-    // Create or update selected ingredients area
     let selectedArea = document.querySelector('.selected-ingredients');
     if (!selectedArea) {
         selectedArea = document.createElement('div');
@@ -158,6 +146,33 @@ function displaySelectedIngredients() {
     }
 }
 
+function getFoodSuggestions() {
+    fetch('/get_food_suggestions', {
+        method: 'POST',
+        headers: {
+            'Content-Type': 'application/json',
+        },
+        body: JSON.stringify({ ingredients: selectedIngredients })
+    })
+    .then(response => response.json())
+    .then(data => {
+        if (data.error) {
+            addMessage('bot', `Sorry, there was an error getting suggestions: ${data.error}`);
+        } else {
+            addMessage('bot', 'Here are some food suggestions based on your ingredients:');
+            data.suggestions.forEach(suggestion => addMessage('bot', suggestion));
+            addMessage('bot', 'Would you like to start over or select more ingredients?');
+            displayOptions([
+                { text: 'Start Over', class: '' },
+                { text: 'Select More', class: '' }
+            ]);
+        }
+    })
+    .catch(error => {
+        addMessage('bot', `Error: Unable to get food suggestions. ${error.message}`);
+    });
+}
+
 function displayOptions(options) {
     const chatMessages = document.getElementById('chatMessages');
     if (!chatMessages) {
@@ -173,7 +188,16 @@ function displayOptions(options) {
             conversation.push({ role: 'user', message: opt.text });
             chatMessages.innerHTML = ''; // Clear previous messages
             conversation.forEach(msg => addMessage(msg.role, msg.message));
-            setTimeout(() => handleResponse(opt.text), 500);
+            if (opt.text.toLowerCase() === 'suggest') {
+                getFoodSuggestions();
+            } else if (opt.text.toLowerCase() === 'start over') {
+                conversation = [{ role: 'bot', message: 'Hi there! I\'m Chef Bot! May I know your name?' }];
+                selectedIngredients = [];
+                chatMessages.innerHTML = '';
+                conversation.forEach(msg => addMessage(msg.role, msg.message));
+            } else {
+                setTimeout(() => handleResponse(opt.text), 500);
+            }
         };
         chatMessages.appendChild(button);
     });