Bonjour, 

J'ai du mal à comprendre pourquoi mon code ne marche pas. En effet, je ne comprends pas pourquoi la condition à la ligne 65 est toujours vraie malgré qu'elle soit censé, lorsque que la "tête" du serpent est sur le bonbon, s’agrandir.

Merci d'avance pour votre aide,

Arnaud 

<script src="canvasFramework.js"></script>
<canvas id="game" height="500px" width="700px"></canvas>
<script>
var canvas = $('#game')[0];
var ctx = canvas.getContext("2d");
var objectSize = f_objectSize(canvas, 15);

var arrowPrev = 39;
var arrow = 39;
var bgColor = "purple";
var blockColor = "blue";
var blockSpace = 4;
var candyColor = "red";
var snake = {coord : []};
snake.coord = [[1,1],[2,1]];
snake.candy = generateCandy();
window.onload = setInterval(update, 200);

function generateCandy(){
	var x = Math.round(Math.random()*Math.round(canvas.width/objectSize));
	var y = Math.round(Math.random()*Math.round(canvas.height/objectSize));
	candy = [x,y];
	if(snake.coord.indexOf(candy) != -1){candy = generateCandy();}
	return candy;
}

function update(){
	ctx.clearRect(0, 0, canvas.width, canvas.height);
	bg(canvas, "purple");
	
	var snakeLast = snake.coord.length - 1;
	
	switch (arrow) {
		case 37: //left
			if(arrowPrev !== 39){snake.coord.push([snake.coord[snakeLast][0]-1,snake.coord[snakeLast][1]]);break} //!== right
			else{arrow = arrowPrev; update();return false;};
		case 39: //right
			if(arrowPrev !== 37){snake.coord.push([snake.coord[snakeLast][0]+1,snake.coord[snakeLast][1]]);break}//!== left
			else{arrow = arrowPrev; update();return false;};
		case 38: //up
			if(arrowPrev !== 40){snake.coord.push([snake.coord[snakeLast][0],snake.coord[snakeLast][1]-1]);break}//!== down
			else{arrow = arrowPrev; update();return false;};
		case 40: //down
			if(arrowPrev !== 38){snake.coord.push([snake.coord[snakeLast][0],snake.coord[snakeLast][1]+1]);break}//!== up
			else{arrow = arrowPrev; update();return false;};
	}
	
	ctx.beginPath(); //candy
	ctx.fillStyle = candyColor; 
	ctx.rect(candy[0] * objectSize + blockSpace/2, candy[1] * objectSize + blockSpace/2, objectSize - blockSpace,objectSize - blockSpace);
	ctx.fill();
	
	for(var i = 0; i < snake.coord.length; i++)
	{
		ctx.beginPath(); 
		ctx.fillStyle = blockColor; 
		ctx.rect(snake.coord[i][0] * objectSize + blockSpace/2, snake.coord[i][1] * objectSize + blockSpace/2, objectSize - blockSpace,objectSize - blockSpace);
		ctx.fill();
	}
	
	console.log(snake.coord[snakeLast]);
	console.log(candy);
	
	arrowPrev = arrow;
	if(snake.coord[snakeLast+1] !== candy){snake.coord.shift();}
	else{candy = generateCandy(); console.log("+1")};
}

function keyListener(){
	arrow = event.keyCode;
}

window.addEventListener("keydown", keyListener);
</script>

Mon fichier canvasFramework.js

window.requestAnimationFrame = window.requestAnimationFrame || window.mozRequestAnimationFrame ||
                              window.webkitRequestAnimationFrame || window.msRequestAnimationFrame;

function $(value)
{
	return document.querySelectorAll(value);
}

function bg(elmt, background)
{
	elmt.style.backgroundColor = background;
}

function f_objectSize(elmt, size)
{
	var heightSize = parseInt(elmt.height)/size;
	var widthSize = parseInt(elmt.width)/size;
	if(heightSize >= widthSize)
	{
		return widthSize;
	}
	else if(heightSize < widthSize)
	{
		return heightSize;
	}
	else
	{
		console.log("Erreur");
	}
}

function unset(array, valueOrIndex){
    var output=[];
    for(var i in array){
        if (i!=valueOrIndex)
            output[i]=array[i];
    }
    return output;
}

-
Edité par ArnaudCournil1 9 octobre 2018 à 20:47:58

Il suffit de remplacer la ligne par l'algo teta c'est pas très compliqué je sais pas si tu connais. Et ton serpent devrait bien mieux fonctionner

D'accord merci je vais essayer. 😁

Si tu as des questions n'hésite pas

Merci du ton aide mais j'iai du mal à comprendre ce qu'est l'algorithme têta et je ne trouve pas de documentation sur internet 🙁, peux tu m'expliquer s'il te plaît ?

Salut

Je n'ai pas spécialement lu ton code, je vois juste que tu compares deux array. En javascript, un array est un objet, et les opérateurs de comparaison ne font que comparer si 2 objets ont la même référence. Dans ton cas cette condition d'égalité est toujours fausse (donc l'inégalité est toujours vraie), car tes 2 arrays sont des instances différentes, même si leur contenu est identique.

Pour vérifier que le contenu de tes 2 arrays est identique, tu dois boucler pour comparer chaque élément.

-
Edité par SpaceIn 10 octobre 2018 à 0:19:03

Bien vu, merci beaucoup 😄