var x = 0;

var num = 0;

var colorR = 100;

var colorG = 47;

var colorB = 137;

​

var colorG2 = 125;

var y = 270;

var num1 = 0;

​

var size1;

function setup() {

  createCanvas(400, 400);

  while (num <= 300) {

    //purple gradient

    noStroke();

    fill(colorR, colorG, colorB);

    rect(0, x, size, size);

    size--;

    x += 10;

    num++;

    colorR += 7;

    colorG += 7;

    colorB += 7;

  }

​

  strokeWeight(1); //stars

  stroke("lavender");

  for (var i = 0; i < 105; i++) {

    size1 = random(2, 5);

    fill(random(50, 256), random(50, 256), random(50, 256));

    ellipse(random(0, 400), random(0, 245), size1, size1);

  }

​

  while (num1 <= 300) {

    //grass

    noStroke();

    fill(0, colorG2, 0);

    rect(0, y, 400, 40);

    y += 10;

    num1++;

    colorG2 += 5;

  }

}

​

function draw() {

  if (key === "b") {

    return 2;

  }

​

  if (key === "p") {

    return 4;

  }

​

  if (key === "c") {

    return 6;

  }

}

​

function mouseClicked() {

  x = mouseX;

  y = mouseY;

  size = 11;

​

  if (key === "b") {

    fill("yellow");

    ellipse(x, y, size, size);

​

    fill(87, 191, 217);

    ellipse(x, y - 10, size - 1, size - 1); //top center petal

    ellipse(x + 9, y - 3, size, size); //top right

    ellipse(x - 9, y - 3, size, size); //top left

    ellipse(x + 6, y + 9, size, size); //bottom right petal

    ellipse(x - 6, y + 9, size, size); //bottom left petal

  }

​

  if (key === "p") {

    fill("yellow");

    ellipse(x, y, size, size);

​

    fill(228, 148, 242);

    ellipse(x, y - 10, size - 1, size - 1); //top center petal

    ellipse(x + 9, y - 3, size, size); //top right

    ellipse(x - 9, y - 3, size, size); //top left

    ellipse(x + 6, y + 9, size, size); //bottom right petal

    ellipse(x - 6, y + 9, size, size); //bottom left petal

  }

​

  if (key === "r") {

    fill("yellow");

    ellipse(x, y, size, size);

​

    fill(255, 119, 69);

    ellipse(x, y - 10, size - 1, size - 1); //top center petal

    ellipse(x + 9, y - 3, size, size); //top right

    ellipse(x - 9, y - 3, size, size); //top left

    ellipse(x + 6, y + 9, size, size); //bottom right petal

    ellipse(x - 6, y + 9, size, size); //bottom left petal

  }

}

​