Implémentation des Événements 'Mouse Down', 'Mouse Move' et 'Mouse Up'
Objectifs
Maîtriser la gestion des événements souris, en particulier mouse down, mouse move et mouse up, pour créer des interactions dynamiques dans les applications web.
Résumé
Apprenez à gérer les événements souris sur une zone de grattage en utilisant les événements mouse down, mouse move et mouse up.
Description
Avant de gérer les événements souris, nous allons déplacer des lignes de code dans une fonction nommée dessiner motifs. Pour réaliser cette application, nous allons utiliser trois événements souris : mouse down, pour commencer le grattage, suivie de mouse move qui se déclenche à chaque mouvement de la souris, et enfin mouse up pour arrêter le grattage lorsque le bouton de la souris est relâché.
Nous allons créer une fonction générique nommée mouseEventsHandler pour capturer ces événements et réagir différemment en fonction du type d'événement en utilisant l'instruction switch.
1. Lors du mouse down, nous ajoutons un écouteur pour l'événement mouse move sur la zone de grattage pour suivre les mouvements de la souris uniquement au-dessus de cette zone. Dans cet écouteur, nous appellerons la fonction dessiner motif pour déplacer le motif en fonction de la souris.
2. Lors de l'événement mouse up, nous arrêtons l'écoute de l'événement mouse move pour stopper la détection des mouvements chaque fois que la souris déplace. Cet événement est écouté sur toute la scène afin de capturer le relâchement même en dehors de la zone de grattage.