Fin du cours du 15.12.2023

.gitignore

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

LICENSE

@@ -1,2 +0,0 @@
-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.

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,5 @@
+/* Copyright © 2023 Entreprise SpaceTarders */
+canvas {
+    border: 2px solid rgb(7, 18, 41);
+    border-radius: 5px;
+}

css/styleindex.css

@@ -0,0 +1,40 @@
+/* Copyright © 2023 Entreprise SpaceTarders */
+html{
+    background-color: rgb(7, 18, 41);
+    cursor: crosshair;
+}
+main{
+    display: flex;
+    justify-content: center;
+}
+#title{
+    font-family: M42;
+    font-size:15px;
+    margin-left: 10px;
+    margin-top: 10px;
+    color: white;
+    display: flex;
+    justify-content: left;
+}
+
+#menu {
+    display: flex;
+    justify-content: center;
+    justify-content: space-between;
+}
+#menu button{
+    margin-top: 15px;
+    font-family: M42;
+    color: white;
+    font-size: 11px;
+    background-color: rgb(20, 20, 32); 
+    cursor: pointer;
+}
+#canvas {
+    border: 2px solid rgb(7, 18, 41);
+    border-radius: 5px;
+}
+@font-face {
+    font-family: M42;
+    src: url(/fonts/m42.TTF);
+  }

css/stylelogin.css

@@ -0,0 +1,50 @@
+/* Copyright © 2023 Entreprise SpaceTarders */
+html{
+    background-color: rgb(7, 18, 41);
+}
+img{
+    width: 10%;
+    margin-right: 30px;
+}
+.text{
+    font-size:8px;
+    font-family: M42;
+    color: white;
+}
+header p{
+    display: flex;
+    justify-content: center;
+}
+#title{
+    font-family: M42;
+    font-size:20px;
+    margin-left: 10px;
+    margin-top: 50px;
+    color: white;
+    display: flex;
+    justify-content: center;
+}
+#menu {
+    display: flex;
+    justify-content: center;
+    justify-content: space-between;
+}
+#menu button{
+    margin-top: 15px;
+    font-family: M42;
+    color: white;
+    font-size: 15px;
+    background-color: rgb(20, 20, 32); 
+}
+footer p{
+    position: fixed;
+    bottom: 0;
+}
+canvas {
+    border: 2px solid rgb(7, 18, 41);
+    border-radius: 5px;
+}
+@font-face {
+    font-family: M42;
+    src: url(/fonts/m42.TTF);
+  }

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);
-}

html/template.html

@@ -1,8 +0,0 @@
-<script>
-    // document.getElementById('audio').play();
-</script>
-<div id="links" class="languettes">
-
-</div>
-<div id="block-content">
-</div>

html/templates/auth/login.html

@@ -1,19 +0,0 @@
-<!-- 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>
-        <div class="errors"></div>
-    </div>
-</div>

html/templates/auth/register.html

@@ -1,23 +0,0 @@
-<!-- Copyright © 2023 Entreprise SkamKraft -->
-<div class="auth-container">
-    <div class="auth">
-        <p class="auth-title">New Agent</p>
-        <input type="text" placeholder="Name" class="base-input" id="in-name">
-        <select class="base-select" id="in-faction">
-            <option value="" disabled selected>Factions</option>
-            <optgroup id="group-faction"></optgroup>
-        </select>
-        <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-register">Validate</button>
-            <button class="base-btn" id="btn-cancel">Cancel</button>
-        </div>
-        <div>
-            <button class="base-btn" id="btn-log">Login</button>
-        </div>
-        <div class="errors"></div>
-    </div>
-</div>

html/templates/contracts/contracts.html

@@ -1,6 +0,0 @@
-<p class="Title">CONTRACTS</p>
-<div class="contract-screen">
-    <img class="screen-img" src="/assets/contracts/screen.png">
-    <div class="contracts">
-    </div>
-</div>

html/templates/contracts/contracts_modal.html

@@ -1,16 +0,0 @@
-<!-- Copyright © 2023 Entreprise SkamKraft -->
-
-<div>
-    <p class="modal-title">Contract</p>
-    <p class="contract-id"></p>
-    <p class="contract-faction"></p>
-    <p class="contract-type"></p>
-    <p class="contract-expiration"></p>
-    <p class="contract-payment-accepted"></p>
-    <p class="contract-payment-fulfill"></p>
-    <p class="contract-tradeSymbol"></p>
-    <p class="contract-destinationSymbol"></p>
-    <div>
-        <button class="btn btn-val btn-close">Close</button>
-    </div>
-</div>

html/templates/home.html

@@ -1,6 +0,0 @@
-<p class="Title">HOME</p>
-<div class="home-container">
-    <h1>WELCOME TO</h1>
-    <img src="/assets/logo/spacetradertitle.png" alt="" width="60%">
-    <p>Skamkraft is based on the SpaceTraders API</p>
-</div>

html/templates/leaderboard/leaderboard.html

@@ -1,21 +0,0 @@
-<!-- Copyright © 2023 Entreprise SkamKraft -->
-<p class="Title">LEADERBOARD</p>
-<video autoplay muted loop id="myVideo">
-    <source src="/assets/leaderboard/trophee.mp4" type="video/mp4">
-</video>
-<div class="cont-center">
-    <div class="container-ldb">
-        <div class="head-board">
-            <p class="num">Rank</p>
-            <p class="symbol">Name</p>
-            <p class="credits">Credits</p>
-            <p class="headquarters">Headquarters</p>
-            <p class="faction">Faction</p>
-            <p class="ships">Ships</p>
-        </div>
-        <div class="leaderboard"></div>
-        <div>
-            <!--- leaderboard content -->
-        </div>
-    </div>
-</div>

html/templates/profile/profile.html

@@ -1,24 +0,0 @@
-<div class="cont-profile">
-    <div id="profile">
-        <div class="profile-header">
-            <p class="">PROFILE</p>
-        </div>  
-        <video autoplay muted loop id="myVideo">
-            <source src="/assets/profile/background.mp4" type="video/mp4">
-          </video>
-        <div class="profile-content">
-            <p class="tb-r">Name</p><p id="name"></p>
-            <p class="tb-r">Faction</p><p id="faction"></p>
-            <p class="tb-r">Credits</p><p id="credit"></p>
-            <p class="tb-r">Head Quaters</p><p id="hq"></p>
-            <p class="tb-r">Number of ships</p><p id="shipcount"></p>
-        </div>
-        
-        <div class="profile-footer">
-            <button id="btn-logout">
-                <img src="/assets/menu/logout.png" alt="">
-            </button>
-            <button id="btn-token">COPY TOKEN</button>
-        </div>
-    </div>
-</div>