Update templates/menu.html

templates/menu.html

@@ -898,41 +898,59 @@ if (!localStorage.getItem('cart')) {
     localStorage.setItem('cart', JSON.stringify([]));
 }
 
-// Function to add item to the cart
-function addToCart(itemName, itemPrice, itemImage) {
-    // Get the cart from localStorage
-    let cart = JSON.parse(localStorage.getItem('cart'));
-
-    // Create the item object to add to the cart
-    let item = {
-        name: itemName,
-        price: itemPrice,
-        image: itemImage,
-        quantity: 1 // Initial quantity is 1, you can adjust if needed
-    };
+function addToCartDirectly() {
+    // Retrieve item details directly from the modal
+    const itemName = document.getElementById('modal-name').innerText;
+    let itemPrice = parseFloat(document.getElementById('modal-price').innerText.replace('$', ''));
 
-    // Check if the item already exists in the cart
-    let existingItem = cart.find(cartItem => cartItem.name === itemName);
+    // Validate item price
+    if (isNaN(itemPrice)) {
+        alert('Invalid price for the item. Please check the item details.');
+        return;
+    }
+
+    const itemImage = document.getElementById('modal-img').src;
+    const quantity = parseInt(document.getElementById('quantityInput').value) || 1; // Default to 1 if invalid
 
-    if (existingItem) {
-        // If the item already exists, just update the quantity
-        existingItem.quantity += 1;
-    } else {
-        // If the item doesn't exist, add it to the cart
-        cart.push(item);
+    if (!itemName || !itemPrice || !itemImage) {
+        console.error('Missing data for cart item:', { itemName, itemPrice, itemImage});
+        return;
     }
 
-    // Save the updated cart back to localStorage
-    localStorage.setItem('cart', JSON.stringify(cart));
+    // Prepare the cart data (no add-ons or section)
+    const cartPayload = {
+        itemName: itemName,
+        itemPrice: itemPrice,
+        itemImage: itemImage,
+        quantity: quantity // Include quantity
+    };
 
-    // Optional: Update the UI to show the cart count or show a message
-    alert(itemName + " has been added to your cart!");
+    // Send the cart data to the server
+    fetch('/cart/add', {
+        method: 'POST',
+        headers: {
+            'Content-Type': 'application/json',
+        },
+        body: JSON.stringify(cartPayload)
+    })
+    .then(response => response.json())
+    .then(data => {
+        if (data.success) {
+            alert('Item added to cart successfully!');
+            updateCartUI(data.cart); // Update cart UI after adding an item
+            const modal = document.getElementById('itemModal');
+            const modalInstance = bootstrap.Modal.getInstance(modal);
+            modalInstance.hide();
+        } else {
+            alert(data.error || 'Failed to add item to cart.');
+        }
+    })
+    .catch(err => {
+        console.error('Error adding item to cart:', err);
+        alert('An error occurred while adding the item to the cart.');
+    });
 }
 
-// Function to get the cart (optional for showing cart info)
-function getCart() {
-    return JSON.parse(localStorage.getItem('cart'));
-}