Scribd
Upload
11 views3 pages

Text

Uploaded by

redjireis
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as TXT, PDF, TXT or read online on Scribd
11 views3 pages

Text

Uploaded by

redjireis
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as TXT, PDF, TXT or read online on Scribd
You are on page 1/ 3

<!

DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>2D Action Combat Game</title>
<style>
body {
margin: 0;
overflow: hidden;
background-color: #333;
}

canvas {
background-color: #eee;
display: block;
margin: auto;
border: 1px solid black;
}
</style>
</head>
<body>
<canvas id="gameCanvas" width="800" height="600"></canvas>
<script>
const canvas = document.getElementById('gameCanvas');
const ctx = canvas.getContext('2d');

// Variables du joueur
const player = {
x: 50,
y: canvas.height - 100,
width: 50,
height: 50,
color: 'blue',
speed: 5,
dx: 0,
dy: 0,
isAttacking: false
};

// Variables de l'ennemi
const enemy = {
x: canvas.width - 100,
y: canvas.height - 100,
width: 50,
height: 50,
color: 'red'
};

// Dessine le joueur
function drawPlayer() {
ctx.fillStyle = player.color;
ctx.fillRect(player.x, player.y, player.width, player.height);
}

// Dessine l'ennemi
function drawEnemy() {
ctx.fillStyle = enemy.color;
ctx.fillRect(enemy.x, enemy.y, enemy.width, enemy.height);
}

// Déplace le joueur
function movePlayer() {
player.x += player.dx;
player.y += player.dy;

// Limites du canvas
if (player.x < 0) player.x = 0;
if (player.x + player.width > canvas.width) player.x = canvas.width -
player.width;
}

// Détecte la collision entre le joueur et l'ennemi


function detectCollision() {
if (
player.x < enemy.x + enemy.width &&
player.x + player.width > enemy.x &&
player.y < enemy.y + enemy.height &&
player.y + player.height > enemy.y
) {
// Collision détectée
if (player.isAttacking) {
alert('Ennemi vaincu!');
resetGame();
} else {
alert('Vous avez été touché!');
resetGame();
}
}
}

// Réinitialise le jeu
function resetGame() {
player.x = 50;
player.y = canvas.height - 100;
player.isAttacking = false;
}

// Efface le canvas
function clearCanvas() {
ctx.clearRect(0, 0, canvas.width, canvas.height);
}

// Met à jour le jeu


function updateGame() {
clearCanvas();
drawPlayer();
drawEnemy();
movePlayer();
detectCollision();

requestAnimationFrame(updateGame);
}

// Gère les touches enfoncées


function keyDownHandler(e) {
if (e.key === 'ArrowRight' || e.key === 'Right') {
player.dx = player.speed;
} else if (e.key === 'ArrowLeft' || e.key === 'Left') {
player.dx = -player.speed;
} else if (e.key === ' ') {
player.isAttacking = true;
}
}

// Gère les touches relâchées


function keyUpHandler(e) {
if (e.key === 'ArrowRight' || e.key === 'Right' || e.key ===
'ArrowLeft' || e.key === 'Left') {
player.dx = 0;
} else if (e.key === ' ') {
player.isAttacking = false;
}
}

// Écouteurs d'événements pour le clavier


document.addEventListener('keydown', keyDownHandler);
document.addEventListener('keyup', keyUpHandler);

// Démarre le jeu
updateGame();
</script>
</body>
</html>

You might also like