lokesh341 commited on
Commit
3d051d4
·
verified ·
1 Parent(s): aebbd41

Update static/script.js

Browse files
Files changed (1) hide show
  1. static/script.js +61 -23
static/script.js CHANGED
@@ -218,6 +218,55 @@ function fetchItemDetails(itemName) {
218
  });
219
  }
220
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
221
  function displayItemsList(items, containerId, isSectorDetail = false) {
222
  const container = document.getElementById(containerId);
223
  if (!container) {
@@ -244,30 +293,19 @@ function displayItemsList(items, containerId, isSectorDetail = false) {
244
  itemDiv.appendChild(nameDiv);
245
 
246
  if (isSectorDetail && item.description) {
247
- const descDiv = document.createElement('div');
248
- descDiv.textContent = item.description;
249
- descDiv.style.textAlign = 'center';
250
- descDiv.style.fontSize = '10px';
251
- descDiv.style.color = '#555';
252
- itemDiv.appendChild(descDiv);
253
- }
254
-
255
- const button = document.createElement('button');
256
- button.textContent = 'Add';
257
- button.onclick = () => {
258
- if (isSectorDetail) {
259
- const sectorItem = {
260
- name: item.name,
261
- image_url: item.image_url || ''
262
- };
263
- selectedItems.push(sectorItem);
264
- addMessage('bot', `Added "${item.name}" to your selection! Check the box below.`);
265
- } else {
266
  fetchItemDetails(item.name);
267
- }
268
- updateSelectionBox();
269
- };
270
- itemDiv.appendChild(button);
271
 
272
  container.appendChild(itemDiv);
273
  });
 
218
  });
219
  }
220
 
221
+ function showDescriptionPopup(item) {
222
+ const existingPopup = document.querySelector('.description-popup');
223
+ if (existingPopup) existingPopup.remove();
224
+
225
+ const popup = document.createElement('div');
226
+ popup.className = 'description-popup';
227
+
228
+ const content = document.createElement('div');
229
+ content.className = 'popup-content';
230
+
231
+ const img = document.createElement('img');
232
+ img.src = item.image_url || 'https://via.placeholder.com/100';
233
+ img.alt = item.name;
234
+ img.className = 'popup-image';
235
+ content.appendChild(img);
236
+
237
+ const title = document.createElement('h3');
238
+ title.textContent = item.name;
239
+ content.appendChild(title);
240
+
241
+ const desc = document.createElement('p');
242
+ desc.textContent = item.description;
243
+ content.appendChild(desc);
244
+
245
+ const addButton = document.createElement('button');
246
+ addButton.textContent = 'Add';
247
+ addButton.className = 'popup-add-button';
248
+ addButton.onclick = () => {
249
+ const sectorItem = {
250
+ name: item.name,
251
+ image_url: item.image_url || ''
252
+ };
253
+ selectedItems.push(sectorItem);
254
+ addMessage('bot', `Added "${item.name}" to your selection! Check the box below.`);
255
+ updateSelectionBox();
256
+ popup.remove();
257
+ };
258
+ content.appendChild(addButton);
259
+
260
+ const closeButton = document.createElement('button');
261
+ closeButton.textContent = 'Close';
262
+ closeButton.className = 'popup-close-button';
263
+ closeButton.onclick = () => popup.remove();
264
+ content.appendChild(closeButton);
265
+
266
+ popup.appendChild(content);
267
+ document.body.appendChild(popup);
268
+ }
269
+
270
  function displayItemsList(items, containerId, isSectorDetail = false) {
271
  const container = document.getElementById(containerId);
272
  if (!container) {
 
293
  itemDiv.appendChild(nameDiv);
294
 
295
  if (isSectorDetail && item.description) {
296
+ const showDescButton = document.createElement('button');
297
+ showDescButton.textContent = 'Show Description';
298
+ showDescButton.className = 'show-desc-button';
299
+ showDescButton.onclick = () => showDescriptionPopup(item);
300
+ itemDiv.appendChild(showDescButton);
301
+ } else {
302
+ const addButton = document.createElement('button');
303
+ addButton.textContent = 'Add';
304
+ addButton.onclick = () => {
 
 
 
 
 
 
 
 
 
 
305
  fetchItemDetails(item.name);
306
+ };
307
+ itemDiv.appendChild(addButton);
308
+ }
 
309
 
310
  container.appendChild(itemDiv);
311
  });