// CAW QUACK CAW HONK

// Discord: https://discord.com/invite/hzsn3UHxbw

// Theme: Lifeforms

​

// PARAMETERS

const COUNT = 50; // 100 is max (unless you change max_grad_count in shader.frag)

​

// RENDER

const LOOP_LENGTH = 50000; // ms

​

// CONTROLS

const MOUSE_X_TIME = false;

​

function mouseClicked() {

  createPoints();

}

​

// press 1 for 4k screenshot

function keyPressed() {

  if (keyCode === 49) {

    const size = 1080 * 4;

    if (width > height)

      resizeCanvas(round(size * (width / height)), size, WEBGL);

    else

      resizeCanvas(size, round(size * (height / width)), WEBGL);

​

    scene(t);

    save();

    console.log(`saved screenshot: ${width}x${height}`);

    windowResized();

  }

}

​

// SETUP

let theShader;

function preload(){

  theShader = loadShader('shader.vert', 'shader.frag');

}

​

function setup() {

  createCanvas(windowWidth, windowHeight, WEBGL);

  createPoints();

}

​

function windowResized(){

  resizeCanvas(windowWidth, windowHeight);

}

​

​

// SKETCH

let points

function createPoints() {

  points = new Array(COUNT).fill().map((_,i) => 

    createVector(random(), random())

 );

}

​

let t;

function draw() {  

  let mX = (mouseX / width);

  let mY = (mouseY / height);

​

  t = fract(millis() / LOOP_LENGTH); // t value loops between 0 - 1

​

  if (MOUSE_X_TIME)

    t = mX;

  scene(t);

}

​

function scene(t) {

  const pts = points.map(

    ({x, y}) => [

      invCosn(x + t), // x position

      invCosn(y + t)  // y position

    ]

  ).flat();

​

  theShader.setUniform("points", pts);

  theShader.setUniform("count", COUNT);

​

  theShader.setUniform("t", t);

  theShader.setUniform("resolution", [width, height]);

  theShader.setUniform("mouse", [mouseX, height - mouseY]);

​

  shader(theShader);

  rect(0,0,width,height);

}

​

// inverted normalized cos function (normalized phase and amplitude between 0 - 1)

function invCosn(v) {

  return 1 - (cos(v * TWO_PI) * 0.5 + 0.5);

}

​