let num = 4;

​

function setup() {

  createCanvas(400, 400);

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

    snails.push(newSnail());

  }

​

}

​

function draw() {

  background(127);

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

    snails[i].update();

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

      snails[i] = newSnail();

    }

  }

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

     snails[i].draw(); 

  }

}

​

function newSnail() {

  let x = random(width);

  let y = random(height);

  let length = 400;

  let s = new Snail(x, y, length);

  return s;

}

​

function onScreen(p, buff) {

  return p.x >= -buff && p.x <= width + buff &&

        p.y >= -buff && p.y <= height + buff;

}

​

class Snail {

  constructor(x, y, length) {

    this.dir = random(TAU);

    this.spd = 0.15;

    this.length = length;

    this.points = [];

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

      this.points.push(createVector(x, y));

    }  

  }

  offScreen() {

    for(let i = 0; i < this.length; i ++) {

      const p = this.points[i];

      if(onScreen(p, 20)) {

        return false;

      }

    }

    return true;

  }

  update() {

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

      this.points[i] = this.points[i - 1];

    }

    let mvmt = createVector(cos(this.dir) * this.spd, sin(this.dir) * this.spd);

    this.points[0] = mvmt.add(this.points[0]);

    this.dir += random(-0.1, 0.1);

  }

  draw() {

    noStroke();

    const mid = floor(this.length / 2);

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

      const p = this.points[i];

      fill(128, 255, 200);

      const r = map(abs(mid - i), 0, mid, 15, 10);

      ellipse(p.x, p.y, r, r);

    }

    this.drawShell(mid);

  }

  drawShell(idx) {

    const p = this.points[idx];

    for(let j = 4; j > 0; j --) {

      if(j % 2 == 0) {

        fill(128, 64, 0);

      } else {

        fill(200, 100, 64);

      }

      ellipse(p.x, p.y, 10 * j, 10 * j);

    }

  }

}