Click on the sketch above. Link to source files.
cells = [];
spacing = 20;
function setup() {
createCanvas(800, 800);
for(let x = 0; x < width/spacing; x++){
cells[x] = [];
for(let y = 0; y < height; y++){
cells[x][y] = new Cell(x,y);
}
}
}
function draw() {
background(0);
for(let x = 0; x < width/spacing; x++){
for(let y = 0; y < height; y++){
let cl = cells[x][y];
cl.update();
cl.display();
}
}
}
class Cell{
constructor(x,y) {
this.life = 0;
this.state = 0;
this.c;
this.x = x;
this.y = y;
this.limit = random(30)+10;
}
update(){
if(this.state == 1 && this.life < this.limit){
this.life += 2;
}
if(this.life >= this.limit){
this.state = 2;
this.life = this.limit - 1;;
let rate = random(3)+1;
for(let i = 0; i < rate; i++){
let px = int(random(-2,2));
let py = int(random(-2,2));
if(this.x + px < 0 || this.x + px >= width/spacing){
px = 0;
}
if(this.y + py < 0 || this.y + py >= height/spacing){
py = 0;
}
if(cells[this.x+px][this.y+py].state == 0){
cells[this.x+px][this.y+py].state = 1;
let R = random(-10,10);
let G = random(-10,10);
let B = random(-10,10);
let newc = color(red(this.c)+R,green(this.c)+G,blue(this.c)+B);
cells[this.x+px][this.y+py].c = newc;
cells[this.x+px][this.y+py].limit = random(30)+20;
}
}
}
if(this.state == 2){
this.life -= 0.5;
if(this.life < 0){
this.life = 0;
this.state = 0;
}
}
}
display(){
if(this.state > 0){
noStroke();
fill(red(this.c),green(this.c),blue(this.c),this.life*(255/this.limit));
rect(this.x*spacing, this.y * spacing,spacing);
}
}
}
function mouseReleased() {
let x = int(mouseX/spacing);
let y = int(mouseY/spacing);
cells[x][y].state = 1;
cells[x][y].c = color(random(255),random(255),random(255));
cells[x][y].limit = random(30)+20;
}