Fake Constellation Generator

mySketch
xxxxxxxxxx
 
const easeInOutQuad = function (t) { return t < .5 ? 2 * t * t : -1 + (4 - 2 * t) * t };
const moveLimit = 2500;
const dotCount = 65;
const dots = [];
​
function setup() {
  createCanvas(600, 600);
  colorMode(HSB);
  for (let i = 0; i < dotCount; i++) {
    dots[i] = new Point();
  }
}
​
function draw() {
  blendMode(BLEND);
  background(240, 100, 10, 1);
  blendMode(SCREEN);
  dots.forEach(dot => {
    dot.updateMe();
    dot.drawMe();
  });
  drawLine();
}
​
class Point {
  constructor() {
    this.x = width / 2;
    this.y = height / 2;
    this.distX;
    this.distY;
    this.distSet();
    this.preX = this.x;
    this.preY = this.y;
    this.startTime = Date.now();
    this.moveTime = 0;
    this.stopTime = 0;
    this.isMove = false;
    this.rad = random(5, 22);
    this.col = random(15, 195);
  }
​
  updateMe() {
    if (this.isMove) {
      this.moveTime = (Date.now() - this.startTime) / moveLimit;
      this.x = this.preX + (this.distX - this.preX) * easeInOutQuad(this.moveTime);
      this.y = this.preY + (this.distY - this.preY) * easeInOutQuad(this.moveTime);
      if (Date.now() - this.startTime >= moveLimit) {
        this.isMove = false;
        this.stopTime = Date.now();
        this.preX = this.x;
        this.preY = this.y;
      }
    } else {
      if (Date.now() - this.stopTime > moveLimit) {
        this.isMove = true;
        this.startTime = Date.now();
        this.distSet();
      }
    }
  }
​
  drawMe() {
    fill(this.col, 80, 80, 1);
    noStroke();
    ellipse(this.x, this.y, this.rad);
  }
​
  distSet() {
    this.distX = random(0, width);
    this.distY = random(0, height);
  }
}
​
function drawLine() {
  strokeWeight(1);
  stroke(80);
  for (let i = 0; i < dots.length; i++) {
    for (let j = i + 1; j < dots.length - 1; j++) {
      if (dist(dots[i].x, dots[i].y, dots[j].x, dots[j].y) < dots[i].rad * 4) {
        line(dots[i].x, dots[i].y, dots[j].x, dots[j].y);
      }
    }
  }
}
​
function mouseClicked() {
  dots.forEach(dot => {
    dot.preX = dot.x;
    dot.preY = dot.y;
    dot.isMove = true;
    dot.distX = mouseX;
    dot.distY = mouseY;
    dot.startTime = Date.now();
  });
}