commit 79e769c8ab6e2861219907a5e432e0a992a5b8f1
parent 0733ca7c3f0150516e460ab2cf362a77a20f69b8
Author: Jacob R. Edwards <jacob@jacobedwards.org>
Date: Fri, 11 Oct 2024 13:27:29 -0700
Update services page
1. Restyle it so it's not so ugly
2. If there's only one service, just initiate checkout with it
3. Ensure there's a verified email before checkout (this is checked
server-side, but doing it here means I can redirect them to verify
it)
Diffstat:
3 files changed, 49 insertions(+), 15 deletions(-)
diff --git a/files/services/index.html b/files/services/index.html
@@ -8,6 +8,6 @@
<script type="module" src="./main.js"></script>
</head>
<body>
- <form id="services"><legend><h1>Services</h1></legend></form>
+ <form id="services" hidden><legend><h1>Services</h1></legend></form>
</body>
</html>
diff --git a/files/services/main.css b/files/services/main.css
@@ -1,4 +1,9 @@
+body {
+ background-color: grey;
+}
+
#services {
+ background-color: white;
max-width: 50vw;
min-width: min(40em, 70vw);
min-height: 60%;
@@ -11,7 +16,13 @@
text-align: center;
}
+#wait {
+ color: lightgrey;
+ text-align: center;
+}
+
.service {
+ background-color: #FBFBFB;
border: thin ridge grey;
border-radius: .25em;
padding: 2em;
diff --git a/files/services/main.js b/files/services/main.js
@@ -2,11 +2,28 @@ import * as etc from "/lib/etc.js"
import * as api from "/lib/api.js"
function main() {
- api.fetch("GET", "services")
- .then(function(services) {
- console.warn(services)
- for (let service in services) {
- addService(services[service])
+ let wait = document.body.appendChild(document.createElement("p"))
+ wait.appendChild(document.createTextNode("Please wait..."))
+ wait.id = "wait"
+
+ etc.userService()
+ .then(function(service) {
+ if (service) {
+ window.location.href = "/billing"
+ } else {
+ api.fetch("GET", "services")
+ .then(function(services) {
+ if (services.length === 1) {
+ chooseService(services[0])
+ } else {
+ for (let service in services) {
+ addService(services[service])
+ }
+ wait.remove()
+ document.getElementById("services")
+ .removeAttribute("hidden", false)
+ }
+ })
}
})
}
@@ -18,15 +35,21 @@ function chooseService(service) {
window.location.href = "/register"
}
- api.fetch("POST", "users/:user/services/checkout",
- { prices: [ service.prices[0].id ] }).then(function(body) {
- console.warn(body)
- window.location.href = body.url
- })
- .catch(function(err) {
- console.error("Unable to checkout:", err)
- etc.error("There was an unexpected error.")
- })
+ api.verifiedEmail()
+ .then(function(email) {
+ if (!email) {
+ window.location.href = "/settings/verify-email"
+ return
+ }
+ api.fetch("POST", "users/:user/services/checkout",
+ { prices: [ service.prices[0].id ] }).then(function(body) {
+ window.location.href = body.url
+ })
+ .catch(function(err) {
+ console.error("Unable to checkout:", err)
+ etc.error("There was an unexpected error.")
+ })
+ })
}
function addService(service) {
