File size: 5,326 Bytes
7547860 e748187 e68e6b9 e448584 e748187 7547860 8fdce7e e748187 e448584 e68e6b9 7547860 fd2f5b6 e68e6b9 e448584 e68e6b9 e448584 fd2f5b6 8fdce7e e68e6b9 fd2f5b6 8fdce7e fd2f5b6 8fdce7e fd2f5b6 8fdce7e e68e6b9 8fdce7e e68e6b9 fd2f5b6 e68e6b9 8fdce7e e68e6b9 fd2f5b6 e68e6b9 fd2f5b6 e448584 8fdce7e 7547860 |
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 |
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Menu - Biryani Hub</title>
<style>
body { font-family: Arial, sans-serif; background-color: #f8f8f8; margin: 0; padding: 0; }
.menu-container { max-width: 1200px; margin: 0 auto; padding: 20px; background-color: #fff; border-radius: 8px; margin-top: 20px; }
h1 { text-align: center; font-size: 2.5rem; color: #333; }
.menu-item { margin-bottom: 20px; padding: 10px; border: 1px solid #ddd; border-radius: 5px; }
.menu-item img { width: 100px; height: 100px; border-radius: 8px; margin-right: 10px; }
.details { display: flex; align-items: center; }
.text { margin-left: 10px; }
.menu-option { margin: 20px; font-size: 1.5rem; }
</style>
</head>
<body>
<div class="menu-container">
<h1>Welcome to the Menu</h1>
<div class="menu-option">
<button onclick="showMenu('veg')">Veg Items</button>
<button onclick="showMenu('non-veg')">Non-Veg Items</button>
</div>
<div id="menu-items"></div>
</div>
<script>
const menuItems = [
{ name: 'Samosa', price: 9, ingredients: 'Potatoes, Peas, Flour, Spices', description: 'Crispy fried pastry filled with spiced potatoes and peas.', imageUrl: 'https://via.placeholder.com/100', category: 'veg' },
{ name: 'Onion Pakoda', price: 10, ingredients: 'Onions, Gram Flour, Spices', description: 'Deep-fried onion fritters seasoned with herbs and spices.', imageUrl: 'https://via.placeholder.com/100', category: 'veg' },
{ name: 'Chilli Gobi', price: 12, ingredients: 'Cauliflower, Chili Sauce, Spices', description: 'Cauliflower florets tossed in a spicy chili sauce.', imageUrl: 'https://via.placeholder.com/100', category: 'veg' },
{ name: 'Chicken Biryani', price: 14, ingredients: 'Chicken, Basmati Rice, Spices', description: 'Aromatic basmati rice cooked with tender chicken and spices.', imageUrl: 'https://via.placeholder.com/100', category: 'non-veg' },
{ name: 'Mutton Biryani', price: 16, ingredients: 'Mutton, Basmati Rice, Spices', description: 'Flavorful rice dish made with succulent mutton and aromatic spices.', imageUrl: 'https://via.placeholder.com/100', category: 'non-veg' },
{ name: 'Fish Curry', price: 18, ingredients: 'Fish, Spices, Coconut Milk', description: 'Delicious fish curry made with fresh fish and coconut milk.', imageUrl: 'https://via.placeholder.com/100', category: 'non-veg' },
{ name: 'Paneer Butter Masala', price: 13, ingredients: 'Paneer, Tomato, Butter, Spices', description: 'Soft paneer cubes in a creamy, flavorful gravy.', imageUrl: 'https://via.placeholder.com/100', category: 'veg' },
{ name: 'Aloo Gobi', price: 10, ingredients: 'Potatoes, Cauliflower, Spices', description: 'A traditional Indian curry with potatoes and cauliflower.', imageUrl: 'https://via.placeholder.com/100', category: 'veg' },
];
const menuContainer = document.getElementById('menu-items');
function showMenu(type) {
menuContainer.innerHTML = ''; // Clear previous menu items
const filteredItems = menuItems.filter(item => item.category === type);
filteredItems.forEach(item => {
const div = document.createElement('div');
div.classList.add('menu-item');
div.innerHTML = `<div class="details"><img src="${item.imageUrl}" alt="${item.name}"><div class="text"><h3>${item.name}</h3><p>${item.description}</p><p><strong>Ingredients:</strong> ${item.ingredients}</p><p><strong>Price:</strong> $${item.price}</p></div></div>`;
menuContainer.appendChild(div);
});
}
const recognition = new (window.SpeechRecognition || window.webkitSpeechRecognition)();
recognition.lang = 'en-US';
recognition.interimResults = false;
function speak(text, callback) {
const msg = new SpeechSynthesisUtterance(text);
msg.onend = callback;
window.speechSynthesis.speak(msg);
}
function readMenuItems() {
let menuText = 'Here is the menu. ';
menuItems.forEach(item => { menuText += `${item.name}, `; });
menuText += 'Please say the name of the item you would like to order.';
speak(menuText, startListening);
}
function startListening() { recognition.start(); }
recognition.onresult = (event) => {
const command = event.results[0][0].transcript.toLowerCase();
const matchedItem = menuItems.find(item => command.includes(item.name.toLowerCase()));
if (matchedItem) {
speak(`You have ordered ${matchedItem.name}. Your order has been placed.`);
} else {
speak('Item not found. Please try again.', startListening);
}
};
recognition.onerror = () => { speak('Sorry, I could not understand. Please try again.'); };
window.onload = () => {
speak("Welcome to Biryani Hub! Would you like to see the Veg or Non-Veg menu?", () => {});
};
</script>
</body>
</html>
|