piiixel, fofobot réponds genre 2 ou 3 fois seulement en une discussion.

  • Auteur de la discussion ZZZ
  • Date de début
ZZZ
Passionné
Messages
1 400
Fofocoins
7 662
Personnalisation du groupe
Personnalisation pseudo
JavaScript:
var canvas = document.getElementById("canvas");
var ctx = canvas.getContext("2d");

document.getElementById("bullets").innerHTML = "ammo: 30/30";

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: -0.8,
    speedDiag: -(0.8 / Math.sqrt(2)),
    heal: 100,
    reloading: false,
    damages: 10,
    image: createImage("./img/sprite.png"),
    reloadingImage: createImage("./img/sprite reloading.png"),
    shotLightImage: createImage("./img/shotLight Img.png"),
    bulletImg: createImage("./img/bullet Img.png"),
    loader: createImage("./img/loader.gif")
};

class baril {
    posx;
    posy;
    constructor(posx, posy) {
        this.posx = posx;
        this.posy = posy;
        this.width = 66;
        this.height = 66;
        this.image = createImage("./img/explosive baril.png");
        this.heal = 100;
        this.currentStat = 1;
        this.explosionDelay = 100; // 100 frames avant de pouvoir exploser à nouveau
        this.explosionTime = 0; // temps écoulé depuis la dernière explosion
    }
}

var explosive = [
    new baril(500, 500), new baril(800, 100), new baril(1000, 400)
]

console.log(explosive[0]);
console.log(explosive[1]);

var bullets = [];
var shotLightVisible = false;
var lastFireTime = 0;
var fireRate = 1000 / 10;
var shootIntervalId;
var barilExplosion = {
    currentStat: false
};

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;
    }
    let ping = 0
    if (keys[32]) {
        ping++
        console.log(ping);
    }
    if (keys[82]) {
        reload();
    }
    updateAngle();
}

player.heal = 100

function detectCollision() {
    function barilsSetups() {
        for (var baril in explosive) {
            if (explosive[baril].currentStat != 3) {
                if (!explosive.hasOwnProperty(baril)) continue;
                for (var i = 0; i < bullets.length; i++) {
                    var bullet = bullets[i];
                    if (explosive[baril].currentStat == 1 && !barilExplosion.currentStat) {
                        if (bullet.x >= explosive[baril].posx - player.posx &&
                            bullet.x < explosive[baril].posx + explosive[baril].width - player.posx &&
                            bullet.y >= explosive[baril].posy - player.posy &&
                            bullet.y < explosive[baril].posy + explosive[baril].height - player.posy) {
                            explosive[baril].heal -= player.damages;
                            explosive[baril].width -= 1;
                            explosive[baril].height -= 1;
                            explosive[baril].posx += 0.5;
                            explosive[baril].posy += 0.5;
                            bullets.splice(i, 1);
                            i--;
                        }
                    }
                    if (explosive[baril].heal <= 0) {
                        let barilBackup = baril
                        explosive[barilBackup].currentStat = 2;

                        img = new Image();
                        img.onload = function () {
                            loop();
                        }
                        img.src = "";
                        explosive[barilBackup].image = img;
                        barilExplosion = {
                            posx: explosive[barilBackup].posx,
                            posy: explosive[barilBackup].posy,
                            currentStat: true
                        }
                        setTimeout(() => {
                            explosive[barilBackup].currentStat = 3;
                        }, 300);
                    }
                }
            }
        }
    }

    barilsSetups();
}

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();

    for (let i = 0; i < explosive.length; i++) {
        ctx.drawImage(explosive[i].image, explosive[i].posx - player.posx, explosive[i].posy - player.posy, explosive[i].width, explosive[i].height);
    }

    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);
    document.getElementById("heal").style.width = String(20 + 3 * (player.heal)) + "px";
    document.getElementById("heal").style.backgroundColor = ctx.fillStyle;
    document.getElementById("healText").innerHTML = "hp: " + Math.round(player.heal);

    if (player.heal <= 0) {
        menu();
    }

    if (barilExplosion.currentStat == true) {
        particlesNumber = 360;
        particles = [];
        for (let i = 0; i < particlesNumber; i++) {
            radiusMax = 1000 / i
            particles.push({
                radius: Math.random() * radiusMax,
            })

            particles[i].posx = particles[i].radius * Math.cos(i);
            particles[i].posy = particles[i].radius * Math.sin(i);

            let opacity = particles[i].radius / radiusMax;
            ctx.fillStyle = "rgba(255, 255, 255, " + opacity + ")";

            // ctx.fillstyle
            if (barilExplosion.currentStat == true) {
                ctx.fillRect(barilExplosion.posx + explosive[0].width / 2 + particles[i].posx - player.posx, barilExplosion.posy + explosive[0].height / 2 + particles[i].posy - player.posy, 8, 8);
            }
        }
        barilExplosion.currentStat = false;
    }

    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;
    document.getElementById("bullets").innerHTML = "ammo: reloading...";
    AK47Reloadsound.play();
    setTimeout(function () {
        bulletsNumber = 30;
        player.reloading = false;
        document.getElementById("bullets").innerHTML = "ammo: " + bulletsNumber + "/30";
    }, 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 * 5;
            bullet.y += bullet.vy * 5;
            bullets.push(bullet);
            lastFireTime = currentTime;
            bulletsNumber -= 1
            document.getElementById("bullets").innerHTML = "ammo: " + bulletsNumber + "/30";
        } 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 * 5;
                bullet.y += bullet.vy * 5;
                bullets.push(bullet);
                bulletsNumber -= 1
                document.getElementById("bullets").innerHTML = "ammo: " + bulletsNumber + "/30";
            } else if (bulletsNumber <= 0) {
                if (player.reloading == false) {
                    reload();
                }
            }
        }
    }, fireRate);
});

