Correction fonction get de la classe Faction

.gitignore

@@ -1,2 +1 @@
 /.vs/
-/js/skama_code

LICENSE

@@ -1,2 +1,2 @@
 DO NOT USE THIS CODE OR LOOK AT IT IF YOU ARE NOT ALLOWED TO
-IF YOU DO YOU CAN'T USE OR TEACH THE KNOWLEAGE YOU ACQUEIRED.
+IF YOU DO YOU CAN USE OR TEACH THE KNOWLEAGE YOU ACQUEIRED.

README.md

@@ -0,0 +1,15 @@
+# Skamcraft
+
+## Start 
+* Start with live server in VsCode to get full functionnality.
+* Start with php : 
+``` bash
+    cd /.../Skamcraft
+    php -S 127.0.0.1:80
+```
+
+## Norm
+* ``` ; ``` at the end of each line.
+* snack_case for functions and variables.
+* UpperCamelCase for Classes.
+* all in english.

css/animation.css

@@ -0,0 +1,15 @@
+/* Copyright © 2023 Entreprise SkamKraft */
+
+
+.ext-modal[open] {
+    animation: myFadeIn 2.0s ease normal;
+}
+  
+@keyframes myFadeIn{
+    from {
+      bottom: 100%;
+    }
+    to {
+      bottom: 0%;
+    }
+}

css/auth.css

@@ -1,32 +0,0 @@
-.auth-container {
-    height: inherit;
-    display: flex;
-    justify-content: center;
-    align-items: center;
-}
-
-.auth-title 
-{
-    font-size: 50px;
-}
-
-.auth{
-    width: 300px;
-    display: flex;
-    flex-direction: column;
-    align-items: center;
-    justify-content: center;
-    background-color: var(--main-color);
-    padding: 30px;
-    border-radius: 5px;
-}
-
-.auth-grp-label {
-    font-size: 20px;
-    display: flex;
-    justify-content: space-between;
-}
-
-.errors {
-    color: red;
-}

css/contracts.css

@@ -1,72 +0,0 @@
-.card{
-  display: grid;
-  margin-top: 15px;
-  grid-template-columns: 1fr 1fr;
-}
-.contracts
-{
-  display: flex;
-  justify-content: center;
-  flex-direction: column;
-  align-items: center;
-  height: 50%;
-  width: 50%;
-  overflow-y: scroll;
-}
-
-.contract-screen
-{
-  width: 100%;
-  height: 100%;
-  display: flex;
-  justify-content: center;
-  flex-direction: column;
-  align-items: center;
-}
-.screen-img {
-  z-index: -1;
-  position: absolute;
-  top: 10%;
-  height: 80%;
-  bottom: 1%;
-  right: 20%;
-  left: 20%;
-  width: 60%;
-}
-.card-body{
-  margin-left: 50px;
-}
-.card-button{
-  margin-top: 10px;
-}
-
-.img
-{
-  position: absolute;
-  top: 10%;
-  left: 25%;
-  z-index: -1;
-  background-repeat: no-repeat;
-  display: flex;
-  justify-content: center;
-  
-}
-
-#contracts-modal
-{
-  background-color: rgba(0, 0, 255, 0.5);
-  border: none;
-  border-radius: 10px;
-  padding: 40px;
-  color: white;
-}
-
-/* Modal */
-
-.status-onhold {
-  color: orange;
-}
-
-.status-accepted {
-  color: greenyellow;
-}

css/global.css

