createCanvas(600, 600);

  frameRate(30)

  colorMode(HSB, 1, 1, 1, 1)

  background(0)

  strokeWeight(0.1)

  // noLoop()

  numBubbles = 1

  bubbles = []

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

    bubble = new Bubble(

      Math.random() * width, 

      Math.random() * height, 

      Math.random() * 200 + 30

    )

    bubbles.push(bubble)

  }

  tentacle = new Tentacle(

    width/2,

    height/2,

    200,

    30

  )

}

​

function draw() {

  background(0, 0.3)

  fill(1, 0.01)

  stroke(1)

  for (let bubble of bubbles) {

    bubble.draw()

    bubble.offset += 0.003

    bubble.move()

  }

  tentacle.draw()

  tentacle.offset += 0.003

  tentacle.move()

​

  // spread += inc

}

​

function blob(N, spread, offset = 0) {

  let angle = 0

  noFill()

  beginShape()

  while (angle <= TWO_PI) {

    let xoff = map(cos(angle), -1, 1, offset, offset + spread)

    let yoff = map(sin(angle), -1, 1, offset, offset + spread)

    let r = noise(xoff, yoff) * width/2

    let x = r * cos(angle)

    let y = r * sin(angle)

    vertex(x, y)

​

    angle += TWO_PI / N 

  }

  endShape()

}

​

class Bubble {

  constructor(cx, cy, r) {

    this.cx = cx

    this.cy = cy

    this.r = r

    this.offset = Math.random() * 2000

    this.spread = 0.7 // Math.random() * 0.5 + 0.8

    this.N = 40

    this.dx = (Math.random() + 0.01) * (Math.random() > 0.5 ? -1 : 1)

    this.dy = (Math.random() + 0.01) * (Math.random() > 0.5 ? -1 : 1)

  }

  draw() {

    let angle = 0

    // noFill()

    beginShape()

    while (angle <= TWO_PI) {

      let xoff = map(cos(angle), -1, 1, this.offset, this.offset + this.spread)

      let yoff = map(sin(angle), -1, 1, this.offset, this.offset + this.spread)

      let r = noise(xoff, yoff) * this.r

      let x = this.cx + r * cos(angle)

      let y = this.cy + r * sin(angle)

      vertex(x, y)

​

      angle += TWO_PI / this.N

    }

    endShape()

  }

  move() {

    this.cx += this.dx

    this.cy += this.dy

    if (this.cx <= -this.r/2 && this.dx < 0) {

      this.cx = width + this.r/2

    } 

    if (this.cx >= width + this.r/2 && this.dx > 0)  {

      this.cx = -this.r/2

    }

    if (this.cy <= -this.r/2 && this.dy < 0) {

      this.cy = height + this.r/2

    }

    if (this.cy >= height + this.r/2 && this.dy > 0) {

      this.cy = -this.r/2

    }

  }

}

​

​

class Tentacle {

  constructor(xmount, ymount, w, h) {

    this.x = xmount

    this.y = ymount

    this.w = w

    this.h = h

    this.t = Math.random() * 1000

    this.createPoints()

  }

  createPoints() {

    this.points = []

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

      this.points.push({

        x: this.x + noise(this.t),

        y: this.y + map(i, 0, 30, 0, this.h)

      })

      this.t += 0.001

    }

  }

  movePoints() {

    for (let p of this.points) {

      p.x =   

    }

  }

}

​

// class Tentacle {

//   constructor(cx, cy, h, w) {

//     this.cx = cx

//     this.cy = cy

//     this.h = h

//     this.w = w

//     this.offset = Math.random() * 2000

//     this.spread = 0.7 // Math.random() * 0.5 + 0.8

//     this.N = 40

//     this.dx = (Math.random() + 0.01) * (Math.random() > 0.5 ? -1 : 1)

//     this.dy = (Math.random() + 0.01) * (Math.random() > 0.5 ? -1 : 1)

//   }

//   draw() {

//     let angle = 0

//     // noFill()

//     beginShape()

//     while (angle <= TWO_PI) {

//       let xoff = map(cos(angle), -1, 1, this.offset, this.offset + this.spread)

//       let yoff = map(sin(angle), -1, 1, this.offset, this.offset + this.spread)

//       let r = noise(xoff, yoff) * this.h

//       if (angle <= PI / 2 + 0.1 && angle >= PI / 2 - 0.1) {

//         r = r / 8

//       }

//       let x = this.cx + r * cos(angle)

//       let y = this.cy + r * sin(angle)

//       vertex(x, y)

​

//       angle += TWO_PI / this.N

//     }

//     endShape()

//   }

//   move() {

//     this.cx += this.dx

//     this.cy += this.dy

//     if (this.cx <= -this.h/2 && this.dx < 0) {

//       this.cx = width + this.h/2

//     } 

//     if (this.cx >= width + this.h/2 && this.dx > 0)  {

//       this.cx = -this.h/2

//     }

//     if (this.cy <= -this.h/2 && this.dy < 0) {

//       this.cy = height + this.h/2

//     }

//     if (this.cy >= height + this.h/2 && this.dy > 0) {

//       this.cy = -this.h/2

//     }

//   }

// }

​