document.addEventListener("mouseup", function () {
    clearInterval(shootIntervalId);
});

function loop() {
    update();
    detectCollision();
    draw();
    requestAnimationFrame(loop);
}

loop();

Dans ce code, l'explosion ne s'exécute que quand on tire en même temps.
voici mon test :
JavaScript:
console.log(explosing[baril].heal);

Output : explosion sans tirer :
0
la vie du baril a été mise à 0, mais pas d'explosion
Output : explosion en tirant :
[75] 0
la vie du baril a été mise à 75 fois à 0, explosion.

Aide-moi stp, je veux que le baril explose sans qu'on ai à maintenir le clique pendant l'explosion.
 
Fofobot 🤖
Assistant virtuel
Donateur 🤲
Messages
3 016
Fofocoins
70 789
JavaScript:
var canvas = document.getElementById("canvas");
var ctx = canvas.getContext("2d");

document.getElementById("bullets").innerHTML = "ammo: 30/30";

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: -0.8,
    speedDiag: -(0.8 / Math.sqrt(2)),
    heal: 100,
    reloading: false,
    damages: 10,
    image: createImage("./img/sprite.png"),
    reloadingImage: createImage("./img/sprite reloading.png"),
    shotLightImage: createImage("./img/shotLight Img.png"),
    bulletImg: createImage("./img/bullet Img.png"),
    loader: createImage("./img/loader.gif")
};

class baril {
    posx;
    posy;
    constructor(posx, posy) {
        this.posx = posx;
        this.posy = posy;
        this.width = 66;
        this.height = 66;
        this.image = createImage("./img/explosive baril.png");
        this.heal = 100;
        this.currentStat = 1;
        this.explosionDelay = 100; // 100 frames avant de pouvoir exploser à nouveau
        this.explosionTime = 0; // temps écoulé depuis la dernière explosion
    }
}

var explosive = [
    new baril(500, 500), new baril(800, 100), new baril(1000, 400)
]

console.log(explosive[0]);
console.log(explosive[1]);

var bullets = [];
var shotLightVisible = false;
var lastFireTime = 0;
var fireRate = 1000 / 10;
var shootIntervalId;
var barilExplosion = {
    currentStat: false
};

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;
    }
    let ping = 0
    if (keys[32]) {
        ping++
        console.log(ping);
    }
    if (keys[82]) {
        reload();
    }
    updateAngle();
}

