Wrinkles

/* Wrinkles - Fractal bezier

​

   Keys:

   r    randomise

   d    wrinkle depth

   1-9  wrinkle scale

   Mouse:

   Drag control points

​

*/

​

var P = [];

var R = [];

var wscale = 1;

var wdepth = 15;

var sel = -1;

​

function setup() {

  createCanvas(windowWidth, windowHeight);

​

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

    P[i] =  createVector(random(width/4)+i*width/4,

          random(height/4)+i*height/4);

  }

​

  makeRandom();

​

}

​

function draw()

{

​

  background(200);

  // Endpoints/on-curve points

  fill(0,100,150);

  noStroke();

  ellipse(P[0].x,P[0].y,9,9);

  ellipse(P[3].x,P[3].y,9,9);

​

  // Control/on-curve points

  noFill();

  stroke(0,100,150);

  strokeWeight(2);

  ellipse(P[1].x,P[1].y,8,8);

  ellipse(P[2].x,P[2].y,8,8);

  // Control polygon

  strokeWeight(1);

  stroke(0,100,150);

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

    line(P[i].x,P[i].y,P[i+1].x,P[i+1].y);

  }

​

  fbezier(P[0],P[1],P[2],P[3],0);

}

​

function cbezier(p,q,r,s)

{

  bezier(p.x,p.y,q.x,q.y,r.x,r.y,s.x,s.y);

}

​

function fbezier(p,q,r,s,d)

{

  stroke(128);

  strokeWeight(1);

  cbezier(p,q,r,s);

  let t = p5.Vector.lerp(p,q,0.5);

  let u = p5.Vector.lerp(q,r,0.5);

  let v = p5.Vector.lerp(r,s,0.5);

  let w = p5.Vector.lerp(t,u,0.5);

  let x = p5.Vector.lerp(u,v,0.5);

​

  let l = p5.Vector.sub(x,w);

​

  w.x -= l.y*R[d]*wscale;

  w.y += l.x*R[d]*wscale;

​

  x.x -= l.y*R[d]*wscale;

  x.y += l.x*R[d]*wscale;

​

  let y = p5.Vector.lerp(w,x,0.5);

  strokeWeight(3);

  stroke(0);

  if(d<wdepth) {

    fbezier(p,t,w,y,d*2+1);

    fbezier(y,x,v,s,d*2+2);

  } else {

    cbezier(p,t,w,y);

    cbezier(y,x,v,s);

  }

}

​

function makeRandom()

{

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

    R[i] = random(1)-0.5;

  }

}

​

function mouseDragged()

{

  let bestd = 9999;

  let besti = -1;

​

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

    let dx = pmouseX - P[i].x;

    let dy = pmouseY - P[i].y;

    let dd = sqrt(dx*dx + dy*dy);

    if(dd<bestd) {

      bestd = dd;

      besti = i;

    }

  }

  if(bestd<10 || besti==sel) {

    sel = besti;

    P[besti].x = mouseX;

    P[besti].y = mouseY;

  } else {

    sel = -1;

  }

  return false;

}

​

function keyPressed()

{

  if(key == 'r')

    makeRandom();

  if(key >= '1' && key <='9')

    wscale = (key-'0')/3.0;

  if(key == 'd') {

    wdepth = wdepth*2 + 1

    if(wdepth > 127)

      wdepth = 7;

  }

}

​