let stars = [];

//let line1 = [];

​

function setup() {

  createCanvas(windowWidth, windowHeight);

  // create objects: lines and stars

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

    line0[i] = new movingLines1();

    stars[i] = new movingStars();

    // line1[i]= new movingLines2(i,i);

  }

}

​

function draw() {

  background(0, 0, 102);

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

    line0[i].move();

    line0[i].display();

    stars[i].move();

    stars[i].display();

    // line1[i].move();

    // line1[i].display();

  }

  //drawing the moon

  noStroke();

  fill(224, 224, 224);

  circle(600, 80, 70);

}

​

//star light movement

class movingLines1 {

  constructor() {

    this.x = random(width - width / 2);

    this.y = random(height - height / 2);

    this.z = 100;

    this.w = 100;

    this.speed = 2;

  }

​

  move() {

    this.x += this.speed;

    this.y += this.speed;

  }

​

  display() {

    stroke("#fff5dd");

    line(this.x, this.y, this.z, this.w);

  }

}

​

// class movingLines2 {

//   constructor() {

//     this.x = random (width/4);

//     this.y = random (height/4);

//     this.z = this.x+1;

//     this.w = this.y;

//     this.speed = 1;

//   }

​

//   move (){

//     this.x += this.speed;

//     this.y += this.speed;

//   }

​

// display() {

//   stroke ('orange');

//   line(this.x, this.y, this.z, this.w);

// }

// }

​

// stars jitter

class movingStars {

  constructor() {

    this.x = random(width);

    this.y = random(height / 3);

    this.diameter = 1;

    this.speed = 1;

  }

​

  move() {

    this.x += random(-this.speed, this.speed);

    this.y += random(-this.speed, this.speed);

  }

​

  display() {

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

  }

}

​