​

 todo: add anti particles that color through in the color of the background, on their own paths

​

*/

​

var cols = 55;

var rows = 55;

var mx, my;

const MZ = -10000

const MMZ = 10000;

var z = 0; // time value (slider)

var colz = 431236;

var cold = 0.005;

var SIZEFLURRY = 3; // max diff in size if circle

var ACCURACY = 0.9; // perectage in correct direction

var d = 0.002; // delta affects the rate of change of the direction

const ADX = 100; // chaos

const ADY = 100;

var scl;

var zSlider;

var showStuff = false;

var theStuff;

const psLIM = 255; // max amt of pixels flowing at the same time

const psSize = 3; // 1 for pixel, >1 for circle

const lifespans = []; // this was needed 

MAX_LIFE_SPAN = 100;

MIN_LIFE_SPAN = 10;

const ps = [];

var SPEED = 2.5; // speed of flowing pixels, higher causes choppy

var ALPHA_LEVEL = 50 ; // out of 255, the alpha-value of drawn pixels

var speedVector;

var centreVector;

var RADIOUS = 169;

​

function setup() {

  createCanvas(400, 400);

​

  // noiseSeed(32592035838.190582 ); // jupytery

  // pretty  22123259682.137955 

  noiseSeed(101033944634043370000   )

  randomSeed(101033944634043370000   )

  noFill();

  theStuff = createGraphics(width, height);

  theStuff.background(255);

​

  theStuff.stroke(255,0,255,255);

  var s = random(4242424242424242442)*42

  setFillColor(s)

  theStuff.circle(200,200,RADIOUS*2);

​

  recalcValues();

​

  speedVector = createVector(1, 1);

  speedVector.setMag(SPEED);

  centreVector=createVector(width/2, height/2)

​

  var zSlider = createSlider(-100, 100, z, 0.05);

  var e = document.querySelector('input[type="range"]');

  e.setAttribute("name", "zValueSlider");

  zSlider.input((e) => {

    z = zSlider.value();

    recalcValues();

    loop();

  });

​

  createButton("toggle show").mousePressed((e) => {

    showStuff = !showStuff;

  });

}

​

​

function decideAngleAtPoint(x,y) { 

  // make indexed randomGauss that shifts smoothely and 

  // make it change the angle

  const CX = 145-PI;

  const CY = 215+PI;

  var d = dist(x,y,CX,CY);

  var a = (atan2(y-CY,x-CX)-.0001)-radians(56);

  // looking for a nice function to gradually shift direction at certan distances from a point

  //

  // var g = Math.sign(sin(d/33)) * Math.sqrt(abs(cos(d/75)))*Math.sign(cos(d)) * Math.sqrt(abs(cos(d/75)))*Math.sign(cos(d/75)) * Math.sqrt(abs(cos(d/89)))*Math.sign(cos(d/26)) * Math.sqrt(abs(cos(d/75))); 

  // 

  // var g = Math.pow(cos(  Math.pow(sin(d/66),3 )  ), 7)-.3

  var g = cos(d/(x+55))-(cos(y))/13

  return  g*(a+noise(x/ADX,y/ADY, z) * 3 *-PI);

}

​

function tickZ() {

  // no not the thing to make nice graphs and stuff

  if (z < MZ || z > MMZ) d = -d;

  colz+=cold;

  z += d;

​

  var e = document.querySelector('input[type="range"][name="zValueSlider"]');

  e.setAttribute("value", z);

}

​

function recalcValues() {

  mx = width / cols;

  my = height / rows;

  scl = (mx + my) / 2;

}

​

​

function mouseClicked() {

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

    var s = random(4242424242424242442)*42

    randomSeed(s);

    noiseSeed(s);

    theStuff.background(255);

    theStuff.stroke(0,0,0,255)

    setFillColor(s)

    theStuff.circle(200,200,RADIOUS*2);

    ps.splice(0,ps.length)

    print(`current seed: ${s}`);

    loop();

  }

}

​

function setFillColor(s) {

  theStuff.fill(50+cos(s)*200,cos(s*s)*255,cos(s*s)*255,255)

}

​

function spawnMore() {

  if (ps.length < psLIM) {

    if (random() < 0.2) {

      var t = random(-TWO_PI, TWO_PI)

      var x = (width/2) + cos(t)*RADIOUS;

      var y = (height/2) + sin(t)*RADIOUS;

      ps.push(createVector(x,y));

    } else {

      var t = random()*TWO_PI

      var x = (width/2) + random(-1,1)*RADIOUS;

      var y = (height/2) + random(-1,1)*RADIOUS;

      ps.push(createVector(x,y));

    }

    lifespans.push(createVector(MIN_LIFE_SPAN+(randomGaussian(1,0.05)*MAX_LIFE_SPAN)));

  }

}

​

function updateAndDrawPs() {

  for (var i = ps.length - 1; i > -1; i--) {

    var v = ps[i];

    // var [v2,v3,v4] = [ps[(i+1)%ps.length],ps[(i+3)%ps.length],ps[(i+5)%ps.length]]

    lifespans[i].x--;

    var l = lifespans[i].x;

    if (l > 0 ){

      var a = a = decideAngleAtPoint(v.x,v.y);

    // idk how to do this nicely/smoothely yet

    speedVector.setHeading(a);

    v.add(speedVector);

    if (

      v.dist(centreVector) < (RADIOUS-(psSize/2)-1)

    ) {

      var cr = (.3+noise(colz))*255

      var cg = noise(v.y/15,colz)*255

      var cb = noise(v.x/105,colz)*255

      if (psSize > 1 ) {

        theStuff.stroke(cr, cg, cb, ALPHA_LEVEL);

        theStuff.fill(cr, cg, cb, ALPHA_LEVEL);

        theStuff.circle(v.x, v.y, 1+ noise(z*v.x*v.y)*SIZEFLURRY*psSize);

        // theStuff.bezier(v.x, v.y,

        //                 v2.y,v2.y,

        //                 v3.y,v3.y,

        //                 v4.y,v4.y);

      } 

      else {

        theStuff.stroke(cr, cg, cb, ALPHA_LEVEL);

        theStuff.point(v.x, v.y);}

    } else if (v.dist(centreVector) > (RADIOUS+(RADIOUS*.1))   ) {

           ps.splice(i, 1)

      lifespans.splice(i,1)

               }

    }

    else{

      ps.splice(i, 1)

      lifespans.splice(i,1)

    }

  }

}

​

​

​

function draw() {

  background(220);

​

  spawnMore();

  updateAndDrawPs();

  // show vectors

  for (var y = 0; y < height; y+=mx) {

    for (var x = 0; x < width; x+=my) {

      var a = decideAngleAtPoint(x,y)

​

      // var v = p5.Vector.fromAngle(a));

      if (dist(x, y, 200, 200) < (RADIOUS))

        {

          push();

          translate(x,y);

          rotate(a);

          line(0, 0, scl, 0);

          line(scl, -2, scl + scl / 5, 0);

          line(scl, 2, scl + scl / 5, 0);

          pop();

        }

    }

  }

  // debug the flowers

  for (const v of ps) {

    var a = decideAngleAtPoint(v.x,v.y)

    push();

    translate(v.x, v.y);

    rotate(a);

    line(0, 0, scl, 0);

    line(scl, -2, scl + scl / 5, 0);

    line(scl, 2, scl + scl / 5, 0);

    pop();

  }

  tickZ();

​

  if (showStuff) {

    image(theStuff, 0, 0);

  }

}

​