let savedTime;

let totalTime = 5;

let s;

let startX;

let startY;

let PosX;

let PosY;

let size;

let y = 10;

​

​

function setup() {

  createCanvas(600, 600);

  background(0);

  PosX=50

  PosY=50

  frameRate(2)

  savedTime = millis()/1000; // since we've put this inside setup(), millis() stops running once draw() begins 

}

​

function draw() {

​

  fill(250,0,0,80);

  noStroke()

​

  // Calculate how much time has passed

  let passedTime = millis()/1000 - savedTime;

  // Has five seconds passed

  if ( passedTime > totalTime) {

    print("5 seconds have passed!");

    size = random(20,40)

    // draw a new circle

    PosX = PosX + passedTime * random(0,10)

    PosY = PosY + passedTime * random(0,10)

     console.log(PosX,PosY)

    if (PosX < 600 && PosY <600){

      circle(PosX, PosY, size);

      console.log(passedTime)

      //flickering effect

       if (y == 10){

        fill(0,0,255);

        circle(PosX, PosY, size);

        y = y - 10;

      }

       else if (y == 0){

        y = y + 10}

      //clear the page when out of range

    } else {background(0); 

         PosX = 50;

         PosY = 50;

    }  

    // restart the timer

    savedTime = millis()/1000; 

  }

​

}