anulax
/
skamkraft.anulax.ch
1
0
Fork 0
Code Issues Pull Requests Packages project_board Releases Wiki Activity

Fixing Listing requests : not fixed, Rendering Leaderboard : done

Browse Source
agent_bryte
AmorimDSJM ago%!(EXTRA string=1 year)
parent 8962158b46
commit 80589ba76a
4 changed files with 105 additions and 14 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 68
      css/style.css
  2. BIN
      fonts/m42.TTF
  3. 11
      index.html
  4. 40
      js/main.js

68
css/style.css
Unescape View File

@ -0,0 +1,68 @@
@font-face {
font-family: M42;
src: url(/fonts/m42.TTF);
}
*{
font-family: M42;
font-size: 10px;
}
.head-board {
display: flex;
margin:auto;
justify-content: space-between;
flex-direction: row;
width: 50%;
border: 2px solid black;
border-bottom-color: white;
border-bottom-width: 1px;
border-bottom-left-radius: 0px;
border-bottom-right-radius: 0px;
border-top-left-radius: 10px;
border-top-right-radius: 10px;
background-color: black;
}
.leaderboard {
display: flex;
margin: auto;
align-items: center;
flex-direction: column;
width: 50%;
height: 50vh;
overflow-y: scroll;
border: 2px solid black;
border-bottom-left-radius: 10px;
border-bottom-right-radius: 10px;
border-top-left-radius: 0px;
border-top-right-radius: 0px;
background-color: black;
scrollbar-width: none; /* Firefox */
}
article{
width: 99.9%;
display: flex;
justify-content: space-between;
border-bottom: 1px solid rgb(255, 255, 255);
}
p{
padding: 5px;
text-align: start;
}
.num{
font-size: larger;
color: rgb(255, 255, 255);
}
.faction{
color:rgb(0, 255, 115);
}
.headquarters{
color:rgb(86, 187, 255);
}
.symbol{
color:red;
text-decoration: underline;
}
.credits{
color: rgb(250, 204, 88);
}

BIN
fonts/m42.TTF
View File

Binary file not shown.

11
index.html
Unescape View File

@ -4,12 +4,21 @@
<meta charset="UTF-8"> <meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge"> <meta http-equiv="X-UA-Compatible" content="ie=edge">
<link rel="stylesheet" href="/css/style.css">
<link rel="preconnect" href="fonts\m42.TTF">
<script src="js/main.js" defer></script> <script src="js/main.js" defer></script>
<script src="https://code.jquery.com/jquery-3.7.1.min.js" integrity="sha256-/JqT3SQfawRcv/BIHPThkBvs0OEvtFFmqPF/lYI/Cxo=" crossorigin="anonymous"></script> <script src="https://code.jquery.com/jquery-3.7.1.min.js" integrity="sha256-/JqT3SQfawRcv/BIHPThkBvs0OEvtFFmqPF/lYI/Cxo=" crossorigin="anonymous"></script>
</header> </header>
<body> <body>
<button class="btn-test">Get Leaderboard</button>
<div class="head-board">
<p class="num">rank</p>
<p class="symbol">name</p>
<p class="credits">credits</p>
<p class="headquarters">headquaters</p>
<p class="faction">faction</p>
</div>
<div class="leaderboard"> <div class="leaderboard">
<button class="btn-test"></button>
</div> </div>
</body> </body>

40
js/main.js
Unescape View File

@ -40,7 +40,7 @@ function sortAgentByCredits(a1, a2) {
} }
var meta = null var meta = null
function listAgent(page, limit = 20){ function listAgent(page, limit = 20, totalPg = 1){
const settings = { const settings = {
async: true, async: true,
crossDomain: true, crossDomain: true,
@ -56,16 +56,26 @@ function listAgent(page, limit = 20){
success: function(response) { success: function(response) {
meta = response.meta meta = response.meta
agents = agents.concat(response.data); agents = agents.concat(response.data);
console.log(agents)
console.log("Actioni") console.log("Actioni")
if (response.meta.page == page) drawAgents(); console.log(meta)
else setTimeout(10000, listAgent(page, limit));
if (response.meta.page == totalPg) drawAgents();
else {
page++
sleep(10000, page);
}
},
error: function(response) {
drawAgents();
} }
}; };
$.ajax(settings); $.ajax(settings);
} }
function sleep(ms) { function sleep(ms, page) {
return new Promise(resolve => setTimeout(resolve, ms)); console.log(page, "Page Sleep :")
return new Promise(() => setTimeout(listAgent(page), ms));
} }
async function getAllAgents() { async function getAllAgents() {
@ -83,9 +93,8 @@ async function getAllAgents() {
limit: limit limit: limit
}, },
success: function(response) { success: function(response) {
meta = response.meta const totalPg = Math.ceil(response.meta.total / limit);
const total = Math.ceil(meta.total / limit); listAgent(1, limit, totalPg)
listAgent(1, limit)
} }
}; };
$.ajax(settings); $.ajax(settings);
@ -95,14 +104,19 @@ function drawAgents() {
$(".leaderboard").html(""); $(".leaderboard").html("");
agents.sort(sortAgentByCredits); agents.sort(sortAgentByCredits);
agents.reverse(); agents.reverse();
let i = 1;
agents.forEach(agent => { agents.forEach(agent => {
$(".leaderboard").append(` $(".leaderboard").append(`
<p>${agent.credits}</p> <article>
<p>${agent.symbol}</p> <p class="elem num">${i}.</p>
<p>${agent.headquarters}</p> <p class="elem symbol">${agent.symbol} : </p>
<p>${agent.startingFaction}</p> <p class="elem credits">${agent.credits}</p>
<p>${agent.shipCount}</p> <p class="elem headquarters">${agent.headquarters}</p>
<p class="elem faction">${agent.startingFaction}</p>
<p class="elem ships>${agent.shipCount}</p>
</article>
`); `);
i++
}); });
} }

Write Preview
Loading…
Cancel
Save