Update templates/index.html

templates/index.html

@@ -8,7 +8,7 @@
     <style>
         body {
             font-family: 'Roboto', sans-serif;
-            background: linear-gradient(135deg, #f4c542, #ff8f6a); /* Light gradient background */
+            background: linear-gradient(135deg, #f4c542, #ff8f6a);
             margin: 0;
             display: flex;
             justify-content: center;
@@ -17,7 +17,7 @@
             text-align: center;
         }
         .container {
-            background:lightblue;
+            background: lightblue;
             padding: 40px 50px;
             border-radius: 10px;
             width: 400px;
@@ -26,7 +26,7 @@
         h1 {
             font-size: 30px;
             font-weight: bold;
-            color: #ff6a00; /* Bright orange for title */
+            color: #ff6a00;
         }
         label {
             font-size: 18px;
@@ -59,29 +59,24 @@
     <div class="container">
         <h1>Welcome to Biryani Hub</h1>
         
-        <!-- Name Input Field -->
         <label for="name">Your Name</label>
         <input type="text" id="name" placeholder="Your name will appear here..." readonly>
 
-        <!-- Email Input Field -->
         <label for="email">Your Email</label>
         <input type="text" id="email" placeholder="Your email will appear here..." readonly>
 
-        <!-- Info Message for Listening -->
         <p class="info" id="infoMessage">Listening will start automatically...</p>
-
-        <!-- Status Message -->
         <p class="status" id="status">Initializing...</p>
     </div>
 
     <script>
         let recognition;
-        let isListening = false;
         let isNameCaptured = false;
+        let isEmailCaptured = false;
 
         if ('webkitSpeechRecognition' in window) {
             recognition = new webkitSpeechRecognition();
-            recognition.continuous = false;  // Stop after capturing each input
+            recognition.continuous = false;
             recognition.interimResults = false;
             recognition.lang = 'en-US';
         } else {
@@ -90,63 +85,46 @@
 
         function speak(text, callback) {
             const speech = new SpeechSynthesisUtterance(text);
-            speech.onend = callback;  // Once the speech ends, call the next function
+            speech.onend = callback;
             window.speechSynthesis.speak(speech);
         }
 
-        function startListeningForName() {
-            const status = document.getElementById('status');
-            const nameInput = document.getElementById('name');
-
-            status.textContent = "Listening for your name...";
-            recognition.start();
-
-            recognition.onresult = function(event) {
-                const transcript = event.results[0][0].transcript.trim();
-                nameInput.value = transcript;
-                recognition.stop();
-
-                // Now, prompt for email
-                speak("Tell me your email", startListeningForEmail);
-            };
+        function startProcess() {
+            speak("Welcome to Biryani Hub", function() {
+                speak("Tell me your name", startListening);
+            });
         }
 
-        function startListeningForEmail() {
+        function startListening() {
             const status = document.getElementById('status');
+            const nameInput = document.getElementById('name');
             const emailInput = document.getElementById('email');
-
-            status.textContent = "Listening for your email...";
+            
             recognition.start();
-
             recognition.onresult = function(event) {
-                let transcript = event.results[0][0].transcript.trim();
-
-            // If name is captured, we now capture email
-            if (isNameCaptured && !isEmailCaptured) {
-               // Correct email input format by removing spaces and handling @ properly
-                const cleanedEmail = transcript.replace(/\s/g, '').replace('@', ' @ '); // Keep space around '@' properly
-
-                // Remove unwanted spaces from the email input
-                emailInput.value = transcript;
-
-                recognition.stop();
-
-                status.textContent = "Registration complete .";
-                speak("Registration complete Go To The Next step and take the order what you want.");
-              
-                // Refresh after 20 seconds
-                setTimeout(() => location.reload(), 20000);
+                const transcript = event.results[0][0].transcript.trim();
+                
+                if (isNameCaptured && !isEmailCaptured) {
+                    const cleanedEmail = transcript.replace(/\s/g, '').replace(' at ', '@');
+                    emailInput.value = cleanedEmail;
+                    status.textContent = 'Registration complete.';
+                    speak("Registration complete. Go to the next step and take the order you want.");
+                    setTimeout(() => location.reload(), 20000);
+                    isEmailCaptured = true;
+                } else if (!isNameCaptured) {
+                    nameInput.value = transcript;
+                    status.textContent = 'Listening for your email...';
+                    recognition.stop();
+                    isNameCaptured = true;
+                    speak("Tell me your email", function() {
+                        recognition.start();
+                    });
+                }
             };
         }
 
-        function startProcess() {
-            speak("Welcome to Biryani Hub", function() {
-                speak("Tell me your name", startListeningForName);
-            });
-        }
-
         window.onload = function () {
-            setTimeout(startProcess, 4000);  // Start process after 4 second
+            setTimeout(startProcess, 4000);
         };
     </script>
 </body>