Spaces:
Sleeping
Sleeping
File size: 3,485 Bytes
66f7c8e |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 |
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()
|