Sommaire

Gérer la perte de balle

1. L’utilisateur perd la dernière balle en jeu

Lorsque toutes les balles en jeu sont perdues par le joueur, celui-ci doit perdre une vie. Il faut donc attribuer une propriété au joueur qui indique au système le nombre de vies restantes.

On crée donc une variable racketNumber, au tout début du fichier de script principal scripts/main.js.

On crée également une fonction showRemainingLifes() qui indique à l’écran le nombre de vies restantes après la perte de celle en cours. Cette indication se fait par l’apparition de raquettes miniatures positionnées en haut, au-dessus de l’écran de jeu, à droite du score du joueur. Le nombre de raquettes indique le nombre de vies disponibles après la perte de celle en cours d’utilisation. Par exemple, pour un total de trois vies restantes, il en existe une en jeu et deux à utiliser, soit deux raquettes à afficher.

Le code de cette fonction est le suivant :

function showRemainingLifes() 
{ 
   $(’.statusBar .life’) 
       .remove(); 
   $(’.statusBar’) 
       .append(’<div class="life"></div>’.repeat(racketNumber - 1)); 
}

On modifie le code de la fonction init() pour exécuter cette fonction de manière à afficher de suite les vies restantes.

    showRemainingLifes();

Le style CSS à ...