Spaces:
Sleeping
Sleeping
| import gradio as gr | |
| # In-memory cart to store added items | |
| cart = [] | |
| # Menu data | |
| menu_data = [ | |
| {"name": "Vegetable Biryani", "category": "VEGAN", | |
| "image": "https://huggingface.co/spaces/Rammohan0504/dynamic_menu/resolve/main/images/veg_burger.jpg", | |
| "description": "An Indian dish made to be thoroughly enjoyed by anyone who eats it. Made with the best basmati rice and a perfect blend of spices, cooked in original dum style.", | |
| "price": "$13.99"}, | |
| ] | |
| # Function to add an item to the cart | |
| def add_to_cart(name, price): | |
| cart.append({"name": name, "price": price}) | |
| return f"{name} has been added to the cart!", display_cart() | |
| # Function to display the cart | |
| def display_cart(): | |
| if not cart: | |
| return "Cart is empty" | |
| html_content = "<div style='display: flex; flex-direction: column; align-items: center; width: 100%;'>" | |
| for item in cart: | |
| html_content += f""" | |
| <div style='margin: 10px; display: flex; justify-content: space-between; width: 80%; padding: 10px; | |
| border: 1px solid #ddd; border-radius: 10px; background-color: #f9f9f9;'> | |
| <p style='font-size: 16px; color: #444;'>{item['name']} - {item['price']}</p> | |
| </div> | |
| """ | |
| html_content += "</div>" | |
| return html_content | |
| # Function to display the menu | |
| def display_menu(): | |
| html_content = "<div style='display: flex; flex-direction: column; align-items: center; width: 100%;'>" | |
| for dish in menu_data: | |
| html_content += f""" | |
| <div style='margin: 10px; display: flex; justify-content: space-between; width: 80%; padding: 10px; | |
| border: 1px solid #ddd; border-radius: 10px; background-color: #f9f9f9;'> | |
| <div> | |
| <h4 style='font-size: 18px; color: #444; margin: 0;'>{dish['name']}</h4> | |
| <p style='font-size: 14px; color: #666; margin: 5px 0;'>{dish['description']}</p> | |
| <p style='font-size: 16px; color: #444; margin: 0;'>Price: {dish['price']}</p> | |
| </div> | |
| <div style='text-align: center;'> | |
| <img src='{dish['image']}' alt='{dish['name']}' | |
| style='width: 150px; height: 100px; object-fit: cover; border-radius: 10px;'> | |
| <button onclick="addToCart('{dish['name']}', '{dish['price']}')" | |
| style="margin-top: 15px; padding: 10px 20px; background-color: #28a745; color: white; border: none; | |
| border-radius: 5px; cursor: pointer;">Add to Cart</button> | |
| </div> | |
| </div> | |
| """ | |
| html_content += "</div>" | |
| return html_content | |
| # Gradio App | |
| with gr.Blocks() as demo: | |
| gr.HTML("<h1 style='text-align: center; color: #333;'>🍛 Biryani Hub Menu 🍛</h1>") | |
| # Display menu | |
| menu_section = gr.HTML(value=display_menu()) | |
| # Add to Cart functionality | |
| name_input = gr.Textbox(label="Dish Name", visible=False) | |
| price_input = gr.Textbox(label="Dish Price", visible=False) | |
| add_to_cart_button = gr.Button("Add to Cart", visible=False) | |
| message_output = gr.Textbox(label="Message", interactive=False) | |
| cart_display = gr.HTML(value=display_cart()) | |
| # Add to cart interaction | |
| add_to_cart_button.click( | |
| add_to_cart, | |
| inputs=[name_input, price_input], | |
| outputs=[message_output, cart_display] | |
| ) | |
| # Menu Section with dynamic cart updates | |
| demo += menu_section | |
| demo += message_output | |
| demo += cart_display | |
| demo.launch() | |