N = 15;

​

t=0;

dt=0.005;

​

var debugtarget = true;

​

var targetStar;

var targetRotation;

var sizer=0.6;

​

var starPoints = 5;

​

​

var targetSize;

var actualTargetRadius = 15;

var min_start_radius = 2;

var max_start_radius = 5;

​

sizeLerp = 0;

sdt = 0.0000003;

​

var centre;

​

function setup() {

  createCanvas(400, 400);

  centre = createVector(0,0);

  targetStar = createVector(0,0);

  targetRotation=createVector(1);

  targetSize = createVector(1,1);

  targetSize.setMag(actualTargetRadius);

  var star;

  var starsize;

  var rotation;

  for (var i = 0; i < N ; i++ ){

    var a = random(0,TWO_PI);

    var r = random(50, 200);

    var x = cos(a)*r;

    var y = sin(a)*r;

    star = createVector(x,y)

    star.r=r

    star.speed = random()/10;

​

    starsize = createVector(0.2,0.2);

    starsize.setMag(random(min_start_radius, max_start_radius));

    rotation = p5.Vector.random2D();

    rotation.setMag(4);

    stars.push([star, starsize, rotation])

  }

}

​

​

function star(x, y, radius1, radius2, npoints) {

  // stolen from https://p5js.org/examples/form-star.html

  let angle = TWO_PI / npoints;

  let halfAngle = angle / 2.0;

  beginShape();

  for (let a = 0; a < TWO_PI; a += angle) {

    let sx = x + cos(a) * radius2;

    let sy = y + sin(a) * radius2;

    vertex(sx, sy);

    sx = x + cos(a + halfAngle) * radius1;

    sy = y + sin(a + halfAngle) * radius1;

    vertex(sx, sy);

  }

  endShape(CLOSE);

}

​

​

function draw() {

  background(220);

  for (var [s, size,rotation] of stars) {

    push();

    translate(width/2, height/2);

    rotate(t);

    push();

    translate(s.x, s.y);

    rotate(rotation.x*rotation.y*t);

    rectMode(CENTER);

    const sm = size.mag();

    fill('yellow')

    // fill(random()*255, random()*255, random()*255, random()*255);

    star(0,0,sizer*10*sm, sizer*18*sm, starPoints);

    pop();

    pop();

    var direction = p5.Vector.sub(centre, s);

    direction.setMag(s.speed);

    size.lerp(targetSize, sizeLerp);

    rotation.lerp(targetRotation, sizeLerp);

    s.add(direction);

  }

  // draw the target 'star'  

  if(debugtarget){

    push();

    translate(width/2, height/2);

    rotate(t);

    push();

    fill('rgba(248,126,245,0.44)')

    translate(targetStar.x, targetStar.y);

    rotate(targetRotation.x/1000);

    targetRotation.x+=0.001;

    // rectMode(CENTER);

    const sm = targetSize.mag();

    // rect(0,0, 15*sm, sm*15);

    star(0,0,sizer*10*sm, sizer*18*sm, starPoints);

    pop();

    pop();

  }

  t+=dt;

  if (sizeLerp < 1) sizeLerp+=sdt;

  text(`${sizeLerp.toFixed(2)}`,2,10);

}