voicemenulogin625

Sleeping

App Files Files Community

Subbu1304 commited on 22 days ago

Commit

148fa44

verified ·

1 Parent(s): e0f5c7b

Update templates/index.html

Browse files

Files changed (1) hide show

templates/index.html +35 -190

templates/index.html CHANGED Viewed

@@ -32,9 +32,6 @@
             box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
             display: none;
         }
-        .form-container {
-            width: 100%;
-        }
         h2 {
             font-size: 24px;
             font-weight: bold;
@@ -69,11 +66,6 @@
             color: #ff6a00;
             font-weight: bold;
         }
-        .status {
-            font-size: 14px;
-            color: gray;
-            margin-top: 10px;
-        }
         #confirmation {
             display: none;
             background-color: #f9f9f9;
@@ -96,68 +88,46 @@
 </head>
 <body>
     <h1 class="header-title">Welcome to Biryani Hub 🍽</h1>
-    <!-- Login Form -->
     <div class="container" id="loginForm">
-        <div class="form-container">
-            <h2>Login</h2>
-            <label for="loginEmail">Your Email</label>
-            <input type="text" id="loginEmail" placeholder="Your email will appear here..." readonly>
-            <label for="loginMobile">Your Mobile Number</label>
-            <input type="text" id="loginMobile" placeholder="Your mobile number will appear here..." readonly>
-            <p class="info" id="infoMessageLogin">Listening 🗣🎙️...</p>
-        </div>
     </div>
-    <!-- Registration Form -->
     <div class="container" id="registrationForm">
-        <div class="form-container">
-            <h2>Register</h2>
-            <label for="name">Your Name</label>
-            <input type="text" id="name" placeholder="Your name will appear here..." readonly>
-            <label for="email">Your Email</label>
-            <input type="text" id="email" placeholder="Your email will appear here..." readonly>
-            <label for="mobile">Your Mobile Number</label>
-            <input type="text" id="mobile" placeholder="Your mobile number will appear here..." readonly>
-            <p class="info" id="infoMessage">Listening 🗣🎙️...</p>
-        </div>
     </div>
-    <!-- Confirmation Section -->
     <div id="confirmation">
         <h2>Confirm Your Details:</h2>
         <p><strong>Name:</strong> <span id="confirmName"></span></p>
         <p><strong>Email:</strong> <span id="confirmEmail"></span></p>
         <p><strong>Phone:</strong> <span id="confirmPhone"></span></p>
-        <button class="confirm-button" onclick="autoSubmit()">Confirm</button>
     </div>
     <script>
-        let recognition;
-        let emailCaptured = "";
-        let mobileCaptured = "";
-        if ('webkitSpeechRecognition' in window) {
-            recognition = new webkitSpeechRecognition();
-            recognition.continuous = false;
-            recognition.interimResults = false;
-            recognition.lang = 'en-US';
-        } else {
-            alert("Speech Recognition API is not supported in this browser.");
-        }
         function speak(text, callback) {
-            const speech = new SpeechSynthesisUtterance(text);
             speech.onend = callback;
             window.speechSynthesis.speak(speech);
         }
         function askLoginOrRegister() {
-            speak("Welcome to Biryani Hub. Are you a new user or an existing user? Please say 'new user' to register or 'existing user' to login.", function() {
                 recognition.start();
                 recognition.onresult = function(event) {
                     let response = event.results[0][0].transcript.trim().toLowerCase();
@@ -167,7 +137,7 @@
                     } else if (response.includes("existing user")) {
                         showLoginForm();
                     } else {
-                        speak("I didn't understand. Please say 'new user' to register or 'existing user' to login.", askLoginOrRegister);
                     }
                 };
             });
