var a;

var b;

​

​

t=0;

dt= .01;

​

marg =0.1;

shape = 'circle'; // todo add more, 

circle_radius = 150;

​

color_noise = 60;

let noiseScale=0.102;

let dn = 0.07;

​

​

interpolate_centre = 5;

interpolate_range = 3;

​

curr = interpolate_centre-interpolate_range;

​

maxbound = interpolate_centre+interpolate_range;

minbound = interpolate_centre-interpolate_range;

​

interpolate_weight = true;

interpolate_speed = 1;

​

change_bckground = true;

var br=87656789;

var bg=563463456;

var bb=12341234;

​

function setup() {

  frameRate(60);

  createCanvas(400, 400);

  painting = createGraphics(400, 400);

  painting.colorMode(HSB,100);

  painting.strokeWeight(2);

  strokeWeightSlider = createSlider(10, 1500, 10);

  strokeWeightSlider.input((e)=>painting.strokeWeight(strokeWeightSlider.value()**2/100));

  reset();

  toggleInterpolateBtn = createButton('toggle weight interpolate')

  toggleInterpolateBtn.mouseReleased((e) => {interpolate_weight=!interpolate_weight;});

  draw_speed_slider = createSlider(5, 55, .5);

  draw_speed_slider.input((e)=>{dt=draw_speed_slider.value()/1000

                          print('dt is now',dt)})

  interpolate_range_slider = createSlider(minbound, maxbound, curr);

  interpolate_range_slider.input(()=>{

    interpolate_range=interpolate_range_slider.value();

    maxbound = interpolate_centre+interpolate_range;

    minbound = interpolate_centre-interpolate_range;

    if (curr < minbound) {curr = minbound ; interpolate_speed=abs(interpolate_speed) }

    if (curr > maxbound) {curr = maxbound ; interpolate_speed=-abs(interpolate_speed) }

  });

  centre_slider = createSlider(1, 100, interpolate_centre);

  centre_slider.input(()=>{

    interpolate_centre=centre_slider.value();

    maxbound = interpolate_centre+interpolate_range;

    minbound = interpolate_centre-interpolate_range;

    if (curr < minbound) {curr = minbound ; interpolate_speed=abs(interpolate_speed) }

    if (curr > maxbound) {curr = maxbound ; interpolate_speed=-abs(interpolate_speed) }

  });

  change_bckground_btn = createButton('toggle change background')

  change_bckground_btn.mouseReleased((e) => change_bckground=!change_bckground )

}

​

function createRandomPointBasedOnShape(){

  //(taken from https://editor.p5js.org/Queuebee2/sketches/UrAejQQ2I)

​

  var result;

  switch (shape) {

    case 'circle':

      ang = random(0, 2*PI)

      x = (width/2) + (circle_radius  * cos(ang));

      y = (height/2) + (circle_radius  * sin(ang));

      result = createVector(x,y);

      break;

    case 'square':

      const sides = [

      [1, height],

      [width, 1],

      [0, 1],

      [1, 0],

    ];

​

    const [dx, dy] = sides[Math.floor(Math.random() * 4)];

    var x = constrain(random(width*marg, width-(width*marg)) * dx, width*marg, width-(width*marg));

    var y = constrain(random(height*marg, height-(height*marg)) * dy, height*marg, height-(height*marg));

​

    result = createVector(x, y);

      break;

    case 'random':

    default:

      result = createVector(random(width*marg, width-(width*marg)),

                        random(height*marg, height-(height*marg)));

      break;

  }

  result.z = random()*100;

   return result;

}

​

function reset() {

  a = createRandomPointBasedOnShape();

  b = createRandomPointBasedOnShape();

}

​

function mouseClicked(){

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

  br=random()

  bg=random()

  bb=random()}

}

​

function draw() {

  if (change_bckground) background(noise(br)*255,noise(bg)*255,noise(bb)*255);

  br+=random()/300

  bg+=random()/300

  bb+=random()/300

​

  var x1,y1,x2,y2,cy,cx;

  cx = width/2

  cy = height/2;

​

  x1 = bezierPoint(a.x, cx, cx , b.x, t);

  y1 = bezierPoint(a.y, cy, cy , b.y, t);

  x2 = bezierPoint(a.x, cx, cx , b.x, t+dt);

  y2 = bezierPoint(a.y, cy, cy , b.y, t+dt);

  painting.stroke(noise(color_noise*noiseScale)*100, noise(5*color_noise*noiseScale)*100, 100);

  if (t==0) painting.circle(a.x, a.y, 3);

  painting.line(x1,y1,x2,y2);

  color_noise+=dn;

  t+=dt;

  if (t>0.999) {

    t=0;

    a=b;

    b=createRandomPointBasedOnShape();

  }

  if (interpolate_weight) {

    painting.strokeWeight(curr);

    curr+=interpolate_speed

    if (curr > maxbound || curr < minbound ) {

      interpolate_speed = -interpolate_speed;

    }

  }

  image(painting,0,0);

  // text(strokeWeightSlider.value()/100, 0, 10);

}