mill = 0,

  seco = 0,

  minu = 0;

let savedT = 0;

let play = false;

​

function setup() {

  createCanvas(640, 480);

}

​

function draw() {

  if (play) {

    background(51, 165, 50);

  } else {

    background(204, 6, 5);

  }

  if (play) {

    t = millis() - savedT;

  }

  seco = floor(t / 1000) % 60;

  minu = floor(t / 60000);

  mill = floor(t) - seco * 1000 - minu * 60000;

  fill(255);

  noStroke();

  textAlign(CENTER, CENTER);

  textSize(60);

  text(`${convert(minu, "minu")}:${convert(seco, "seco")}.${convert(mill, "mill")}`, width / 2, height / 2);

​

​

  textAlign(LEFT, TOP);

  textSize(15);

  text("Press the spacebar or click the screen to start or stop the timer.", 5, 5)

​

}

​

function keyPressed() {

  if (key == " ") {

    play = !play;

    if (play) {

      savedT = millis();

    }

  }

}

​

function mousePressed() {

  play = !play;

  if (play) {

    savedT = millis();

  }

}

​

function convert(num, mode) {

  let newNum = 0;

  if (mode == "mill") {

    if (num < 10) {

      newNum = str(num) + "00"

    } else if (num < 100) {

      newNum = str(num) + "0";

    } else {

      newNum = str(num);

    }

  }

  if (mode == "seco" || mode == "minu") {

    if (num < 10) {

      newNum = "0" + str(num);

    } else {

      newNum = str(num);

    }

  }

  return newNum;

}