Problème True/False

Fermé
Ludo57440 - Modifié le 10 mai 2018 à 12:10
jordane45 Messages postés 38201 Date d'inscription mercredi 22 octobre 2003 Statut Modérateur Dernière intervention 5 juin 2024 - 10 mai 2018 à 12:13
Bonjour ! J'ai une petite question et j'aimerais juste savoir si vous pouviez identifier mon erreur, je voudrais faire en sorte que lorsque que le personnage se fasse toucher par les obstacles, la fonction qui dessine le bonhomme et qui dessine les obstacles s'arrête, j'ai donc utilisé true/false mais je ne pense pas l'utiliser correctement, voici mon programme :

<html>

<head>

<meta charset= "utf=8"/>

<title> BODYJUMPER </title>

</head>

<body style="margin: 0; overflow: hidden">

<canvas id="bonhomme" style="border: 1px solid #000"></canvas>

<script>

width = window.innerWidth,

height = window.innerHeight;

canvas = document.getElementById("bonhomme"),
context = canvas.getContext("2d");

canvas.width = width;
canvas.height =height;

context.imageSmoothingEnabled= false;

r = 1000,

step = 0,

x = width/4,

y = height-300;

sprites = new Image();

sprites.onload = animate;

sprites.src = "spritesbj.png"; // stickman à 2 étapes : 1e sprite pied en avant (0) / 2e sprite pied en arrière (1) => effet de course


function animate() {

draw();

update();

requestAnimationFrame(animate); // on appelle périodiquement la fonction animate

document.onkeydown=deplacement; // Chrome et Firefox

window.event=deplacement; // Internet Explorer et Edge

}

function draw() {


var s = r/3000;
//context.clearRect(x-200*s, y-550*s, 306*s, 578*s);
context.clearRect(x-250*s, y-570*s, 400*s, 630*s)

drawBonhomme(x, r, Math.floor(step));

}

drawBonhomme = true;
obstacles = true;

function drawBonhomme(x, r, step) {

if (drawBonhomme == true) {
var s = r/3000;

context.drawImage(sprites, 306*step, 0, 306, 578, x-200*s, y-550*s, 306*s, 578*s); }

// dimensions de l'images = 612 x 578

// s est le facteur de rétrecissement

// j'ai utilisé r car l'animation ne se lancait pas si je marquais s = 1/3

}

function update() {

step += 0.09;

if (step >= 2) { // animation à 2 étapes donc step doit être inférieur à 2 ( step = 0 -> 1e sprite / step = 1 -> 2e sprite )

step -= 2; // quand step = 2 on la décrémente de 2 pour recommencer l'animation

}

}

function deplacement(e) {

if(e.keyCode == 40){

y += 10; }

if (y >= height-600) {

y -= 10; }

if(e.keyCode == 38){

y -= 10; }

if (y <= height-10) {

y += 10; }

if(e.keyCode == 39) {

x += 10; }

if (x > width/2.1) {

x -= 10; }


if(e.keyCode == 37) {

x -= 10; }

if (x < 60) {

x += 10; }

}


let score = 0;

 


setInterval(obstacles, 2000); // on créé un nouveau obstacle toutes les 2000 millisecondes soit toutes les 2 secondes
function obstacles() {

z = Math.floor(Math.random() * 599) + 50;
if (obstacles == true){
for (i = width; i >= 0; i-=0.5) { 
setTimeout(MoveObstacle,500,i,z); }
}
} 
function MoveObstacle(xCoord,yCoord)
{
context.clearRect(xCoord+1, yCoord, 50.2, 50); // Lorsqu'un nouvel obstacle est créé, l'ancien est effacé
context.beginPath();
context.rect(xCoord, yCoord, 50, 50); // context.rect(x, y, width, height)
context.fillStyle = "red";
context.fill();
context.closePath();

var xp = x-306/6;
var yp = y-578/3;
var w = 306/3;
var h = 578/3

context.beginPath();
context.rect(x, y, 50, 50);
context.fillStyle = "white";
context.fill();
context.closePath();

context.beginPath();
context.rect(xp, yp, w, h);
context.fillStyle = "white";
context.fill();
context.closePath();


if(xCoord == 0) { //Quand on arrive a l'extrémité gauche de l'écran, on l'efface
context.clearRect(0, yCoord, 50.5, 50); 
score = score +1;}

if (xCoord >= xp + w
|| xCoord + 50 <= xp
|| yCoord >= yp + h
|| yCoord + 50 <= yp) 
{

}
else
{
gameover();
}

}

function gameover() {
drawBonhomme = false;
obstacles = false;
}

context.fillStyle = "black";
context.font = "20px Georgia";
context.fillText("Score: " + score, width/1.5, 50);

</script>

</body>

</html>



EDIT : Ajout des balises de code ..... encore..... (jordane)


Or dès que j'utilise true/false la fonction ne se lance plus du tout alors que mon but initial était de l'arrêter après un contact avec un obstacles.

Pouvez-vous m'aider ?

Merci d'avance !



A voir également:

1 réponse

jordane45 Messages postés 38201 Date d'inscription mercredi 22 octobre 2003 Statut Modérateur Dernière intervention 5 juin 2024 4 675
10 mai 2018 à 12:13
Bonjour,

1 - Pour poster ton code sur le forum ... merci de le faire en utilisant les BALISES DE CODE.
Explications disponibles ici : https://codes-sources.commentcamarche.net/faq/10686-le-nouveau-codes-sources-comment-ca-marche#balises-code

2 -

drawBonhomme = true;

function drawBonhomme(x, r, step) {

Ne nomme pas une variable pareil que le nom d'une fonction.... ça fout le bazar...




Pour le reste... je n'ai pas regardé.

0