//p5.js reference for animation, arc, push and pop

//previous projects from this class, and direct help from Ben Grosser

​

let stars = [];

let signals = [];

let x;

let y;

​

​

function setup() {

  createCanvas(600, 600);

  angleMode(DEGREES);

 for (

    let i = 0; i < 100; i = i+1){

  stars.push(new Star(random(600), random (600), 5));

  }

  x = 305;

  y = height;

​

}

​

function draw() {

  background(0);

  push();

  for(

 let i = 0; i < stars.length; i = i+1)

 { stars[i].update();

 }

  rect(300,550,20,60);

  circle(310,540,15);

  fill(255);

  pop();

  push();

  for (

    let i = 0; i < signals.length; i = i + 1) {

 signals[i].update();

 signals[i].move();

  }

  pop();

}

function mousePressed(){

    signals.push(new Signal(310,540,100));

  }

​

class Signal {

  constructor(x, y, w, h, start) {

    this.x = x;

    this.y = y;

    this.w = 100;

    this.h = 100;

    this.start = 180;

  }

  update(signals) {

    noFill();

    strokeWeight(10);

    stroke(17,255,17);

    arc(this.x, this.y, this.w, this.h,this.start, PI + QUARTER_PI, OPEN );

  }

  move (){

    this.y = this.y - 5;

  }

}

​

  class Star{

  constructor(x,y,s){

  this.x = x;

  this.y = y;

  this.s = s;

​

  }

  update(stars){

    fill(200,200,200);

    ellipse(this.x,this.y,this.s,this.s);

  }

}

​

​

​