​

function setup() {

  createCanvas(600, 400);

  noStroke();

}

​

function draw() {

  background(0, 100);

  var index = 0;

  while(index < particles.length) {

    updateAndDrawParticle(particles[index]);

    index ++;

  }

  for(var i = 0; i < 20; i++) {

  particles.push({

    x: random(100, width-100),

    y: 400,

    xSpeed: 0,

    ySpeed: -2,

    life: random(50, 100)

  });

  }

}

​

function updateAndDrawParticle(part) {

  if (part.life < 0) {

    return; // skip the rest of this function

  }

  part.x += part.xSpeed;

  part.y += part.ySpeed;

  fill(255, part.life * 4, 0, 100);

  if (part.life < 10) {

    fill(255, 10);

  }

  ellipse(part.x, part.y, 20, 20);

  part.life --;

}

​

function makeFirework(x, y) {

  var num = 200;

  for(var c = 0; c < num; c++) {

    var a = random(TWO_PI); // random angle

    var s = random(0, 2);   // random speed

    particles.push({

      x: x,

      y: y,

      xSpeed: s * cos(a), // trig magic

      ySpeed: s * sin(a),

      life: random(60, 75)

    });

  }

}

​

function mousePressed() {

  makeFirework(mouseX, mouseY);

}