Update templates/menu.html

templates/menu.html

@@ -95,14 +95,6 @@
             justify-content: center;
             gap: 6px;
         }
-        .customisable-text {
-            color: #0FAA39;
-            font-size: 10px;
-            font-weight: 500;
-            margin: 0;
-            text-align: center;
-            line-height: 1;
-        }
         .btn-primary {
             font-size: 12px;
             font-weight: bold;
@@ -233,70 +225,6 @@
         .mic-icon.active {
             color: #007bff;
         }
-        .addon-section {
-            background-color: #fff;
-            border: 2px solid #ffa500;
-            border-radius: 8px;
-            padding: 12px;
-            margin-bottom: 10px;
-        }
-        .addon-section h6 {
-            margin-bottom: 10px;
-            font-size: 1.1rem;
-            font-weight: bold;
-            color: #343a40;
-        }
-        .addon-section .form-check {
-            display: inline-flex;
-            align-items: center;
-            margin-left: 10px;
-            color: #343a40;
-        }
-        .addon-section .form-check-input {
-            -webkit-appearance: none;
-            -moz-appearance: none;
-            appearance: none;
-            width: 20px;
-            height: 20px;
-            border: 2px solid #343a40;
-            border-radius: 5px;
-            background-color: #f0f0f0;
-            position: relative;
-            margin-right: 10px;
-        }
-        .addon-section .form-check-input[type="radio"] {
-            border-radius: 50%;
-        }
-        .addon-section .form-check-input:checked {
-            background-color: #006400;
-            border-color: #006400;
-        }
-        .addon-section .form-check-input:checked::before {
-            content: '\2713';
-            font-size: 14px;
-            position: absolute;
-            top: 3px;
-            left: 4px;
-            color: white;
-        }
-        .addon-section .form-check-input[type="radio"]:checked::before {
-            content: '';
-            width: 12px;
-            height: 12px;
-            border-radius: 50%;
-            background-color: #006400;
-            position: absolute;
-            top: 4px;
-            left: 4px;
-        }
-        .addon-section .form-check-label {
-            font-size: 16px;
-            margin-left: 5px;
-            margin-right: 15px;
-            cursor: pointer;
-            display: inline-block;
-            vertical-align: middle;
-        }
         form.text-center.mb-4 {
             display: flex;
             flex-direction: column;
@@ -342,17 +270,6 @@
             color: #6c757d;
             margin-bottom: 10px;
         }
-        .modal-body .nutritional-info {
-            font-size: 12px;
-            color: #6c757d;
-            margin-bottom: 10px;
-        }
-        .modal-body #modal-addons h6,
-        .modal-body #first-row h6 {
-            font-size: 14px;
-            font-weight: bold;
-            margin-bottom: 10px;
-        }
         .modal-footer {
             display: flex;
             align-items: center;
@@ -659,15 +576,6 @@
                 font-size: 12px;
                 margin-bottom: 5px;
             }
-            .modal-body .nutritional-info {
-                font-size: 10px;
-                margin-bottom: 5px;
-            }
-            .modal-body #modal-addons h6,
-            .modal-body #first-row h6 {
-                font-size: 12px;
-                margin-bottom: 5px;
-            }
             .modal-footer {
                 padding: 5px;
             }
@@ -698,9 +606,6 @@
                 width: 50px;
                 height: 25px;
             }
-            .customisable-text {
-                font-size: 8px;
-            }
             .button-container {
                 gap: 3px;
             }
@@ -839,9 +744,6 @@
                                                             ADD
                                                         </button>
                                                     {% endif %}
-                                                    {% if item.Section__c != 'Apetizer' and item.Section__c != 'Customized dish' and item.Section__c != 'Soft Drinks' %}
-                                                        <span class="customisable-text">Customisable</span>
-                                                    {% endif %}
                                                 </div>
                                             </div>
                                         </div>
@@ -891,10 +793,6 @@
                     <h5 id="modal-name" class="fw-bold text-center"></h5>
                     <p id="modal-price" class="text-muted text-center"></p>
                     <p id="modal-description" class="text-secondary"></p>
-                    <div id="modal-addons" class="modal-addons mt-4">
-                        <h6>Customization Options</h6>
-                        <div id="addons-list" class="addons-container">Loading customization options...</div>
-                    </div>
                     <div class="mt-4">
                         <h6>Custom Request</h6>
                         <textarea id="modal-instructions" class="form-control" placeholder="Enter any special instructions here..."></textarea>
@@ -976,8 +874,7 @@
             let cart = JSON.parse(localStorage.getItem('cart')) || [];
             const existingItem = cart.find(item => 
                 item.itemName === payload.itemName && 
-                item.instructions === payload.instructions && 
-                JSON.stringify(item.addons) === JSON.stringify(payload.addons)
+                item.instructions === payload.instructions
             );
             if (existingItem) {
                 existingItem.quantity = payload.quantity;
@@ -988,12 +885,11 @@
             return cart;
         }
 
