​

// Consider a simulation of paint splatter drawn as a collection of colored dots.

// Most of the paint clusters around a central position, but some dots splatter out toward the edges.

// Can you use a normal distribution of random numbers to generate the positions of the dots?

​

// Can you also use a normal distribution of random numbers to generate a color palette?

​

// TODO: Try creating a slider to adjust the standard deviation.

​

let splats = [];

let starfield = [];

let SD = 30; // Standard deviation

let t = 0; // Global time

let fadetimer = 60;

let state = [(START = "START"), (PLAY = "PLAY")];

let gameState = state[0];

​

class Splat {

  constructor(x, y, sd, col) {

    this.sd = sd; // Standard deviation

​

    this.pos = createVector(x, y);

​

    // Splat time

    this.t = 0;

​

    // White fill, can be used instead of RGB

    this.c = 255;

​

    // Distance from mouse to splat

    this.d = dist(mouseX, mouseY, this.pos.x, this.pos.y);

​

    // Radius linked to standard deviation

    this.r = randomGaussian(map(this.d, 0, this.d, this.d, 0), this.sd * 0.95);

​

    // RGB palette

    this.R = randomGaussian(255, 13);

    this.G = randomGaussian(225, 10);

    this.B = randomGaussian(125, 33);

  }

​

  draw() {

    noStroke();

​

    // fill(this.c);

    fill(this.R, this.G, this.B);

    circle(this.pos.x, this.pos.y, this.r);

  }

  update() {

    this.t++; // update time

    if (this.t > 25 + random(10)) {

      // after a certain time then...r

      this.c = this.c * random(0.78, 0.93); // fade white to black

      this.R = this.R * random(0.92, 0.94); // fade R to black

      this.G = this.G * random(0.62, 0.64); // fade G to black

      this.B = this.B * random(0.82, 0.84); // fade B to black

      this.r = this.r * random(0.93, 0.99); // scale splat down

    }

  }

} // class Splat

​

function keyPressed() {

  if (mouseX > 0 && mouseX < width && mouseY > 0 && mouseY < height) {

    if (key === "f") {

      let fs = fullscreen();

      fullscreen(!fs);

​

      for (i = 0; i < 400; i++) {

        starfield.push(new Star());

      }

    }

  }

  if (key === "r" && gameState === state[1]) {

    //    splats = [];

    gameState = state[0];

    fadetimer = 30;

    SD = 30;

  }

}

​

function windowResized() {

  if (fullscreen()) {

    resizeCanvas(windowWidth, windowHeight);

  } else {

    resizeCanvas(800, 1000);

  }

}

​

function mouseWheel(event) {

  if (event.delta > 0) {

    SD = SD - 2;

  } else if (event.delta < 0) {

    SD = SD + 2;

  }

  // print(event.delta)

}

​

function instructions() {

  textcol = 52;

  textFont("courier");

  fill(255, 255, 255, textcol + 48 * sin(t / 12));

  textSize(44);

  textAlign(CENTER);

  text("Click + drag to paint", width / 2, height / 2);

​

  fill(255, 255, 255, 64);

  textSize(22);

  textAlign(LEFT);

  text(

    "F to enter/exit fullscreen\nR to restart\nScroll mouse to resize",

    width / 2 - 160,

    height / 2 + 44

  );

}

​

function paint() {

  if (mouseIsPressed) {

    for (let i = 1; i < 25; i++) {

      splats.push(

        new Splat(randomGaussian(mouseX, SD), randomGaussian(mouseY, SD), SD)

      );

    }

  }

}

​

function cleanup() {

  for (let i = 0; i < splats.length; i++) {

    if (splats[i].t < 60) {

      splats[i].update();

      splats[i].draw();

    } else {

      splats.splice(i, 1);

    }

  }

}

​

function debug() {

  textFont("courier");

  textSize(44);

  textAlign(LEFT);

  fill(25);

  text(floor(frameRate(), 2), width / 2 - 80, height / 4);

}

​

function sketchSTART() {

  cleanup();

  instructions();

​

  if (t % 6 == 0) {

    splats.push(

      new Splat(

        randomGaussian(width / 2, 50),

        randomGaussian(height / 2 - 100, 10),

        SD / 4

      )

    );

  }

  if (mouseIsPressed) {

    gameState = state[1];

  }

}

​

function sketchPLAY() {

  if (fadetimer > 0) {

    fadetimer--;

    instructions();

    textcol--;

  } else {

    fadetimer = 0;

  }

​

  paint();

  cleanup();

}

​

function setup() {

  let p = createVector(width / 2, height / 2);

  createCanvas(800, 1000);

  fullscreen();

  gameState = state[0];

​

  class Star {

    constructor() {

      this.pos = createVector(random(width), random(height));

      this.size = random(4);

      this.col = random(255);

    }

​

    show() {

      stroke(this.col);

      strokeWeight(this.size);

      point(this.pos.x, this.pos.y);

    }

  }

} // setup

​

function draw() {

  background(15, 12, 15);

​

  t++;

​

  if (gameState == state[0]) {

    sketchSTART();

  } else if (gameState == state[1]) {

    sketchPLAY();

  }

​

  for (i = 0; i < starfield.length; i++) {

    starfield[i].show();

  }

} // draw

​