char.lt-old/static/js/shorten.js

104 lines
2.8 KiB
JavaScript

const q = (selector, elem = document) => elem.querySelector(selector);
const t = (templateSelector, element) =>
q(templateSelector).content.cloneNode(true).querySelector(element);
const onReady = (f) => {
if (document.readyState === "complete") {
f();
} else {
document.addEventListener("DOMContentLoaded", f);
}
};
const populateRedirects = async (redirKey) => {
const status = q("main #status-message");
let redirects;
try {
redirects = await fetch("/redirects.json", {
headers: { authorization: `Bearer ${redirKey}` },
})
.then((r) => r.json())
.catch();
} catch (e) {
status.textContent =
"You are not authorized to fetch the list of redirects.";
return;
}
status.style.display = "none";
const table = t("template#redirect-table", "table");
const body = q("tbody", table);
q("main").appendChild(table);
for (const redirect of redirects) {
const deleteBody = new URLSearchParams();
deleteBody.append("path", redirect.path);
const row = t("template#redirect-row", "tr");
const rowEntries = row.querySelectorAll("td");
rowEntries[0].querySelector("a").href = `/${redirect.path}`;
rowEntries[0].querySelector("pre").textContent = redirect.path;
rowEntries[1].querySelector("a").href = redirect.target_location;
rowEntries[1].querySelector("a").textContent = redirect.target_location;
rowEntries[2].textContent = redirect.redirect_code;
rowEntries[3]
.querySelector("button")
.addEventListener("click", async (e) => {
await fetch("/shorten", {
method: "DELETE",
headers: {
"content-type": "application/x-www-form-urlencoded",
authorization: `Bearer ${redirKey}`,
},
body: deleteBody,
});
row.remove();
});
body.appendChild(row);
}
};
const setupRedirectForm = (redirKey) => {
const form = t("template#redirect-form", "form");
form.addEventListener("submit", async (e) => {
e.preventDefault();
const data = new URLSearchParams();
const path = form.querySelector("#path").value;
if (path) data.append("path", path);
data.append("target", form.querySelector("#url").value);
const response = await fetch("/shorten", {
method: "POST",
headers: {
"content-type": "application/x-www-form-urlencoded",
authorization: `Bearer ${redirKey}`,
},
body: data,
}).then((r) => r.json());
if (response.error) alert(response.error);
window.location.reload();
});
q("main").appendChild(form);
};
onReady(async () => {
const redirKey = window.localStorage.getItem("char.lt/redirect-key");
if (redirKey == null) {
// TODO: Show a form entry for setting the redirect key
return;
}
await populateRedirects(redirKey);
setupRedirectForm(redirKey);
});