Spaces:
Sleeping
Sleeping
File size: 5,697 Bytes
6a94706 b537c3b 7980609 b537c3b 2eb1a73 96fe3dc b537c3b 920d44a b16d730 f03d6fd b16d730 f03d6fd 920d44a 013b172 bf46b85 2eb1a73 bf46b85 013b172 bf46b85 ad4e58e 6a94706 bf46b85 f03d6fd 6a94706 b16d730 ad4e58e f03d6fd ad4e58e 013b172 b16d730 013b172 920d44a 7980609 920d44a 7980609 920d44a 013b172 |
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 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 |
import gradio as gr
import pandas as pd
# Function to load the menu data from Excel
def load_menu():
menu_file = "menu.xlsx" # Ensure this file exists in the same directory
try:
return pd.read_excel(menu_file)
except Exception as e:
raise ValueError(f"Error loading menu file: {e}")
# Function to generate the popup content dynamically
def generate_popup(item_name):
menu_data = load_menu()
try:
item = menu_data[menu_data['Dish Name'] == item_name].iloc[0]
except IndexError:
return f"<p style='color: red;'>Item '{item_name}' not found!</p>"
# Dynamic HTML for the popup
popup_content = f"""
<div style="background-color: white; padding: 20px; border-radius: 8px; width: 80%; margin: auto; box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.2); position: fixed; top: 50%; left: 50%; transform: translate(-50%, -50%); z-index: 1000;">
<img src="{item['Image URL']}" alt="{item_name}" style="width: 100%; border-radius: 8px; margin-bottom: 20px;">
<h2>{item_name}</h2>
<p>{item['Description']}</p>
<p style="font-size: 18px; color: #333;"><strong>Price:</strong> ${item['Price ($)']}</p>
<h3>Choose a Spice Level:</h3>
<div style="display: flex; gap: 10px;">
<label><input type="radio" name="spice" value="American Mild"> American Mild</label>
<label><input type="radio" name="spice" value="American Medium"> American Medium</label>
<label><input type="radio" name="spice" value="American Spicy"> American Spicy</label>
<label><input type="radio" name="spice" value="Indian Mild"> Indian Mild</label>
<label><input type="radio" name="spice" value="Indian Medium"> Indian Medium</label>
<label><input type="radio" name="spice" value="Indian Spicy"> Indian Spicy</label>
</div>
<h3>Biryani Extras:</h3>
<div style="display: flex; flex-wrap: wrap; gap: 10px;">
<label><input type="checkbox" name="extras" value="Extra Raitha 4oz"> Extra Raitha 4oz ($1)</label>
<label><input type="checkbox" name="extras" value="Extra Raitha 8oz"> Extra Raitha 8oz ($2)</label>
<label><input type="checkbox" name="extras" value="Extra Salan 4oz"> Extra Salan 4oz ($1)</label>
<label><input type="checkbox" name="extras" value="Extra Onion"> Extra Onion ($1)</label>
</div>
<h3>Special Instructions:</h3>
<textarea placeholder="Add any requests here." style="width: 100%; height: 100px;"></textarea>
<h3>Quantity:</h3>
<input type="number" value="1" min="1" style="width: 50px;">
<button style="background-color: purple; color: white; padding: 10px 20px; margin-top: 20px; border: none; border-radius: 5px; cursor: pointer;">Add to Bag</button>
</div>
"""
return popup_content
# Function to filter menu items and include the popup functionality
def filter_menu_with_popup(preference):
menu_data = load_menu()
# Define filter conditions
if preference == "Halal/Non-Veg":
filtered_data = menu_data[menu_data["Ingredients"].str.contains("Chicken|Mutton|Fish|Prawns|Goat", case=False, na=False)]
elif preference == "Vegetarian":
filtered_data = menu_data[~menu_data["Ingredients"].str.contains("Chicken|Mutton|Fish|Prawns|Goat", case=False, na=False)]
elif preference == "Guilt-Free":
filtered_data = menu_data[menu_data["Description"].str.contains(r"Fat: ([0-9]|10)g", case=False, na=False)]
else: # Default to "All"
filtered_data = menu_data
# Generate HTML for the menu
html_content = ""
for _, item in filtered_data.iterrows():
html_content += f"""
<div style="display: flex; align-items: center; border: 1px solid #ddd; border-radius: 8px; padding: 15px; margin-bottom: 10px; box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.1); position: relative;">
<div style="flex: 1; margin-right: 15px;">
<h3 style="margin: 0; font-size: 18px;">{item['Dish Name']}</h3>
<p style="margin: 5px 0; font-size: 16px; color: #888;">${item['Price ($)']}</p>
<p style="margin: 5px 0; font-size: 14px; color: #555;">{item['Description']}</p>
</div>
<div style="flex-shrink: 0; text-align: center;">
<img src="{item['Image URL']}" alt="{item['Dish Name']}" style="width: 100px; height: 100px; border-radius: 8px; object-fit: cover; margin-bottom: 10px;">
<button onclick="showPopup('{item['Dish Name']}')" style="background-color: #28a745; color: white; border: none; padding: 8px 15px; font-size: 14px; border-radius: 5px; cursor: pointer;">Add</button>
</div>
</div>
"""
return html_content
# Gradio app definition
def app():
with gr.Blocks(title="Dynamic Menu with Filters") as demo:
gr.Markdown("## Dynamic Menu with Preferences")
# Radio button for selecting preference
selected_preference = gr.Radio(
choices=["All", "Vegetarian", "Halal/Non-Veg", "Guilt-Free"],
value="All",
label="Choose a Preference",
)
# Output area for menu items
menu_output = gr.HTML(value=filter_menu_with_popup("All"))
# Popup area
popup_output = gr.HTML()
# Define interactivity
selected_preference.change(filter_menu_with_popup, inputs=[selected_preference], outputs=[menu_output])
# Layout
gr.Row([selected_preference])
gr.Row(menu_output)
gr.Row(popup_output)
return demo
# Run the app
if __name__ == "__main__":
demo = app()
demo.launch()
|