player.heal = 100

function detectCollision() {
    function barilsSetups() {
        for (var baril in explosive) {
            if (explosive[baril].currentStat != 3) {
                if (!explosive.hasOwnProperty(baril)) continue;
                for (var i = 0; i < bullets.length; i++) {
                    var bullet = bullets[i];
                    if (explosive[baril].currentStat == 1 && !barilExplosion.currentStat) {
                        if (bullet.x >= explosive[baril].posx - player.posx &&
                            bullet.x < explosive[baril].posx + explosive[baril].width - player.posx &&
                            bullet.y >= explosive[baril].posy - player.posy &&
                            bullet.y < explosive[baril].posy + explosive[baril].height - player.posy) {
                            explosive[baril].heal -= player.damages;
                            explosive[baril].width -= 1;
                            explosive[baril].height -= 1;
                            explosive[baril].posx += 0.5;
                            explosive[baril].posy += 0.5;
                            bullets.splice(i, 1);
                            i--;
                        }
                    }
                    if (explosive[baril].heal <= 0) {
                        let barilBackup = baril
                        explosive[barilBackup].currentStat = 2;

                        img = new Image();
                        img.onload = function () {
                            loop();
                        }
                        img.src = "";
                        explosive[barilBackup].image = img;
                        barilExplosion = {
                            posx: explosive[barilBackup].posx,
                            posy: explosive[barilBackup].posy,
                            currentStat: true
                        }
                        setTimeout(() => {
                            explosive[barilBackup].currentStat = 3;
                        }, 300);
                    }
                }
            }
        }
    }

    barilsSetups();
}

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();

    for (let i = 0; i < explosive.length; i++) {
        ctx.drawImage(explosive[i].image, explosive[i].posx - player.posx, explosive[i].posy - player.posy, explosive[i].width, explosive[i].height);
    }

    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);
    document.getElementById("heal").style.width = String(20 + 3 * (player.heal)) + "px";
    document.getElementById("heal").style.backgroundColor = ctx.fillStyle;
    document.getElementById("healText").innerHTML = "hp: " + Math.round(player.heal);

    if (player.heal <= 0) {
        menu();
    }

    if (barilExplosion.currentStat == true) {
        particlesNumber = 360;
        particles = [];
        for (let i = 0; i < particlesNumber; i++) {
            radiusMax = 1000 / i
            particles.push({
                radius: Math.random() * radiusMax,
            })

            particles[i].posx = particles[i].radius * Math.cos(i);
            particles[i].posy = particles[i].radius * Math.sin(i);

            let opacity = particles[i].radius / radiusMax;
            ctx.fillStyle = "rgba(255, 255, 255, " + opacity + ")";

            // ctx.fillstyle
            if (barilExplosion.currentStat == true) {
                ctx.fillRect(barilExplosion.posx + explosive[0].width / 2 + particles[i].posx - player.posx, barilExplosion.posy + explosive[0].height / 2 + particles[i].posy - player.posy, 8, 8);
            }
        }
        barilExplosion.currentStat = false;
    }

    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;
    document.getElementById("bullets").innerHTML = "ammo: reloading...";
    AK47Reloadsound.play();
    setTimeout(function () {
        bulletsNumber = 30;
        player.reloading = false;
        document.getElementById("bullets").innerHTML = "ammo: " + bulletsNumber + "/30";
    }, 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 * 5;
            bullet.y += bullet.vy * 5;
            bullets.push(bullet);
            lastFireTime = currentTime;
            bulletsNumber -= 1
            document.getElementById("bullets").innerHTML = "ammo: " + bulletsNumber + "/30";
        } 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 * 5;
                bullet.y += bullet.vy * 5;
                bullets.push(bullet);
                bulletsNumber -= 1
                document.getElementById("bullets").innerHTML = "ammo: " + bulletsNumber + "/30";
            } else if (bulletsNumber <= 0) {
                if (player.reloading == false) {
                    reload();
                }
            }
        }
    }, fireRate);
});

document.addEventListener("mouseup", function () {
    clearInterval(shootIntervalId);
});

