Code qui ne fonctionne pas

Fermé
Rub00 Messages postés 2 Date d'inscription vendredi 19 mai 2023 Statut Membre Dernière intervention 20 mai 2023 - 19 mai 2023 à 17:46
 Rub00 - 20 mai 2023 à 19:25

J'ai écrit un code en JS/HTML pour creer un petit jeu dans canvas (je débute),mais quand je clique sur des boutons prévus pour faire avancer un petit carré, rien ne se passe et je n'arrive pas a comprendre pkt. Pouvez vous m'aider?

Le code :

<!DOCTYPE html>
<html>
    <head>
        <title>Page Title</title>
    </head>
    <body>
        <canvas id="canvas"></canvas>
        <script>
var canvas=document.getElementById("canvas");
var ctx=canvas.getContext("2d");

//var
var c={
    x:10,
    y:110,
    w:20,
    h:20,
    isjumping:false,
}

var lPress=false;
var rPress=false;

//detection touches
function keyDown(event){
    if (event.keyCode === 37){
        lPress = true; }
    else if (event.keyCode === 39){
        rPress = true; }
}

function keyUp(event){
    if (event.keyCode === 37){
        lPress = false; }
    else if (event.keyCode === 39){
        rPress = false; }
}

//update

function update(){
    clear();
    
//dessiner carre 
ctx.fillStyle="blue";
ctx.fillRect(c.x,c.y,c.w,c.h);

//conditions et deroulement du jeu
if (lPress){
    c.x-=5
}
else if (rPress){
    c.x+=5
}

requestAnimationFrame(update);
}

//eventListener
document.addEventListener("keydown",keyDown);
document.addEventListener("keyup",keyUp);

//les fonctions
function clear(){
ctx.clearRect(0,0,canvas.width,canvas.height)
}

function bTL(){
    lPress=true;
}

function bTR(){
    rPress=true;
}

function bTLUp(){
    lPress=false;
}
function bTRUp(){
    rPress=false;
}

update();
            
        </script>

<button onmousedown="bTL()" onmouseup="bTLUp()">Left</button>
<button onmousedown="bTR()" onmouseup="bTRUp()">Right</button>
    </body>
</html>

2 réponses

hypothetix Messages postés 197 Date d'inscription dimanche 19 janvier 2020 Statut Membre Dernière intervention 24 octobre 2024 55
20 mai 2023 à 10:45

Bonjour Rub00,

Sans aucune modification, ton code fonctionne dans Chrome et Firefox.

Comment teste-tu ton code ?
Sur ta page  clic droit puis Inspect et regarde si tu as des messages dans la console.


0
Rub00 Messages postés 2 Date d'inscription vendredi 19 mai 2023 Statut Membre Dernière intervention 20 mai 2023
20 mai 2023 à 10:51

Je teste dans une application (sololearn) parce que il y a des aides et les erreurs sont bien expliquée (quand il y en a), mais du coup je ne peux pas tester dans chrome sans un vrai éditeur.

0
hypothetix Messages postés 197 Date d'inscription dimanche 19 janvier 2020 Statut Membre Dernière intervention 24 octobre 2024 55 > Rub00 Messages postés 2 Date d'inscription vendredi 19 mai 2023 Statut Membre Dernière intervention 20 mai 2023
Modifié le 20 mai 2023 à 11:46

je viens d'essayer dans :

https://www.sololearn.com/compiler-playground/html

Et cela fonctionne aussi.

Donc je suppose que cela vient de ton appli.

Tu utilises sur un pc windows ou un mobile ou .... ?

je ne peux pas tester dans chrome sans un vrai éditeur
il suffit de bloc-notes et d'enregistrer le fichier avec l'extention .html

0
Rub00 > hypothetix Messages postés 197 Date d'inscription dimanche 19 janvier 2020 Statut Membre Dernière intervention 24 octobre 2024
20 mai 2023 à 19:25

je suis sur mobile Android ,mais je pourrais tester sur pc dans quelques jours (quand il sera réparé) donc oui je pense aussi que le probleme vient de l'appli mobile

1

Salut,

en regardant vite fait parce que je n'ai pas plus de temps j'ai vu déjà ça:

document.addEventListener("keydown",keyDown);
document.addEventListener("keyup",keyUp);

Rien ne choque? Les deux fonctions utilisées (pas des noms terribles d'aileurs et source d'erreur facile) attendent un paramètre et il n'y en a pas.

Donc déjà ça devrait plutôt ressembler à ça:

document.addEventListener("keydown",keyDown(e) );

idem pour l'autre. Pas sûr qu'il y ait pas d'autres erreurs.

-3