voicemenuwithregisterandloginnnwithmenuuuu

Sleeping

App Files Files Community

lokesh341 commited on 15 days ago

Commit

5a12a62

verified ·

1 Parent(s): a43603b

Update templates/index.html

Browse files

Files changed (1) hide show

templates/index.html +38 -42

templates/index.html CHANGED Viewed

@@ -49,18 +49,7 @@
             border-color: #ff6a00;
             outline: none;
         }
-        .info {
-            font-size: 16px;
-            color: #ff6a00;
-            font-weight: bold;
-            margin-top: 10px;
-        }
-        .status {
-            font-size: 14px;
-            color: gray;
-            margin-top: 10px;
-        }
-        .confirm-button, .switch-button {
             padding: 10px 20px;
             background-color: #ff6a00;
             color: white;
@@ -69,19 +58,9 @@
             cursor: pointer;
             margin-top: 10px;
         }
-        .confirm-button:hover, .switch-button:hover {
             background-color: #e65e00;
         }
-        .confirm-details {
-            margin-top: 20px;
-            font-size: 18px;
-            font-weight: bold;
-            color: #333;
-        }
-        .details {
-            font-size: 16px;
-            margin: 5px 0;
-        }
     </style>
 </head>
 <body>
@@ -91,46 +70,39 @@
         <p class="status" id="status">🔊 Please say 'new' to register or 'existing' to login.</p>
     </div>
     <div class="container" id="registrationForm" style="display: none;">
         <h2>Register</h2>
         <label for="name">Your Name</label>
-        <input type="text" id="name" placeholder="Listening for name..." readonly>
         <label for="email">Your Email</label>
-        <input type="text" id="email" placeholder="Listening for email..." readonly>
         <label for="mobile">Your Mobile Number</label>
-        <input type="text" id="mobile" placeholder="Listening for mobile number..." readonly>
         <label for="password">Your Password</label>
-        <input type="password" id="password" placeholder="Listening for password..." readonly>
         <p class="status" id="registrationStatus">Listening... 🗣</p>
     </div>
     <div class="container" id="loginForm" style="display: none;">
         <h2>Login</h2>
         <label for="loginEmail">Your Email</label>
-        <input type="text" id="loginEmail" placeholder="Listening for email..." readonly>
         <label for="loginMobile">Your Mobile Number</label>
-        <input type="text" id="loginMobile" placeholder="Listening for mobile number..." readonly>
         <label for="loginPassword">Your Password</label>
-        <input type="password" id="loginPassword" placeholder="Listening for password..." readonly>
         <p class="status" id="loginStatus">Listening... 🗣</p>
-    </div>
-    <div class="container" id="confirmationPage" style="display: none;">
-        <h2>Confirm Your Details</h2>
-        <div class="confirm-details">
-            <p class="details"><strong>Name:</strong> <span id="confirmName"></span></p>
-            <p class="details"><strong>Email:</strong> <span id="confirmEmail"></span></p>
-            <p class="details"><strong>Phone:</strong> <span id="confirmPhone"></span></p>
-            <p class="details"><strong>Password:</strong> <span id="confirmPassword"></span></p>
-        </div>
-        <button class="confirm-button" onclick="submitRegistration()">Confirm & Submit</button>
     </div>
     <script>
@@ -158,6 +130,30 @@
                 alert('An error occurred. Please try again.');
             });
         }
     </script>
 </body>
-</html>

             border-color: #ff6a00;
             outline: none;
         }
+        .confirm-button {
             padding: 10px 20px;
             background-color: #ff6a00;
             color: white;
             cursor: pointer;
             margin-top: 10px;
         }
+        .confirm-button:hover {
             background-color: #e65e00;
         }
     </style>
 </head>
 <body>
         <p class="status" id="status">🔊 Please say 'new' to register or 'existing' to login.</p>
     </div>
+    <!-- Registration Form -->
     <div class="container" id="registrationForm" style="display: none;">
         <h2>Register</h2>
         <label for="name">Your Name</label>
+        <input type="text" id="name" placeholder="Listening for name..." required>
         <label for="email">Your Email</label>
+        <input type="text" id="email" placeholder="Listening for email..." required>
         <label for="mobile">Your Mobile Number</label>
+        <input type="text" id="mobile" placeholder="Listening for mobile number..." required>
         <label for="password">Your Password</label>
+        <input type="password" id="password" placeholder="Enter your password" required>
         <p class="status" id="registrationStatus">Listening... 🗣</p>
+        <button class="confirm-button" onclick="submitRegistration()">Register</button>
     </div>
+    <!-- Login Form -->
     <div class="container" id="loginForm" style="display: none;">
         <h2>Login</h2>
         <label for="loginEmail">Your Email</label>
+        <input type="text" id="loginEmail" placeholder="Listening for email..." required>
         <label for="loginMobile">Your Mobile Number</label>
+        <input type="text" id="loginMobile" placeholder="Listening for mobile number..." required>
         <label for="loginPassword">Your Password</label>
+        <input type="password" id="loginPassword" placeholder="Enter your password" required>
         <p class="status" id="loginStatus">Listening... 🗣</p>
+        <button class="confirm-button" onclick="submitLogin()">Login</button>
     </div>
     <script>
                 alert('An error occurred. Please try again.');
             });
         }
+        function submitLogin() {
+            const email = document.getElementById('loginEmail').value;
+            const phone = document.getElementById('loginMobile').value;
+            const password = document.getElementById('loginPassword').value;
+            fetch('/login', {
+                method: 'POST',
+                headers: { 'Content-Type': 'application/json' },
+                body: JSON.stringify({ email, phone, password })
+            })
+            .then(response => response.json())
+            .then(data => {
+                if (data.success) {
+                    alert('Login successful!');
+                    window.location.href = '/dashboard';
+                } else {
+                    alert('Error: ' + data.error);
+                }
+            })
+            .catch(error => {
+                alert('An error occurred. Please try again.');
+            });
+        }
     </script>
 </body>
+</html>