Nous allons créer deux niveaux dans le jeu..

Nous allons initialiser une variable "niveau" à 0, et lorsque le smiley atteint le rectangle 2, on incrémente la variable niveau de 1, ce qui aura pour effet de démarrer un second niveau en déplaçant les deux rectangles

1ère modification:

Pour obliger notre smiley à retourner dans le rectangle 1 lors d'un contact:
Modifiez les deux lignes suivantes dans la fonction contact():


smiley.position.x=780;
smiley.position.y=260;

par celles-ci:


smiley.position.x=rect1.position.x;
smiley.position.y=rect1.position.y;

2nde modification

Nous allons avoir besoin de deux nouvelles variables :

une variable niveau
une variable test (qui sera un "booleen" : C'est à dire une variable qui peut avoir deux valeurs : true ou false)

Dans déclaration des variables, rajoutez ces deux lignes :


var niveau=0;
var test=false;

Appel et création de la fonction changementNiveau()

Pour appeler une fonction, il suffit d'écrire son nom dans le draw():


changementNiveau();

Créons la fonction changementNiveau() avec ce code :


//test du contact de smiley avec le rectangle2
function changementNiveau() {
  if (smiley.overlapPoint(rect2.position.x, rect2.position.y)) {
    niveau=niveau+1;
    test=true;
  }
}

Création du second niveau

Notre programme teste si le smiley rencontre le rectangle 2. Dans ce cas la variable niveau est mise à "1" et la variable test est mise à "true".

Nous allons donc rajoutez dans le draw() une instruction conditionnelle qui permettra de changer les positions des rectangles et du smiley pour une nouvelle traversée..

Rajoutez dans le draw() après la ligne "background(150, 176, 188);" les lignes suivantes:


//instruction conditionnelle qui n'est exécutée que si "niveau==1 et test==true"
if (niveau==1 && test==true) {
//nouvelles position du rectangle 1
    rect1.position.x=25;
    rect1.position.y=250;
//nouvelles position du rectangle 2
    rect2.position.x=775;
    rect2.position.y=25;
//positionnement du smiley dans le rectangle 1
    smiley.position.x=rect1.position.x;
    smiley.position.y=rect1.position.y;
    //remise à false du test pour que cette instruction ne puisse s'exécuter qu'une seule fois
    test=false;
  }

Rajoutez également cette ligne dans le draw() pour faire afficher le niveau:


text("niveau :"+niveau, 480, 20);

Ce qui donne :

Je n'ai mis que 3 ennemis ci-dessous pour vous donner une chance de voir que cela fonctionne ...