let texts = [];

let gameState = 'start'; // 'start', 'playing', 'end'

let startTime;

const gameDuration = 2 * 60 * 1000; // 3 minutes in milliseconds

let startButton;

​

function preload() {

  img = loadImage('images/locked.png', 

    () => console.log('Image loaded successfully'),

    () => console.log('Failed to load image')

  );

}

​

function setup() {

  createCanvas(windowWidth, windowHeight);

  textAlign(CENTER, CENTER);

  startButton = createButton('START');

  startButton.position(width / 2 - 50, (2 * height) / 3 - 20);

  startButton.size(100, 40);

  startButton.mousePressed(() => {

    gameState = 'playing';

    startTime = millis();

    startButton.hide();

  });

}

​

function draw() { 

  textFont('Arial');

  background(255);

  if (gameState === 'start') {

    if (img) {

      image(img, width / 2 - 50, height / 4 - 100, 100, 100); // Display image at the center of the screen

    }

    displayStartScreen();

  } else if (gameState === 'playing') {

    updateAndDisplayTexts();

    displayProgressBar();

    checkGameEnd();

  } else if (gameState === 'end') {

    displayEndScreen();

  }

}

​

function displayStartScreen() {

  fill(0);

  textSize(20);

  textStyle(BOLD);

  text('\n\nThe Door is Locked\n\n', width / 2, height / 3);

  textSize(16);

  textStyle(NORMAL);

  text('Click on the floating text that says\n "your door is unlocked"\nto get rid of the intrusive thought, \nso you can go on with your day\n.', width / 2, height / 2);

}

​

function displayEndScreen() {

  fill(0);

  textSize(16);

  textWrap(WORD);

  let remainingThoughts = texts.length;

  if (remainingThoughts === 0) {

    text(`Yay, you cleared all the \nthoughts this time!`, width / 2, height / 2, 250);

  } else {

    text(`Oh no, you had ${remainingThoughts} thoughts left.\nHopefully they don't bother you for the rest of the day`, width / 2, height / 2, 250);

  }

}

​

function mousePressed() {

  if (gameState === 'playing') {

    for (let i = texts.length - 1; i >= 0; i--) {

      if (texts[i].isClicked(mouseX, mouseY)) {

        texts.splice(i, 1);

        break;

      }

    }

  }

}

​

function updateAndDisplayTexts() {

  if (frameCount % 32  === 0) { // Generate a new text every two seconds

    texts.push(new FloatingText(random(width), random(height)));

  }

  for (let floatingText of texts) {

    floatingText.update();

    floatingText.display();

  }

}

​

function displayProgressBar() {

  let elapsedTime = millis() - startTime;

  let progress = map(elapsedTime, 0, gameDuration, 0, width);

  fill(0, 0, 0);

  rect(0, 0, progress, 10, 8);

}

​

function checkGameEnd() {

  if (millis() - startTime > gameDuration) {

    gameState = 'end';

  }

}

​

class FloatingText {

  constructor(x, y) {

    this.x = x;

    this.y = y;

    this.size = 16;

    this.text = "your door is unlocked";

    this.xSpeed = random(-1.5, 1.5);

    this.ySpeed = random(-1.5, 1.5);

  }

  update() {

    this.x += this.xSpeed;

    this.y += this.ySpeed;

    if (this.x < 0 || this.x > width) {

      this.xSpeed *= -1;

    }

    if (this.y < 0 || this.y > height) {

      this.ySpeed *= -1;

    }

  }

  display() {

    fill(0);

    textSize(this.size);

    text(this.text, this.x, this.y);

  }

  isClicked(px, py) {

    let d = dist(px, py, this.x, this.y);

    return d < textWidth(this.text) / 2;

  }

}

​