​

function setup() {

  createCanvas(800, 600);

  for (let i = 0; i < 5; i++) {}

}

​

function mouseDragged() {

  let x = mouseX;

  let y = mouseY;

  let size = random(10, 40);

  let rc = 246;

  let gc = 143;

  let bc = 160;

  let f = new Flower(x, y, size, rc, gc, bc);

  flowers.push(f);

  if (flowers.length > 25) {

    flowers.splice(0, 1);

  }

}

​

function draw() {

  background(0, 0, 255);

​

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

    if (flowers[i].contains(mouseX, mouseY)) {

      flowers[i].changeColor();

    } else {

      flowers[i].changeBack();

    }

​

    flowers[i].show();

    flowers[i].move();

  }

​

  //   flowers[1].show();

  //   flowers[1].move();

} // end of draw function

​

function mousePressed() {

  //i have to loop through the array defined above. iterating down from the array is best practice

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

    if (flowers[i].contains(mouseX, mouseY)) {

      //special code to delete an index from an array

      flowers.splice(i, 1);

    }

  }

}

​

class Flower {

  constructor(x, y, size, rc, gc, bc) {

    this.x = x;

    this.y = y;

    this.size = size;

    this.rc = rc;

    this.gc = gc;

    this.bc = bc;

  }

​

  contains(mx, my) {

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

    if (d < this.size) {

      console.log("contained");

      return true;

    } else {

      return false;

    }

  }

​

  changeColor() {

    this.rc = 0;

    this.gc = 0;

    this.bc = 0;

  }

  changeBack() {

    this.rc = 246;

    this.gc = 143;

    this.bc = 160;

  }

  move() {

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

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

    // this.a += random(5, -5);

    // this.s += random(0.2, -0.2);

    // if (

    //   this.x < 0 - this.size ||

    //   this.x > width + this.size

    //   // this.s > 4.5

    // ) {

    //   this.x = 100;

    //   // this.s = 1;

    // }

    // if (this.y < 0 - this.size || this.y > 400 + this.size) {

    //   this.y = 100;

    // }

  }

​

  show() {

    fill(this.rc, this.gc, this.bc);

    stroke(255);

    strokeWeight(2);

    ellipse(this.x, this.y, this.size, this.size);

    let new_size = this.size / 2;

    fill(255, 100, 200, 200);

    ellipse(this.x + new_size, this.y, new_size, new_size);

    ellipse(this.x - new_size, this.y, new_size, new_size);

    ellipse(this.x, this.y + new_size, new_size, new_size);

    ellipse(this.x, this.y - new_size, new_size, new_size);

  }

}

​

// function flower(x, y, size) {

//   fill(246, 255, 66);

//   stroke(255);

//   strokeWeight(2);

//   ellipse(x, y, size, size);

//   fill(255, 100, 200, 200);

//   var new_size = size / 2;

​

// }

​

// //NESTED FOR LOOP

// var r = 0;

// var g = 0;

// var b = 0;

//  for (var y = 20; y < height; y += 40) {

​

//      for(var x = 20; x < width; x += 40){

//             fill(r,g,b);

//           r = r+1;

//           g = g+1;

//           b = b+1;

//          stroke(y);

//          strokeWeight(2);

//          ellipse(x, y, 40, 40);

//      }

//  }

​