Update static/script.js

static/script.js

@@ -1,5 +1,5 @@
 let conversation = [
-    { role: 'bot', message: 'Hi there! I\'m Chef Bot! May I know your name?' }
+    { role: 'bot', message: 'Hello! I’m Chef Bot, your culinary assistant! What’s your name?' }
 ];
 let selectedItems = [];
 
@@ -27,11 +27,23 @@ function sendMessage() {
     if (message) {
         addMessage('user', message);
         conversation.push({ role: 'user', message: message });
-        userInput.value = '';
         setTimeout(() => handleResponse(message), 500);
+    } else if (selectedItems.length > 0) {
+        // If input is empty but items are selected, treat it as a trigger to show Submit
+        addMessage('bot', `You’ve selected ${selectedItems.length} item(s). Ready to submit?`);
+        displaySubmitButton();
     } else {
-        addMessage('bot', 'Please type something to continue! 😊');
+        addMessage('bot', 'Hey, don’t be shy! Type something or add items to get started! 😄');
     }
+    userInput.value = ''; // Clear input after sending
+    updateInputBar(); // Reset input bar to show selected items
+}
+
+function updateInputBar() {
+    const userInput = document.getElementById('userInput');
+    if (!userInput) return;
+    userInput.value = selectedItems.map(item => item.name).join(', ');
+    console.log('Updated input bar with selected items:', userInput.value);
 }
 
 function handleResponse(userInput) {
@@ -39,19 +51,19 @@ function handleResponse(userInput) {
     let botResponse = '';
 
     if (conversation.length === 2) {
-        botResponse = `Nice to meet you, ${userInput}! 😊 What type of food would you like to explore today?`;
+        botResponse = `Great to meet you, ${userInput}! 🍳 What kind of food are you craving today?`;
         displayOptions([
             { text: 'Vegetarian', class: 'green' },
             { text: 'Non-Vegetarian', class: 'red' },
             { text: 'Both', class: 'gray' }
         ]);
     } else if (lowerInput === 'vegetarian' || lowerInput === 'non-vegetarian' || lowerInput === 'both') {
-        botResponse = `Awesome! Fetching some ${lowerInput} menu items for you...`;
+        botResponse = `Nice choice! Let me whip up some ${lowerInput} options for you...`;
         addMessage('bot', botResponse);
         fetchMenuItems(lowerInput);
         return;
     } else {
-        botResponse = `Searching for "${userInput}"...`;
+        botResponse = `Hmm, let’s see what I can find for "${userInput}"...`;
         addMessage('bot', botResponse);
         suggestItems(userInput);
         return;
@@ -69,18 +81,17 @@ function fetchMenuItems(dietaryPreference) {
         .then(response => response.json())
         .then(data => {
             if (data.error) {
-                addMessage('bot', `Oops! Couldn’t fetch ${dietaryPreference} items: ${data.error}. Try again?`);
+                addMessage('bot', `Oops! Trouble fetching ${dietaryPreference} items: ${data.error}. Want to try again or search something specific?`);
             } else if (data.menu_items.length > 0) {
-                addMessage('bot', `Here are some ${dietaryPreference} menu items:`);
+                addMessage('bot', `Here’s a tasty selection of ${dietaryPreference} items from Sector_Detail__c:`);
                 displayItemsList(data.menu_items, 'menuItemsList');
-                if (selectedItems.length > 0) displaySubmitButton();
             } else {
-                addMessage('bot', `No ${dietaryPreference} items found. Try searching for something specific!`);
+                addMessage('bot', `Looks like we’re out of ${dietaryPreference} items in Sector_Detail__c. Try searching for something like "paneer" or "chicken"!`);
             }
-            console.log(`Fetched menu items for ${dietaryPreference}:`, data.menu_items);
+            console.log(`Fetched items from Sector_Detail__c for ${dietaryPreference}:`, data.menu_items);
         })
         .catch(error => {
-            addMessage('bot', `Error connecting to Salesforce: ${error.message}. Retrying...`);
+            addMessage('bot', `Yikes! Couldn’t reach Salesforce: ${error.message}. I’ll retry in a sec...`);
             setTimeout(() => fetchMenuItems(dietaryPreference), 2000);
         });
 }
@@ -94,13 +105,12 @@ function suggestItems(searchTerm) {
         .then(response => response.json())
         .then(data => {
             if (data.error) {
-                addMessage('bot', `Couldn’t find anything for "${searchTerm}": ${data.error}. Try another term?`);
+                addMessage('bot', `Couldn’t find anything for "${searchTerm}": ${data.error}. Got another idea?`);
             } else if (data.suggestions.length > 0) {
-                addMessage('bot', `Found these suggestions for "${searchTerm}":`);
+                addMessage('bot', `Check out these suggestions for "${searchTerm}" from Ingredient_Object__c:`);
                 displayItemsList(data.suggestions, 'suggestionsList');
-                if (selectedItems.length > 0) displaySubmitButton();
             } else {
-                addMessage('bot', `No matches for "${searchTerm}". Try "chicken" or "paneer"?`);
+                addMessage('bot', `No luck with "${searchTerm}" in Ingredient_Object__c. How about "chicken" or "paneer"?`);
             }
             console.log(`Suggestions for ${searchTerm}:`, data.suggestions);
         })
@@ -119,18 +129,17 @@ function fetchItemDetails(itemName) {
         .then(response => response.json())
         .then(data => {
             if (data.error) {
-                addMessage('bot', `Sorry, couldn’t get details for "${itemName}": ${data.error}. Check the name!`);
+                addMessage('bot', `Sorry, couldn’t get details for "${itemName}": ${data.error}. Double-check the name!`);
             } else {
                 const details = data.item_details;
                 selectedItems.push(details);
-                addMessage('bot', `Added "${itemName}" to your selection!`);
-                displaySelectedItems();
-                displaySubmitButton();
+                addMessage('bot', `Added "${itemName}" to your list! Check the input bar.`);
+                updateInputBar();
                 console.log(`Details for ${itemName}:`, details);
             }
         })
         .catch(error => {
-            addMessage('bot', `Error fetching details for "${itemName}": ${error.message}. Retrying...`);
+            addMessage('bot', `Trouble fetching details for "${itemName}": ${error.message}. Retrying...`);
             setTimeout(() => fetchItemDetails(itemName), 2000);
         });
 }
@@ -139,7 +148,7 @@ function displayItemsList(items, containerId) {
     const container = document.getElementById(containerId);
     if (!container) {
         console.error(`${containerId} container not found!`);
-        addMessage('bot', 'Display issue. Please try again!');
+        addMessage('bot', 'Something’s off with the display. Try again?');
         return;
     }
     container.innerHTML = '';
@@ -165,26 +174,6 @@ function displayItemsList(items, containerId) {
     });
 }
 
-function displaySelectedItems() {
-    const selectedArea = document.getElementById('itemDetails');
-    if (!selectedArea) {
-        console.error('Item details container not found!');
-        return;
-    }
-    selectedArea.innerHTML = '';
-
-    if (selectedItems.length === 0) {
-        selectedArea.innerHTML = '<div>No items selected yet!</div>';
-    } else {
-        selectedItems.forEach(item => {
-            const div = document.createElement('div');
-            div.textContent = item.name; // Display as text label
-            div.style.margin = '5px 0';
-            selectedArea.appendChild(div);
-        });
-    }
-}
-
 function displayOptions(options) {
     const chatMessages = document.getElementById('chatMessages');
     if (!chatMessages) {
@@ -221,7 +210,6 @@ function displaySubmitButton() {
     const chatMessages = document.getElementById('chatMessages');
     if (!chatMessages) return;
 
-    // Remove existing submit button if any
     const existingButton = document.querySelector('.submit-button');
     if (existingButton) existingButton.remove();
 
@@ -234,7 +222,7 @@ function displaySubmitButton() {
 
 function submitToSalesforce() {
     if (selectedItems.length === 0) {
-        addMessage('bot', 'No items selected to submit!');
+        addMessage('bot', 'No items to submit yet! Add some first! 😊');
         return;
     }
 
@@ -246,16 +234,16 @@ function submitToSalesforce() {
         .then(response => response.json())
         .then(data => {
             if (data.error) {
-                addMessage('bot', `Failed to submit items: ${data.error}`);
+                addMessage('bot', `Uh-oh! Failed to submit items: ${data.error}. Want to try again?`);
             } else {
-                addMessage('bot', data.success);
+                addMessage('bot', `${data.success}! Your selections are saved. Ready for more?`);
                 selectedItems = [];
-                displaySelectedItems();
+                updateInputBar();
                 document.querySelector('.submit-button').remove();
             }
         })
         .catch(error => {
-            addMessage('bot', `Error submitting items: ${error.message}. Retrying...`);
+            addMessage('bot', `Error submitting items: ${error.message}. I’ll retry shortly...`);
             setTimeout(submitToSalesforce, 2000);
         });
 }
@@ -263,9 +251,9 @@ function submitToSalesforce() {
 function resetConversation() {
     const userName = conversation.length > 1 ? conversation[1].message : 'Friend';
     conversation = [
-        { role: 'bot', message: `Hi there! I'm Chef Bot! May I know your name?` },
+        { role: 'bot', message: `Hello! I’m Chef Bot, your culinary assistant! What’s your name?` },
         { role: 'user', message: userName },
-        { role: 'bot', message: `Nice to meet you, ${userName}! 😊 What type of food would you like to explore today?` }
+        { role: 'bot', message: `Great to meet you, ${userName}! 🍳 What kind of food are you craving today?` }
     ];
     selectedItems = [];
     const chatMessages = document.getElementById('chatMessages');
@@ -278,7 +266,7 @@ function resetConversation() {
     ]);
     document.getElementById('suggestionsList').innerHTML = '';
     document.getElementById('menuItemsList').innerHTML = '';
-    displaySelectedItems();
+    updateInputBar();
 }
 
 document.getElementById('userInput').addEventListener('keypress', (e) => {