# Project 03 – Dynamic Drawing

Is the code more complicated than it needs to be? Yes. Did it still take me way too long to figure out? Also Yes.

sketch
``````//Iris Yip
//15104 Section D

var wwidth = 600,
wheight = 600,
ballx,
bally,
hvelocity,
vvelocity,
clickdistance,
rvalue,greenvalue,bluevalue;

function setup() {

createCanvas(wwidth, wheight);

// starting point
ballx = wwidth/2;
bally = wheight/2;

// starting velocity
hvelocity = random(-5,5);
vvelocity = random(-5,5);

// starting ball size
ballsize = random(10,150);

// ball color
redvalue = random(100,255);
greenvalue = random(100,255);
bluevalue = random(100,255);

};

function draw() {

//background
background(0)
let rectBlue = map(mouseY, 0, height, 0, 255);
fill(255, rectBlue, 200);
rect(0,0, 600, 600);

fill(redvalue, greenvalue, bluevalue);
ellipse(mouseX, mouseY, 100, 100);

// ball bounce-back conditions
if(ballx >= width - ballsize || ballx <= ballsize){
hvelocity = -hvelocity;
};
if(bally >= height - ballsize || bally <= ballsize){
vvelocity = -vvelocity;
};

// ball location change
ballx += hvelocity;
bally += vvelocity;

// render ball
noStroke();
fill(redvalue, greenvalue, bluevalue);
ellipse(ballx, bally, ballsize * 2, ballsize * 2);

};

function mouseClicked() {
{

clickdistance = dist(mouseX, mouseY, ballx, bally);

if(clickdistance <= ballsize) {

// change velocity if clicked on the ball
hvelocity = random(-5,5);
vvelocity = random(-5,5);

// change ball color
redvalue = random(100,255);
greenvalue = random(100,255);
bluevalue = random(100,255);

//changing ball size
ballsize = random(50,100);

};

};

};``````