geethareddy commited on
Commit
61b0b45
·
verified ·
1 Parent(s): e4d69fd

Update static/script.js

Browse files
Files changed (1) hide show
  1. static/script.js +36 -36
static/script.js CHANGED
@@ -1,7 +1,7 @@
1
  let conversation = [
2
  { role: 'bot', message: 'Hi there! I\'m Chef Bot! May I know your name?' }
3
  ];
4
- let selectedMenuItems = [];
5
 
6
  function addMessage(role, message) {
7
  const chatMessages = document.getElementById('chatMessages');
@@ -47,8 +47,8 @@ function handleResponse(userInput) {
47
  { text: 'Both', class: 'gray' }
48
  ];
49
  } else if (lastMessage.includes('vegetarian') || lastMessage.includes('non-vegetarian') || lastMessage.includes('both')) {
50
- botResponse = `Great choice! 🍽️ These are the available menu items for ${lastMessage}:`;
51
- fetchMenuItems(lastMessage);
52
  return;
53
  }
54
 
@@ -58,8 +58,8 @@ function handleResponse(userInput) {
58
  }
59
  }
60
 
61
- function fetchMenuItems(dietaryPreference) {
62
- fetch('/get_menu_items', {
63
  method: 'POST',
64
  headers: {
65
  'Content-Type': 'application/json',
@@ -69,81 +69,81 @@ function fetchMenuItems(dietaryPreference) {
69
  .then(response => response.json())
70
  .then(data => {
71
  if (data.error) {
72
- addMessage('bot', `Sorry, there was an error fetching menu items: ${data.error}`);
73
  } else {
74
- const menuItems = data.menu_items || [];
75
- addMessage('bot', 'Great choice! These are available menu items:');
76
- displayMenuItemsList(menuItems);
77
- displaySelectedMenuItems();
78
- console.log(`Menu items fetched for ${dietaryPreference}:`, menuItems);
79
  }
80
  })
81
  .catch(error => {
82
- addMessage('bot', `Error: Unable to connect to the menu database. ${error.message}`);
83
  });
84
  }
85
 
86
- function displayMenuItemsList(menuItems) {
87
  const chatMessages = document.getElementById('chatMessages');
88
  if (!chatMessages) {
89
- console.error('Chat messages container not found for menu items!');
90
  return;
91
  }
92
 
93
- let menuItemsList = document.querySelector('.menu-items-list');
94
- if (!menuItemsList) {
95
- menuItemsList = document.createElement('div');
96
- menuItemsList.className = 'menu-items-list';
97
- chatMessages.appendChild(menuItemsList);
98
  } else {
99
- menuItemsList.innerHTML = '';
100
  }
101
 
102
- menuItems.forEach(menuItem => {
103
  const item = document.createElement('div');
104
- item.className = 'menu-item-item';
105
  const img = document.createElement('img');
106
- img.src = menuItem.image_url || 'https://via.placeholder.com/80';
107
- img.alt = menuItem.name;
108
  const name = document.createElement('div');
109
- name.textContent = menuItem.name;
110
  name.style.textAlign = 'center';
111
  name.style.marginTop = '5px';
112
  name.style.fontSize = '12px';
113
  const button = document.createElement('button');
114
  button.textContent = 'Add';
115
  button.onclick = () => {
116
- if (!selectedMenuItems.some(item => item.name === menuItem.name)) {
117
- selectedMenuItems.push(menuItem);
118
- displaySelectedMenuItems();
119
  }
120
  };
121
  item.appendChild(img);
122
  item.appendChild(name);
123
  item.appendChild(button);
124
- menuItemsList.appendChild(item);
125
  });
126
  }
127
 
128
- function displaySelectedMenuItems() {
129
  const chatMessages = document.getElementById('chatMessages');
130
  if (!chatMessages) {
131
- console.error('Chat messages container not found for selected menu items!');
132
  return;
133
  }
134
 
135
- let selectedArea = document.querySelector('.selected-menu-items');
136
  if (!selectedArea) {
137
  selectedArea = document.createElement('div');
138
- selectedArea.className = 'selected-menu-items';
139
  chatMessages.appendChild(selectedArea);
140
  } else {
141
  selectedArea.innerHTML = '';
142
  }
143
 
144
- selectedMenuItems.forEach(menuItem => {
145
  const div = document.createElement('div');
146
- div.textContent = menuItem.name;
147
  selectedArea.appendChild(div);
148
  });
149
  }
@@ -175,7 +175,7 @@ function displayOptions(options) {
175
  // Reset conversation to initial state
176
  const userName = conversation.length > 1 ? conversation[1].message : 'User';
177
  conversation = [{ role: 'bot', message: `Hi there! I'm Chef Bot! May I know your name?` }, { role: 'user', message: userName }, { role: 'bot', message: `Nice to meet you, ${userName}! 😊 Let's create your perfect meal! What type of food would you prefer?` }];
178
- selectedMenuItems = [];
179
  chatMessages.innerHTML = '';
180
  conversation.forEach(msg => addMessage(msg.role, msg.message));
181
  displayOptions([
 
1
  let conversation = [
2
  { role: 'bot', message: 'Hi there! I\'m Chef Bot! May I know your name?' }
3
  ];
4
+ let selectedIngredients = [];
5
 
6
  function addMessage(role, message) {
7
  const chatMessages = document.getElementById('chatMessages');
 
47
  { text: 'Both', class: 'gray' }
48
  ];
49
  } else if (lastMessage.includes('vegetarian') || lastMessage.includes('non-vegetarian') || lastMessage.includes('both')) {
50
+ botResponse = `Great choice! 🍽️ These are the available ingredients for ${lastMessage}:`;
51
+ fetchIngredients(lastMessage);
52
  return;
53
  }
54
 
 
58
  }
59
  }
60
 
61
+ function fetchIngredients(dietaryPreference) {
62
+ fetch('/get_ingredients', {
63
  method: 'POST',
64
  headers: {
65
  'Content-Type': 'application/json',
 
69
  .then(response => response.json())
70
  .then(data => {
71
  if (data.error) {
72
+ addMessage('bot', `Sorry, there was an error fetching ingredients: ${data.error}`);
73
  } else {
74
+ const ingredients = data.ingredients || [];
75
+ addMessage('bot', 'Great choice! These are available ingredients:');
76
+ displayIngredientsList(ingredients);
77
+ displaySelectedIngredients();
78
+ console.log(`Ingredients fetched for ${dietaryPreference}:`, ingredients);
79
  }
80
  })
81
  .catch(error => {
82
+ addMessage('bot', `Error: Unable to connect to the ingredient database. ${error.message}`);
83
  });
84
  }
85
 
86
+ function displayIngredientsList(ingredients) {
87
  const chatMessages = document.getElementById('chatMessages');
88
  if (!chatMessages) {
89
+ console.error('Chat messages container not found for ingredients!');
90
  return;
91
  }
92
 
93
+ let ingredientsList = document.querySelector('.ingredients-list');
94
+ if (!ingredientsList) {
95
+ ingredientsList = document.createElement('div');
96
+ ingredientsList.className = 'ingredients-list';
97
+ chatMessages.appendChild(ingredientsList);
98
  } else {
99
+ ingredientsList.innerHTML = '';
100
  }
101
 
102
+ ingredients.forEach(ingredient => {
103
  const item = document.createElement('div');
104
+ item.className = 'ingredient-item';
105
  const img = document.createElement('img');
106
+ img.src = ingredient.image_url || 'https://via.placeholder.com/80';
107
+ img.alt = ingredient.name;
108
  const name = document.createElement('div');
109
+ name.textContent = ingredient.name;
110
  name.style.textAlign = 'center';
111
  name.style.marginTop = '5px';
112
  name.style.fontSize = '12px';
113
  const button = document.createElement('button');
114
  button.textContent = 'Add';
115
  button.onclick = () => {
116
+ if (!selectedIngredients.some(item => item.name === ingredient.name)) {
117
+ selectedIngredients.push(ingredient);
118
+ displaySelectedIngredients();
119
  }
120
  };
121
  item.appendChild(img);
122
  item.appendChild(name);
123
  item.appendChild(button);
124
+ ingredientsList.appendChild(item);
125
  });
126
  }
127
 
128
+ function displaySelectedIngredients() {
129
  const chatMessages = document.getElementById('chatMessages');
130
  if (!chatMessages) {
131
+ console.error('Chat messages container not found for selected ingredients!');
132
  return;
133
  }
134
 
135
+ let selectedArea = document.querySelector('.selected-ingredients');
136
  if (!selectedArea) {
137
  selectedArea = document.createElement('div');
138
+ selectedArea.className = 'selected-ingredients';
139
  chatMessages.appendChild(selectedArea);
140
  } else {
141
  selectedArea.innerHTML = '';
142
  }
143
 
144
+ selectedIngredients.forEach(ingredient => {
145
  const div = document.createElement('div');
146
+ div.textContent = ingredient.name;
147
  selectedArea.appendChild(div);
148
  });
149
  }
 
175
  // Reset conversation to initial state
176
  const userName = conversation.length > 1 ? conversation[1].message : 'User';
177
  conversation = [{ role: 'bot', message: `Hi there! I'm Chef Bot! May I know your name?` }, { role: 'user', message: userName }, { role: 'bot', message: `Nice to meet you, ${userName}! 😊 Let's create your perfect meal! What type of food would you prefer?` }];
178
+ selectedIngredients = [];
179
  chatMessages.innerHTML = '';
180
  conversation.forEach(msg => addMessage(msg.role, msg.message));
181
  displayOptions([