// let unicorn;

​

let flower;

let kittens = [];

​

function preload() {

  flower = loadImage("flower.png");

  for (let i = 0; i < 5; i++) kittens[i] = loadImage("kittens/kitten" + i + ".jpg");

}

​

function setup() {

  createCanvas(600, 400);

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

    let x = random(width);

    let y = random(height);

    let r = random(50, 150);

    let kitten = random(kittens)

    let b = new Bubble(x, y, r, kitten);

    bubble.push(b);

  }

  // unicorn = new Bubble(400,200,10);

​

}

​

​

function mousePressed () {

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

    bubble[i].clicked(mouseX, mouseY);

  }

}

​

function draw() {  background(0);

​

​

​

  // if (bubble1.intersects(bubble2)) {

  //   background(200, 0, 100);

  // }

​

  //   unicorn.x = mouseX;

  //   unicorn.y = mouseY;

  //   unicorn.show();

  //   unicorn.move();

​

  for (let b of bubble) {

    b.show();

    b.move();

    let overlapping = false;

    for (let other of bubble) {

      if (b !== other && b.intersects(other)) {

        overlapping = true;

      }

    }

    if (overlapping) {

      b.changeColor(255) ;

    } else {

      b.changeColor(0);

    }

​

  }

​

}

​

class Bubble {

  constructor(x, y, r, img) {

    this.x = x;

    this.y = y;

    this.r = r;

    this.kitten = img;

  }

​

  intersects(other) {

    let d = dist(this.x, this.y, other.x, other.y);

    if (d < this.r + other.r) {

      return true;

​

    } else {

      return false;

    }

  }

​

  changeColor(bright) {

    this.brightness = bright;

​

  }

​

  clicked(px, py) {

    // let d = dist(px, py, this.x, this.y);

    // if (d < this.r) {

    if (px > this.x && px < this.x + this.r && py > this.y && py < this.y + this.r) {

    this.kitten = flower; //random(kittens);

    }

  }

​

  move() {

    this.x = this.x + random(-2, 2);

    this.y = this.y + random(-2, 2);

​

  }

​

  show() {

    image(this.kitten, this.x, this.y, this.r, this.r);

    // stroke(255);

    // strokeWeight(4);

    // fill(this.brightness, 125);

    // ellipse(this.x, this.y, this.r * 2);

​

  }

​

}