JavaScript:
var canvas = document.getElementById("canvas");
var ctx = canvas.getContext("2d");
function resizeCanvas() {
canvas.width = window.innerWidth;
canvas.height = window.innerHeight;
canvas.width = document.body.clientWidth;
canvas.height = document.body.clientHeight;
}
window.addEventListener('resize', resizeCanvas);
resizeCanvas();
var keys = {};
var mouse = {
x: 0,
y: 0
};
var angle = 0;
function menu() {
player.heal = 100;
}
window.addEventListener("mousemove", function (event) {
mouse.x = event.clientX;
mouse.y = event.clientY;
});
window.addEventListener("keydown", function (event) {
keys[event.keyCode] = true;
});
window.addEventListener("keyup", function (event) {
delete keys[event.keyCode];
});
function createImage(path) {
newImage = new Image();
newImage.src = path;
newImage.onload = function () {
loop();
};
return newImage;
}
var player = {
x: canvas.width / 2,
y: canvas.height / 2,
posx: 0,
posy: 0,
width: 41,
height: 97,
speed: -1.6,
speedDiag: -(1.6 / Math.sqrt(2)),
heal: 100,
reloading: false,
image: createImage("./img/sprite.png"),
reloadingImage: createImage("./img/sprite reloading.png"),
shotLightImage: createImage("./img/shotLight Img.png"),
bulletImg: createImage("./img/bullet Img.png")
};
var explosive = {
baril1: {
posx: 500,
posy: 500,
width: 66,
height: 66,
image: createImage("./img/explosive baril.png"),
heal: 100
},
baril2: {
posx: 800,
posy: 100,
width: 66,
height: 66,
image: createImage("./img/explosive baril.png"),
heal: 100
}
}
var bullets = [];
var shotLightVisible = false;
var lastFireTime = 0;
var fireRate = 1000 / 10;
var shootIntervalId;
function updateAngle() {
var dx = mouse.x - player.x;
var dy = mouse.y - player.y;
angle = Math.atan2(dy, dx);
angle += Math.PI / 2;
}
function update() {
if (keys[38] && !keys[37] && !keys[39]) {
player.posy += player.speed;
}
if (keys[40] && !keys[37] && !keys[39]) {
player.posy -= player.speed;
}
if (keys[37] && !keys[38] && !keys[40]) {
player.posx += player.speed;
}
if (keys[39] && !keys[38] && !keys[40]) {
player.posx -= player.speed;
}
if (keys[38] && keys[37]) {
player.posy += player.speedDiag;
player.posx += player.speedDiag;
}
if (keys[38] && keys[39]) {
player.posy += player.speedDiag;
player.posx -= player.speedDiag;
}
if (keys[40] && keys[37]) {
player.posy -= player.speedDiag;
player.posx += player.speedDiag;
}
if (keys[40] && keys[39]) {
player.posy -= player.speedDiag;
player.posx -= player.speedDiag;
}
if (keys[82]) {
reload();
}
updateAngle();
}
player.heal = 100
function draw() {
ctx.clearRect(0, 0, canvas.width, canvas.height);
ctx.fillStyle = "black";
ctx.fillRect(0, 0, canvas.width, canvas.height);
ctx.save();
ctx.translate(player.x, player.y);
ctx.rotate(angle);
if (player.reloading == false) {
ctx.drawImage(player.image, -player.width / 2, -player.height + 45 / 2, player.width, player.height);
} else {
ctx.drawImage(player.reloadingImage, -player.width / 2, -player.height + 45 / 2, player.width, player.height);
}
if (shotLightVisible) {
ctx.drawImage(player.shotLightImage, -player.width + 65 / 2, -player.height / 2 - 42, 20, 20);
}
ctx.restore();
ctx.fillStyle = "rgba(" + String(255 - 2.55 * player.heal) + ", " + String(255 - (255 - 2.55 * player.heal)) + ", 0)";
ctx.fillRect((player.x - (player.width / 2) - 19) + ((40) - 0.52 * (player.heal / 1.3)), player.y + 40, player.heal / 1.3, 4);
ctx.drawImage(explosive.baril1.image, explosive.baril1.posx - player.posx, explosive.baril1.posy - player.posy, explosive.baril1.width, explosive.baril1.height)
ctx.drawImage(explosive.baril2.image, explosive.baril2.posx - player.posx, explosive.baril2.posy - player.posy, explosive.baril2.width, explosive.baril2.height)
if (player.heal <= 0) {
menu();
}
for (var i = 0; i < bullets.length; i++) {
var bullet = bullets[i];
ctx.save();
ctx.translate(bullet.x, bullet.y);
ctx.rotate(Math.atan2(bullet.vy, bullet.vx) + Math.PI / 2);
ctx.drawImage(player.bulletImg, -1, 0, 2, 34);
ctx.restore();
bullet.x += bullet.vx;
bullet.y += bullet.vy;
if (Math.sqrt(Math.pow(bullet.x - player.x, 2) + Math.pow(bullet.y - player.y, 2)) >= 1000) {
bullets.splice(i, 1);
i--;
}
}
}
var bulletsNumber = 30;
var AK47Reloadsound = new Audio("./sounds/AK-47 reloading.mp3");
function reload() {
player.reloading = true;
AK47Reloadsound.play();
setTimeout(function () {
bulletsNumber = 30;
player.reloading = false;
}, 3000)
}
document.addEventListener("mousedown", function () {
var currentTime = Date.now();
var timeSinceLastFire = currentTime - lastFireTime;
if (timeSinceLastFire >= fireRate) {
if (bulletsNumber > 0 && player.reloading == false) {
var AK47sound = new Audio("./sounds/AK-47.mp3");
AK47sound.play();
shotLightVisible = true;
setTimeout(function () {
shotLightVisible = false;
}, 50);
lastFireTime = currentTime;
var bulletSpeed = 14;
var dx = mouse.x - player.x;
var dy = mouse.y - player.y;
var bulletVX = bulletSpeed * Math.cos(Math.atan2(dy, dx));
var bulletVY = bulletSpeed * Math.sin(Math.atan2(dy, dx));
var bullet = {
x: player.x,
y: player.y,
vx: bulletVX,
vy: bulletVY
};
bullet.x += bullet.vx * 10;
bullet.y += bullet.vy * 10;
bullets.push(bullet);
lastFireTime = currentTime;
bulletsNumber -= 1
} else if (bulletsNumber <= 0) {
if (player.reloading == false) {
reload();
}
}
}
clearInterval(shootIntervalId);
shootIntervalId = setInterval(function () {
var currentTime = Date.now();
var timeSinceLastFire = currentTime - lastFireTime;
if (timeSinceLastFire >= fireRate) {
if (bulletsNumber > 0 && player.reloading == false) {
var AK47sound = new Audio("./sounds/AK-47.mp3");
AK47sound.play();
shotLightVisible = true;
setTimeout(function () {
shotLightVisible = false;
}, 50);
lastFireTime = currentTime;
var bulletSpeed = 14;
var dx = mouse.x - player.x;
var dy = mouse.y - player.y;
var bulletVX = bulletSpeed * Math.cos(Math.atan2(dy, dx));
var bulletVY = bulletSpeed * Math.sin(Math.atan2(dy, dx));
var bullet = {
x: player.x,
y: player.y,
vx: bulletVX,
vy: bulletVY
};
bullet.x += bullet.vx * 10;
bullet.y += bullet.vy * 10;
bullets.push(bullet);
bulletsNumber -= 1
} else if (bulletsNumber <= 0) {
if (player.reloading == false) {
reload();
}
}
}
}, fireRate);
});
document.addEventListener("mouseup", function () {
clearInterval(shootIntervalId);
});
function loop() {
update();
draw();
requestAnimationFrame(loop);
}
loop();
Comment faire pour que les barils captent les balles qui les percutent et exécutent ```// le code``` ?