Canvas snake bug event

Question

J'ai fait un jeu de serpents mais quand par exemple je vais à droite et je clique sur & en même temps que je pense qu'il est entré en collision avec lui-même et qu'il est mort.

le code pour le concours complet est:

$(document).keydown(function(e){ 

var key = e.which; 

if(key == "37" && dir!= "right") dir = "left"; 
else if (key == "38" && dir != "down") dir = "up"; 
else if (key == "39" && dir != "left") dir = "right"; 
else if (key == "40" && dir != "up") dir = "down"; 



}) 

J'ai ce code dans une méthode de peinture qui obtient repeint tous les 60ms

var headX = snakeArray[0].x; 
var headY = snakeArray[0].y; 

//directions 
if (dir == "right") headX++; 
else if (dir == "left") headX--; 
if(dir =="up") headY--; 
else if (dir == "down") headY++; 


//game over clause 
if (headX == -1 || headX == w/cellSize || headY == -1 || headY == h/cellSize ||  CheckCollision(headX,headY, snakeArray)) 
{ 
//restart game 
init(); 
return; 
} 

Pour tester le jeu vous-même: http://www.taffatech.com/Snake.html

Answer 1

Ce n'est pas un bug.

Le délai entre chaque trame est si important que vous pouvez facilement générer deux appels de fonction de touche dans une trame.

-> Cela provoque que votre serpent passe d'abord (par exemple) à droite, puis il appuie sur une touche "enfoncée", change de direction vers "bas" et obtient une pression "gauche" avant de se déplacer. Ainsi votre serpent "tourne 180 degrés" dans un cadre et se mange littéralement.

Vous devez vous assurer d'accepter une seule nouvelle direction dans une image et (pour améliorer la jouabilité) mettre en file d'attente les autres touches pressées pour calculer leurs effets dans les images suivantes.