let circleSizes = [100, 200, 300, 400];

let circleIndex = -1;

​

function setup() {

  createCanvas(600, 600);

  textAlign(CENTER, CENTER);

  textSize(48);

  fill(255, 255, 255);

}

​

function draw() {

  background(240, 255, 255);

  // Draw the circles for the archery target

  for (let i = circleIndex; i >= 0; i--) {

    fill(circleColors[i][0], circleColors[i][1], circleColors[i][2]);

    stroke(0);

    strokeWeight(1);

    let circleSize = circleSizes[i];

    ellipse(width / 2, height / 2, circleSize);

  }

  // Draw the arrow-shaped letters

  let nickname = "Shroon";

  let startX = (width - (nickname.length - 1) * 50) / 2;

  let startY = height / 2;

  let arrowSize = 50;

  let spacing = 50;

  for (let i = 0; i < nickname.length; i++) {

    drawArrow(startX + i * spacing, startY, arrowSize, nickname.charAt(i));

  }

}

​

function mouseClicked() {

  if (circleIndex === circleSizes.length - 1) {

    circleIndex = -1; // Reset to show innermost circle again

  } else {

    circleIndex++; // Increment to show the next circle

  }

}

​

​

function drawArrow(x, y, size, letter) {

  // Draw the arrow body

  fill(255);

  stroke(0);

  strokeWeight(2);

  beginShape();

  vertex(x - size / 4, y - size / 8);

  vertex(x - size / 4, y - size / 2);

  vertex(x + size / 4, y - size / 2);

  vertex(x + size / 4, y - size / 8);

  vertex(x + size / 2, y - size / 8);

  vertex(x, y + size / 2);

  vertex(x - size / 2, y - size / 8);

  vertex(x - size / 4, y - size / 8);

  endShape(CLOSE);

  // Display the letter

  fill(0);

  textSize(size / 2);

  textAlign(CENTER, CENTER);

  text(letter, x, y - size / 8);

}

​

​

function drawArrow(x, y, size, letter) {

  // Draw the arrow body

  fill(255);

  stroke(0);

  strokeWeight(2);

  beginShape();

  vertex(x - size / 4, y - size / 8);

  vertex(x - size / 4, y - size / 2);

  vertex(x + size / 4, y - size / 2);

  vertex(x + size / 4, y - size / 8);

  vertex(x + size / 2, y - size / 8);

  vertex(x, y + size / 2);

  vertex(x - size / 2, y - size / 8);

  vertex(x - size / 4, y - size / 8);

  endShape(CLOSE);

  // Display the letter

  fill(0);

  textSize(size / 2);

  textAlign(CENTER, CENTER);

  text(letter, x, y - size / 8);

}

​