Partage
  • Partager sur Facebook
  • Partager sur Twitter

Gestion de plusieurs évènement simultanément

Sujet résolu
    5 septembre 2018 à 11:04:04

    Bonjour,

    Je suis en train de développer un space invaders en js et à l'heure actuel je suis sur le vaisseau et ses control donc j'arrive sans problème à le déplacer de gauche à droite et set une limite à pas dépasser mon problème viens quand je souhaite tiré un laser j'ai donc utiliser l'event 'keydown' pour les control mais lorsque par exemple je clique sur la touche Q pour me déplacer sur la droite et simultanément sur la barre espace pour tirer mon vaisseau se freeze car il gère le nouvel event.

    Donc comment puis-je faire pour que les deux évènement puissent fonctionner simultanément ? je précise que je développe le jeu en pure JS pour pratiquer et m'améliorer donc pas de jquery ou autre framework/library...

    Voici le bout de code qui gère l'event :

    document.addEventListener('keydown', moveShip);

    j'utilise l'event sur le document, car quand j'ai voulu l'utiliser que sur ma div représentant la surface du jeu sa ne fonctionnait pas :s

    mon vaisseau et laser sont positionner au départ par le CSS s'est ensuite le js qui prend le relais pour pouvoir le déplacer et établir une limite de ma div en utilisant le offsetLeft.

    -
    Edité par GaetanGerard 5 septembre 2018 à 11:04:21

    • Partager sur Facebook
    • Partager sur Twitter
      5 septembre 2018 à 12:40:26

      Hello,

      Pourquoi ne pas rajouter un test rapide pour vérifier si la touche correspond à la barre d'espace ? SI c'est le cas ta fonction s'exécute normalement, sinon tu return immédiatement

      • Partager sur Facebook
      • Partager sur Twitter
      Celui qui croit tout savoir ne sait rien
        5 septembre 2018 à 13:45:42

        salut, oui j'ai déjà tester cela, sa retourne les bonne touche le console log de la barre espace lors du keydown retourne une string avec un espace donc je suppose que s'est bon puisque s'est accompagner d'autre infos !

        Mon problème s'est de les faires fonctionner simultanément s'est un peu bête que le joueur ne puisse plus se déplacer latéralement quand il tire, j'ai un peu regarder à gauche et à droite sur d'autre personne ayant fait un space invaders également mais leur solution sont bien différentes des miennes donc je veux pas m'en servir juste savoir si quelqu'un connait un moyen de les faire fonctionner ensemble ;)

        • Partager sur Facebook
        • Partager sur Twitter
          5 septembre 2018 à 14:55:10

          Bonjour,

          Tu pourrais utiliser une combinaison de keydown et keyup et faire en sorte que lorsque la touche espace (par exemple) est en keydown (touche enfoncée), les lasers tirs en continue, mais qu'ils s'arrêtent dès que le keyup se déclenche (touche relâchée).

          Démo.

          • Partager sur Facebook
          • Partager sur Twitter
            5 septembre 2018 à 15:21:15

            Salut

            En théorie, si tu te fais une animation interactive, il faut utiliser requestAnimationFrame.

            Dans ce cas, pour avoir des contrôles fluides, les eventlistener ne doivent être utilisés que pour renseigner dans des variables quelles touches du clavier/souris sont enfoncées, la position de la souris etc. Les conséquences de ces contrôles doivent se produire dans la fonction appelée par requestAnimationFrame, en fonction du deltaT entre la frame précédente et la frame courante, des combinaisons de touches enfoncées etc.

            • Partager sur Facebook
            • Partager sur Twitter
              5 septembre 2018 à 16:04:46

              Ca veut dire que ton code est bloquant, quand tu déplaces ton vaisseau ou tires le reste du code n'est pas exécuté puisqu'on boucle. L'idée serait d'avoir une liste d'objets à mettre à jour dans une fonction appelée régulièrement via requestAnimationFrame, pas de gérer ça via des événements clavier attachés à des objets. Tes événements clavier doivent juste modifier un objet représentant l'état des entrées du jeu, et chaque objet mis à jour dans la boucle du jeu regarde l'état des entrées si ça l'intéresse.
              • Partager sur Facebook
              • Partager sur Twitter
              /!\ Si je cesse de répondre c'est parce que vous êtes venus poster sans avoir suivi les cours de base sur le sujet. /!\
                5 septembre 2018 à 16:06:08

                okay donc si je comprend bien je doit transférer tout ce que je fait dans la fonction moveShip dans une fonction requestAnimationFrame ? et les event sont la juste pour écouter les touches du clavier cliquer ?

                je vais allez voir la doc à propos de requestAnimationFrame sur MDN et essayer merci ;)

                Merci Genroa,

                j'avais comme idée au début de créer un objet pour les invader et le vaisseau mais comme je maitrise pas encore bien le sujet je voulais faire le jeu en utilisant des concept que je comprend +/- mais comme tu es le 2em à me parler du requestAnimationFrame je vais allez me renseigner à ce sujet ;)

                J'ai trouver une solution viable en utilisant sujet clos

                -
                Edité par GaetanGerard 6 septembre 2018 à 17:49:53

                • Partager sur Facebook
                • Partager sur Twitter

                Gestion de plusieurs évènement simultanément

                × Après avoir cliqué sur "Répondre" vous serez invité à vous connecter pour que votre message soit publié.
                × Attention, ce sujet est très ancien. Le déterrer n'est pas forcément approprié. Nous te conseillons de créer un nouveau sujet pour poser ta question.
                • Editeur
                • Markdown