v1.0: First production version

This first version allows login of pre-existing users, creation and update of truths
by admins, vote on the truths by users, their display as well as a simple graph
for the vote results.
Everything persisting in a SQLite database.

static_files/style.css

@@ -0,0 +1,86 @@
+.top_bar {
+    display: flex;
+    flex-direction: row;
+    justify-content: space-between;
+    margin-right: 2em;
+}
+
+.page_body {
+    display: flex;
+    flex-direction: row;
+    justify-content: space-between;
+    width: 100%;
+}
+
+.truth_list {
+    display: flex;
+    flex-direction: column;
+    width: 50vw;
+    padding-left: 1eM;
+}
+
+.individual_truth {
+    padding-bottom: 2em;
+}
+
+.truth_editor {
+    width: 100%;
+    height: 6eM;
+    font-size: large;
+    padding: 0.5em;
+    margin-bottom: 1em;
+}
+
+.graph {
+    display: flex;
+    flex-direction: column;
+    align-content: center;
+    margin-right: 2vw;
+    width: 45vw;
+    height: auto;
+}
+
+.graph > div {
+    width: 100%;
+    height: 80vh;
+    position: sticky;
+    top: 25%;
+}
+
+hr {
+    border: none;
+    border-top: 2px solid #9ec5fe;
+    color: #9ec5fe;
+    overflow: visible;
+    text-align: center;
+    height: 5px;
+    width: 100%;
+}
+
+blockquote {
+    border-left: 2px solid #9ec5fe;
+    padding-left: 1eM;
+    margin-left: 1.5eM
+}
+
+blockquote > blockquote {
+    margin-left: 0.5em;
+}
+
+body {
+    margin-bottom: 10eM;
+}
+
+body > h2 {
+    padding-left: 0.25eM;
+}
+
+@media (orientation: portrait) {
+    .truth_list {
+        width: 60vw;
+    }
+
+    .graph {
+        width: 35vw;
+    }
+}

static_files/vote_chart.js

@@ -0,0 +1,85 @@
+
+// const names = ["Bystus", "Dory", "Fen", "Lucky", "Nico", "Peran", "trot"]
+//
+//
+// let data = [];
+// for (let i = 0; i < 7; i++) {
+//     data.push({
+//         parsing: true,
+//         label: names[i],
+//         data: Array.from(keys, () => Math.round(Math.random()*1.33))})
+// }
+async function main() {
+    const vote_response = await fetch(document.URL+"/votes");
+    if (!vote_response.ok) {
+        return;
+    }
+
+    const keys = ["Vérité 1", "Vérité 2", "Vérité 3", "Vérité 4", "Vérité 5", "Vérité 6", "Vérité 7"]
+    let datasets = []
+
+    try {
+        const vote_data = (await vote_response.json()).votes;
+        for (let player in vote_data) {
+            datasets.push({
+                parsing: true,
+                label: player,
+                data: vote_data[player],
+            })
+        }
+        console.log(datasets)
+    } catch (error) {
+        console.error("Failed to parse vote data : \n\t" + error.message);
+        return;
+    }
+
+    const chart_canvas = document.getElementById("vote_chart")
+    let chart
+    function create_chart(keys, data) {
+        let main_axis;
+        let aspect_ratio;
+        if (window.innerWidth > window.innerHeight) {
+            main_axis = 'x'
+            aspect_ratio = 2
+        } else {
+            main_axis = 'y'
+            aspect_ratio = 0.5
+        }
+
+        if ( chart ) {
+            chart.destroy()
+        }
+
+        chart = new Chart(chart_canvas, {
+            type: 'bar',
+            data: {
+                labels: keys,
+                datasets: data,
+            },
+            options: {
+                aspectRatio: aspect_ratio,
+                indexAxis: main_axis,
+                grouped: true,
+                scales: {
+                    x: {
+                        stacked: true
+                    },
+                    y: {
+                        stacked: true
+                    }
+                }
+            }
+        })
+    }
+
+    function update_chart_ratio(_) {
+        create_chart(keys, datasets)
+    }
+
+    const orientation_query = matchMedia("screen and (orientation:portrait)");
+    orientation_query.onchange = update_chart_ratio
+
+    create_chart(keys, datasets)
+}
+
+main().then()

static_files/vote_handler.js

@@ -0,0 +1,40 @@
+/**
+ *  This script handles disabling/enabling the different choices
+ *  accross the vote options.
+ *  This prevents sending weird votes that choose the same person for multiple truths.
+ */
+
+const vote_select_tracking = new Map();
+
+function log_select_change(event) {
+    const changed_select = event.target;
+    const original_index = vote_select_tracking.get(changed_select)
+    for (const select of vote_select_tracking) {
+        select.at(0)[original_index].disabled = false;
+        // Don't disable the default entry, or the one we just moved to.
+        if (changed_select.selectedIndex !== 0 && select.at(0) !== changed_select)
+            select.at(0)[changed_select.selectedIndex].disabled = true
+    }
+
+    // Make sure to change the selected *attribute*, because the .selected property doesn't impact
+    // the form output, it seems.
+    changed_select[original_index].removeAttribute("selected");
+    changed_select[changed_select.selectedIndex].setAttribute("selected", true);
+    // Update with the new tracked index.
+    vote_select_tracking.set(changed_select, changed_select.selectedIndex);
+}
+
+const selected_indices = [];
+for (const select of document.getElementsByTagName("select")) {
+    select.addEventListener("change", log_select_change);
+    vote_select_tracking.set(select, select.selectedIndex);
+    if (select.selectedIndex !== 0) {
+        selected_indices.push(select.selectedIndex);
+    }
+}
+
+for (const select of document.getElementsByTagName("select")) {
+    for (const selected_index of selected_indices) {
+        select[selected_index].disabled = true;
+    }
+}