Pour la création de l'image du fantôme blanc, faire une copie ici
Enregistrer l'image dans le dossier GHOST sous le nom 'fantome'.
Déclarer les variables img1, img1x et img1y
img1 qui correspond à la nouvelle image 'fantome'.
img1x qui correspond à la coordonnée x du coin supérieur gauche de l'image 'fantome'.
img1y qui correspond à la coordonnée y du coin supérieur gauche de l'image 'fantome'.
Déclarer la source (emplacement) de img1, dans la fonction jeu().
img1.src = 'fantome.png'
La source (src) de l'image img1 est "fantome.png".
ctx.drawImage(img1, img1x, img1y)
Afficher img1.
Enregistrer le code dans l'editeur.
Actualiser la page du navigateur.
Pour le déplacement vers le haut du fantôme blanc nous allons choisir la touche up ('flèche haut' du clavier).
Déclarer les variables dimg1y et upPressed.
dimg1y qui correspond à la vitesse et au sens de déplacement vertical de img1.
upPressed ('flèche haut' préssée) qui nous permet de cibler la touche up ('flèche haut' du clavier).
Nous lui attribuons la valeur false (faux) qui correspond à son état initial (non pressée).
La méthode addEventListener (écouteur d'évènement).
Cette méthode va nous permettre de savoir si le joueur presse une touche.
Placer 2 écouteurs d'évènements.
document.addEventListener ("keydown", keyDown)
Le premier "keydown", chargé de lancer la fonction keyDown() si il détecte que la touche est pressée.
document.addEventListener ("keyup", keyUp)
Le second "keyup", chargé de lancer la fonction keyUp() si il détecte que la touche est non pressée.
Créer les fonctions keyDown() et keyUp().
Ces fonctions vont prendre pour argument l'indice (e) qui correspond au code de reconnaissance de chaque touche du clavier.
Le code pour la touche up est le 38.
Dans ces fonctions, nous allons utiliser l'instruction if, else if (si, autre si) qui va exécuter le code si la condition soumise est vraie.
Si la touche up est pressée l'écouteur d'évènement "keydown" va lancer l'exécution de la fonction keyDown().
La fonction keyDown() va déclarer la condition
if (e.keyCode == 38) vraie et exécuter le code upPressed = true (vrai)
Si la touche up n'est pas pressée l'écouteur d'évènement "keyup" va lancer l'exécution de la fonction keyUp().
La fonction keyUp() va déclarer la condition
if (e.keyCode == 38) vraie et exécuter le code upPressed = false (faux)
Créer la fonction deplaceFantome().
Dans cette fonction nous allons utiliser l'opérateur logique ET(&&).
Avec l'opérateur logique ET (&&) toutes les conditions doivent être remplies pour que le code soit exécuté.
if(upPressed) && img1y >= 40)
Si la touche up est préssée ET img1y est supérieure ou égale à 40.
dimg1y = -4
Le sens et la vitesse de déplacement vertical de l'image img1 est égale à -4.
else if(dimg1y == -4)
Si le sens et la vitesse de déplacement vertical de l'image img1 est égale à -4.
dimg1y = 1.2
Le sens et la vitesse de déplacement vertical de l'image img1 est égale à 1.2.
else if(dimg1y == 1.2 && img1y >= 280)
Si le sens et la vitesse de déplacement vertical de l'image img1 est égale à 1.2 ET img1y est supérieure ou égale à 280.
dimg1y = 0
Le sens et la vitesse de déplacement vertical de l'image img1 est égale à 0.
Appeler la fonction deplaceFantome() dans la fonction jeu().
Déclarer la variable img1y dans la fonction jeu().
img1y += dimg1y
Cette déclaration de img1y permet le déplacement vertical de img1.
Enregistrer le code dans l'editeur.
Actualiser la page du navigateur.