-        function removeFromCartLocalStorage(itemName, quantityToRemove, instructions, addons) {
+        function removeFromCartLocalStorage(itemName, quantityToRemove, instructions) {
             let cart = JSON.parse(localStorage.getItem('cart')) || [];
             const itemIndex = cart.findIndex(item => 
                 item.itemName === itemName && 
-                item.instructions === instructions && 
-                JSON.stringify(item.addons) === JSON.stringify(addons)
+                item.instructions === instructions
             );
             if (itemIndex !== -1) {
                 if (quantityToRemove >= cart[itemIndex].quantity) {
@@ -1050,7 +946,6 @@
                 itemImage: itemImage,
                 section: section,
                 category: selectedCategory,
-                addons: [],
                 instructions: '',
                 quantity: quantity
             };
@@ -1109,56 +1004,11 @@
             const modalImg = document.getElementById('modal-img');
             modalImg.src = image || '/static/placeholder.jpg';
             document.getElementById('modal-description').innerText = description || 'No description available.';
-            document.getElementById('addons-list').innerHTML = 'Loading customization options...';
             document.getElementById('modal-instructions').value = '';
             const modalSectionEl = document.getElementById('modal-section');
             modalSectionEl.setAttribute('data-section', section);
             modalSectionEl.setAttribute('data-category', selectedCategory);
             document.getElementById('quantityInput').value = 1;
-
-            fetch(`/api/addons?item_name=${encodeURIComponent(name)}&item_section=${encodeURIComponent(section)}`)
-                .then(response => response.json())
-                .then(data => {
-                    const addonsList = document.getElementById('addons-list');
-                    addonsList.innerHTML = '';
-                    if (!data.success || !data.addons || data.addons.length === 0) {
-                        addonsList.innerHTML = '<p>No customization options available.</p>';
-                        return;
-                    }
-                    data.addons.forEach(addon => {
-                        const sectionDiv = document.createElement('div');
-                        sectionDiv.classList.add('addon-section');
-                        const title = document.createElement('h6');
-                        title.innerText = addon.name;
-                        sectionDiv.appendChild(title);
-                        const optionsContainer = document.createElement('div');
-                        addon.options.forEach((option, index) => {
-                            const optionId = `addon-${addon.name.replace(/\s+/g, '-')}-${index}`;
-                            const formCheck = document.createElement('div');
-                            formCheck.classList.add('form-check');
-                            const input = document.createElement('input');
-                            input.classList.add('form-check-input');
-                            input.type = addon.multi_select ? 'checkbox' : 'radio';
-                            input.name = addon.multi_select ? optionId : addon.name.replace(/\s+/g, '-');
-                            input.id = optionId;
-                            input.value = option.name;
-                            input.dataset.price = option.price || 0;
-                            const label = document.createElement('label');
-                            label.classList.add('form-check-label');
-                            label.htmlFor = optionId;
-                            label.innerText = `${option.name} ${option.price ? `(+$${option.price})` : ''}`;
-                            formCheck.appendChild(input);
-                            formCheck.appendChild(label);
-                            optionsContainer.appendChild(formCheck);
-                        });
-                        sectionDiv.appendChild(optionsContainer);
-                        addonsList.appendChild(sectionDiv);
-                    });
-                })
-                .catch(err => {
-                    console.error('Error fetching addons:', err);
-                    document.getElementById('addons-list').innerHTML = '<p>Error loading customization options.</p>';
-                });
         }
 
         function addToCartFromModal() {
@@ -1174,14 +1024,12 @@
             const quantity = parseInt(document.getElementById('quantityInput').value) || 1;
             const instructions = document.getElementById('modal-instructions').value;
 
-            const addons = [];
-            const addonInputs = document.querySelectorAll('#addons-list .form-check-input:checked');
-            addonInputs.forEach(input => {
-                addons.push({
-                    name: input.value,
-                    price: parseFloat(input.dataset.price) || 0
-                });
-            });
+            if (!itemName || isNaN(itemPrice) || !section || !itemImage || quantity < 1) {
+                console.error('Invalid cart item data:', { itemName, itemPrice, section, itemImage, quantity });
+                alert('Invalid item data. Please try again.');
+                isProcessingRequest = false;
+                return;
+            }
 
             const cartPayload = {
                 itemName: itemName,
@@ -1189,7 +1037,6 @@
                 itemImage: itemImage,
                 section: section,
                 category: selectedCategory,
-                addons: addons,
                 instructions: instructions,
                 quantity: quantity
             };
@@ -1478,8 +1325,10 @@
             });
             increaseBtn.addEventListener('click', function () {
                 let currentQuantity = parseInt(quantityInput.value);
-                currentQuantity++;
-                quantityInput.value = currentQuantity;
+                if (currentQuantity < 500) {
+                    currentQuantity++;
+                    quantityInput.value = currentQuantity;
+                }
             });
 
             // Soft Drinks Modal Quantity Controls