DEV_1

public/javascripts/dashboard.js

@@ -0,0 +1,32 @@
+const logoutBtn = document.getElementById("logout")
+
+logoutBtn.addEventListener("click", () => {
+
+    fetch('/signout', {
+        method: 'GET',
+        redirect: 'follow',
+        headers: {
+            'Accept': 'application/json',
+            'Content-Type': 'application/json'
+        },
+    })
+    .then(response => response.json())
+    .then(response => redirect(response))
+
+
+    function redirect(response) {
+
+        if(response.success == true) {
+            window.location.href = "/login"
+         
+        } else if(response.token == "auth_success") {
+            
+            window.location.href = "/"
+
+        }
+
+       
+
+    } 
+
+})

public/javascripts/loginscript.js

@@ -0,0 +1,57 @@
+const userField = document.getElementById("username");
+const passwordField = document.getElementById("password");
+const remindus = document.getElementById("remindus");
+const loginButton = document.getElementById("loginButton");
+const info = document.getElementById("info");
+
+loginButton.addEventListener("click", () => {
+
+    info.innerHTML = ""
+    const userValue = userField.value;
+    const passwordValue = passwordField.value;
+
+    if(userValue == "" | passwordValue == "") {
+        info.innerHTML = "Tous les champs doivent être remplis."
+
+    } else if(userValue.includes(" ")) {
+
+        info.innerHTML = "Le nom d'utilisateur ne peut pas contenir un espace"
+    } else {
+
+
+
+        const loginData = {
+            "username":userValue,
+            "password": passwordValue,
+            "remindus": remindus.checked
+        }
+
+
+        fetch('/login', {
+            method: 'POST',
+            redirect: 'follow',
+            headers: {
+                'Accept': 'application/json',
+                'Content-Type': 'application/json'
+            },
+            body: JSON.stringify(loginData)
+        })
+        .then(response => response.json())
+        .then(response => redirect(response))
+
+        function redirect(response) {
+
+            if(response.token == "auth_failed") {
+
+                info.innerHTML = "Le nom d'utilisateur ou le mot de passe est éronné"
+            } else if(response.token == "auth_success") {
+                
+                window.location.href = "/"
+
+            }
+
+           
+
+        } 
+    }
+});

public/neutron.bundle.js.LICENSE.txt

@@ -0,0 +1,30 @@
+/*!
+  * Bootstrap v5.2.3 (https://getbootstrap.com/)
+  * Copyright 2011-2022 The Bootstrap Authors (https://github.com/twbs/bootstrap/graphs/contributors)
+  * Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE)
+  */
+
+/*!
+ * Sizzle CSS Selector Engine v2.3.9
+ * https://sizzlejs.com/
+ *
+ * Copyright JS Foundation and other contributors
+ * Released under the MIT license
+ * https://js.foundation/
+ *
+ * Date: 2022-12-19
+ */
+
+/*!
+ * jQuery JavaScript Library v3.6.3
+ * https://jquery.com/
+ *
+ * Includes Sizzle.js
+ * https://sizzlejs.com/
+ *
+ * Copyright OpenJS Foundation and other contributors
+ * Released under the MIT license
+ * https://jquery.org/license
+ *
+ * Date: 2022-12-20T21:28Z
+ */

public/stylesheets/style.css

@@ -1,8 +1,123 @@
+@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@300&display=swap');
+
 body {
-  padding: 50px;
-  font: 14px "Lucida Grande", Helvetica, Arial, sans-serif;
+
+  background: rgb(58, 56, 56);
+  margin: 0;
+  padding: 0;
+  font-family: 'Roboto', sans-serif;
+  color: white;
 }
 
-a {
-  color: #00B7FF;
+.content {
+
+
+  padding: 3%;
+  width: 100%;
+  height: 100%;
+  display: flex;
+    align-items: center;
+    justify-content: center;
 }
+
+@media (max-width: 768px) { 
+  
+  .box {
+    text-align: center;
+    padding: 5%;
+    width: 100%;
+    background-color: rgb(80, 80, 80);
+    border-radius: 1vw;
+    box-shadow: 5px 5px 5px rgba(80, 80, 80, 0.477) ;
+  }
+
+} 
+
+@media (min-width: 768px) { 
+
+  .box {
+    text-align: center;
+    padding: 5%;
+    width: 50%;
+    background-color: rgb(80, 80, 80);
+    border-radius: 1vw;
+    box-shadow: 5px 5px 5px rgba(80, 80, 80, 0.477) ;
+  }
+
+
+} 
+
+
+
+.box form {
+
+  margin: 4%;
+  
+}
+
+.box form input {
+
+  border-style: hidden;
+  border-radius: 1vw;
+  transition: all 0.2s ease 0s;
+
+}
+
+.box form input:hover {
+
+  box-shadow: 5px 5px 5px rgba(0, 174, 255, 0.477) ;
+
+}
+
+.box form .inp {
+
+  margin: 2%;
+}
+
+.box button {
+
+  border-style:solid;
+  border-radius: 1vw;
+  padding: 1%;
+  margin: 3%;
+  transition: all 0.2s ease 0s;
+  color: white;
+  background-color: transparent;
+}
+
+.box button:hover {
+
+  background: white;
+  color: black;
+  border-color: transparent;
+  box-shadow: 2px 2px 5px rgba(0, 174, 255, 0.477);
+
+}
+
+.box button:active {
+
+  border-style:solid;
+  border-radius: 1vw;
+  padding: 1%;
+  margin: 3%;
+  transition: all 0.2s ease 0s;
+  color: white;
+  background-color: transparent;
+  border-color: black;
+  box-shadow: none;
+}
+
+
+
+#remindus:hover {
+  box-shadow: 1px 1px 5px rgba(0, 174, 255, 0.477);
+
+}
+
+
+#info {
+
+  color: #ff0012;
+  font-size: larger;
+ 
+}