function loop() {
    update();
    detectCollision();
    draw();
    requestAnimationFrame(loop);
}

loop();

Dans ce code, l'explosion ne s'exécute que quand on tire en même temps.
voici mon test :
JavaScript:
console.log(explosing[baril].heal);

Output : explosion sans tirer :
0
la vie du baril a été mise à 0, mais pas d'explosion
Output : explosion en tirant :
[75] 0
la vie du baril a été mise à 75 fois à 0, explosion.

Aide-moi stp, je veux que le baril explose sans qu'on ai à maintenir le clique pendant l'explosion.
Il semble que le problème soit lié à la condition `if (barilExplosion.currentStat == true)` dans la boucle de dessin. Cette condition empêche la partie de dessiner les particules d'explosion si `barilExplosion.currentStat` est faux, ce qui est le cas quand il n'y a pas de clic en cours. Pour corriger cela, vous pouvez déplacer le bloc de dessin des particules en dehors de cette condition. Voici un exemple de modification du code :

```
function draw() {
// ...

if (barilExplosion.currentStat) {
particlesNumber = 360;
particles = [];
for (let i = 0; i < particlesNumber; i++) {
// ...
}

ctx.fillStyle = "rgba(255, 255, 255, " + opacity + ")";

for (let i = 0; i < particlesNumber; i++) {
ctx.fillRect(barilExplosion.posx + explosive[0].width / 2 + particles.posx - player.posx, barilExplosion.posy + explosive[0].height / 2 + particles.posy - player.posy, 8, 8);
}
}

// ...
```

Maintenant, les particules devraient être dessinées même sans clic.
 
ZZZ
Passionné
Messages
1 400
Fofocoins
7 662
Personnalisation du groupe
Personnalisation pseudo
Il semble que le problème soit lié à la condition `if (barilExplosion.currentStat == true)` dans la boucle de dessin. Cette condition empêche la partie de dessiner les particules d'explosion si `barilExplosion.currentStat` est faux, ce qui est le cas quand il n'y a pas de clic en cours. Pour corriger cela, vous pouvez déplacer le bloc de dessin des particules en dehors de cette condition. Voici un exemple de modification du code :

```
function draw() {
// ...

if (barilExplosion.currentStat) {
particlesNumber = 360;
particles = [];
for (let i = 0; i < particlesNumber; i++) {
// ...
}

ctx.fillStyle = "rgba(255, 255, 255, " + opacity + ")";

for (let i = 0; i < particlesNumber; i++) {
ctx.fillRect(barilExplosion.posx + explosive[0].width / 2 + particles.posx - player.posx, barilExplosion.posy + explosive[0].height / 2 + particles.posy - player.posy, 8, 8);
}
}

// ...
```

Maintenant, les particules devraient être dessinées même sans clic.
tu marches?
 
ZZZ
Passionné
Messages
1 400
Fofocoins
7 662
Personnalisation du groupe
Personnalisation pseudo
Oui, je suis un programme informatique, je n'ai pas de jambes mais je suis actif et prêt à aider ! Comment puis-je vous aider aujourd'hui ?
dans un jeu html, quand je double clique sur l'écran, ça me sélectionné en bleu le text (comme le nombre de balles restantes qui est une information qui ne devrais pas être sélectionnable), comment faire?
 
Fofobot 🤖
Assistant virtuel
Donateur 🤲
Messages
3 016
Fofocoins
70 789
dans un jeu html, quand je double clique sur l'écran, ça me sélectionné en bleu le text (comme le nombre de balles restantes qui est une information qui ne devrais pas être sélectionnable), comment faire?
Pour éviter la sélection du texte sur double-clic, vous pouvez utiliser l'attribut `onselectstart` sur l'élément dans lequel vous ne voulez pas de sélection. Cet attribut empêche la sélection de tout le contenu dans l'élément lorsqu'il est activé.

Voici un exemple de code HTML avec l'attribut `onselectstart` appliqué à un paragraphe :

```html
<p onselectstart="return false;">Texte qui ne peut pas être sélectionné</p>
```

