let rectWidth1 = 50; // Fixed width of the rectangle

let rectHeight = 50; // Initial height of the rectangle

let growthFactor = 9; // Controls the rate of growth

let growthFactor1 = 2; // Controls the rate of growth

let xPosition = 110; // Initial x position

let yPosition = 100; // Initial y position

​

let xPosition1 = 310; // Initial x position

let yPosition1 = 50; // Initial y position

let x1 = 210;

let x2 = 310;

let x3 = 310

​

var direction = "right";

​

function setup() {

  createCanvas(540, 540);

    frameRate(50);

}

​

function draw() {

  background(220);

​

  fill (0);

  // rect(110, 100, 100, 320);

  rect(x1, 150, 150, 220);

  rect(x2, 100, 100, 150);

  rect(x3, 310, 100, 110);

  let x = width - rectWidth / 2;

  let y = height / 2 - rectHeight / 2;

  rectHeight = rectHeight + growthFactor * sin(frameCount * 0.05);

  rectWidth1 = rectWidth + growthFactor1 * sin(frameCount * 0.05);

​

  fill(0, 0, 0); // Red fill color

  noStroke(); // No stroke

  rect(xPosition, y, rectWidth, rectHeight);

  if (direction=="right"){

    x2=x2 + 1;

  }

  if (direction=="left") {

    x2 = x2 - 1;

  }

  if (x2 >= 360) {

    direction = "left";

  }

    if (x2 <= 320) {

    direction = "right";

  }

    if (direction=="right"){

    x3=x3 + 0.5;

  }

  if (direction=="left") {

    x3 = x3 - 0.5;

  }

  if (x3 == 350) {

    direction = "left";

  }

    if (x3 == 320) {

    direction = "right";

  }

}