class Cube {

  constructor(x, y, z, size) {

    // Cube's position in 3D space (x, y, z) and size

    this.x = x;

    this.y = y;

    this.z = z;   // Cube starts at z = 0 but changes when "pulled out"

    this.size = size; //inputting the size of the cube 

    this.brightness = 100;  // Initial brightness (s o it affects cube color)

    // checks if the cube is pushed out or not

    this.pushedOut = false; 

  }

​

  // Draw the cube on the canvas

  display() {

    // This would save the current drawing state

    push();  

​

    // Position the cube in 3D space

    translate(this.x, this.y, this.z);  

​

    // setting the outline for the cubes

    stroke(255);  

    strokeWeight(2);  

​

    // Fill color changes based on brightness

    fill(this.brightness, 0, 128);  

​

    // Draw the cube with the given size

    box(this.size);  

  }

​

  // Change the cube's brightness based on mouse distance

  adjustBrightness(mx, my) {

    // Calculate distance between the mouse and the cube

    let distance = dist(mx - width / 2, my - height / 2, this.x, this.y);  

​

    // Map the distance to the brightness range (closer means brighter)

    this.brightness = map(distance, 0, width / 2, 255, 50);  

​

    // Constrain the brightness to stay within a range (50-255)

    this.brightness = constrain(this.brightness, 50, 255);  

  }

​

  // Toggle the cube's "pull-out" effect along the z-axis

  togglePullOut() {

    // If the cube is not pushed out,it move it forward

    if (!this.pushedOut) {

      this.z += 100;  

    } else {

      // If it’s already pushed out,it move it back to its original position

      this.z -= 100;  

    }

​

    // Toggle the pushed-out state

    this.pushedOut = !this.pushedOut;  

  }

}

​