BiryaniHubMenu03subbu

Sleeping

App Files Files Community

DSatishchandra commited on Mar 25

Commit

26e37f3

verified ·

1 Parent(s): 2695c8c

Update templates/menu.html

Browse files

Files changed (1) hide show

templates/menu.html +106 -11

templates/menu.html CHANGED Viewed

@@ -537,7 +537,24 @@ form-check-input addon-option{
         width: 40px; /* Adjust input size for smaller screens */
         height: 35px;
     }
-}
 </style>
 </head>
 <body>
@@ -645,8 +662,20 @@ form-check-input addon-option{
     </div>
     <div class= "d-flex flex-column align-item-center justify-content-center">
       <!-- <button class="btn btn-primary>ADD</button> -->
-    <div  >
      <button class="btn btn btn-primary "
             data-bs-toggle="modal" data-bs-target="#itemModal"
             onclick="showItemDetails('{{ item.Name }}', '{{ item.Price__c }}', '{{ item.Image2__c }}', '{{ item.Description__c }}', '{{ item.Section__c }}','{{ selected_category }}')">
@@ -660,15 +689,8 @@ form-check-input addon-option{
        {% if item.Section__c != 'Apetizer' and item.Section__c != 'Customized dish' and item.Section__c !='Soft Drinks' %}
   <h5 class="customisable-text">Customisable</h5>
 {% endif %}
     </div>
-    </div>
   </div>
 </div>
@@ -975,7 +997,80 @@ document.addEventListener('DOMContentLoaded', function () {
     });
 });
     </script>

         width: 40px; /* Adjust input size for smaller screens */
         height: 35px;
     }
+}
+.quantity-control {
+    display: flex;
+    align-items: center;
+    gap: 5px;
+}
+.quantity {
+    font-size: 14px;
+    font-weight: bold;
+    min-width: 20px;
+    text-align: center;
+}
+.btn-sm {
+    padding: 2px 8px;
+    font-size: 12px;
+}
 </style>
 </head>
 <body>
     </div>
     <div class= "d-flex flex-column align-item-center justify-content-center">
       <!-- <button class="btn btn-primary>ADD</button> -->
+      {% if item.Section__c == 'Soft Drinks' %}
+                        <!-- Soft Drinks: Direct Add-to-Cart Button -->
+                        <div id="quantity-control-{{ loop.index }}" class="quantity-control" style="display: none;">
+                            <button class="btn btn-outline-secondary btn-sm" onclick="decreaseQuantity('{{ item.Name }}', {{ loop.index }})">−</button>
+                            <span class="quantity mx-2" id="quantity-{{ loop.index }}">1</span>
+                            <button class="btn btn-outline-secondary btn-sm" onclick="increaseQuantity('{{ item.Name }}', {{ loop.index }})">+</button>
+                        </div>
+      <button class="btn btn-primary" id="add-btn-{{ loop.index }}"
+                            onclick="addSoftDrinkToCart('{{ item.Name }}', '{{ item.Price__c }}', '{{ item.Image1__c }}', '{{ item.Section__c }}', '{{ selected_category }}', {{ loop.index }})">
+                            ADD
+                        </button>
+   {% else %}
+                        <!-- Other Items: Modal Button -->
      <button class="btn btn btn-primary "
             data-bs-toggle="modal" data-bs-target="#itemModal"
             onclick="showItemDetails('{{ item.Name }}', '{{ item.Price__c }}', '{{ item.Image2__c }}', '{{ item.Description__c }}', '{{ item.Section__c }}','{{ selected_category }}')">
        {% if item.Section__c != 'Apetizer' and item.Section__c != 'Customized dish' and item.Section__c !='Soft Drinks' %}
   <h5 class="customisable-text">Customisable</h5>
 {% endif %}
+    </div>
     </div>
   </div>
 </div>
     });
 });
+  // Function to add Soft Drink to cart directly
+function addSoftDrinkToCart(name, price, image, section, category, index) {
+    const itemPrice = parseFloat(price);
+    const quantity = 1; // Default quantity
+    const cartPayload = {
+        itemName: name,
+        itemPrice: itemPrice,
+        itemImage: image || '/static/placeholder.jpg',
+        section: section,
+        category: category,
+        addons: [], // No add-ons for Soft Drinks
+        instructions: '', // No instructions for Soft Drinks
+        quantity: quantity
+    };
+    fetch('/cart/add', {
+        method: 'POST',
+        headers: {
+            'Content-Type': 'application/json',
+        },
+        body: JSON.stringify(cartPayload)
+    })
+    .then(response => response.json())
+    .then(data => {
+        if (data.success) {
+            // Hide the ADD button and show quantity controls
+            document.getElementById(`add-btn-${index}`).style.display = 'none';
+            document.getElementById(`quantity-control-${index}`).style.display = 'flex';
+            updateCartUI(data.cart);
+            alert('Soft Drink added to cart successfully!');
+        } else {
+            alert(data.error || 'Failed to add Soft Drink to cart.');
+        }
+    })
+    .catch(err => {
+        console.error('Error adding Soft Drink to cart:', err);
+        alert('An error occurred while adding the Soft Drink to the cart.');
+    });
+}
+    // Function to increase quantity
+function increaseQuantity(name, index) {
+    let quantityElement = document.getElementById(`quantity-${index}`);
+    let currentQuantity = parseInt(quantityElement.innerText);
+    currentQuantity++;
+    quantityElement.innerText = currentQuantity;
+    updateCartQuantity(name, currentQuantity);
+}
+// Function to decrease quantity
+function decreaseQuantity(name, index) {
+    let quantityElement = document.getElementById(`quantity-${index}`);
+    let currentQuantity = parseInt(quantityElement.innerText);
+    if (currentQuantity > 1) {
+        currentQuantity--;
+        quantityElement.innerText = currentQuantity;
+        updateCartQuantity(name, currentQuantity);
+    } else {
+        // Remove from cart and revert to ADD button
+        removeFromCart(name, index);
+    }
+}
+  // Existing updateCartUI function (unchanged, but included for reference)
+function updateCartUI(cart) {
+    if (!Array.isArray(cart)) {
+        console.error('Invalid cart data:', cart);
+        return;
+    }
+    const cartIcon = document.getElementById('cart-icon');
+    if (cartIcon) {
+        cartIcon.innerText = cart.length; // Update cart icon if it exists
+    }
+}
     </script>