ca me coute des token
All checks were successful
DEPLOY / deploy (push) Successful in 9s

This commit is contained in:
Djalim Simaila 2025-02-23 20:19:00 +01:00
parent 33b1bde178
commit 707075503a

View File

@ -1,5 +1,24 @@
<!doctype html> <!doctype html>
<body style="background-color: #282a36; margin: 0; width: 100vw; height: 100vh"> <html lang="fr">
<head>
<title>snake</title>
<meta charset="UTF-8" />
<link rel="stylesheet" href="/static/style.css" />
<script src="/static/js/utils.js" defer></script>
<script src="/static/js/TP6.js" defer></script>
<link
rel="stylesheet"
href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css"
/>
</head>
<body
style="
background-color: #282a36;
margin: 0;
width: 100vw;
height: 100vh;
"
>
<h2 <h2
id="status" id="status"
style=" style="
@ -29,7 +48,9 @@
.getElementById("canvas") .getElementById("canvas")
.getBoundingClientRect(); .getBoundingClientRect();
document.getElementById("canvas").setAttribute("width", width); document.getElementById("canvas").setAttribute("width", width);
document.getElementById("canvas").setAttribute("height", height); document
.getElementById("canvas")
.setAttribute("height", height);
this.boxSize = 15; this.boxSize = 15;
this.canvasWidth = width; this.canvasWidth = width;
this.canvasHeight = height; this.canvasHeight = height;
@ -71,11 +92,14 @@
computeMovement(keypressed) { computeMovement(keypressed) {
this.snake.tail.push(this.snake.head); this.snake.tail.push(this.snake.head);
if ( if (
(keypressed === "ArrowUp" && this.LastInput == "ArrowDown") || (keypressed === "ArrowUp" &&
(keypressed === "ArrowDown" && this.LastInput == "ArrowUp") || this.LastInput == "ArrowDown") ||
(keypressed === "ArrowDown" &&
this.LastInput == "ArrowUp") ||
(keypressed === "ArrowLeft" && (keypressed === "ArrowLeft" &&
this.LastInput == "ArrowRight") || this.LastInput == "ArrowRight") ||
(keypressed === "ArrowRight" && this.LastInput == "ArrowLeft") (keypressed === "ArrowRight" &&
this.LastInput == "ArrowLeft")
) { ) {
keypressed = this.LastInput; keypressed = this.LastInput;
} else { } else {
@ -187,17 +211,28 @@
this.context = canvas.getContext("2d"); this.context = canvas.getContext("2d");
} }
clear() { clear() {
this.context.clearRect(0, 0, this.canvas.width, this.canvas.height); this.context.clearRect(
0,
0,
this.canvas.width,
this.canvas.height,
);
} }
drawBoard() { drawBoard() {
for (let x = 0; x <= this.canvasWidth; x += this.boxSize) { for (let x = 0; x <= this.canvasWidth; x += this.boxSize) {
this.context.moveTo(0 + x + this.p, this.p); this.context.moveTo(0 + x + this.p, this.p);
this.context.lineTo(0 + x + this.p, this.canvasHeight + this.p); this.context.lineTo(
0 + x + this.p,
this.canvasHeight + this.p,
);
} }
for (let x = 0; x <= this.canvasHeight; x += this.boxSize) { for (let x = 0; x <= this.canvasHeight; x += this.boxSize) {
this.context.moveTo(this.p, 0 + x + this.p); this.context.moveTo(this.p, 0 + x + this.p);
this.context.lineTo(this.canvasWidth + this.p, 0 + x + this.p); this.context.lineTo(
this.canvasWidth + this.p,
0 + x + this.p,
);
} }
this.context.strokeStyle = "#44475a"; this.context.strokeStyle = "#44475a";
this.context.stroke(); this.context.stroke();
@ -229,3 +264,4 @@
g = new Game(); g = new Game();
g.init(); g.init();
</script> </script>
</html>