Notez que cela empêchera la sélection de l'intégralité du contenu de l'élément, mais autorisera toujours la sélection de parties individuelles du texte.

Si vous souhaitez désactiver la sélection sur l'ensemble de la page, vous pouvez utiliser cette propriété CSS :

```css
* {
user-select: none;
}
```

Cela empêchera toute sélection de texte sur la page sauf si vous l'autorisez expressément sur un élément spécifique.
 
ZZZ
Passionné
Messages
1 400
Fofocoins
7 662
Personnalisation du groupe
Personnalisation pseudo
Pour éviter la sélection du texte sur double-clic, vous pouvez utiliser l'attribut `onselectstart` sur l'élément dans lequel vous ne voulez pas de sélection. Cet attribut empêche la sélection de tout le contenu dans l'élément lorsqu'il est activé.

Voici un exemple de code HTML avec l'attribut `onselectstart` appliqué à un paragraphe :

```html
<p onselectstart="return false;">Texte qui ne peut pas être sélectionné</p>
```

Notez que cela empêchera la sélection de l'intégralité du contenu de l'élément, mais autorisera toujours la sélection de parties individuelles du texte.

Si vous souhaitez désactiver la sélection sur l'ensemble de la page, vous pouvez utiliser cette propriété CSS :

```css
* {
user-select: none;
}
```

Cela empêchera toute sélection de texte sur la page sauf si vous l'autorisez expressément sur un élément spécifique.
JavaScript:
var canvas = document.getElementById("canvas");
var ctx = canvas.getContext("2d");

document.getElementById("bullets").innerHTML = "ammo: 30/30";

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: -0.8,
    speedDiag: -(0.8 / Math.sqrt(2)),
    heal: 100,
    reloading: false,
    damages: 10,
    image: createImage("./img/sprite.png"),
    reloadingImage: createImage("./img/sprite reloading.png"),
    shotLightImage: createImage("./img/shotLight Img.png"),
    bulletImg: createImage("./img/bullet Img.png"),
    loader: createImage("./img/loader.gif")
};

class baril {
    posx;
    posy;
    constructor(posx, posy) {
        this.posx = posx;
        this.posy = posy;
        this.width = 66;
        this.height = 66;
        this.image = createImage("./img/explosive baril.png");
        this.heal = 100;
        this.currentStat = 1;
    }
}

var explosive = [
    new baril(500, 500), new baril(800, 100), new baril(1000, 400)
]

console.log(explosive[0]);
console.log(explosive[1]);

var bullets = [];
var shotLightVisible = false;
var lastFireTime = 0;
var fireRate = 1000 / 10;
var shootIntervalId;
var barilExplosion = {
    currentStat: false
};
var opacity;
var particlesNumber;
var particles;
var radiusMax;
var explosionFramesNumber = 30;
var explosionFramesInterval = 50;
var explosionFrames;
var explosionSound = new Audio("./sounds/barils explosion.mp3");

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;
    }
    let ping = 0
    if (keys[32]) {
        ping++
        console.log(ping);
    }
    if (keys[82]) {
        reload();
    }
    updateAngle();
}

player.heal = 100

