Spaces:
Sleeping
Sleeping
Update templates/chef-bot.html
Browse files- templates/chef-bot.html +32 -40
templates/chef-bot.html
CHANGED
@@ -485,10 +485,10 @@
|
|
485 |
];
|
486 |
let userName = '';
|
487 |
let selectedPreference = '';
|
488 |
-
let
|
489 |
let selectionBoxVisible = false;
|
490 |
let nameInputVisible = false;
|
491 |
-
let
|
492 |
|
493 |
function addMessage(role, message) {
|
494 |
const chatMessages = document.getElementById('chatMessages');
|
@@ -614,13 +614,13 @@
|
|
614 |
});
|
615 |
selectionBox.appendChild(nameInput);
|
616 |
|
617 |
-
//
|
618 |
-
if (
|
619 |
const itemsLabel = document.createElement('span');
|
620 |
itemsLabel.textContent = 'Selected Items:';
|
621 |
selectionBox.appendChild(itemsLabel);
|
622 |
|
623 |
-
|
624 |
const itemContainer = document.createElement('div');
|
625 |
itemContainer.className = 'selected-item';
|
626 |
|
@@ -633,11 +633,8 @@
|
|
633 |
const contentDiv = document.createElement('div');
|
634 |
contentDiv.className = 'selected-item-content';
|
635 |
|
636 |
-
const itemName = item.additionalIngredients && item.additionalIngredients.length > 0
|
637 |
-
? `${item.name} with ${item.additionalIngredients.join(', ')}`
|
638 |
-
: item.name;
|
639 |
const itemSpan = document.createElement('span');
|
640 |
-
itemSpan.textContent = `${
|
641 |
contentDiv.appendChild(itemSpan);
|
642 |
|
643 |
// Ingredient Buttons
|
@@ -645,7 +642,7 @@
|
|
645 |
ingredientButtonsDiv.style.display = 'flex';
|
646 |
ingredientButtonsDiv.style.flexWrap = 'wrap';
|
647 |
ingredientButtonsDiv.style.gap = '5px';
|
648 |
-
|
649 |
const ingredientButton = document.createElement('button');
|
650 |
ingredientButton.textContent = ingredient.name;
|
651 |
ingredientButton.className = 'ingredient-button';
|
@@ -664,7 +661,7 @@
|
|
664 |
ingredientInfoInput.className = 'ingredient-info-input';
|
665 |
ingredientInfoInput.value = item.ingredientsInfo || '';
|
666 |
ingredientInfoInput.addEventListener('input', (e) => {
|
667 |
-
|
668 |
});
|
669 |
contentDiv.appendChild(ingredientInfoInput);
|
670 |
|
@@ -674,8 +671,8 @@
|
|
674 |
removeButton.textContent = 'X';
|
675 |
removeButton.className = 'remove-button';
|
676 |
removeButton.onclick = () => {
|
677 |
-
|
678 |
-
addMessage('bot', `Removed "${
|
679 |
updateSelectionBox();
|
680 |
};
|
681 |
itemContainer.appendChild(removeButton);
|
@@ -724,9 +721,8 @@
|
|
724 |
}
|
725 |
|
726 |
chatMessages.scrollTop = chatMessages.scrollHeight;
|
727 |
-
console.log('Updated selection box:',
|
728 |
name: item.name,
|
729 |
-
additionalIngredients: item.additionalIngredients,
|
730 |
ingredientsInfo: item.ingredientsInfo
|
731 |
})));
|
732 |
}
|
@@ -746,7 +742,7 @@
|
|
746 |
addMessage('bot', `Error: ${data.error}. Try again!`);
|
747 |
} else if (data.menu_items.length > 0) {
|
748 |
addMessage('bot', `--- Found ${data.menu_items.length} item${data.menu_items.length > 1 ? 's' : ''} ---`);
|
749 |
-
|
750 |
} else {
|
751 |
addMessage('bot', `No matches for "${searchTerm || dietaryPreference}". Try "paneer"!`);
|
752 |
}
|
@@ -757,9 +753,9 @@
|
|
757 |
setTimeout(() => fetchMenuItems(dietaryPreference, searchTerm), 2000);
|
758 |
});
|
759 |
|
760 |
-
// Fetch
|
761 |
-
if (!
|
762 |
-
fetch('/
|
763 |
method: 'POST',
|
764 |
headers: { 'Content-Type': 'application/json' },
|
765 |
body: JSON.stringify({ dietary_preference: 'both' })
|
@@ -767,12 +763,12 @@
|
|
767 |
.then(response => response.json())
|
768 |
.then(data => {
|
769 |
if (!data.error) {
|
770 |
-
|
771 |
-
console.log('Fetched Sector_Detail__c ingredients:',
|
772 |
updateSelectionBox();
|
773 |
}
|
774 |
})
|
775 |
-
.catch(error => console.error('Error fetching
|
776 |
}
|
777 |
}
|
778 |
|
@@ -788,7 +784,7 @@
|
|
788 |
addMessage('bot', `Error: ${data.error}. Try another ingredient!`);
|
789 |
} else if (data.menu_items.length > 0) {
|
790 |
addMessage('bot', `--- Found ${data.menu_items.length} dish${data.menu_items.length > 1 ? 'es' : ''} with "${ingredientName}" ---`);
|
791 |
-
|
792 |
} else {
|
793 |
addMessage('bot', `No dishes found with "${ingredientName}". Try another!`);
|
794 |
}
|
@@ -800,7 +796,7 @@
|
|
800 |
});
|
801 |
}
|
802 |
|
803 |
-
function
|
804 |
const chatMessages = document.getElementById('chatMessages');
|
805 |
if (!chatMessages) {
|
806 |
console.error('Chat messages container not found!');
|
@@ -852,21 +848,20 @@
|
|
852 |
addButton.textContent = 'Add';
|
853 |
addButton.className = 'add-button';
|
854 |
addButton.onclick = () => {
|
855 |
-
const
|
856 |
name: item.name,
|
857 |
image_url: item.image_url || '',
|
858 |
category: item.category || item.veg_nonveg || 'Not specified',
|
859 |
description: item.description || 'No description available',
|
860 |
source: item.source,
|
861 |
quantity: 1,
|
862 |
-
additionalIngredients: [],
|
863 |
ingredientsInfo: ''
|
864 |
};
|
865 |
-
if (
|
866 |
-
addMessage('bot', `"${
|
867 |
} else {
|
868 |
-
|
869 |
-
addMessage('bot', `Added "${
|
870 |
updateSelectionBox();
|
871 |
}
|
872 |
};
|
@@ -881,7 +876,7 @@
|
|
881 |
}
|
882 |
|
883 |
function promptAndSubmit(quantity, orderName, ingredientsInfo) {
|
884 |
-
if (confirm(`Submit ${
|
885 |
submitToSalesforce(orderName, quantity, ingredientsInfo);
|
886 |
} else {
|
887 |
addMessage('bot', 'Cancelled. Add more items?');
|
@@ -889,24 +884,21 @@
|
|
889 |
}
|
890 |
|
891 |
function submitToSalesforce(customOrderName, quantity, ingredientsInfo) {
|
892 |
-
if (
|
893 |
-
addMessage('bot', 'No items
|
894 |
return;
|
895 |
}
|
896 |
|
897 |
-
const itemsToSubmit =
|
898 |
-
name: item.
|
899 |
-
? `${item.name} with ${item.additionalIngredients.join(', ')}`
|
900 |
-
: item.name,
|
901 |
category: item.category || 'Not specified',
|
902 |
description: item.description || 'No description available',
|
903 |
image_url: item.image_url || '',
|
904 |
quantity: parseInt(quantity) || 1,
|
905 |
-
additionalIngredients: item.additionalIngredients || [],
|
906 |
ingredientsInfo: item.ingredientsInfo || ''
|
907 |
}));
|
908 |
|
909 |
-
fetch('/
|
910 |
method: 'POST',
|
911 |
headers: { 'Content-Type': 'application/json' },
|
912 |
body: JSON.stringify({
|
@@ -921,7 +913,7 @@
|
|
921 |
addMessage('bot', `Submission failed: ${data.error}. Try again?`);
|
922 |
} else {
|
923 |
addMessage('bot', `Submitted ${data.ingredient_name}! What's next?`);
|
924 |
-
|
925 |
updateSelectionBox();
|
926 |
}
|
927 |
})
|
|
|
485 |
];
|
486 |
let userName = '';
|
487 |
let selectedPreference = '';
|
488 |
+
let cart = [];
|
489 |
let selectionBoxVisible = false;
|
490 |
let nameInputVisible = false;
|
491 |
+
let ingredients = [];
|
492 |
|
493 |
function addMessage(role, message) {
|
494 |
const chatMessages = document.getElementById('chatMessages');
|
|
|
614 |
});
|
615 |
selectionBox.appendChild(nameInput);
|
616 |
|
617 |
+
// Cart Items
|
618 |
+
if (cart.length > 0) {
|
619 |
const itemsLabel = document.createElement('span');
|
620 |
itemsLabel.textContent = 'Selected Items:';
|
621 |
selectionBox.appendChild(itemsLabel);
|
622 |
|
623 |
+
cart.forEach((item, index) => {
|
624 |
const itemContainer = document.createElement('div');
|
625 |
itemContainer.className = 'selected-item';
|
626 |
|
|
|
633 |
const contentDiv = document.createElement('div');
|
634 |
contentDiv.className = 'selected-item-content';
|
635 |
|
|
|
|
|
|
|
636 |
const itemSpan = document.createElement('span');
|
637 |
+
itemSpan.textContent = `${item.name} (Qty: ${item.quantity || 1})`;
|
638 |
contentDiv.appendChild(itemSpan);
|
639 |
|
640 |
// Ingredient Buttons
|
|
|
642 |
ingredientButtonsDiv.style.display = 'flex';
|
643 |
ingredientButtonsDiv.style.flexWrap = 'wrap';
|
644 |
ingredientButtonsDiv.style.gap = '5px';
|
645 |
+
ingredients.forEach(ingredient => {
|
646 |
const ingredientButton = document.createElement('button');
|
647 |
ingredientButton.textContent = ingredient.name;
|
648 |
ingredientButton.className = 'ingredient-button';
|
|
|
661 |
ingredientInfoInput.className = 'ingredient-info-input';
|
662 |
ingredientInfoInput.value = item.ingredientsInfo || '';
|
663 |
ingredientInfoInput.addEventListener('input', (e) => {
|
664 |
+
cart[index].ingredientsInfo = e.target.value;
|
665 |
});
|
666 |
contentDiv.appendChild(ingredientInfoInput);
|
667 |
|
|
|
671 |
removeButton.textContent = 'X';
|
672 |
removeButton.className = 'remove-button';
|
673 |
removeButton.onclick = () => {
|
674 |
+
cart.splice(index, 1);
|
675 |
+
addMessage('bot', `Removed "${item.name}".`);
|
676 |
updateSelectionBox();
|
677 |
};
|
678 |
itemContainer.appendChild(removeButton);
|
|
|
721 |
}
|
722 |
|
723 |
chatMessages.scrollTop = chatMessages.scrollHeight;
|
724 |
+
console.log('Updated selection box:', cart.map(item => ({
|
725 |
name: item.name,
|
|
|
726 |
ingredientsInfo: item.ingredientsInfo
|
727 |
})));
|
728 |
}
|
|
|
742 |
addMessage('bot', `Error: ${data.error}. Try again!`);
|
743 |
} else if (data.menu_items.length > 0) {
|
744 |
addMessage('bot', `--- Found ${data.menu_items.length} item${data.menu_items.length > 1 ? 's' : ''} ---`);
|
745 |
+
displayMenuItems(data.menu_items);
|
746 |
} else {
|
747 |
addMessage('bot', `No matches for "${searchTerm || dietaryPreference}". Try "paneer"!`);
|
748 |
}
|
|
|
753 |
setTimeout(() => fetchMenuItems(dietaryPreference, searchTerm), 2000);
|
754 |
});
|
755 |
|
756 |
+
// Fetch ingredients
|
757 |
+
if (!ingredients.length) {
|
758 |
+
fetch('/get_ingredients', {
|
759 |
method: 'POST',
|
760 |
headers: { 'Content-Type': 'application/json' },
|
761 |
body: JSON.stringify({ dietary_preference: 'both' })
|
|
|
763 |
.then(response => response.json())
|
764 |
.then(data => {
|
765 |
if (!data.error) {
|
766 |
+
ingredients = data.ingredients;
|
767 |
+
console.log('Fetched Sector_Detail__c ingredients:', ingredients);
|
768 |
updateSelectionBox();
|
769 |
}
|
770 |
})
|
771 |
+
.catch(error => console.error('Error fetching ingredients:', error));
|
772 |
}
|
773 |
}
|
774 |
|
|
|
784 |
addMessage('bot', `Error: ${data.error}. Try another ingredient!`);
|
785 |
} else if (data.menu_items.length > 0) {
|
786 |
addMessage('bot', `--- Found ${data.menu_items.length} dish${data.menu_items.length > 1 ? 'es' : ''} with "${ingredientName}" ---`);
|
787 |
+
displayMenuItems(data.menu_items);
|
788 |
} else {
|
789 |
addMessage('bot', `No dishes found with "${ingredientName}". Try another!`);
|
790 |
}
|
|
|
796 |
});
|
797 |
}
|
798 |
|
799 |
+
function displayMenuItems(items) {
|
800 |
const chatMessages = document.getElementById('chatMessages');
|
801 |
if (!chatMessages) {
|
802 |
console.error('Chat messages container not found!');
|
|
|
848 |
addButton.textContent = 'Add';
|
849 |
addButton.className = 'add-button';
|
850 |
addButton.onclick = () => {
|
851 |
+
const cartItem = {
|
852 |
name: item.name,
|
853 |
image_url: item.image_url || '',
|
854 |
category: item.category || item.veg_nonveg || 'Not specified',
|
855 |
description: item.description || 'No description available',
|
856 |
source: item.source,
|
857 |
quantity: 1,
|
|
|
858 |
ingredientsInfo: ''
|
859 |
};
|
860 |
+
if (cart.some(existing => existing.name === cartItem.name && !existing.ingredientsInfo)) {
|
861 |
+
addMessage('bot', `"${cartItem.name}" already in cart!`);
|
862 |
} else {
|
863 |
+
cart.push(cartItem);
|
864 |
+
addMessage('bot', `Added "${cartItem.name}" to cart!`);
|
865 |
updateSelectionBox();
|
866 |
}
|
867 |
};
|
|
|
876 |
}
|
877 |
|
878 |
function promptAndSubmit(quantity, orderName, ingredientsInfo) {
|
879 |
+
if (confirm(`Submit ${cart.length} items (Qty: ${quantity}) as "${orderName || 'Order'}"?`)) {
|
880 |
submitToSalesforce(orderName, quantity, ingredientsInfo);
|
881 |
} else {
|
882 |
addMessage('bot', 'Cancelled. Add more items?');
|
|
|
884 |
}
|
885 |
|
886 |
function submitToSalesforce(customOrderName, quantity, ingredientsInfo) {
|
887 |
+
if (cart.length === 0) {
|
888 |
+
addMessage('bot', 'No items in cart! Add some dishes! 😊');
|
889 |
return;
|
890 |
}
|
891 |
|
892 |
+
const itemsToSubmit = cart.map(item => ({
|
893 |
+
name: item.name,
|
|
|
|
|
894 |
category: item.category || 'Not specified',
|
895 |
description: item.description || 'No description available',
|
896 |
image_url: item.image_url || '',
|
897 |
quantity: parseInt(quantity) || 1,
|
|
|
898 |
ingredientsInfo: item.ingredientsInfo || ''
|
899 |
}));
|
900 |
|
901 |
+
fetch('/submit_ingredients', {
|
902 |
method: 'POST',
|
903 |
headers: { 'Content-Type': 'application/json' },
|
904 |
body: JSON.stringify({
|
|
|
913 |
addMessage('bot', `Submission failed: ${data.error}. Try again?`);
|
914 |
} else {
|
915 |
addMessage('bot', `Submitted ${data.ingredient_name}! What's next?`);
|
916 |
+
cart = [];
|
917 |
updateSelectionBox();
|
918 |
}
|
919 |
})
|