// She lost her sparkle, you know she isn't the same

// Truckin - Grateful Dead

​

let starPoints = [];

let stars = [];

let starWidth = 50;

let starHeight = 50;

let angle = 0;

​

function setup() {

  createCanvas(600, 600);

  let a = starWidth;

  let b = starHeight;

  let n = 0.55;

​

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

    let na = 2 / n;

    let x = pow(abs(cos(angle)), na) * a * sgn(cos(angle));

    let y = pow(abs(sin(angle)), na) * b * sgn(sin(angle));

    starPoints.push(createVector(x, y));

  }

  for (let row = 50; row < width; row += (starWidth * 2)) {

    for (let col = 50; col < height; col += (starHeight * 2)) {

      stars.push(new Star(row, col, starPoints));

    }

  }

}

​

function draw() {

  background(0);

​

 stars.forEach(star => {

   star.draw();

 });

​

}

​

function sgn(val) {

  if (val == 0) {

    return 0;

  }

  return val / abs(val);

}

​

class Star {

  constructor(xOff, yOff, starPoints) {

    this.xOff = xOff;

    this.yOff = yOff;

    this.angle = 0;

    this.starPoints = starPoints;

    this.rotate = true;

    this.framePause = 0;

  }

  draw() {

    push();

    if(this.rotate){

      stroke(255);

      fill(0);

    }else{

      stroke('gold'); 

      fill('lightyellow')

    }

    translate(this.xOff, this.yOff);

    if(this.rotate){

      rotate(this.angle);

    }

    beginShape();

    this.starPoints.forEach(star => {

      vertex(star.x, star.y);

    })

    endShape(CLOSE);

    pop();

​

    if (this.angle >= HALF_PI) {

      this.angle = 0;

      this.rotate = false;

      this.framePause = frameCount;

    } else {

      if(this.rotate){

        this.angle += 0.02;

      }

    }

    if(90 == frameCount - this.framePause){

      this.rotate = true;

    }

  }

}