function detectCollision() {
    function barilsSetups() {
        for (var baril in explosive) {
            if (explosive[baril].currentStat != 3) {
                if (!explosive.hasOwnProperty(baril)) continue;
                for (var i = 0; i < bullets.length; i++) {
                    var bullet = bullets[i];
                    if (explosive[baril].currentStat == 1 && !barilExplosion.currentStat) {
                        if (bullet.x >= explosive[baril].posx - player.posx &&
                            bullet.x < explosive[baril].posx + explosive[baril].width - player.posx &&
                            bullet.y >= explosive[baril].posy - player.posy &&
                            bullet.y < explosive[baril].posy + explosive[baril].height - player.posy) {
                            explosive[baril].heal -= player.damages;
                            explosive[baril].width -= 1;
                            explosive[baril].height -= 1;
                            explosive[baril].posx += 0.5;
                            explosive[baril].posy += 0.5;
                            bullets.splice(i, 1);
                            i--;
                        }
                    }
                    if (explosive[baril].heal <= 0) {
                        let barilBackup = baril
                        explosive[barilBackup].currentStat = 2;

                        img = new Image();
                        img.onload = function () {
                            loop();
                        }
                        img.src = "";
                        explosive[barilBackup].image = img;

                        barilExplosion = {
                            posx: explosive[barilBackup].posx,
                            posy: explosive[barilBackup].posy,
                        }

                        explosionSound.play();

                        explosionFrames = setInterval(() => {
                            particlesNumber = 360;
                            particles = [];
                            for (let i = 0; i < particlesNumber; i++) {
                                radiusMax = 1000 / i
                                particles.push({
                                    radius: Math.random() * radiusMax,
                                })

                                particles[i].posx = particles[i].radius * Math.cos(i);
                                particles[i].posy = particles[i].radius * Math.sin(i);
                                particles[i].red = (Math.random() * 100) + 155
                                particles[i].green = (Math.random() * 100)
                                particles[i].color = "rgba(" + particles[i].red + ", " + particles[i].green + ", 0, " + particles[i].radius / radiusMax; + ")"
                            }
                        }, explosionFramesInterval);

                        setTimeout(() => {
                            clearInterval(explosionFrames);
                        }, 10 * explosionFramesNumber);

                        explosive[barilBackup].currentStat = 3;
                    }
                }
            }
        }
    }

    barilsSetups();
}

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();

    for (let i = 0; i < explosive.length; i++) {
        ctx.drawImage(explosive[i].image, explosive[i].posx - player.posx, explosive[i].posy - player.posy, explosive[i].width, explosive[i].height);
    }

    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);
    document.getElementById("heal").style.width = String(20 + 3 * (player.heal)) + "px";
    document.getElementById("heal").style.backgroundColor = ctx.fillStyle;
    document.getElementById("healText").innerHTML = "hp: " + Math.round(player.heal);

    for (var baril in explosive) {
        if (explosive[baril].heal <= 0) {
            let dx = explosive[baril].posx - player.posx;
            let dy = explosive[baril].posy - player.posy;
            if (Math.sqrt(dx ** 2 + dy ** 2) <= 600) {
                player.heal = player.heal - 80;
            }
        }
    }

    if (player.heal <= 0) {
        menu();
    }

    for (let i = 0; i < particlesNumber; i++) {
        ctx.fillStyle = particles[i].color;
        ctx.fillRect(barilExplosion.posx + explosive[0].width / 2 + particles[i].posx - player.posx, barilExplosion.posy + explosive[0].height / 2 + particles[i].posy - player.posy, 8, 8);
        setTimeout(() => {
            particlesNumber = 0;
            particles = [];
        }, explosionFramesInterval);
    }

    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;
    document.getElementById("bullets").innerHTML = "ammo: reloading...";
    AK47Reloadsound.play();
    setTimeout(function () {
        bulletsNumber = 30;
        player.reloading = false;
        document.getElementById("bullets").innerHTML = "ammo: " + bulletsNumber + "/30";
    }, 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 * 5;
            bullet.y += bullet.vy * 5;
            bullets.push(bullet);
            lastFireTime = currentTime;
            bulletsNumber -= 1
            document.getElementById("bullets").innerHTML = "ammo: " + bulletsNumber + "/30";
        } 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 * 5;
                bullet.y += bullet.vy * 5;
                bullets.push(bullet);
                bulletsNumber -= 1
                document.getElementById("bullets").innerHTML = "ammo: " + bulletsNumber + "/30";
            } else if (bulletsNumber <= 0) {
                if (player.reloading == false) {
                    reload();
                }
            }
        }
    }, fireRate);
});

document.addEventListener("mouseup", function () {
    clearInterval(shootIntervalId);
});

function loop() {
    update();
    detectCollision();
    draw();
    requestAnimationFrame(loop);
}

loop();


