Il s'agit de créer douze paires de calculs/réponses de manière aléatoire. Chaque paire retrouvée fait disparaître les deux boutons de la paire, dévoilant un fragment de l'image. Si la paire est incorrecte, on perd l'une de nos trois vies. Si les trois vies sont perdues, le jeu recommence depuis le début (refresh de la page).
aleatoire() : Crée une solution (un nombre entre 1 et 20). À partir de ce chiffre, crée une réponse par soustraction d'un nombre aléatoire compris entre 0 et la solution. On attribue une position à la solution et à la réponse en tirant deux nombres aléatoires qui renvoient à une liste contenant les boutons html. Ces opérations sont répétées douze fois dans la fonction (boucle for). A chaque passage dans la boucle, les positions déjà occupées sont supprimées. La réponse est testée à chaque passage pour savoir si elle existe déjà (on ne veut pas deux réponses identiques).
$("#un").click(function nb1() : S'active quand on clique sur un bouton. Elle attribue la valeur du bouton à une variable (contenu1 ou contenu2 en fonction du type du bouton (réponse ou calcul)). Elle colorie le bouton sur lequel on a cliqué et retire la couleur des autres boutons du même type. Pour finir, elle appelle la fonction compare() . Cette fonction existe 24 fois (une fois pour chaque bouton).
compare() : Commence par un test if qui vérifie si les deux variables contenu1 et contenu2 sont remplies. Si oui, on entre dans la fonction. On vérifie ensuite si contenu1 est égal à contenu2. Si oui, on ajoute 1 à la variable « juste », puis on cache les deux boutons. Si non, on retire une vie au nombre total de vies et on retire la couleur de tous les boutons. Si le nombre de vies atteint 0, le jeu redémarre (rafraîchit la page). Si le nombre de juste atteint 12, le jeu se termine, l'image apparaît en plus grand, c'est gagné.