var s = 100;

var x = 100;

var y = 100;

var state = 2;

​

​

function setup() {

createCanvas(450, 450);

textSize(30);

textFont("Comic Sans MS");

 }

​

​

function mousePressed() {

state++;

if (state > 3) {

state = 1;

 }

  }

​

​

function draw() {

background(220);

​

//Third Panel 

if (state == 1) {

fill("blue");

text("White", x + 100, y);

x = 100;

s = 100;

fill("white");

  }

//First Panel

​

if (state == 2) {

x = 200;

y = 200;

s = 100; 

fill("blue");

text("Red", x, y - 70);

fill("red");

  }

​

//Second Panel

if (state == 3) {

 x = 300;

 y = 300;

 s = 100;

 fill("blue");

 text(" Yellow", x - 150, y - 200, s + 100);

 fill("yellow");

    }

​

//CHARACTER

circle(x, y, s); // circle

​

}

​