Update static/script.js

static/script.js

@@ -42,7 +42,7 @@ function handleResponse(userInput) {
     let options = [];
 
     if (conversation.length === 2) { // After name input
-        botResponse = Nice to meet you, ${userInput}! 😊 Let's create your perfect meal! What type of food would you prefer?;
+        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' }
@@ -53,7 +53,7 @@ function handleResponse(userInput) {
         botResponse = 'Great choice! 🍽️ Please select a non-vegetarian option:';
         fetchIngredients('non-vegetarian');
         return;
-        
+
     }
     else if (lastMessage.includes('vegetarian')) {
         conversation.push({ role: 'user', message: 'Vegetarian' });
@@ -63,8 +63,8 @@ function handleResponse(userInput) {
         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:;
+        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) {
@@ -98,7 +98,7 @@ function fetchIngredients(foodPreference) {
     .then(response => response.json())
     .then(data => {
         if (data.error) {
-            addMessage('bot', Sorry, there was an error fetching ingredients: ${data.error});
+            addMessage('bot', `Sorry, there was an error fetching ingredients: ${data.error}`);
         } else {
             const ingredients = data.ingredients || [];
             addMessage('bot', 'Please select ingredients:');
@@ -107,11 +107,32 @@ function fetchIngredients(foodPreference) {
         }
     })
     .catch(error => {
-        addMessage('bot', Error: Unable to connect to the ingredient database. ${error.message});
+        addMessage('bot', `Error: Unable to connect to the ingredient database. ${error.message}`);
     });
 }
 
-
+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');
@@ -186,7 +207,7 @@ function displayMenuItems(menuItems) {
         button.textContent = 'Add to Cart';
         button.onclick = () => {
             selectedMenuItem = item;
-            addMessage('bot', World-class selection! Would you like to customize your dish further?);
+            addMessage('bot', `World-class selection! Would you like to customize your dish further?`);
             const options = [
                 { text: 'Yes', class: 'green' },
                 { text: 'No', class: 'red' }
@@ -334,7 +355,7 @@ function displayOptions(options) {
     options.forEach(opt => {
         const button = document.createElement('button');
         button.textContent = opt.text;
-        button.className = option-button ${opt.class};
+        button.className = `option-button ${opt.class}`;
         button.onclick = () => {
             addMessage('user', opt.text);
             conversation.push({ role: 'user', message: opt.text });