Update app.py

app.py

@@ -122,8 +122,6 @@ def store_cart_in_salesforce(cart_summary, total_cost):
         return "Order saved successfully in Salesforce."
     except Exception as e:
         return f"Error saving order in Salesforce: {str(e)}"
-
-# Function to create modal window HTML
 def create_modal_window():
     add_ons = load_add_ons_from_salesforce()
     add_ons_html = ""
@@ -172,12 +170,14 @@ def create_modal_window():
     </div>
     """
     return modal_html
+
 # JavaScript for Modal and Cart
 def modal_js():
     modal_script = """
     <script>
         let cart = [];
         let totalCartCost = 0;
+
         function openModal(name, image2, description, price) {
             const modal = document.getElementById('modal');
             modal.style.display = 'block';
@@ -192,11 +192,13 @@ def modal_js():
             document.getElementById('modal-price').innerText = price;
             document.getElementById('quantity').value = 1;
             document.getElementById('special-instructions').value = '';
-            resetAddOns();  // Reset add-ons when opening the modal
+            resetAddOns();
         }
+
         function closeModal() {
             document.getElementById('modal').style.display = 'none';
         }
+
         function addToCart() {
             const name = document.getElementById('modal-name').innerText;
             const price = parseFloat(document.getElementById('modal-price').innerText.replace('$', ''));
@@ -206,21 +208,22 @@ def modal_js():
             const extras = selectedAddOns.map(extra => ({
                 name: extra.value,
                 price: parseFloat(extra.getAttribute('data-price')),
-                quantity: 1  // Default quantity for add-ons is 1
+                quantity: 1
             }));
             const extrasCost = extras.reduce((total, extra) => total + (extra.price * extra.quantity), 0);
             const totalCost = (price * quantity) + extrasCost;
-            // Add the item to the cart with its specific add-ons
             cart.push({ name, price, quantity, extras, instructions, totalCost });
-            totalCartCost += totalCost;  // Update the total cost of the cart
+            totalCartCost += totalCost;
             updateCartButton();
-            updateCartTotalCost();  // Update total cost displayed
+            updateCartTotalCost();
             closeModal();
         }
+
         function updateCartButton() {
             const cartButton = document.getElementById('cart-button');
             cartButton.innerText = `View Cart (${cart.length} items)`;
         }
+
         function openCartModal() {
             const cartModal = document.getElementById('cart-modal');
             const cartItemsContainer = document.getElementById('cart-items');
@@ -240,69 +243,60 @@ def modal_js():
             });
             cartModal.style.display = 'block';
         }
+
         function closeCartModal() {
             document.getElementById('cart-modal').style.display = 'none';
         }
+
         function removeFromCart(index) {
-            totalCartCost -= cart[index].totalCost;  // Deduct the cost of the removed item from total cost
+            totalCartCost -= cart[index].totalCost;
             cart.splice(index, 1);
             updateCartButton();
-            updateCartTotalCost();  // Update total cost displayed
+            updateCartTotalCost();
             openCartModal();
         }
+
         function updateCartItem(index, type, value) {
             if (type === 'item') {
                 cart[index].quantity = parseInt(value);
             } else if (type === 'extra') {
-                cart[index].extras[0].quantity = parseInt(value); // Assuming one add-on for simplicity
+                cart[index].extras[0].quantity = parseInt(value);
             }
             const item = cart[index];
             const price = item.price;
             const extrasCost = item.extras.reduce((total, extra) => total + (extra.price * extra.quantity), 0);
             item.totalCost = (price * item.quantity) + extrasCost;
             document.getElementById(`item-${index}-total`).innerText = item.totalCost.toFixed(2);
-            updateCartTotalCost();  // Update total cost displayed
+            updateCartTotalCost();
         }
+
         function updateCartTotalCost() {
             const totalCostElement = document.getElementById('cart-total-cost');
             totalCartCost = cart.reduce((total, item) => total + item.totalCost, 0);
             totalCostElement.innerText = `Total Cart Cost: $${totalCartCost.toFixed(2)}`;
         }
+
         function proceedToCheckout() {
             const cartSummary = cart.map(item => `
                 ${item.name} (x${item.quantity}) - $${item.totalCost.toFixed(2)}
                 Extras: ${item.extras.map(extra => extra.name).join(', ') || 'None'}
                 Instructions: ${item.instructions || 'None'}
             `).join('\n');
-
             const totalBill = totalCartCost.toFixed(2);
 
-            // Call Python function to store data in Salesforce
             fetch('/run_proceed_checkout', {
                 method: 'POST',
-                headers: {
-                    'Content-Type': 'application/json'
-                },
+                headers: { 'Content-Type': 'application/json' },
                 body: JSON.stringify({ cartSummary, totalBill })
-            })
-             .then(response => response.json())
-            .then(data => {
+            }).then(response => response.json()).then(data => {
                 alert(data.message);
-            })
-            .catch(error => {
+            }).catch(error => {
                 alert("Error during checkout: " + error);
             });
         }
-        // Reset all selected add-ons when opening a new item modal
-        function resetAddOns() {
-            const checkboxes = document.querySelectorAll('input[name="biryani-extra"]');
-            checkboxes.forEach(checkbox => checkbox.checked = false);  // Uncheck all add-ons
-        }
     </script>
     """
     return modal_script
-# JavaScript for Modal and Cart
-
 
 # Gradio App
 with gr.Blocks() as app:
@@ -333,19 +327,19 @@ with gr.Blocks() as app:
             menu_output = gr.HTML()
             gr.HTML("<div id='cart-button' style='position: fixed; top: 20px; right: 20px; background: #28a745; color: white; padding: 10px 20px; border-radius: 30px; cursor: pointer; z-index: 1000;' onclick='openCartModal()'>View Cart</div>")
             gr.HTML(create_modal_window())
-            gr.HTML(modal_js)
+            gr.HTML(modal_js())
 
     login_button.click(
         lambda email, password: (gr.update(visible=False), gr.update(visible=True), gr.update(value=filter_menu("All")), "Login successful!")
         if login(email, password)[0] == "Login successful!" else (gr.update(), gr.update(), gr.update(), "Invalid email or password."),
         [login_email, login_password], [login_page, menu_page, menu_output, login_output]
     )
+
     submit_signup.click(
         lambda name, email, phone, password: signup(name, email, phone, password),
         inputs=[signup_name, signup_email, signup_phone, signup_password],
         outputs=signup_output
     )
-
     signup_button.click(
         lambda: (gr.update(visible=False), gr.update(visible=True)),
         inputs=[],