From c80656abf09459c8b13c9cdb33c9a8d3a8cee502 Mon Sep 17 00:00:00 2001 From: LarsVomMars Date: Fri, 2 Oct 2020 23:29:06 +0200 Subject: Added basic voting --- mottovote/public/index.html | 15 ++++++++++++++ mottovote/public/script.js | 49 +++++++++++++++++++++++++++++++++++++++++++++ 2 files changed, 64 insertions(+) create mode 100644 mottovote/public/index.html create mode 100644 mottovote/public/script.js (limited to 'mottovote/public') diff --git a/mottovote/public/index.html b/mottovote/public/index.html new file mode 100644 index 0000000..27ea837 --- /dev/null +++ b/mottovote/public/index.html @@ -0,0 +1,15 @@ + + + + + + Motto Vote + + + +
+ + + + + \ No newline at end of file diff --git a/mottovote/public/script.js b/mottovote/public/script.js new file mode 100644 index 0000000..7216af4 --- /dev/null +++ b/mottovote/public/script.js @@ -0,0 +1,49 @@ +get(); + +async function get() { + const resp = await fetch("api/list"); + const mottos = await resp.json(); + + for (const motto of mottos) { + const row = document.createElement("div"); + const id = motto.id; + + const cb = document.createElement("input"); + cb.type = "checkbox"; + cb.id = "motto" + id; + cb.name = id; + + const label = document.createElement("label"); + label.for = "motto" + id; + label.textContent = `${motto.name} ${motto.description ? "-" : ""} ${motto.description}` + + row.append(cb, label); + window.vote.appendChild(row); + } + addListeners(); +} + +function addListeners() { + // Only allow 3 votes + const boxes = document.querySelectorAll("input[type=checkbox]"); + boxes.forEach((box) => { + box.addEventListener("change", (evt) => { + const checkedSiblings = document.querySelectorAll("input[type=checkbox]:checked"); + if (checkedSiblings.length > 3) evt.target.checked = false; + }); + }); + + window.voteButton.addEventListener("click", async () => { + const checked = document.querySelectorAll("input[type=checkbox]:checked"); + if (checked.length !== 3) return; + const req = {}; + for (const box of checked) req[box.name] = 1; // Amount of votes + const resp = await fetch("api/vote", { + method: "PUT", + headers: { "Content-Type": "application/json" }, + body: JSON.stringify(req), + }); + console.log(await resp.text()); + + }); +} \ No newline at end of file -- cgit v1.2.3