let CIRCLE_SIZE = 5;

let ROTATIONS = 8;

let RENDER_FRAMES = 1;

//var points = [[25,40],[90,80],[150,50]]

let point_index = 1;

const FRAME_RATE = 10; //fps;

const DURATION = 180; //seconds;

//const LOOPS_PER_DURATION = [1,2]

​

function drawPoints(points) {

  fill(0);

  for (var i = 0; i < points.length; i++) {

    circle(points[i][0], points[i][1], CIRCLE_SIZE);

  }

}

​

function drawCurve(points, strokeC, fillC) {

  stroke("#" + strokeC);

  fill("#" + fillC);

  strokeWeight(10);

  line(

    points[0][0],

    points[0][1],

    points[points.length - 1][0],

    points[points.length - 1][1]

  );

  beginShape();

  curveVertex(points[0][0], points[0][1]);

  for (var i = 0; i < points.length; i++) {

    curveVertex(points[i][0], points[i][1]);

  }

  curveVertex(points[points.length - 1][0], points[points.length - 1][1]);

  endShape();

  noStroke();

}

​

function setup() {

  createCanvas(CANVAS_SIZE, CANVAS_SIZE);

  (drawingContext.shadowOffsetX = 0),

    (drawingContext.shadowOffsetY = -3),

    (drawingContext.shadowBlur = 8),

    (drawingContext.shadowColor = "black"),

    //drawPoints()

    //drawCurve()

    //angleMode(DEGREES)

    frameRate(FRAME_RATE);

}

​

function star(

  points,

  rotations,

  offset,

  LOOPS_PER_DURATION,

  amplitude,

  strokeC,

  fillC

) {

  newPoint = [

    0.1 *

      CANVAS_SIZE *

      amplitude *

      sin((2 * PI * LOOPS_PER_DURATION[0] * frameCount) / DURATION) -

      0.01 *

        CANVAS_SIZE *

        amplitude *

        cos((2 * PI * LOOPS_PER_DURATION[1] * frameCount) / DURATION),

    0.15 *

      CANVAS_SIZE *

      amplitude *

      cos((2 * PI * LOOPS_PER_DURATION[1] * frameCount) / DURATION) +

      0.1 *

        CANVAS_SIZE *

        amplitude *

        sin((2 * PI * LOOPS_PER_DURATION[0] * frameCount) / DURATION) +

      CANVAS_SIZE / 3,

  ];

  points.splice(point_index, 1, newPoint);

  push();

  translate(CANVAS_SIZE / 2, CANVAS_SIZE / 2);

  rotate(offset);

  for (var j = 0; j < rotations; j++) {

    rotate((2 * PI) / rotations);

    drawPoints(points);

    drawCurve(points, strokeC, fillC);

  }

​

  pop();

}

​

function draw() {

  background("#00072d");

  star(

    [

      [1, 10],

      [25, 90],

      [50, 50],

    ],

    10,

    (7 * PI) / 4,

    [2, 5],

    1.1,

    "b27092",

    "512d38"

  );

  star(

    [

      [5, 20],

      [70, 40],

      [150, 50],

    ],

    8,

    PI / 4,

    [5, 3],

    0.7,

    "0e6ba8",

    "001c55"

  );

  star(

    [

      [8, 30],

      [60, 110],

      [150, 50],

    ],

    6,

    0,

    [2, 4],

    1.0,

    "F4BFDB",

    "B27092"

  );

  star(

    [

      [25, 40],

      [80, 90],

      [150, 50],

    ],

    5,

    PI / 3,

    [1, 3],

    0.5,

    "f4bfdb",

    "ffe9f3"

  );

  star(

    [

      [35, 40],

      [25, 90],

      [150, 50],

    ],

    4,

    (7 * PI) / 4,

    [2, 3],

    1.1,

    "b27092",

    "512d38"

  );

  star(

    [

      [15, 40],

      [25, 90],

      [150, 50],

    ],

    3,

    (-1 * PI) / 6,

    [2, 2],

    1.1,

    "0e6ba8",

    "001c55"

  );

​

  //circle(CANVAS_SIZE/2,CANVAS_SIZE/2,0.3*CANVAS_SIZE)

  if (RENDER_FRAMES) {

    if (frameCount <= DURATION && RENDER_FRAMES) {

      // saveCanvas("img_" + frameCount, "PNG");

    } else {

      noLoop();

    }

  }

}

function mouseMoved() {

  //newPoint = [mouseX-CANVAS_SIZE/2,mouseY-CANVAS_SIZE/2]

  //points.splice(point_index,1,newPoint)

}

​