@@ -1,192 +0,0 @@
-@font-face {
-    font-family: pixellari;
-    src: url("/assets/fonts/Pixellari.ttf");
-}
-
-:root {
-    --text-color: white;
-    --text-familly: pixellari;
-    --main-color: black;
-    --sec-color: rgba(69, 128, 255, 0.842);
-}
-
-::-webkit-scrollbar {
-    width: 0 !important
-}
-
-body{
-    background-image: url("/assets/img/background.png"); 
-    background-repeat: no-repeat;
-    background-size: cover;
-    overflow: hidden;
-    font-family: var(--text-familly);
-    color: var(--text-color);
-    margin: 0;
-    padding: 0;
-}
-/* 
-button{
-    font-family: var(--text-familly);
-    color: var(--text-color);
-} */
-
-input{
-    font-family: var(--text-familly);
-    color: var(--text-color);
-}
-
-#block-content{
-    margin: 0;
-    padding: 0;
-    width: 100%;
-    height: 100vh;
-}
-
-.modal-disable::backdrop {
-    background-color: rgba(0, 0, 0, 0.493);
-}
-
-.ext-modal[open] {
-    animation: myFadeIn 0.5s ease normal;
-  }
-    
-  @keyframes myFadeIn{
-    from {
-        bottom: 100%;
-    }
-    to {
-        bottom: 0%;
-    }
-}
-
-.home-container {
-    width: 100%;
-    height: 100%;
-    display: flex;
-    justify-content: center;
-    align-items: center;
-    flex-direction: column;
-    text-shadow: 4px 2px black;
-}
-
-.languettes {
-    z-index: 1;
-    right: -30px;
-    top: 25%;
-    width: 80px;
-    position: absolute;
-    display: flex;
-    flex-direction: column;
-    align-items:flex-end;
-}
-.languettes input{
-    width: 100%;
-}
-.languettes input:hover{
-    animation: slide-left;
-    position: relative;
-    animation-timing-function: ease;
-    animation-fill-mode: forwards;
-    animation-duration: 1s;
-}
-
-@keyframes slide-left {
-    0%   {right: 0px; top: 0px;}
-  100%  {right: 25px; top: 0px;}
-}
-
-.Title{
-    position: absolute;
-    font-size: 50px;
-    margin-left: 50px;
-    background-color: rgba(0, 0, 0, 0.363);
-    border-radius: 5px;
-    width: fit-content;
-    padding: 10px;
-}
-
-.cont-center {
-    width: 100%;
-    height: 100%;
-    display: flex;
-    justify-content: center;
-    align-items: center;
-}
-
-.title{
-    font-size: 50px;
-    margin-left: 50px;
-}
-
-::placeholder {
-    color: var(--text-color);
-  }
-
-.base-input{
-    margin: 5px;
-    padding: 10px;
-    border: none;
-    border-radius: 5px;
-    background-color: var(--sec-color);
-    font-size: 20px;
-}
-.base-input:active{
-    background-color: var(--sec-color);
-    font-size: 20px;
-}
-
-/* .base-btn{
-    margin: 2px;
-    padding: 10px;
-    border: none;
-    border-radius: 5px;
-    background-color: var(--sec-color);
-    font-size: 20px;
-} */
-button, .button {
-    margin: 2px;
-    font-family: var(--text-familly);
-    background-color: #0000008f; 
-    color: #ffffff; 
-    border: 2px solid #ffffff;
-    padding: 10px; 
-    font-size: 13px; 
-    cursor: pointer; 
-    border-radius: 5px; 
-    transition: background-color 0.3s, color 0.3s, border-color 0.3s; 
-}
-
-button:hover, .button:hover {
-    background-color: #ffffff; 
-    color: #1a1a1a; 
-    border-color: #1a1a1a; 
-}
-
-button:active, .button:active {
-    background-color: #333333; 
-    color: #ffffff; 
-    border-color: #ffffff; 
-}
-
-button:disabled, .button:disabled {
-    background-color: #555555; 
-    color: #b3b3b3; 
-    border-color: #b3b3b3; 
-    cursor: not-allowed; 
-    opacity: 0.6; 
-}
-
-/* .base-btn:hover{
-    box-shadow: 1px 1px 1px 0px rgba(88, 88, 252, 0.842);
-} */
-
-.base-select {
-    margin: 5px;
-    padding: 10px;
-    border: none;
-    border-radius: 3px;
-    background-color: var(--sec-color);
-    font-size: 15px;
-    font-family: var(--text-familly);
-    color: var(--text-color);
-}

css/leaderboard.css

@@ -1,56 +0,0 @@
-.container-ldb {
-    width: 100%;
-}
-#myVideo {
-    position: fixed;
-    right: 0;
-    bottom: 0;
-    min-width: 100%;
-    min-height: 100%;
-    z-index: -1;
-}
-.head-board {
-    display: grid;
-    grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr;
-    margin: auto;
-    width: 60%;
-    padding: 20px;
-    font-size:x-large;
-    border : 1px solid white;
-    border-bottom-color: white;
-    border-bottom-width: 1px;
-    border-top-right-radius: 5px;
-    border-top-left-radius: 5px;
-    background-color: rgba(0, 0, 0, 0.5);
-}
-
-.leaderboard {
-    display: flex;
-    margin: auto;
-    align-items: center;
-    flex-direction: column;
-    border : 1px solid white;
-    width: 60%;
-    height: 350px;
-    overflow-y: scroll;
-    overflow-x: visible;
-    background-color: rgba(0, 0, 0, 0.5);
-    padding: 20px;
-    border-bottom-right-radius: 5px;
-    border-bottom-left-radius: 5px;
-    scrollbar-width: none;
-}
-
-.player {
-    width: 100%;
-    display: grid;
-    grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr;
-    border-bottom: 1px solid rgb(255, 255, 255);
-}
-
-.player p {
-    padding: 5px;
-    color: white;
-    font-size: large;
-    text-align: start;
-}

