Update static/script.js

static/script.js

@@ -36,6 +36,7 @@ function sendMessage() {
     }
 }
 
+
 function handleResponse(userInput) {
     const lastMessage = conversation[conversation.length - 1].message.toLowerCase();
     let botResponse = '';
@@ -47,29 +48,19 @@ function handleResponse(userInput) {
             { text: 'Vegetarian', class: 'green' },
             { text: 'Non-Vegetarian', class: 'red' }
         ];
-    }else if (lastMessage.includes('non-vegetarian')) {
+    } else if (lastMessage.includes('non-vegetarian')) {
         conversation.push({ role: 'user', message: 'Non-Vegetarian' });
-        console.log("Food preference selected: Non-Vegetarian");
         botResponse = 'Great choice! 🍽️ Please select a non-vegetarian option:';
         fetchIngredients('non-vegetarian');
         return;
-
-    }
-    else if (lastMessage.includes('vegetarian')) {
+    } else 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('vegetarian');
         return;
-    } else if (lastMessage.includes('chicken') || lastMessage.includes('beef') || lastMessage.includes('lamb')) {
-        conversation.push({ role: 'user', message: lastMessage });
-        console.log(`Non-veg option selected: ${lastMessage}`);
-        botResponse = `Great! Here are some ${lastMessage} ingredients available:`;
-        fetchIngredients(lastMessage.toLowerCase());
-        return;
     } else if (lastMessage.includes('yes') && selectedMenuItem) {
-        botResponse = 'Here are some ingredients to customize your dish:';
-        fetchIngredients('both');  // Fetch non-veg ingredients for customization
+        botResponse = 'Here are some ingredients with both options:';
+        fetchIngredients('both');  // Show both vegetarian and non-vegetarian ingredients
         return;
     } else if (lastMessage.includes('no') && selectedMenuItem) {
         addToCart(selectedMenuItem);
@@ -111,29 +102,6 @@ function fetchIngredients(foodPreference) {
     });
 }
 
-function fetchMenuItems(category) {
-    fetch('/get_menu_items', {
-        method: 'POST',
-        headers: {
-            'Content-Type': 'application/json',
-        },
-        body: JSON.stringify({ category: category })
-    })
-    .then(response => response.json())
-    .then(data => {
-        if (data.error) {
-            addMessage('bot', `Sorry, there was an error fetching menu items: ${data.error}`);
-        } else {
-            const menuItems = data.menu_items || [];
-            addMessage('bot', 'Here are some dishes based on your selection:');
-            displayMenuItems(menuItems);
-        }
-    })
-    .catch(error => {
-        addMessage('bot', `Error: Unable to connect to the menu database. ${error.message}`);
-    });
-}
-
 function displayIngredientsList(ingredients) {
     const chatMessages = document.getElementById('chatMessages');
     if (!chatMessages) {
@@ -176,6 +144,85 @@ function displayIngredientsList(ingredients) {
     });
 }
 
+function displaySelectedIngredients() {
+    const chatMessages = document.getElementById('chatMessages');
+    if (!chatMessages) {
+        console.error('Chat messages container not found for selected ingredients!');
+        return;
+    }
+
+    let selectedArea = document.querySelector('.selected-ingredients');
+    if (!selectedArea) {
+        selectedArea = document.createElement('div');
+        selectedArea.className = 'selected-ingredients';
+        chatMessages.appendChild(selectedArea);
+    } else {
+        selectedArea.innerHTML = '';
+    }
+
+    selectedIngredients.forEach(ingredient => {
+        const div = document.createElement('div');
+        div.textContent = ingredient.name;
+        selectedArea.appendChild(div);
+    });
+
+    if (selectedIngredients.length > 0) {
+        let instructionsArea = document.querySelector('.instructions-area');
+        if (!instructionsArea) {
+            instructionsArea = document.createElement('div');
+            instructionsArea.className = 'instructions-area';
+            const textarea = document.createElement('textarea');
+            textarea.placeholder = 'Enter any special instructions...';
+            const submitButton = document.createElement('button');
+            submitButton.textContent = 'Submit';
+            submitButton.onclick = () => {
+                const instructions = textarea.value.trim();
+                if (instructions) {
+                    addMessage('user', instructions);
+                    conversation.push({ role: 'user', message: instructions });
+                }
+                addToCart({ ...selectedMenuItem, instructions, ingredients: selectedIngredients });
+                addMessage('bot', 'Item added to cart! Would you like to order more?');
+                const options = [
+                    { text: 'Yes', class: 'green' },
+                    { text: 'No', class: 'red' }
+                ];
+                displayOptions(options);
+                selectedMenuItem = null;
+                selectedIngredients = [];
+            };
+            instructionsArea.appendChild(textarea);
+            instructionsArea.appendChild(submitButton);
+            chatMessages.appendChild(instructionsArea);
+        }
+    }
+}
+
+
+function fetchMenuItems(category) {
+    fetch('/get_menu_items', {
+        method: 'POST',
+        headers: {
+            'Content-Type': 'application/json',
+        },
+        body: JSON.stringify({ category: category })
+    })
+    .then(response => response.json())
+    .then(data => {
+        if (data.error) {
+            addMessage('bot', `Sorry, there was an error fetching menu items: ${data.error}`);
+        } else {
+            const menuItems = data.menu_items || [];
+            addMessage('bot', 'Here are some dishes based on your selection:');
+            displayMenuItems(menuItems);
+        }
+    })
+    .catch(error => {
+        addMessage('bot', `Error: Unable to connect to the menu database. ${error.message}`);
+    });
+}
+
+
 function displayMenuItems(menuItems) {
     const chatMessages = document.getElementById('chatMessages');
     if (!chatMessages) {
@@ -221,39 +268,6 @@ function displayMenuItems(menuItems) {
     });
 }
 
-function displaySelectedIngredients() {
-    const chatMessages = document.getElementById('chatMessages');
-    if (!chatMessages) {
-        console.error('Chat messages container not found for selected ingredients!');
-        return;
-    }
-
-    let selectedArea = document.querySelector('.selected-ingredients');
-    if (!selectedArea) {
-        selectedArea = document.createElement('div');
-        selectedArea.className = 'selected-ingredients';
-        chatMessages.appendChild(selectedArea);
-    } else {
-        selectedArea.innerHTML = '';
-    }
-
-    selectedIngredients.forEach(ingredient => {
-        const div = document.createElement('div');
-        div.textContent = ingredient.name;
-        selectedArea.appendChild(div);
-    });
-
-    if (selectedIngredients.length > 0) {
-        let submitButton = document.querySelector('.submit-button');
-        if (!submitButton) {
-            submitButton = document.createElement('button');
-            submitButton.className = 'submit-button';
-            submitButton.textContent = 'Submit Ingredients';
-            submitButton.onclick = submitIngredients;
-            chatMessages.appendChild(submitButton);
-        }
-    }
-}
 
 function submitIngredients() {
     fetch('/submit_ingredients', {