Bonjour,
 
Je suis débutante en javascript et je dois réaliser un pong en javascript.
J'y suis arrivée grâce à un tuto et après de nombreuses difficultées mais en voici une de plus que je n'arrive pas à résoudre. Mon code fonctionne sur tout les navigateurs sauf sur firefox.
 
Donc voici mon code:
 
Code Javascript :
 
//variables
var GAME_BAR_WIDTH = 80;
var GAME_BAR_HEIGHT = 10;
var PXL_DEPLA = 20;
var ZONE_GAME_WIDTH = 800;
var ZONE_GAME_HEIGHT = 500;
var COLOR_BALL = "#fff";
var SIZE_BALL = 8;
var SPEED_BALL = 2;
 
 
 
var barX; // X position of the bar change with keypad
var barY; // Y position of the bar don't change
var context;
var ballX ;
var ballY = 150;
var dirBallX = 0;
var dirBallY = 1;
var loop = setInterval(refreshGame);
 
 
window.addEventListener('load', function () {
// Get canvas object
var elem = document.getElementById('canvasElem');
if (!elem || !elem.getContext) {
return;
}
 
// Get context 2D
context = elem.getContext('2d');
if (!context) {
return;
}
 
//Initialisation of variables
ZONE_GAME_WIDTH = elem.width;
ZONE_GAME_HEIGHT = elem.height;
ballX = Math.random()*ZONE_GAME_WIDTH;
barX = (ZONE_GAME_WIDTH/2)-(GAME_BAR_WIDTH/2);
barY = (ZONE_GAME_HEIGHT-GAME_BAR_HEIGHT);
 
//Initialisation of game
createContext(context);
 
 
 
// Events
window.document.onkeydown = checkDepla;
 
 
}, false);
 
 
function refreshGame() {
 
// Clear zone
clearContext(context, 0, ZONE_GAME_WIDTH, 0, ZONE_GAME_HEIGHT);
 
// Get all again
 
 
// Get the bar again
context.fillStyle = "#fff";
context.fillRect(barX,barY,GAME_BAR_WIDTH,GAME_BAR_HEIGHT);
 
// New position of the ball
 
if ( (ballX + dirBallX * SPEED_BALL) > ZONE_GAME_WIDTH) dirBallX = -1;
else if ( (ballX + dirBallX * SPEED_BALL) < 0) dirBallX = 1;
if ( (ballY + dirBallY * SPEED_BALL) > ZONE_GAME_HEIGHT) {ballY = 0;
//position on X
ballX = (Math.random()*ZONE_GAME_WIDTH);}
else {
if ( (ballY + dirBallY * SPEED_BALL) < 0) dirBallY = 1;
else {
if ( ((ballY + dirBallY * SPEED_BALL) > (ZONE_GAME_HEIGHT - GAME_BAR_HEIGHT)) && ((ballX + dirBallX * SPEED_BALL) >= barX) && ((ballX + dirBallX * SPEED_BALL) <= (barX+GAME_BAR_WIDTH))) {
dirBallY = -1;
dirBallX = 2*(ballX-(barX+GAME_BAR_WIDTH/2))/GAME_BAR_WIDTH;
}
}
}
 
 
ballX += dirBallX * SPEED_BALL;
ballY += dirBallY * SPEED_BALL;
 
// Get the ball
context.fillStyle = COLOR_BALL;
context.beginPath();
context.arc(ballX, ballY, SIZE_BALL, 0, Math.PI*2, true);
context.closePath();
context.fill();
 
 
}
 
function checkDepla(e) {
// Right Key
if (e.keyCode == 39) {
if ( (barX+PXL_DEPLA+GAME_BAR_WIDTH) <= ZONE_GAME_WIDTH ) barX += PXL_DEPLA;
}
// Left Key
else if (e.keyCode == 37) {
if ( ((barX-PXL_DEPLA)) >= 0 ) barX -= PXL_DEPLA;
}
 
 
}
 
 
 
 
function clearContext(context, startwidth, contextwidth, startheight, contextheight) {
context.clearRect(startwidth, startheight, contextwidth, contextheight);
}
 
// Get context
function createContext(context) {}
 
 
 
 
 
Merci de m'aider à résoudre ce problème ça devient limite urgent.

Pour plus de clarté, utilisez les balises [ fixed ] et [ /fixed ], sans espace, autour de votre code, ou [ cpp ] et [ /cpp ].
 

Il faudrait être plus précis, et rechercher la partie du code, ou mieux la ligne du code qui ne marche pas. Donc, il faudrait débugguer, ce qui se fait en suivant le programme pas à pas, parfois en ajoutant des affichages de variables juste pour des tests.
 
Dans votre programme, la gestion des touches est réalisée par une partie de code qui ne convient que pour Windows Explorer. Je pense donc que c'est cette partie qui ne marche pas sous Firefox.
 
Un exemple où les touches marchent bien avec IE et FF est le petit programme de Sokoban que j'ai développé en javascript, http://olivier.thill.perso.neuf.fr [...] ban_ot.htm, où j'ai utilisé :

Je ne pense pas que ça soit ça.
Et puis la console d"erreur firefox me met "context is undefined"
Mais je ne vois pas comment résoudre ce problème

+1 pour la gestions des touches qui ne va pas marcher sur Firefox.
 
De même : window.document.onkeydown = checkDepla;
Mon avis que ça va pas aller non plus à Firefox.
 
Pour info, ezzza, tu ferais mieux de passer par des libs genre Prototype, script.aculo.us... pour t'éviter de te prendre la tête avec l'aspect cross-browsers

Je suis partie d'un code existant et tout fonctionnait sur firefox même la gestion des touches c'est pour ça que je ne pense pas que ça soit ça le problème

Merci j'ai résolu mon problème en fait il manquait un paramètre de délai sur le Refresh  "  var loop = setInterval(refreshGame);  "
Mais merci quand même et les déplacements au clavier fonctionnent si jamais.