css/modal-ships.css

@@ -1,41 +0,0 @@
-.modal-ships {
-    background-image: url("/assets/spaceships/blueprint.png");
-    background-size: cover;
-    font-size: 25px;
-    width: 1000px;  /* Set the width to the image width */
-    height: 560px; /* Set the height to the image height */
-    position: relative;
-    margin: auto;
-    padding: 40px;
-    color: rgb(255, 255, 255);
-}
-
-.infos-ships {
-    padding: 20px;
-    margin-bottom: 20px; /* Space below the info box */
-}
-
-.ship-info {
-    background-color: rgba(0, 0, 0, 0.363);
-    border-radius: 5px;
-    width: fit-content;
-    padding: 5px;
-}
-
-.btn-close-ships {
-    position: absolute;
-    font-size:x-large;
-    bottom: 20px;
-    left: 20px;
-    background-color: rgba(255, 255, 255, 0.8); 
-    border: none;
-    color: rgb(252, 252, 252);
-    padding: 10px 20px;
-    cursor: pointer;
-    border-radius: 5px;
-    transition: background-color 0.3s ease; 
-}
-
-.btn-close-ships:hover {
-    background-color: rgba(255, 255, 255, 1); 
-}  

css/profile.css

@@ -1,101 +0,0 @@
-.cont-profile
-{
-    width: 100%;
-    height: 100%;
-    display: flex;
-    align-items: center;
-}
-#myVideo {
-    position: fixed;
-    right: 0;
-    bottom: 0;
-    min-width: 100%;
-    min-height: 100%;
-    z-index: -1;
-}
-#profile
-{
-    width: 50%;
-    height: 90%;
-    padding: 10px;
-    background-color: rgba(0, 0, 0, 0.637);
-    border: none;
-    border-radius: 10px;
-    display: flex;
-    justify-content: space-between;
-    align-items: center;
-    flex-direction: column;
-    color: white;
-}
-
-.profile-header
-{
-    width: 100%;
-    display: flex;
-    align-items: center;
-    justify-content: center;
-}
-
-.profile-header p
-{
-    font-size: 60px;
-}
-
-.profile-header button
-{
-    display: flex;
-    justify-content: center;
-    align-items: center;
-    border: none;
-}
-
-.profile-header button p
-{
-    font-size: 25px;
-    padding: 0;
-    margin: 0;
-}
-
-.profile-content
-{
-    width: 80%;
-    display: grid;
-    grid-template-columns: 1fr 1fr;
-    grid-template-rows: 1fr 1fr 1fr 1fr 1fr;
-    border: 1px solid white;
-    border-radius: 10px;
-    padding: 0;
-}
-
-.profile-content p
-{
-    text-align: center;
-}
-
-.tb-r
-{
-    border-right: 1px solid white;
-}
-
-.profile-footer
-{
-    display: flex;
-    align-items: center;
-    width: 80%;
-    padding: 5px;
-}
-
-#btn-logout
-{
-    width: 50px;
-    height: 50px;
-    padding: 0;
-    border: none;
-    background: none;
-}
-
-#btn-logout img
-{
-    width: 100%;
-    height: 100%;
-}

css/ships.css

@@ -1,55 +0,0 @@
-.block-ships{
-    position: relative;
-    width: 50%;
-    display:flex;
-    flex-direction: column;
-    color: white;
-    font-size:large;
-    text-align: center;
-    margin: auto;
-}
-
-.ships-modal{
-    font-size:small;
-    background-image: url("/assets/spaceships/blueprint.png");
-    background-repeat: no-repeat;
-    background-size: contain;
-}
-
-.ships-list {
-    display: none;
-}
-
-/* Next & previous buttons */
-.prev, .next {
-  cursor: pointer;
-  position: absolute;
-  top: 50%;
-  margin-top: -22px;
-  font-weight: bold;
-  font-size: 60px;
-  transition: 0.6s ease;
-}
-
-.imgShip {
-  left: 0;
-  margin-top: 50px;
-  width: 70%;
-}
-.ships-list h5 {
-  font-size:xx-large;
-  background-color: rgba(0, 0, 0, 0.363);
-  border-radius: 5px;
-  width: fit-content;
-  padding: 10px;
-  margin:auto;
-}
-/* Position the "next button" to the right */
-.next {
-  right: 0;
-}
-
-/* On hover, add a black background color with a little bit see-through */
-.btn-ships{
-  font-size:x-large;
-}

