let imgBottom;

let xoff1 = 0;

let xoff2 = 10000;

let xoff3 = 30000;

let xoff4 = 50000;

let xoff5 = 40000;

let x, y, x2, y2;

let xspeed, yspeed, x2speed, y2speed;

let scalex1, scaley1, scalex2, scaley2, scalex3, scaley3, scalex4, scaley4;

​

function preload() {

  imgTop = loadImage('assets/ctrrMask.png');

  imgBottom = loadImage('assets/ctrrBase.jpg');

}

​

function setup() {

  createCanvas(800, 1000);

  x = width / 2;

  y = height / 2;

  x2 = width / 3;

  y2 = height / 3;

  xspeed = random(-2, 2);

  yspeed = random(-2, 2);

  x2speed = random(-4, 4);

  y2speed = random(-4, 4);

}

​

function draw() {

  image(imgBottom, -4, 4);

​

  let range = 200;

  let speed = 0.005;

​

  let x1 = mouseX + map(noise(xoff1), 0, 1, -range, range);

  let y1 = mouseY + map(noise(xoff1 + 5000), 0, 1, -range, range);

  let x2 = mouseX + map(noise(xoff2), 0, 1, -range * 5, range * 5);

  let y2 = mouseY + map(noise(xoff2 + 5000), 0, 1, -range * 1.5, range * 1.5);

  let x3 = mouseX + map(noise(xoff3), 0, 1, -range * 4, range * 4);

  let y3 = mouseY + map(noise(xoff3 + 5000), 0, 1, -range * 2, range * 2);

  let x4 = mouseX + map(noise(xoff4), 0, 1, -range * 5, range * 5);

  let y4 = mouseY + map(noise(xoff4 + 5000), 0, 1, -range * 5, range * 5);

​

  scalex1 = map(noise(xoff1 + 1000), 0, 1, 0.5, 1.5);

  scaley1 = map(noise(xoff1 + 1500), 0, 1, 0.5, 1.5);

  scalex2 = map(noise(xoff2 + 1000), 0, 1, 0.5, 2.5);

  scaley2 = map(noise(xoff2 + 1500), 0, 1, 0.5, 1.5);

  scalex3 = map(noise(xoff3 + 1000), 0, 1, 0.5, 2);

  scaley3 = map(noise(xoff3 + 1500), 0, 1, 0.5, 2);

  scalex4 = map(noise(xoff4 + 1000), 0, 1, 0.5, 2.5);

  scaley4 = map(noise(xoff4 + 1500), 0, 1, 0.5, 2.5);

​

  x += xspeed;

  y += yspeed;

  x2 += x2speed;

  y2 += y2speed;

​

  if (random(1) < 0.1) {  

    xspeed = random(-2, 2);

    yspeed = random(-2, 2);

  }

  if (random(1) < 0.2) {  

    x2speed = random(-4, 4);

    y2speed = random(-4, 4);

  }

  x = constrain(x, 0, width);

  y = constrain(y, 0, height);

  x2 = constrain(x2, 0, width);

  y2 = constrain(y2, 0, height);

​

  fill(37, 38, 39);

  noStroke();

  ellipse(x, y, 100 * scalex1, 100 * scaley1);

  ellipse(x*1.5, y*1.5, 200 * scalex2, 200 * scaley2);

  ellipse(x1, y1, 300 * scalex3, 300 * scaley3);

  ellipse(x2, y2, 200 * scalex4, 200 * scaley4);

  ellipse(x3, y3, 100 * scalex3, 100 * scaley3);

  ellipse(x4, y4, 150 * scalex4, 150 * scaley4);

​

  image(imgTop, 0, 0);

​

  // Increment the offsets to move through the noise space

  xoff1 += speed;

  xoff2 += speed;

  xoff3 += speed;

  xoff4 += speed;

}

​