GrandTabernacleAutoVI/js/render.js
2023-12-06 19:51:25 +01:00

79 lines
No EOL
1.8 KiB
JavaScript

const imgPlayer = new Image();
const imgBullet = new Image();
imgPlayer.src = "./assets/body.png";
imgBullet.src = "./assets/bullet.png";
class Render {
constructor(id, mapsrc) {
this.canvas = document.getElementById(id);
this.ctx = canvas.getContext("2d");
this.players = [];
this.bullets = [];
this.mapsrc=mapsrc;
this.ReloadAff();
}
AddPlayer(player) {
this.players.push(player);
}
addBullet(bullet) {
this.bullets.push(bullet);
}
remBullet(bullet) {
for(let i=0;i<this.bullets.length;i++) {
if(bullet==this.bullets[i]) {
this.bullets.splice(i,1);
}
}
}
RemPlayer(id) {
for(let i=0;i<this.players.length;i++)
{
if(this.players[i].id==id)
{
this.players.splice(i,1);
break;
}
}
}
RenderPlayer(player) {
this.ctx.save();
this.ctx.translate(player.x, player.y);
this.ctx.rotate(player.angle);
this.ctx.drawImage(imgPlayer, -playerSize / 2, -playerSize / 2, playerSize, playerSize);
this.ctx.restore();
this.ctx.fillStyle = 'white';
this.ctx.font="10pt arial";
this.ctx.fillText(player.name,player.x-player.name.length*10/3,player.y-playerSize/1.8);
}
RenderBullet(bullet) {
this.ctx.save();
this.ctx.translate(bullet.x, bullet.y);
this.ctx.drawImage(imgBullet, -playerSize / 2, -playerSize / 2, playerSize, playerSize);
this.ctx.restore();
}
ReloadAff() {
/*this.ctx.fillStyle = "red";
this.ctx.fillRect(0,0,this.canvas.width,this.canvas.height);
*/
const fond = new Image();
fond.src = this.mapsrc;
mapWidth = fond.width;
mapHeith = fond.height;
this.ctx.canvas.width = mapWidth;
this.ctx.canvas.height = mapHeith;
this.ctx.drawImage(fond, 0, 0, mapWidth, mapHeith);
this.players.forEach((player) => {
this.RenderPlayer(player);
})
this.bullets.forEach((bullet) => {
this.RenderBullet(bullet);
});
}
}