let shootingStars = [];

let noiseTime = 0;

let gridWidth = 200;

let gridHeight = 200;

let mouseTimer = 0;

​

function setup() {

  createCanvas(1112, 834);

colorMode(HSB, 150); 

  smooth();

  noStroke();

​

  // Create static stars for the night sky

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

    stars.push(new Star());

  }

}

​

function draw() {

  // Draw the night sky with a darker (black) background

  background(0, 0, 0); // Black night sky color

​

  // Display and update all stars

  for (let star of stars) {

    star.show();

  }

​

  // Occasionally add a shooting star

  if (random(1) < 0.01) {

    shootingStars.push(new ShootingStar());

  }

​

  // Update and display shooting stars

  for (let i = shootingStars.length - 1; i >= 0; i--) {

    shootingStars[i].update();

    shootingStars[i].show();

    if (shootingStars[i].offScreen()) {

      shootingStars.splice(i, 1); // Remove shooting stars that are off the screen

    }

  }

​

  // Draw the animated grid

  translate(0, 250);

  for (let index = gridWidth * gridHeight; --index;) {

    let x = index % gridWidth;

    let z = parseInt(index / gridWidth);

    let y = noise(x / 30, z / 70 + noiseTime, 1);

    z *= 0.01;

    let brightness = (1 - y) * (z * 0.7) * 200;

    fill(0, 150, y * y * gridWidth);

    rect(500 + (x * 4 - gridWidth * 2) / z, y * 175 / z, 40 - z * 10, 400);

  }

​

noiseTime += deltaTime * 0.0004; // Reduce the rate of change

}

​

function mousePressed() {

  // Prevents mouse press from registering twice

  if (millis() - mouseTimer > 400) {

    save('pix.jpg');

    mouseTimer = millis();

  }

}

​

// Star class for static stars

class Star {

  constructor() {

    this.x = random(width);

    this.y = random(height);

    this.size = random(1, 3);

  }

​

  show() {

    noStroke();

    fill(255);

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

  }

}

​

// ShootingStar class for dynamic shooting stars

class ShootingStar {

  constructor() {

    this.x = random(width);

    this.y = random(height / 2);

    this.length = random(10, 20);

    this.speed = random(5, 10);

    this.angle = PI / 6; // Angle for the shooting star

  }

​

  update() {

    this.x += this.speed * cos(this.angle);

    this.y += this.speed * sin(this.angle);

  }

​

  show() {

    stroke(255, 255, 200);

    strokeWeight(2);

    line(this.x, this.y, this.x - this.length * cos(this.angle), this.y - this.length * sin(this.angle));

  }

​

  offScreen() {

    return this.x > width || this.y > height;

  }

}

​