player tubé

game.js

@@ -1,9 +1,27 @@
+Renderer = new Render("canvas")
+
+let rubiks = new Player(1, 100, 50, "rubiks")
+let atsuyo = new Player(2, 500, 70, "atsuyo")
+let vincent = new Player(3, 600, 70, "atsuyo")
+let migliore = new Player(4, 700, 70, "atsuyo")
+let leroux = new Player(5, 200, 30, "atsuyo")
+let lele = new Player(6, 700, 700, "atsuyo")
+
+rubiks.visibleDir=3
+
+Renderer.AddPlayer(rubiks)
+Renderer.AddPlayer(atsuyo)
+Renderer.AddPlayer(vincent)
+Renderer.AddPlayer(migliore)
+Renderer.AddPlayer(leroux)
+Renderer.AddPlayer(lele)
+
+
 setInterval(game);
 
 function game() {
-	Renderer = new Render("canvas")
-
-	let rubiks = new Player(1, 100, 50, "rubiks")
-	console.log(rubiks)
-	Renderer.AddPlayer(rubiks)
+	rubiks.visibleDir=rubiks.visibleDir+0.03
+	atsuyo.visibleDir=atsuyo.visibleDir-0.1
+	migliore.x=migliore.x-0.1
+	Renderer.ReloadAff()
 }

render.js

@@ -6,24 +6,26 @@ class Render {
 		this.ReloadAff()
 	}
 
-	AddPlayer(id, pseudo, x, y, angle) {
-		this.players[id] = (id, pseudo, x, y, angle)
+	AddPlayer(player) {
+		this.players[player.id] = player
+	}
+
+	RenderPlayer(player) {
+		const img = new Image();
+		img.src = "./assets/body.png";
+	    this.ctx.save();
+	    this.ctx.translate(player.x, player.y);
+	    this.ctx.rotate(player.angle);
+	    this.ctx.drawImage(img, -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);
 
-		/*this.ctx.stokeStyle = "black"
-	    this.ctx.lineWidth   = 1;
-		ctx.beginPath();
-		ctx.moveTo(point1[0], point1[1]);
-		ctx.lineTo(point2[0], point2[1]);
-		ctx.lineTo(point3[0], point3[1]);
-		ctx.lineTo(point1[0], point1[1]);
-		ctx.stroke()
-		ctx.fill();*/
-		this.ctx.closePath();
-		this.ctx
+   		this.players.forEach((player) => {
+   			this.RenderPlayer(player)
+   		})
 	}
 }