@@ -175,169 +145,44 @@
         function showLoginForm() {
             document.getElementById('loginForm').style.display = 'block';
-            document.getElementById('registrationForm').style.display = 'none';
-            speak("Please tell your email and mobile number to login.", startListeningForLogin);
         }
         function showRegistrationForm() {
             document.getElementById('registrationForm').style.display = 'block';
-            document.getElementById('loginForm').style.display = 'none';
-            speak("Please say your name to begin registration.", startListeningForName);
-        }
-        let nameCaptured, emailCaptured, mobileCaptured;
-        let nameField = document.getElementById('name');
-        let emailField = document.getElementById('email');
-        let mobileField = document.getElementById('mobile');
-        function startListeningForLogin() {
-            recognition.start();
-            recognition.onresult = function(event) {
-                let loginEmail = event.results[0][0].transcript.trim();
-                document.getElementById('loginEmail').value = loginEmail;
-                recognition.stop();
-                loginEmail = loginEmail.replace(/\bat\b/g, "@").replace(/\s+/g, ''); // Fix "at" to "@"
-                document.getElementById('loginEmail').value = loginEmail;
-                speak("You said " + loginEmail + ". Is it correct?", function() {
-                    recognition.start();
-                    recognition.onresult = function(event) {
-                        let confirmation = event.results[0][0].transcript.trim().toLowerCase();
-                        recognition.stop();
-                        if (confirmation.includes("ok") || confirmation.includes("yes")) {
-                            startListeningForMobileLogin(); // Move to mobile number
-                        } else {
-                            speak("Let's try again. Please tell your email.", startListeningForLogin);
-                        }
-                    };
-                });
-            };
-        }
-        function startListeningForMobileLogin() {
-            recognition.start();
-            recognition.onresult = function(event) {
-                let mobileLogin = event.results[0][0].transcript.trim();
-                document.getElementById('loginMobile').value = mobileLogin;
-                recognition.stop();
-                speak("You said " + mobileLogin + ". Is it correct?", function() {
-                    recognition.start();
-                    recognition.onresult = function(event) {
-                        let confirmation = event.results[0][0].transcript.trim().toLowerCase();
-                        recognition.stop();
-                        if (confirmation.includes("ok") || confirmation.includes("yes")) {
-                            speak("Login successful!");
-                        } else {
-                            speak("Let's try again. Please tell your mobile number.", startListeningForMobileLogin);
-                        }
-                    };
-                });
-            };
         }
         function startListeningForName() {
             recognition.start();
             recognition.onresult = function(event) {
-                nameCaptured = event.results[0][0].transcript.trim();
-                nameField.value = nameCaptured;
                 recognition.stop();
-                setTimeout(confirmName, 500);
             };
         }
         function confirmName() {
-            speak("You said " + nameCaptured + ". Is it okay?", function() {
-                recognition.start();
-                recognition.onresult = function(event) {
-                    let confirmation = event.results[0][0].transcript.trim().toLowerCase();
-                    recognition.stop();
-                    if (confirmation.includes("ok") || confirmation.includes("yes")) {
-                        setTimeout(() => speak("Great! Now, tell me your email.", startListeningForEmail), 500);
-                    } else {
-                        setTimeout(() => speak("Let's try again. Tell me your name.", startListeningForName), 500);
-                    }
-                };
-            });
-        }
-        function startListeningForEmail() {
-            recognition.start();
-            recognition.onresult = function(event) {
-                emailCaptured = event.results[0][0].transcript.trim().replace(/\bat\b/g, '@').replace(/\s+/g, '');
-                emailField.value = emailCaptured;
-                recognition.stop();
-                speak("You said " + emailCaptured + ". Is it correct?", function() {
-                    recognition.start();
-                    recognition.onresult = function(event) {
-                        let confirmation = event.results[0][0].transcript.trim().toLowerCase();
-                        recognition.stop();
-                        if (confirmation.includes("ok") || confirmation.includes("yes")) {
-                            setTimeout(() => speak("Great! Now, tell me your mobile number.", startListeningForMobile), 500);
-                        } else {
-                            speak("Let's try again. Tell me your email.", startListeningForEmail);
-                        }
-                    };
-                });
-            };
-        }
-        function startListeningForMobile() {
             recognition.start();
             recognition.onresult = function(event) {
-                mobileCaptured = event.results[0][0].transcript.trim().replace(/\s+/g, '');
-                mobileField.value = mobileCaptured;
                 recognition.stop();
-                speak("You said " + mobileCaptured + ". Is it correct?", function() {
-                    recognition.start();
-                    recognition.onresult = function(event) {
-                        let confirmation = event.results[0][0].transcript.trim().toLowerCase();
-                        recognition.stop();
-                        if (confirmation.includes("ok") || confirmation.includes("yes")) {
-                            speak("All details are captured. Confirming your registration.", function() {
-                                autoConfirm();
-                            });
-                        } else {
-                            speak("Let's try again. Tell me your mobile number.", startListeningForMobile);
-                        }
-                    };
-                });
             };
         }
-        function autoConfirm() {
-            document.getElementById('confirmName').textContent = nameField.value;
-            document.getElementById('confirmEmail').textContent = emailField.value;
-            document.getElementById('confirmPhone').textContent = mobileField.value;
-            document.getElementById('confirmation').style.display = 'block';
         }
