voicemenu1433

Sleeping

App Files Files Community

lokesh341 commited on 26 days ago

Commit

f71dfd5

verified ·

1 Parent(s): 9ecba6e

Update templates/index.html

Browse files

Files changed (1) hide show

templates/index.html +23 -204

templates/index.html CHANGED Viewed

@@ -4,215 +4,27 @@
 <head>
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <title>Biryani Hub - Register & Login</title>
-    <link href="https://fonts.googleapis.com/css2?family=Roboto:wght@400;500&display=swap" rel="stylesheet">
-    <style>
-        body {
-            font-family: 'Roboto', sans-serif;
-            background: linear-gradient(135deg, #f4c542, #ff8f6a);
-            margin: 0;
-            display: flex;
-            flex-direction: column;
-            justify-content: center;
-            align-items: center;
-            height: 100vh;
-            text-align: center;
-        }
-        .header-title {
-            font-size: 40px;
-            font-weight: bold;
-            color: white;
-            text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.2);
-            margin-bottom: 20px;
-        }
-        .container {
-            background-color: #fff;
-            padding: 40px 50px;
-            border-radius: 10px;
-            width: 500px;
-            box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
-            display: none;
-        }
-        .form-container {
-            width: 100%;
-        }
-        h2 {
-            font-size: 24px;
-            font-weight: bold;
-            color: #ff6a00;
-            margin-bottom: 20px;
-        }
-        label {
-            font-size: 16px;
-            display: block;
-            text-align: left;
-            font-weight: bold;
-            color: #333;
-            margin-top: 10px;
-        }
-        input {
-            width: 100%;
-            padding: 12px;
-            font-size: 16px;
-            border: 2px solid #ccc;
-            border-radius: 8px;
-            margin-top: 8px;
-            box-sizing: border-box;
-            background-color: #f9f9f9;
-        }
-        input:focus {
-            border-color: #ff6a00;
-            outline: none;
-        }
-        .info {
-            margin-top: 20px;
-            font-size: 16px;
-            color: #ff6a00;
-            font-weight: bold;
-        }
-        .status {
-            font-size: 14px;
-            color: gray;
-            margin-top: 10px;
-        }
-        .confirmation {
-            display: none;
-            margin-top: 20px;
-            padding: 20px;
-            background: #fff;
-            border-radius: 10px;
-            text-align: center;
-            box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
-        }
-        .confirm-button {
-            margin-top: 15px;
-            padding: 10px 20px;
-            background-color: #ff6a00;
-            color: white;
-            border: none;
-            border-radius: 5px;
-            cursor: pointer;
-        }
-        .confirm-button:hover {
-            background-color: #e65e00;
-        }
-    </style>
 </head>
 <body>
-    <h1 class="header-title">Welcome to Biryani Hub 🍽</h1>
-    <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>
-    <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>
-    <!-- Confirmation Section -->
-    <div class="confirmation" id="confirmationBox">
-        <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="submitToSalesforce()">Confirm & Submit</button>
     </div>
     <script>
-        let recognition;
-        if ('webkitSpeechRecognition' in window) {
-            recognition = new webkitSpeechRecognition();
-            recognition.continuous = false;
-            recognition.interimResults = false;
-            recognition.lang = 'en-US';
-        }
-        function speak(text, callback) {
-            const speech = new SpeechSynthesisUtterance(text);
-            speech.onend = callback;
-            window.speechSynthesis.speak(speech);
-        }
-        function askLoginOrRegister() {
-            speak("Welcome to Biryani Hub. Say 'Register' to create an account or 'Login' to sign in.", function() {
-                recognition.start();
-                recognition.onresult = function(event) {
-                    let response = event.results[0][0].transcript.trim().toLowerCase();
-                    recognition.stop();
-                    if (response.includes("register")) {
-                        showRegistrationForm();
-                    } else if (response.includes("login")) {
-                        showLoginForm();
-                    } else {
-                        speak("I didn't understand. Please say 'Register' to sign up or 'Login' to sign in.", askLoginOrRegister);
-                    }
-                };
-            });
-        }
-        function showRegistrationForm() {
-            document.getElementById('registrationForm').style.display = 'block';
-            document.getElementById('loginForm').style.display = 'none';
-            speak("Please say your name to begin registration.", startListeningForName);
-        }
-        function startListeningForName() {
-            recognition.start();
-            recognition.onresult = function(event) {
-                document.getElementById('name').value = event.results[0][0].transcript.trim();
-                recognition.stop();
-                speak("Now, say your email.", startListeningForEmail);
-            };
-        }
-        function startListeningForEmail() {
-            recognition.start();
-            recognition.onresult = function(event) {
-                document.getElementById('email').value = event.results[0][0].transcript.trim().replace(/\bat\b/g, '@').replace(/\s+/g, '');
-                recognition.stop();
-                speak("Now, say your mobile number.", startListeningForMobile);
-            };
-        }
-        function startListeningForMobile() {
-            recognition.start();
-            recognition.onresult = function(event) {
-                document.getElementById('mobile').value = event.results[0][0].transcript.trim().replace(/\s+/g, '');
-                recognition.stop();
-                confirmDetails();
-            };
-        }
-        function confirmDetails() {
-            document.getElementById('confirmName').textContent = document.getElementById('name').value;
-            document.getElementById('confirmEmail').textContent = document.getElementById('email').value;
-            document.getElementById('confirmPhone').textContent = document.getElementById('mobile').value;
-            document.getElementById('confirmationBox').style.display = 'block';
-            speak("Please confirm your details and submit.");
-        }
-        function submitToSalesforce() {
             fetch('/register', {
                 method: 'POST',
                 headers: { 'Content-Type': 'application/json' },
@@ -221,10 +33,17 @@
                     email: document.getElementById('email').value,
                     phone: document.getElementById('mobile').value
                 })
-            }).then(() => location.reload());
         }
-        window.onload = askLoginOrRegister;
     </script>
 </body>
 </html>

 <head>
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Biryani Hub - Registration</title>
+    <link rel="stylesheet" href="{{ url_for('static', filename='styles.css') }}">
 </head>
 <body>
+    <div class="container">
+        <h1>Welcome to Biryani Hub 🍽</h1>
+        <label for="name">Your Name</label>
+        <input type="text" id="name" placeholder="Your name..." readonly>
+        <label for="email">Your Email</label>
+        <input type="text" id="email" placeholder="Your email..." readonly>
+        <label for="mobile">Your Mobile Number</label>
+        <input type="text" id="mobile" placeholder="Your mobile number..." readonly>
+        <p class="info" id="infoMessage">Listening 🗣🎙️...</p>
+        <button onclick="startRegistration()">Start Registration</button>
     </div>
     <script>
+        function startRegistration() {
             fetch('/register', {
                 method: 'POST',
                 headers: { 'Content-Type': 'application/json' },
                     email: document.getElementById('email').value,
                     phone: document.getElementById('mobile').value
                 })
+            })
+            .then(response => response.json())
+            .then(data => {
+                if (data.success) {
+                    alert("Registration successful! Redirecting to login...");
+                    window.location.href = "/login";
+                } else {
+                    alert("Error: " + data.error);
+                }
+            });
         }
     </script>
 </body>
 </html>