| <!DOCTYPE html> |
| <html lang="en"> |
| <head> |
| <meta charset="UTF-8"> |
| <meta name="viewport" content="width=device-width, initial-scale=1.0"> |
| <title>Joblin - Create Account</title> |
| <link rel="stylesheet" href="styles.css"> |
| </head> |
| <body> |
| <div class="auth-page"> |
| <div class="auth-card"> |
| <a href="index.html" class="auth-brand"> |
| <div class="auth-brand-icon">J</div> |
| <h1>Job<span>lin</span></h1> |
| </a> |
| <p class="subtitle">Create your account</p> |
| <form id="registerForm"> |
| <div class="form-group"> |
| <label>Your Name</label> |
| <input type="text" id="name" placeholder="John Doe" autocomplete="name"> |
| </div> |
| <div class="form-group"> |
| <label>Email</label> |
| <input type="email" id="email" placeholder="you@example.com" required autocomplete="email"> |
| </div> |
| <div class="form-group"> |
| <label>Password</label> |
| <div class="pwd-wrapper"> |
| <input type="password" id="password" placeholder="At least 6 characters" required minlength="6" autocomplete="new-password"> |
| <span class="pwd-toggle" onclick="togglePwd('password',this)">👁</span> |
| </div> |
| </div> |
| <button type="submit" class="btn btn-primary btn-lg" style="width:100%" id="registerBtn">Create Account</button> |
| </form> |
| <p class="footer-link">Already have an account? <a href="login.html">Sign in</a></p> |
| </div> |
| </div> |
| <script src="app.js"></script> |
| <script> |
| const btn = document.getElementById("registerBtn"); |
| document.getElementById("registerForm").addEventListener("submit", async (e) => { |
| e.preventDefault(); |
| btn.disabled = true; |
| btn.innerHTML = '<span class="spinner"></span> Creating account...'; |
| try { |
| const data = await apiFetch("POST", "/api/auth/register", { |
| name: document.getElementById("name").value, |
| email: document.getElementById("email").value, |
| password: document.getElementById("password").value, |
| }); |
| localStorage.setItem("joblin_token", data.token); |
| setCurrentUser(data.user); |
| window.location.href = "dashboard.html"; |
| } catch (err) { |
| showToast(err.message, "error"); |
| btn.disabled = false; |
| btn.textContent = "Create Account"; |
| } |
| }); |
| if (getToken()) window.location.href = "dashboard.html"; |
| const params = new URLSearchParams(window.location.search); |
| if (params.get("email")) document.getElementById("email").value = params.get("email"); |
| </script> |
| </body> |
| </html> |
|
|