css/style.css

@@ -0,0 +1,199 @@
+/* Copyright © 2023 Entreprise SkamKraft */
+
+:root {
+  --main-back-color: rgb(143, 143, 143);
+  --second-back-color: black;
+}
+
+@font-face {
+  font-family: M42;
+  src: url("/assets/fonts/m42.TTF");
+}
+
+* {
+  box-sizing: border-box;
+}
+
+body {
+  background-image: url("/assets/img/background.jpg");
+  font-family: "M42";
+  font-size: 7px;
+  margin: 0px;
+  padding: 0px;
+}
+
+/* Main */
+.container {
+  color: white;
+  background-color: rgba(0, 0, 0, 0.726);
+  display: flex;
+  margin: 10px;
+  width: fit-content;
+  margin: auto;
+  margin-top: 10px;
+  margin-bottom: 30px;
+  flex-direction: column;
+  align-items: center;
+  border: 4px solid rgba(68, 68, 68, 0.575);
+  /* scrollbar-width: none;
+  overflow-y: scroll; */
+}
+
+.max-container {
+  background-color: rgba(0, 0, 0, 0.726);
+  color: white;
+  display: flex;
+  margin: 10px;
+  width: 95%;
+  margin: auto;
+  margin-top: 10px;
+  margin-bottom: 30px;
+  flex-direction: column;
+  align-items: center;
+  border: 4px solid rgba(68, 68, 68, 0.575);
+}
+
+.con-title {
+  font-size: 15px;
+  border-bottom: 2px solid black;
+}
+
+.btn {
+  padding: 10px;
+  font-size: 8px;
+  font-family: "M42";
+  color: white;
+  border: none;
+  border-radius: 10px;
+}
+
+.btn-val {
+  background-color: rgba(0, 0, 255, 0.637);
+}
+
+.btn-cancel {
+  background-color: rgba(255, 0, 0, 0.699);
+}
+
+/*footer*/
+footer {
+  position: fixed;
+  width: 100%;
+  bottom: 0;
+  display: flex;
+  justify-content: center;
+  background-color: var(--second-back-color);
+  color: white;
+}
+
+/*nav bar*/
+.nav-nav {
+  --nav-img-width: 100px;
+  background-color: var(--second-back-color);
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+}
+
+.nav-nav .nav-brand {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+}
+
+.nav-nav .nav-brand img {
+  width: var(--nav-img-width);
+}
+
+.nav-nav .nav-links {
+  --links-color: rgb(0, 0, 0);
+  --links-backcolor: rgb(255, 123, 71);
+  --links-border-color: rgb(255, 173, 118);
+  height: 70%;
+  display: flex;
+  justify-content: space-between;
+}
+
+.nav-link {
+  margin-right: 10px;
+  background-color: var(--links-backcolor);
+  color: var(--links-color);
+  border: 4px solid var(--links-border-color);
+  list-style: none;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  box-shadow: 3px 2px white;
+}
+
+.stats {
+  color: white;
+}
+
+/* General */
+.smooth {
+  padding: 5px;
+  padding-left: 10px;
+  padding-right: 10px;
+  border-radius: 5px;
+}
+
+.in-big {
+  font-family: "M42";
+  font-size: 6px;
+  padding: 5px;
+  width: 100%;
+  margin-bottom: 10px;
+  border-radius: 5px;
+  border: none;
+}
+
+.errors p {
+  background-color: rgba(255, 56, 56, 0.733);
+  border: 3px solid rgb(255, 111, 111);
+  padding: 10px;
+  color: white;
+  border-radius: 5px;
+  text-align: center;
+}
+
+/* Modal */
+.ext-modal {
+  background-color: rgba(255, 255, 255, 0.767);
+  border-radius: 10px;
+  padding: 50px;
+}
+
+.my-modal {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+}
+
+.modal-title {
+  font-size: 15px;
+  margin-bottom: 40px;
+}
+
+.show-token {
+  width: fit-content;
+  border: 2px solid black;
+  border-radius: 10px;
+  padding: 30px;
+  font-size: 5px;
+  white-space: pre-wrap;
+  word-break: break-word;
+}
+
+.my-modal #timer {
+  text-align: center;
+  border: 1px solid black;
+  border-radius: 10px;
+  width: 10%;
+  padding: 5px;
+  margin-bottom: 10px;
+}
+
+#canvas {
+  border-radius: 10px;
+}

