Spaces:
Sleeping
Sleeping
Update templates/menu_page.html
Browse files- templates/menu_page.html +30 -43
templates/menu_page.html
CHANGED
@@ -10,7 +10,6 @@
|
|
10 |
background-color: #f8f8f8;
|
11 |
margin: 0;
|
12 |
padding: 0;
|
13 |
-
text-align: center;
|
14 |
}
|
15 |
.container {
|
16 |
max-width: 1200px;
|
@@ -88,6 +87,7 @@
|
|
88 |
</head>
|
89 |
<body>
|
90 |
|
|
|
91 |
<div class="container" id="welcome-container">
|
92 |
<h1>Welcome to the Biryani Hub Menu</h1>
|
93 |
<div class="menu-option">
|
@@ -96,6 +96,7 @@
|
|
96 |
</div>
|
97 |
</div>
|
98 |
|
|
|
99 |
<div class="container" id="menu-container" style="display: none;">
|
100 |
<h1>Menu</h1>
|
101 |
<div id="menu-items" class="row">
|
@@ -104,6 +105,7 @@
|
|
104 |
<button onclick="viewCart()">View Cart</button>
|
105 |
</div>
|
106 |
|
|
|
107 |
<div class="cart-container" id="cart-container">
|
108 |
<h2>Your Cart</h2>
|
109 |
<div id="cart-items"></div>
|
@@ -133,19 +135,6 @@
|
|
133 |
|
134 |
const cart = [];
|
135 |
|
136 |
-
// Speech Synthesis and Speech Recognition
|
137 |
-
const recognition = new (window.SpeechRecognition || window.webkitSpeechRecognition)();
|
138 |
-
recognition.lang = 'en-US';
|
139 |
-
recognition.interimResults = false;
|
140 |
-
recognition.maxAlternatives = 1;
|
141 |
-
|
142 |
-
// Function to speak text
|
143 |
-
function speak(text, callback) {
|
144 |
-
const msg = new SpeechSynthesisUtterance(text);
|
145 |
-
msg.onend = callback;
|
146 |
-
window.speechSynthesis.speak(msg);
|
147 |
-
}
|
148 |
-
|
149 |
// Function to show the menu based on selected type (veg or non-veg)
|
150 |
function showMenu(type) {
|
151 |
// Hide the welcome screen and show the menu
|
@@ -179,9 +168,9 @@
|
|
179 |
const item = menuItems.veg.concat(menuItems.nonVeg).find(item => item.name === itemName);
|
180 |
const cartItem = { ...item, quantity: parseInt(quantity) };
|
181 |
cart.push(cartItem);
|
182 |
-
|
183 |
} else {
|
184 |
-
|
185 |
}
|
186 |
}
|
187 |
|
@@ -202,48 +191,46 @@
|
|
202 |
// Function to place the final order
|
203 |
function placeOrder() {
|
204 |
if (cart.length > 0) {
|
205 |
-
|
206 |
cart.length = 0; // Clear the cart after placing the order
|
207 |
viewCart(); // Optionally, update cart view
|
208 |
} else {
|
209 |
-
|
210 |
}
|
211 |
}
|
212 |
|
213 |
-
//
|
214 |
-
|
215 |
-
|
216 |
-
|
|
|
217 |
|
218 |
-
// Speech recognition logic
|
219 |
recognition.onresult = (event) => {
|
220 |
const command = event.results[0][0].transcript.toLowerCase();
|
221 |
-
if (command.includes('
|
222 |
-
|
223 |
-
|
224 |
-
|
225 |
-
|
226 |
-
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
227 |
} else {
|
228 |
-
|
229 |
-
recognition.start();
|
230 |
-
});
|
231 |
}
|
232 |
};
|
233 |
|
234 |
-
recognition
|
235 |
-
console.error("Speech recognition error:", event.error);
|
236 |
-
speak("Sorry, I couldn't understand that. Please try again.", () => recognition.start());
|
237 |
-
};
|
238 |
-
|
239 |
-
// Welcome message and voice prompt when the page loads
|
240 |
window.onload = () => {
|
241 |
-
|
242 |
-
|
243 |
-
});
|
244 |
-
}
|
245 |
</script>
|
246 |
|
247 |
</body>
|
248 |
</html>
|
249 |
-
|
|
|
10 |
background-color: #f8f8f8;
|
11 |
margin: 0;
|
12 |
padding: 0;
|
|
|
13 |
}
|
14 |
.container {
|
15 |
max-width: 1200px;
|
|
|
87 |
</head>
|
88 |
<body>
|
89 |
|
90 |
+
<!-- Welcome Page -->
|
91 |
<div class="container" id="welcome-container">
|
92 |
<h1>Welcome to the Biryani Hub Menu</h1>
|
93 |
<div class="menu-option">
|
|
|
96 |
</div>
|
97 |
</div>
|
98 |
|
99 |
+
<!-- Menu Page -->
|
100 |
<div class="container" id="menu-container" style="display: none;">
|
101 |
<h1>Menu</h1>
|
102 |
<div id="menu-items" class="row">
|
|
|
105 |
<button onclick="viewCart()">View Cart</button>
|
106 |
</div>
|
107 |
|
108 |
+
<!-- Cart Page -->
|
109 |
<div class="cart-container" id="cart-container">
|
110 |
<h2>Your Cart</h2>
|
111 |
<div id="cart-items"></div>
|
|
|
135 |
|
136 |
const cart = [];
|
137 |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
138 |
// Function to show the menu based on selected type (veg or non-veg)
|
139 |
function showMenu(type) {
|
140 |
// Hide the welcome screen and show the menu
|
|
|
168 |
const item = menuItems.veg.concat(menuItems.nonVeg).find(item => item.name === itemName);
|
169 |
const cartItem = { ...item, quantity: parseInt(quantity) };
|
170 |
cart.push(cartItem);
|
171 |
+
alert(`${quantity} of ${itemName} added to your cart.`);
|
172 |
} else {
|
173 |
+
alert("Please enter a valid quantity.");
|
174 |
}
|
175 |
}
|
176 |
|
|
|
191 |
// Function to place the final order
|
192 |
function placeOrder() {
|
193 |
if (cart.length > 0) {
|
194 |
+
alert("Your order has been placed successfully!");
|
195 |
cart.length = 0; // Clear the cart after placing the order
|
196 |
viewCart(); // Optionally, update cart view
|
197 |
} else {
|
198 |
+
alert("Your cart is empty. Please add items before placing the order.");
|
199 |
}
|
200 |
}
|
201 |
|
202 |
+
// Voice Recognition for adding items and viewing cart
|
203 |
+
const recognition = new (window.SpeechRecognition || window.webkitSpeechRecognition)();
|
204 |
+
recognition.lang = 'en-US';
|
205 |
+
recognition.interimResults = false;
|
206 |
+
recognition.maxAlternatives = 1;
|
207 |
|
|
|
208 |
recognition.onresult = (event) => {
|
209 |
const command = event.results[0][0].transcript.toLowerCase();
|
210 |
+
if (command.includes('samosa')) {
|
211 |
+
addToCart('Samosa');
|
212 |
+
} else if (command.includes('onion pakoda')) {
|
213 |
+
addToCart('Onion Pakoda');
|
214 |
+
} else if (command.includes('chilli gobi')) {
|
215 |
+
addToCart('Chilli Gobi');
|
216 |
+
} else if (command.includes('chicken biryani')) {
|
217 |
+
addToCart('Chicken Biryani');
|
218 |
+
} else if (command.includes('mutton biryani')) {
|
219 |
+
addToCart('Mutton Biryani');
|
220 |
+
} else if (command.includes('butter chicken')) {
|
221 |
+
addToCart('Butter Chicken');
|
222 |
+
} else if (command.includes('view cart')) {
|
223 |
+
viewCart();
|
224 |
} else {
|
225 |
+
alert("Please say a menu item or 'view cart'.");
|
|
|
|
|
226 |
}
|
227 |
};
|
228 |
|
229 |
+
// Start recognition when the page loads
|
|
|
|
|
|
|
|
|
|
|
230 |
window.onload = () => {
|
231 |
+
recognition.start();
|
232 |
+
};
|
|
|
|
|
233 |
</script>
|
234 |
|
235 |
</body>
|
236 |
</html>
|
|