Spaces:
Running
Running
Update templates/menu_page.html
Browse files- templates/menu_page.html +13 -60
templates/menu_page.html
CHANGED
@@ -22,6 +22,11 @@
|
|
22 |
|
23 |
<div class="menu-container">
|
24 |
<h1>Welcome to the Menu</h1>
|
|
|
|
|
|
|
|
|
|
|
25 |
<div id="menu-items"></div>
|
26 |
<button onclick="viewCart()">View Cart</button>
|
27 |
</div>
|
@@ -54,29 +59,11 @@
|
|
54 |
|
55 |
const cart = [];
|
56 |
|
57 |
-
const recognition = new (window.SpeechRecognition || window.webkitSpeechRecognition)();
|
58 |
-
recognition.lang = 'en-US';
|
59 |
-
recognition.interimResults = false;
|
60 |
-
recognition.maxAlternatives = 1;
|
61 |
-
|
62 |
-
// Greeting the user
|
63 |
-
function speak(text, callback) {
|
64 |
-
const msg = new SpeechSynthesisUtterance(text);
|
65 |
-
msg.onend = callback;
|
66 |
-
window.speechSynthesis.speak(msg);
|
67 |
-
}
|
68 |
-
|
69 |
-
function askForVegOrNonVeg() {
|
70 |
-
speak("Would you prefer vegetarian or non-vegetarian?", () => {
|
71 |
-
recognition.start();
|
72 |
-
});
|
73 |
-
}
|
74 |
-
|
75 |
-
// Function to display menu based on user's choice (veg/non-veg)
|
76 |
function showMenu(type) {
|
77 |
const menuContainer = document.getElementById('menu-items');
|
78 |
menuContainer.innerHTML = ''; // Clear previous menu items
|
79 |
|
|
|
80 |
menuItems[type].forEach(item => {
|
81 |
const div = document.createElement('div');
|
82 |
div.classList.add('menu-item');
|
@@ -94,20 +81,18 @@
|
|
94 |
});
|
95 |
}
|
96 |
|
97 |
-
// Function to add items to the cart
|
98 |
function addToCart(itemName) {
|
99 |
const quantity = prompt(`How many ${itemName} would you like to add?`, 1);
|
100 |
if (quantity && !isNaN(quantity) && quantity > 0) {
|
101 |
const item = menuItems.veg.concat(menuItems.nonVeg).find(item => item.name === itemName);
|
102 |
const cartItem = { ...item, quantity: parseInt(quantity) };
|
103 |
cart.push(cartItem);
|
104 |
-
|
105 |
} else {
|
106 |
-
|
107 |
}
|
108 |
}
|
109 |
|
110 |
-
// Function to view cart
|
111 |
function viewCart() {
|
112 |
const cartContainer = document.getElementById('cart-container');
|
113 |
const cartItemsContainer = document.getElementById('cart-items');
|
@@ -121,49 +106,17 @@
|
|
121 |
cartContainer.style.display = 'block';
|
122 |
}
|
123 |
|
124 |
-
// Function to place the final order
|
125 |
function placeOrder() {
|
126 |
if (cart.length > 0) {
|
127 |
-
|
128 |
-
|
129 |
-
|
130 |
-
});
|
131 |
} else {
|
132 |
-
|
133 |
}
|
134 |
}
|
135 |
|
136 |
-
// Speech recognition for handling the customer’s choice
|
137 |
-
recognition.onresult = (event) => {
|
138 |
-
const command = event.results[0][0].transcript.toLowerCase();
|
139 |
-
if (command.includes('vegetarian')) {
|
140 |
-
showMenu('veg');
|
141 |
-
speak("Here are the vegetarian items.", () => askForItemsToAdd());
|
142 |
-
} else if (command.includes('non-vegetarian')) {
|
143 |
-
showMenu('nonVeg');
|
144 |
-
speak("Here are the non-vegetarian items.", () => askForItemsToAdd());
|
145 |
-
} else {
|
146 |
-
speak("Please say vegetarian or non-vegetarian.", () => {
|
147 |
-
recognition.start();
|
148 |
-
});
|
149 |
-
}
|
150 |
-
};
|
151 |
-
|
152 |
-
recognition.onerror = (event) => {
|
153 |
-
console.error("Speech recognition error:", event.error);
|
154 |
-
speak("Sorry, I couldn't understand that. Please try again.", () => recognition.start());
|
155 |
-
};
|
156 |
-
|
157 |
-
function askForItemsToAdd() {
|
158 |
-
speak("Please say the name of the item you'd like to add to the cart.", () => {
|
159 |
-
recognition.start();
|
160 |
-
});
|
161 |
-
}
|
162 |
-
|
163 |
-
// Initiating the process as soon as the page loads
|
164 |
-
window.onload = () => {
|
165 |
-
speak("Welcome to the Biryani Hub menu.", () => askForVegOrNonVeg());
|
166 |
-
};
|
167 |
</script>
|
168 |
</body>
|
169 |
</html>
|
|
|
|
22 |
|
23 |
<div class="menu-container">
|
24 |
<h1>Welcome to the Menu</h1>
|
25 |
+
<!-- Buttons to select vegetarian or non-vegetarian menu -->
|
26 |
+
<div class="menu-option">
|
27 |
+
<button onclick="showMenu('veg')">Vegetarian Menu</button>
|
28 |
+
<button onclick="showMenu('nonVeg')">Non-Vegetarian Menu</button>
|
29 |
+
</div>
|
30 |
<div id="menu-items"></div>
|
31 |
<button onclick="viewCart()">View Cart</button>
|
32 |
</div>
|
|
|
59 |
|
60 |
const cart = [];
|
61 |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
62 |
function showMenu(type) {
|
63 |
const menuContainer = document.getElementById('menu-items');
|
64 |
menuContainer.innerHTML = ''; // Clear previous menu items
|
65 |
|
66 |
+
// Display items based on selected menu type
|
67 |
menuItems[type].forEach(item => {
|
68 |
const div = document.createElement('div');
|
69 |
div.classList.add('menu-item');
|
|
|
81 |
});
|
82 |
}
|
83 |
|
|
|
84 |
function addToCart(itemName) {
|
85 |
const quantity = prompt(`How many ${itemName} would you like to add?`, 1);
|
86 |
if (quantity && !isNaN(quantity) && quantity > 0) {
|
87 |
const item = menuItems.veg.concat(menuItems.nonVeg).find(item => item.name === itemName);
|
88 |
const cartItem = { ...item, quantity: parseInt(quantity) };
|
89 |
cart.push(cartItem);
|
90 |
+
alert(`${quantity} of ${itemName} added to your cart.`);
|
91 |
} else {
|
92 |
+
alert("Please enter a valid quantity.");
|
93 |
}
|
94 |
}
|
95 |
|
|
|
96 |
function viewCart() {
|
97 |
const cartContainer = document.getElementById('cart-container');
|
98 |
const cartItemsContainer = document.getElementById('cart-items');
|
|
|
106 |
cartContainer.style.display = 'block';
|
107 |
}
|
108 |
|
|
|
109 |
function placeOrder() {
|
110 |
if (cart.length > 0) {
|
111 |
+
alert("Your order has been placed successfully!");
|
112 |
+
cart.length = 0; // Clear the cart after placing the order
|
113 |
+
viewCart(); // Optionally, update cart view
|
|
|
114 |
} else {
|
115 |
+
alert("Your cart is empty. Please add items before placing the order.");
|
116 |
}
|
117 |
}
|
118 |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
119 |
</script>
|
120 |
</body>
|
121 |
</html>
|
122 |
+
|