css/system.css

@@ -1,17 +0,0 @@
-.cont-canvas
-{
-    width: 100%;
-    height: 100%;
-    display: flex;
-    justify-content: center;
-    align-items: center;
-    z-index: -1;
-}
-
-#sys-canvas
-{
-    z-index: -1;
-    border: 1px solid black;
-    border-radius: 10px;
-    background-color: rgba(11, 1, 37, 0.842);
-}

css/ui.css

@@ -0,0 +1,11 @@
+/* Copyright © 2023 Entreprise SkamKraft */
+
+#block-content {
+    margin: 0;
+    padding: 0;
+}
+
+.modal-disable::backdrop {
+    background-color: rgba(0, 0, 0, 0.493);
+}
+

html/template.html

@@ -1,8 +1,16 @@
-<script>
-    // document.getElementById('audio').play();
-</script>
-<div id="links" class="languettes">
-
-</div>
-<div id="block-content">
-</div>
+<!-- Copyright © 2023 Entreprise SkamKraft -->
+<nav class="nav-nav">
+  <div class="nav-brand">
+    <img src="assets/logo/logoblancnotext.png" />
+  </div>
+  <div class="stats"></div>
+  <ul class="nav-links">
+    <li class="nav-link smooth" id="systems-link">Systems</li>
+    <li class="nav-link smooth" id="login-link">Log in</li>
+    <li class="nav-link smooth" id="reg-link">New Agent</li>
+  </ul>
+</nav>
+<main id="block-content"></main>
+<footer>
+  <p>Skamcraft Sarl</p>
+</footer>

html/templates/auth/login.html

@@ -1,19 +1,11 @@
 <!-- Copyright © 2023 Entreprise SkamKraft -->
-<div class="auth-container">
-    <div class="auth">
-        <p class="auth-title">LOGIN</p>
-        <input type="text" placeholder="Agent token" class="base-input" id="in-token">
-        <div class="auth-grp-label">
-            <p>Remember me ?</p>
-            <input type="checkbox" class="base-input" id="in-remember">
-        </div>
-        <div>
-            <button class="base-btn" id="btn-login">Validate</button>
-            <button class="base-btn" id="btn-cancel">Cancel</button>
-        </div>
-        <div>
-            <button class="base-btn" id="btn-register">New agent</button>
+
+<div class="container smooth"> 
+    <p class="con-title">Login</p>
+    <input type="text" placeholder="Agent token" id="in-token" class="in-big">
+    <div class="grp-btn">
+        <button class="btn btn-val" id="val">Validate</button>
+        <button class="btn btn-cancel" id="cancel">Cancel</button>
     </div>
     <div class="errors"></div>
-    </div>
 </div>

html/templates/auth/login_modal.html

@@ -0,0 +1,9 @@
+<!-- Copyright © 2023 Entreprise SkamKraft -->
+
+<div class="my-modal">
+    <p class="modal-title">Login success</p>
+    <div>
+        <button id="ok" class="btn btn-val">Continue</button>
+        <button id="forget_login" class="btn btn-cancel">Forget agent</button>
+    </div>
+</div>

html/templates/auth/reg.html

@@ -0,0 +1,12 @@
+<!-- Copyright © 2023 Entreprise SkamKraft -->
+
+<div class="container smooth"> 
+    <p class="con-title">New Agent</p>
+    <input type="text" placeholder="Name" id="in-name" class="in-big">
+    <input type="text" placeholder="Faction" id="in-faction" class="in-big">
+    <div class="grp-btn">
+        <button class="btn btn-val" id="val">Validate</button>
+        <button class="btn btn-cancel" id="cancel">Cancel</button>
+    </div>
+    <div class="errors"></div>
+</div>

html/templates/auth/reg_modal.html

@@ -0,0 +1,10 @@
+<!-- Copyright © 2023 Entreprise SkamKraft -->
+
+<div class="my-modal">
+    <p class="modal-title">Login success</p>
+    <p class="show-token"></p>
+    <div>
+        <button id="ok" class="btn btn-val">Continue</button>
+        <button id="forget_reg" class="btn btn-cancel">Forget agent</button>
+    </div>
+</div>