71 lines
2.7 KiB
HTML
71 lines
2.7 KiB
HTML
<!doctype html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
|
<title>Sign in — PayToLaugh</title>
|
|
<meta name="description" content="Create a PayToLaugh account and start making videos of your pet weighing in.">
|
|
<link rel="stylesheet" href="/assets/app.css">
|
|
</head>
|
|
<body>
|
|
<div class="wrap">
|
|
|
|
<header class="page">
|
|
<h1>Sign in</h1>
|
|
<p>Your email is all we need for now. If you have not been here before, this creates your account.</p>
|
|
</header>
|
|
|
|
<section style="max-width:520px">
|
|
<div class="card">
|
|
<div class="msg" id="msg"></div>
|
|
<form id="form">
|
|
<div class="field">
|
|
<label for="email">Email address</label>
|
|
<span class="hint">We use this to keep your pets and videos together.</span>
|
|
<input type="email" id="email" name="email" required autocomplete="email" placeholder="you@example.com">
|
|
</div>
|
|
<div class="field">
|
|
<label for="name">Your name <span style="color:var(--muted);font-weight:400">(optional)</span></label>
|
|
<input type="text" id="name" name="name" autocomplete="name" placeholder="Scooter">
|
|
</div>
|
|
<button class="btn" id="go" type="submit">Continue</button>
|
|
</form>
|
|
</div>
|
|
|
|
<p class="note" style="margin-top:22px">
|
|
<strong>Early access.</strong> There is no password yet, so an email address identifies
|
|
you rather than proves who you are. Do not put anything here you would mind
|
|
another person seeing. Proper sign-in is coming.
|
|
</p>
|
|
</section>
|
|
|
|
<footer>PayToLaugh · your pet has opinions.</footer>
|
|
</div>
|
|
|
|
<script src="/assets/app.js"></script>
|
|
<script>
|
|
navBar("");
|
|
var params = new URLSearchParams(location.search);
|
|
var next = params.get("next") || "/create.html";
|
|
|
|
document.getElementById("form").addEventListener("submit", async function (e) {
|
|
e.preventDefault();
|
|
hideMsg("msg");
|
|
var btn = document.getElementById("go");
|
|
var email = document.getElementById("email").value.trim();
|
|
var name = document.getElementById("name").value.trim();
|
|
if (!email) { showMsg("msg", "Please enter your email address."); return; }
|
|
|
|
btn.disabled = true; btn.textContent = "One moment…";
|
|
var r = await api("register", { email: email, display_name: name });
|
|
btn.disabled = false; btn.textContent = "Continue";
|
|
|
|
if (!r.ok) { showMsg("msg", r.error || "That did not work. Please try again."); return; }
|
|
// The token is the credential from here on; the email is only for display.
|
|
Session.start(r, r.user.email, r.user.display_name || name);
|
|
showMsg("msg", r.returning ? "Welcome back. Taking you through…" : "Account created. Taking you through…", "ok");
|
|
setTimeout(function () { location.href = next; }, 550);
|
|
});
|
|
</script>
|
|
</body>
|
|
</html>
|