"he thrusts his fists against the posts and still insists he sees the ghosts";

let txt_x, txt_y;

let colors, offset, offset2;

​

let particles;

​

class Particle {

  constructor(x, y, vx, vy, col, size) {

    this.position = createVector(x, y);

    this.orig_position = createVector(x, y);

    this.velocity = createVector(vx, vy);

    this.color = col;

    this.size = size;

    this.sizeDir = true;

  }

​

  update() {

    this.position.x += this.velocity.x;

    this.position.y = 50*log(20*this.position.x);

    // this.position.y += this.velocity.y;

​

    if (

      this.position.x < offset ||

      this.position.x > width - offset ||

      this.position.y < offset ||

      this.position.y > height - offset

    ) {

      this.position.x = this.orig_position.x;

      this.position.y = this.orig_position.y;

    }

    if (random() > 0.99) {

      // this.color._array[3] -= 0.1;

      // let _c = this.color;

      // _c._array[3] -= 0.01;

      // if (_c._array[3] <= 0.0) _c._array[3] = 1.0;

      if (this.sizeDir)

      this.size++;

      else

        this.size--;

      // this.color = _c

    }

    if (random() > 0.99) {

      this.color = colors[getRandomInt(0,colors.length)];

    }

    if (this.size > 40) this.sizeDir = false;

    if (this.size < 5) this.sizeDir = true;

  }

  draw() {

    // noStroke();

    stroke(255);

    strokeWeight(0.1);

    fill(this.color);

    circle(this.position.x, this.position.y, this.size);

  }

}

​

function getRandomInt(min, max) {

  min = Math.ceil(min);

  max = Math.floor(max);

  return Math.floor(Math.random() * (max - min) + min); //The maximum is exclusive and the minimum is inclusive

}

​

function setup() {

  offset = 50;

  offset2 = 5;

​

  let numParticles = 1000;

  particles = [];

​

  // https://kgolid.github.io/chromotome-site/ # rohlfs_1G

  colors = [

    color(255, 248, 231, 255),

    color(0, 73, 150, 255),

    color(86, 123, 174, 255),

    color(96, 191, 60, 255),

    color(210, 222, 177, 255),

  ];

  createCanvas(800, 800);

  pixelDensity(1);

​

  textFont("Helvetica");

​

  x = width;

  y = (3 * height) / 4;

​

  for (let i = 0; i < numParticles; i++) {

    let x = random(-50, offset);

    let y = 0;//height-offset-offset2-random(20);//random(-50, height + 50);

    let vx = random(1,5);

    let vy = 0;

    particles.push(new Particle(x, y, vx, vy, colors[3], 5));

    if ((i%20) == 0)

      particles.push(new Particle(x, y, vx, vy, color(0,0,0,255), 5));

  }

  background(0);

}

​

function drawBorder() {

  noStroke();

  fill(colors[0]);

  rect(0, 0, width, offset);

  rect(0, 0, offset, height);

  rect(width - offset, 0, offset, height);

  rect(0, height - offset, width, offset);

​

  fill(colors[1]);

  rect(offset, offset, offset2, height - 2 * offset - offset2);

  rect(offset, offset, width - 2 * offset - offset2, offset2);

  rect(

    width - offset - offset2,

    offset,

    offset2,

    height - 2 * offset - offset2

  );

  rect(offset, height - offset - offset2, width - 2 * offset, offset2);

}

​

// moving in here not to lose it

function handleText() {

  noStroke();

  fill(colors[getRandomInt(1, colors.length)]);

  textSize(random(12, 48));

  let w = textWidth(txt);

  text(txt, x, y);

  x -= 5;

  if (x + w < 0) x = width;

​

}

​

function draw() {

  // background(0);//colors[0]);

​

  for (let i = particles.length - 1; i >= 0; i--) {

    particles[i].update();

    particles[i].draw();

  }

  // fill(color(255,255,255,20));

  // rect(offset+offset2,y-(38),width-offset-offset2,48);

  fill(0);

  rect(offset+offset2,y-48,width-offset-offset2,70);

  handleText();

​

  drawBorder();

}

​