-        function autoSubmit() {
-            var name = document.getElementById('name').value;
-            var email = document.getElementById('email').value;
-            var phone = document.getElementById('mobile').value;
-            fetch('/submit', {
-                method: 'POST',
-                headers: { 'Content-Type': 'application/json' },
-                body: JSON.stringify({ name: name, email: email, phone: phone })
-            })
-            .then(response => response.json())
-            .then(data => {
-                if (data.success) {
-                    document.getElementById('status').textContent = 'Your details were submitted successfully!';
-                    document.getElementById('confirmation').style.display = 'none';
-                    speak("Your registration is complete. Thank you for registering.");
-                    setTimeout(() => location.reload(), 5000);
-                } else {
-                    document.getElementById('status').textContent = 'There was an error submitting your details.';
-                    speak("There was an error submitting your details. Please try again.");
-                }
-            });
-        }
-        window.onload = function () {
-            askLoginOrRegister(); // First, ask the user whether they are a new or existing user
-        };
     </script>
 </body>
 </html>

             box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
             display: none;
         }
         h2 {
             font-size: 24px;
             font-weight: bold;
             color: #ff6a00;
             font-weight: bold;
         }
         #confirmation {
             display: none;
             background-color: #f9f9f9;
 </head>
 <body>
     <h1 class="header-title">Welcome to Biryani Hub 🍽</h1>
     <div class="container" id="loginForm">
+        <h2>Login</h2>
+        <label for="loginEmail">Your Email</label>
+        <input type="text" id="loginEmail" readonly>
+        <label for="loginMobile">Your Mobile Number</label>
+        <input type="text" id="loginMobile" readonly>
     </div>
     <div class="container" id="registrationForm">
+        <h2>Register</h2>
+        <label for="name">Your Name</label>
+        <input type="text" id="name" readonly>
+        <label for="email">Your Email</label>
+        <input type="text" id="email" readonly>
+        <label for="mobile">Your Mobile Number</label>
+        <input type="text" id="mobile" readonly>
     </div>
     <div id="confirmation">
         <h2>Confirm Your Details:</h2>
         <p><strong>Name:</strong> <span id="confirmName"></span></p>
         <p><strong>Email:</strong> <span id="confirmEmail"></span></p>
         <p><strong>Phone:</strong> <span id="confirmPhone"></span></p>
+        <button class="confirm-button" onclick="submitForm()">Confirm</button>
     </div>
     <script>
+        let recognition = new (window.SpeechRecognition || window.webkitSpeechRecognition)();
+        recognition.continuous = false;
+        recognition.interimResults = false;
+        recognition.lang = 'en-US';
         function speak(text, callback) {
+            let speech = new SpeechSynthesisUtterance(text);
             speech.onend = callback;
             window.speechSynthesis.speak(speech);
         }
         function askLoginOrRegister() {
+            speak("Welcome to Biryani Hub. Are you a new user or an existing user?", function() {
                 recognition.start();
                 recognition.onresult = function(event) {
                     let response = event.results[0][0].transcript.trim().toLowerCase();
                     } else if (response.includes("existing user")) {
                         showLoginForm();
                     } else {
+                        speak("Please say 'new user' or 'existing user'.", askLoginOrRegister);
                     }
                 };
             });
         function showLoginForm() {
             document.getElementById('loginForm').style.display = 'block';
+            speak("Please say your email.", startListeningForEmail);
         }
         function showRegistrationForm() {
             document.getElementById('registrationForm').style.display = 'block';
+            speak("Please say your name.", startListeningForName);
         }
         function startListeningForName() {
             recognition.start();
             recognition.onresult = function(event) {
+                let name = event.results[0][0].transcript.trim();
+                document.getElementById('name').value = name;
                 recognition.stop();
+                speak("You said " + name + ". Is it correct?", confirmName);
             };
         }
         function confirmName() {
             recognition.start();
             recognition.onresult = function(event) {
+                let confirmation = event.results[0][0].transcript.trim().toLowerCase();
                 recognition.stop();
+                if (confirmation.includes("yes")) {
+                    speak("Great! Now, say your email.", startListeningForEmail);
+                } else {
+                    speak("Let's try again. Please say your name.", startListeningForName);
+                }
             };
         }
+        function submitForm() {
+            speak("Your details have been submitted. Welcome to Biryani Hub!");
         }
+        window.onload = askLoginOrRegister;
     </script>
 </body>
 </html>