AL_ArtGameThing

var ball = {
    x: 0,
    y: 0,
    diam: 100
}

var easing;
var dx, dy;
var xpos, ypos;
var diam;
var bgColor;
// var xspeed, yspeed; //eventually use if statement to incrementally decrease speed as more ellipses merge

function setup() {
    createCanvas(800,800);
    easing = .25;
    xpos = random(width);
    ypos = random(height);
    diam = random(25,75);
    bgColor = color(random(0,200),random(0,200),random(0,200));
}

function draw() {
    background(bgColor);
    drawSmall();
    drawBall();
    followMouse();
}

function drawSmall() {
    noStroke();
    fill(255);
    ellipse(xpos, ypos, diam, diam);

    if(dist(ball.x, ball.y, xpos, ypos) < ball.diam/2) {
        // fill(0); //fill small ball black to make it seem like it "absorbed" into ball?
        ball.diam += diam; //not sure WHY ball takes up the entire screen instead of just increasing ball.diam but it's really funny
    }
}

function drawBall() {
    noStroke();
    fill(255);
    ellipse(ball.x,ball.y,ball.diam,ball.diam);
}

function followMouse() {
    dx = mouseX - ball.x;
    ball.x += dx*easing;
    dy = mouseY - ball.y;
    ball.y += dy*easing;
}

function mouseClicked() {
    location.reload(); //reload page
}
// mouseClicked() stops followMouse()?
// function mouseClicked() {
//  this.x = random(width);
//  this.y = random(height);
//  this.diam = random(25,50);
//  this.xspeed = random(-3,3);
//  this.yspeed = random(-3,3);

//  this.draw = function() {
//      fill(255);
//      ellipse(this.x, this.y, this.diam, this.diam);
//  };

//  bouncing not working?
//  this.update = function() {
//      this.x += this.xspeed;
//      this.y += this.yspeed;
//  };

//  this.bounce = function() {
//      if(this.x > width-this.diam/2 || this.x < this.diam/2) {
//          this.xspeed *= -1;
//      }
//      if(this.y > height-this.diam/2 || this.y < this.diam/2) {
//          this.yspeed *= -1;
//      }
//  }
// }