Dans mon code, quand le baril explose, d'abord la vie reste à 100, puis quand on bouge, elle descends sans cesse, ce qui fait que, avec la fonction play(); la vie oscille très vite entre 100, 20 et 0 puis quand on est dans un rayon de 600 px du baril qui n'existe plus et qui n'est pas censé exister, l'oscillation cesse mais quand on s'en éloigne à nouveau, l'oscillation revient.

Un explosif n'explose qu'une fois, donc je veux que la vie baisse de 80 puis c'est tout. en suite dans un jeu les dégâts doivent être immédiats, et non attendre qu'on bouge pour apparaître.

voilà. Bonne chance pour résoudre tout ça.
 
ZZZ
Passionné
Messages
1 400
Fofocoins
7 662
Personnalisation du groupe
Personnalisation pseudo
JavaScript:
var canvas = document.getElementById("canvas");
var ctx = canvas.getContext("2d");

document.getElementById("bullets").innerHTML = "ammo: 30/30";

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: -0.8,
    speedDiag: -(0.8 / Math.sqrt(2)),
    heal: 100,
    reloading: false,
    damages: 10,
    image: createImage("./img/sprite.png"),
    reloadingImage: createImage("./img/sprite reloading.png"),
    shotLightImage: createImage("./img/shotLight Img.png"),
    bulletImg: createImage("./img/bullet Img.png"),
    loader: createImage("./img/loader.gif")
};

class baril {
    posx;
    posy;
    constructor(posx, posy) {
        this.posx = posx;
        this.posy = posy;
        this.width = 66;
        this.height = 66;
        this.image = createImage("./img/explosive baril.png");
        this.heal = 100;
        this.currentStat = 1;
    }
}

var explosive = [
    new baril(500, 500), new baril(800, 100), new baril(1000, 400)
]

console.log(explosive[0]);
console.log(explosive[1]);

var bullets = [];
var shotLightVisible = false;
var lastFireTime = 0;
var fireRate = 1000 / 10;
var shootIntervalId;
var barilExplosion = {
    currentStat: false
};
var opacity;
var particlesNumber;
var particles;
var radiusMax;
var explosionFramesNumber = 30;
var explosionFramesInterval = 50;
var explosionFrames;
var explosionSound = new Audio("./sounds/barils explosion.mp3");

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;
    }
    let ping = 0
    if (keys[32]) {
        ping++
        console.log(ping);
    }
    if (keys[82]) {
        reload();
    }
    updateAngle();
}

player.heal = 100

