GrandTabernacleAutoVI/public_html/js/leaderboard.js

71 lines
2.3 KiB
JavaScript
Raw Normal View History

2023-12-06 14:02:35 +01:00
class LeaderBoard {
2023-12-08 13:50:49 +01:00
constructor(idCanvas) {
this.canvas = document.getElementById(idCanvas);
2023-12-06 14:02:35 +01:00
this.ctx = this.canvas.getContext("2d");
this.nbjoueur=0
2023-12-08 20:02:04 +01:00
this.px=10;
this.py=10;
2023-12-06 14:02:35 +01:00
}
2023-12-08 13:50:49 +01:00
ReloadAff() {
let LBplayers=[];
2023-12-06 14:02:35 +01:00
players.forEach((p) => {
if(p != null) {
2023-12-08 13:50:49 +01:00
LBplayers.push(p);
2023-12-06 14:02:35 +01:00
}
})
2023-12-08 13:50:49 +01:00
LBplayers.push(player);
2023-12-06 14:02:35 +01:00
2023-12-08 13:50:49 +01:00
LBplayers.sort(function (a, b) {
2023-12-06 20:25:49 +01:00
return b.kill - a.kill;
});
// tableau du leaderboard (le fonc "blanc")
this.ctx.fillStyle = 'rgba(255, 255, 255, 0.7)';
2023-12-08 20:02:04 +01:00
this.ctx.fillRect(this.px, this.py, this.px+240, this.py+100+LBplayers.length*20);
2023-12-08 13:50:49 +01:00
this.nbjoueur=0;
2023-12-06 14:02:35 +01:00
this.ctx.font = '20px Arial';
this.ctx.fillStyle = '#000000';
this.ctx.fillText('Leaderboard', this.px+80, this.py+30);
2023-12-06 20:25:49 +01:00
// lignes noires
2023-12-06 14:02:35 +01:00
this.ctx.strokeStyle = '#000000';
this.ctx.lineWidth = 2;
this.ctx.beginPath();
this.ctx.moveTo(this.px, this.py+50);
this.ctx.lineTo(this.px+250, this.py+50);
this.ctx.moveTo(this.px, this.py+100);
this.ctx.lineTo(this.px+250, this.py+100);
this.ctx.stroke();
2023-12-08 20:02:04 +01:00
//donnee user
2023-12-06 14:02:35 +01:00
this.ctx.fillStyle = '#000000';
this.ctx.font = '15px Arial';
2023-12-06 20:25:49 +01:00
this.ctx.fillText('#', this.px+10, this.py+80);
this.ctx.fillText('Username', this.px+30, this.py+80);
this.ctx.fillText('K', this.px+180, this.py+80);
this.ctx.fillText('D', this.px+200, this.py+80);
this.ctx.fillText('K/D', this.px+220, this.py+80);
2023-12-06 14:02:35 +01:00
this.ctx.font = '10px Arial';
2023-12-08 13:50:49 +01:00
LBplayers.forEach((p) => {
2023-12-06 14:02:35 +01:00
if(p != null) {
2023-12-06 20:25:49 +01:00
this.ctx.fillText((this.nbjoueur+1), this.px+10, this.py+120+20*this.nbjoueur);
this.ctx.fillText(p.name, this.px+30, this.py+120+20*this.nbjoueur);
this.ctx.fillText(p.kill, this.px+180, this.py+120+20*this.nbjoueur);
this.ctx.fillText(p.death, this.px+200, this.py+120+20*this.nbjoueur);
2023-12-07 14:14:42 +01:00
this.ctx.fillText(Math.round(10*p.kill/p.death)/10, this.px+220, this.py+120+20*this.nbjoueur);
2023-12-06 14:02:35 +01:00
2023-12-08 13:50:49 +01:00
this.nbjoueur++;
2023-12-06 14:02:35 +01:00
}
});
/*this.ctx.fillText('1', this.px+20, this.py+120);
this.ctx.fillText('Player1', this.px+50, this.py+120);
this.ctx.fillText('10/20', this.px+180, this.py+120);
this.ctx.fillText('2', this.px+20, this.py+120+20);
this.ctx.fillText('Player2', this.px+50, this.py+120+20);
this.ctx.fillText('10/2', this.px+180, this.py+120+20);
*/
}
}