​

var larguraQ = 80;

var alturaQ = 80;

​

var tela = 1;

​

var gabarito = 'RGPB';

​

var respostas = '';

​

var clicks = 0; 

​

function quadrado(xq, yq, lq, aq, corR, corG, corB, ident) {

  // desenha o quadrado 

  fill(corR, corG, corB);

  noStroke();

  rect(xq, yq, lq, aq)

  // verifica seleção 

  identQuadrado = '-';

  if (mouseX > xq && mouseX < xq + lq && mouseY > yq && mouseY < yq + aq) {

​

    identQuadrado = ident;

  }

  return identQuadrado

}

​

function setup() {

  createCanvas(400, 400);

​

}

​

function draw() {

  textSize(40);

​

  if (tela == 1) {

    background(220);

​

    sel = '-';

    if ( 'R' == quadrado(100, 100, larguraQ, alturaQ, 255, 0, 0, 'R')){

      sel = 'R'; 

    }

    if ('G' == quadrado(200, 100, larguraQ, alturaQ, 0, 255, 0, 'G')) {

      sel = 'G';    

    }

    if ( 'B' == quadrado(100, 200, larguraQ, alturaQ, 0, 0, 255, 'B')){ 

      sel = 'B';

    }

    if('P' == quadrado(200, 200, larguraQ, alturaQ, 255, 0, 255, 'P')){

      sel = 'P';    

    }

​

    if (mouseIsPressed && sel != '-') {

      if (sel != selAnt) {

        console.log(sel);

        respostas = respostas + sel        

        selAnt = sel;

        clicks++; 

        if (clicks == 4){

          if ( respostas == gabarito )

            tela = 2 // ganhou 

          else

            tela = 3 // perdeu 

        }

      }

    }

  }

  if (tela == 2) {

    background(220);

    text("Parabéns", 100, 200);    

  }

  if (tela == 3) {

    background(220);

    text("Perdeu!", 100, 200);    

  }

​

​

  }