//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;

let s = 0.0;

​

​

function setup() {

  createCanvas(700, 800);

  angleMode(DEGREES);

  rectMode(CENTER);

    ellipseMode(CENTER);

  colorMode(RGB);

 for (

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

  stars.push(new Star(random(700), random (800), 5));

  }

  x = 305;

  y = height;

​

​

}

​

function draw() {

  background(0);

  push();

  for(

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

 { stars[i].update();

 }

  pop();

​

  drawBoat();

​

​

  push();

  for (

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

 signals[i].update();

 signals[i].move();

  }

  pop();

}

function mousePressed(){

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

  }

​

function drawBoat(){

  fill(200,200,200);

  rect(360,560,10,50);

  circle(360,542,10);

​

  fill(12,38,79);

  rect(0,750,1700,100);

  noStroke();

  rect(300,670,250,70,20);

  rect(350,620,90,70,20);

  rect(200,640,90,10,20);

  rect(370,590,100,10,20);

  fill(255,242,0);

  rect(360,615,30,30);

  fill(12,38,79);

  rect(360,615,5,30);

  rect(360,615,30,5);

​

​

}

​

class Signal {

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

    this.x = x;

    this.y = y;

    this.w = 50;

    this.h = 50;

    this.start = 180;

    this.s = 1;

  }

  update(signals) {

    noFill();

    strokeWeight(10);

    stroke(17,255,17);

    //a = a + 0.4;

    this.s = this.s + .025;

    push();

    translate (this.x, this.y);

    scale(this.s);

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

    pop();

  }

  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,random(150));

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

  }

}