main page rework done.

static/css/index.css

@@ -99,10 +99,23 @@ body {
     background-color: #11111b;
 }
 
-.notification > h1 {
+.notification > .info {
     color: yellow;
 }
 
+.notification > .warning {
+    color: red;
+}
 .notification > h3 {
     color: white;
 }
+
+.notification > button {
+    font-size: 16px;
+    margin: 4px 0 4px 0;
+    padding: 5px;
+    background-color: cornflowerblue;
+    color: white;
+    border: none;
+    border-radius: 5px;
+}

static/html/index.html

@@ -27,7 +27,7 @@
     <div id="notification" class="notification" hidden="hidden">
         <h1 id="title"></h1>
         <h3 id="detail"></h3>
-        <button id="close">Ok</button>
+        <button id="close">Fermer</button>
     </div>
     <div id="footer" class="footer">
         <a href="/">Voter</a>

static/js/index.js

@@ -10,6 +10,10 @@ let vote = {
 let current_page = 0;
 
 async function main() {
+    if (read_cookie()) {
+        showMessage("Merci pour ton vote!", "Ton vote a bien été prit en compte.", false, "info");
+        return;
+    }
     let players = await fetch("/data/players").then(r => r.json());
     let select = document.getElementById("player_id");
     let nickname = document.getElementById("nickname");
@@ -21,6 +25,8 @@ async function main() {
         select.append(option);
     })
     select.value = null;
+    nickname.value = "";
+    reason.value = "";
     select.addEventListener("change", () => {
         if (current_page) {
             vote.minus_player_id = parseInt(select.value);
@@ -47,13 +53,26 @@ async function main() {
     let title = document.getElementById("app_title");
     rightButton.addEventListener("click", async () => {
         if (current_page) {
+            if (vote.minus_player_id === null) {
+                showMessage("Bah alors, on sait pas pour qui voter?",
+                    "Il semblerait que tu aies oublié de sélectionner quelqu'un pour ton vote!",
+                    true, "warning");
+                return;
+            }
             if (await fetch("/post", {
                 method:"post", body: JSON.stringify(vote)})
                 .then(r => r.status) === 200) {
-                showMessage("Merci pour ton vote!", "Ton vote a bien été prit en compte.", false);
+                set_cookie();
+                showMessage("Merci pour ton vote!", "Ton vote a bien été prit en compte.", false, "info");
             }
             console.log(vote);
         } else {
+            if (vote.plus_player_id === null) {
+                showMessage("Bah alors, on sait pas pour qui voter?",
+                    "Il semblerait que tu aies oublié de sélectionner quelqu'un pour ton vote!",
+                    true, "warning");
+                return;
+            }
             rightButton.textContent = "À voté!";
             title.textContent = "Vote -";
             current_page = 1;
@@ -76,11 +95,12 @@ async function main() {
     })
 }
 
-function showMessage(title, description, canBeDismissed) {
+function showMessage(title, description, canBeDismissed, type) {
     let notification = document.getElementById("notification");
     notification.hidden = false;
     let notificationTitle = document.getElementById("title");
     notificationTitle.textContent = title;
+    notificationTitle.classList.add(type);
     let detail = document.getElementById("detail");
     detail.textContent = description;
     let close = document.getElementById("close");
@@ -90,6 +110,16 @@ function showMessage(title, description, canBeDismissed) {
     })
 }
 
-function cookie() {}
+function set_cookie() {
+    let date = new Date(Date.now());
+    date.setDate(date.getDate() + 1);
+    date.setHours(0, 0,0);
+    console.log(date);
+    document.cookie = `hasvoted=true; expires=${date.toUTCString()}; path=/`;
+}
+
+function read_cookie() {
+    return document.cookie.includes("hasvoted=true");
+}
 
 let _ = main();