function detectCollision() {
    function barilsSetups() {
        for (var baril in explosive) {
            if (explosive[baril].currentStat != 3) {
                if (!explosive.hasOwnProperty(baril)) continue;
                for (var i = 0; i < bullets.length; i++) {
                    var bullet = bullets[i];
                    if (explosive[baril].currentStat == 1 && !barilExplosion.currentStat) {
                        if (bullet.x >= explosive[baril].posx - player.posx &&
                            bullet.x < explosive[baril].posx + explosive[baril].width - player.posx &&
                            bullet.y >= explosive[baril].posy - player.posy &&
                            bullet.y < explosive[baril].posy + explosive[baril].height - player.posy) {
                            explosive[baril].heal -= player.damages;
                            explosive[baril].width -= 1;
                            explosive[baril].height -= 1;
                            explosive[baril].posx += 0.5;
                            explosive[baril].posy += 0.5;
                            bullets.splice(i, 1);
                            i--;
                        }
                    }
                    if (explosive[baril].heal <= 0) {
                        let barilBackup = baril
                        explosive[barilBackup].currentStat = 2;

                        img = new Image();
                        img.onload = function () {
                            loop();
                        }
                        img.src = "";
                        explosive[barilBackup].image = img;

                        barilExplosion = {
                            posx: explosive[barilBackup].posx,
                            posy: explosive[barilBackup].posy,
                        }

                        explosionSound.play();

                        explosionFrames = setInterval(() => {
                            particlesNumber = 360;
                            particles = [];
                            for (let i = 0; i < particlesNumber; i++) {
                                radiusMax = 1000 / i
                                particles.push({
                                    radius: Math.random() * radiusMax,
                                })

                                particles[i].posx = particles[i].radius * Math.cos(i);
                                particles[i].posy = particles[i].radius * Math.sin(i);
                                particles[i].red = (Math.random() * 100) + 155
                                particles[i].green = (Math.random() * 100)
                                particles[i].color = "rgba(" + particles[i].red + ", " + particles[i].green + ", 0, " + particles[i].radius / radiusMax; + ")"
                            }
                        }, explosionFramesInterval);

                        setTimeout(() => {
                            clearInterval(explosionFrames);
                        }, 10 * explosionFramesNumber);

                        explosive[barilBackup].currentStat = 3;
                    }
                }
            }
        }
    }

    barilsSetups();
}

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();

    for (let i = 0; i < explosive.length; i++) {
        ctx.drawImage(explosive[i].image, explosive[i].posx - player.posx, explosive[i].posy - player.posy, explosive[i].width, explosive[i].height);
    }

    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);
    document.getElementById("heal").style.width = String(20 + 3 * (player.heal)) + "px";
    document.getElementById("heal").style.backgroundColor = ctx.fillStyle;
    document.getElementById("healText").innerHTML = "hp: " + Math.round(player.heal);

    for (var baril in explosive) {
        if (explosive[baril].heal <= 0) {
            let dx = explosive[baril].posx - player.posx;
            let dy = explosive[baril].posy - player.posy;
            if (Math.sqrt(dx ** 2 + dy ** 2) <= 600) {
                player.heal = player.heal - 80;
            }
        }
    }

    if (player.heal <= 0) {
        menu();
    }

    for (let i = 0; i < particlesNumber; i++) {
        ctx.fillStyle = particles[i].color;
        ctx.fillRect(barilExplosion.posx + explosive[0].width / 2 + particles[i].posx - player.posx, barilExplosion.posy + explosive[0].height / 2 + particles[i].posy - player.posy, 8, 8);
        setTimeout(() => {
            particlesNumber = 0;
            particles = [];
        }, explosionFramesInterval);
    }

    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;
    document.getElementById("bullets").innerHTML = "ammo: reloading...";
    AK47Reloadsound.play();
    setTimeout(function () {
        bulletsNumber = 30;
        player.reloading = false;
        document.getElementById("bullets").innerHTML = "ammo: " + bulletsNumber + "/30";
    }, 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 * 5;
            bullet.y += bullet.vy * 5;
            bullets.push(bullet);
            lastFireTime = currentTime;
            bulletsNumber -= 1
            document.getElementById("bullets").innerHTML = "ammo: " + bulletsNumber + "/30";
        } 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 * 5;
                bullet.y += bullet.vy * 5;
                bullets.push(bullet);
                bulletsNumber -= 1
                document.getElementById("bullets").innerHTML = "ammo: " + bulletsNumber + "/30";
            } else if (bulletsNumber <= 0) {
                if (player.reloading == false) {
                    reload();
                }
            }
        }
    }, fireRate);
});

document.addEventListener("mouseup", function () {
    clearInterval(shootIntervalId);
});

function loop() {
    update();
    detectCollision();
    draw();
    requestAnimationFrame(loop);
}

loop();


Dans mon code, quand le baril explose, d'abord la vie reste à 100, puis quand on bouge, elle descends sans cesse, ce qui fait que, avec la fonction play(); la vie oscille très vite entre 100, 20 et 0 puis quand on est dans un rayon de 600 px du baril qui n'existe plus et qui n'est pas censé exister, l'oscillation cesse mais quand on s'en éloigne à nouveau, l'oscillation revient.

Un explosif n'explose qu'une fois, donc je veux que la vie baisse de 80 puis c'est tout. en suite dans un jeu les dégâts doivent être immédiats, et non attendre qu'on bouge pour apparaître.

voilà. Bonne chance pour résoudre tout ça.
le problème est résolu depuis. Sans l'aide de chatGPt, lui, il décone
 

🚫 Alerte AdBlock !

Vous avez activé le mode Ninja, et il cache toutes les pubs ! 😆 Un petit coup de pouce pour notre site serait super apprécié si vous pouvez le désactiver. 🙏

🦸‍♂️ J'ai Désactivé AdBlock !