death-notifier/src/main/js/Main.ts

165 lines
5.7 KiB
TypeScript
Raw Normal View History

2022-08-09 19:20:02 +02:00
// @ts-ignore
const {$, doAfterLoad, footer, header, nav} = window.fwdekker;
function refreshTrackings() {
fetch("api.php?action=list-trackings")
.then(it => it.text())
.then(it => $("#trackings").innerText = it);
}
doAfterLoad(async () => {
2022-08-09 19:20:02 +02:00
// Initialize template
$("#nav").appendChild(nav("/Tools/Death-Notifier/"));
$("#header").appendChild(header({
title: "Death Notifier",
description: "Get notified when a famous person dies"
}));
$("#footer").appendChild(footer({
vcsURL: "https://git.fwdekker.com/tools/death-notifier/",
version: "v%%VERSION_NUMBER%%"
}));
$("main").classList.remove("hidden");
// Workflow
const loginRow = $("#loginRow");
const trackingRow = $("#trackingRow");
const accountRow = $("#accountRow");
// TODO: Move common code to a Form class or sth... (or actually, wait with that until I have the table thingy
// implemented!)
$("#loginForm").addEventListener("submit", async () => {
$("#loginForm .error").innerText = "";
const response = await fetch("api.php", {
method: "post",
headers: {
"Accept": "application/json",
"Content-Type": "application/json",
},
body: JSON.stringify({
action: "login",
// TODO: Deal with tokens in a smarter way. Allow refreshing them! Also remove duplication...
token: $("#loginForm input[name=token]").value,
email: $("#loginForm input[name=email]").value,
password: $("#loginForm input[name=password]").value,
})
}).then(it => it.json());
if (response !== true) {
$("#loginForm .error").innerText = response;
return;
}
$("#loginForm").reset();
loginRow.classList.add("hidden");
trackingRow.classList.remove("hidden");
accountRow.classList.remove("hidden");
refreshTrackings();
});
$("#registerForm").addEventListener("submit", async () => {
$("#registerForm .error").innerText = "";
const response = await fetch("api.php", {
method: "post",
headers: {
"Accept": "application/json",
"Content-Type": "application/json",
},
body: JSON.stringify({
action: "register",
token: $("#registerForm input[name=token]").value,
email: $("#registerForm input[name=email]").value,
password: $("#registerForm input[name=password]").value,
password_confirm: $("#registerForm input[name=password_confirm]").value,
})
}).then(it => it.json());
if (response !== true) {
$("#registerForm .error").innerText = response;
return;
}
$("#registerForm").reset();
$("#registerForm .error").innerText = "Account created successfully! You may now log in.";
});
$("#addTrackingForm").addEventListener("submit", async () => {
$("#addTrackingForm .error").innerText = "";
const response = await fetch("api.php", {
method: "post",
headers: {
"Accept": "application/json",
"Content-Type": "application/json",
},
body: JSON.stringify({
action: "add-tracking",
token: $("#addTrackingForm input[name=token]").value,
person_name: $("#addTrackingForm input[name=person_name]").value,
})
}).then(it => it.json());
if (response !== true) {
$("#addTrackingForm .error").innerText = response;
return;
}
$("#addTrackingForm").reset();
refreshTrackings();
});
$("#deleteTrackingForm").addEventListener("submit", async () => {
$("#deleteTrackingForm .error").innerText = "";
const response = await fetch("api.php", {
method: "post",
headers: {
"Accept": "application/json",
"Content-Type": "application/json",
},
body: JSON.stringify({
action: "delete-tracking",
token: $("#deleteTrackingForm input[name=token]").value,
person_name: $("#deleteTrackingForm input[name=person_name]").value,
})
}).then(it => it.json());
if (response !== true) {
$("#deleteTrackingForm .error").innerText = response;
return;
}
$("#deleteTrackingForm").reset();
refreshTrackings();
});
$("#logoutForm").addEventListener("submit", async () => {
$("#logoutForm .error").innerText = "";
const response = await fetch("api.php", {
method: "post",
headers: {
"Accept": "application/json",
"Content-Type": "application/json",
},
body: JSON.stringify({
action: "logout",
token: $("#logoutForm input[name=token]").value,
})
}).then(it => it.json());
if (response !== true) {
$("#logoutForm .error").innerText = response;
return;
}
$("#logoutForm").reset();
loginRow.classList.remove("hidden");
trackingRow.classList.add("hidden");
accountRow.classList.add("hidden");
});
const userData = await fetch("api.php?action=get-user-data").then(it => it.text());
if (userData === "\"not logged in\"") {
loginRow.classList.remove("hidden");
} else {
trackingRow.classList.remove("hidden");
accountRow.classList.remove("hidden");
refreshTrackings();
}
2022-08-09 19:20:02 +02:00
});