const radius = 300;

const num = 1;

const frames = 600;

const minScale = 12;

const maxScale = 36;

​

function randomAngleSphere(){

  var u = random();

  var v = random();

  var theta = 2 * PI * u;

  var phi = acos(2 * v - 1);

  return {theta, phi};

}

​

function randomSpherePoint({theta, phi, radius}){

   var x = (radius * sin(phi) * cos(theta));

   var y = (radius * sin(phi) * sin(theta));

   var z = (radius * cos(phi));

   return createVector(x,y,z);

}

​

​

​

function setup() {

  createCanvas(800, 800, WEBGL);

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

    const from = randomSpherePoint({radius, ...randomAngleSphere()});

    const angle = randomAngleSphere()

    const to = randomSpherePoint({radius, ...angle});

    const offset = 0;

    const timeScale = 1;

    things[i] = new Thing({from, to, angle, offset, timeScale});

  }

}

​

function draw() {

  background(0);

  let progress = (frameCount / frames)%1;

  rotateY(frameCount*0.005);

  noFill();

  stroke(50, 0, 255, 150);

  for(let i = 0; i < things.length; i++){

    const thing = things[i];

    thing.draw(progress);

  }

  fill(255, 4);

  stroke(255, 8);

  strokeWeight(1);

  sphere(radius, 24, 24);

}

​

​

class Thing {

  constructor({from, to, angle, offset, timeScale}){

    this.from = from;

    this.to = to;

    this.offset = offset;

    this.timeScale = timeScale;

    this.angle = angle;

  }

  draw(progress){

    let lp = (progress + this.offset)%1;

    const inOutProgress = map(lp, 0, 1, 0, 2);

    let ip = constrain(inOutProgress, 0, 1);

    let op = constrain(inOutProgress - 1, 0, 1);

    const v1 = p5.Vector.lerp(this.from, this.to, op);

    const v2 = p5.Vector.lerp(this.from, this.to, ip);

    strokeWeight(2);

    beginShape(LINES);

    vertex(v1.x, v1.y, v1.z);

    vertex(v2.x, v2.y, v2.z);

    endShape();

    push();

    noStroke();

    fill(255, 100);

    translate(this.to.x, this.to.y, this.to.z);

    const {phi, theta} = this.angle;

    rotateX(cos(phi) * cos(theta));

    rotateY(cos(phi) * sin(theta));

    rotateZ(sin(phi));

    cylinder(20, 1);

    pop();

  }

}

​