So my code uses a black outlined green circle to create drawings. If i hit up, it gets larger, down arrow, smaller. We have also manipulated colors. Left areow makes it orange, “r“ makes it red.
var x, y, d;
function setup () {
createCanvas (600,600);
//this determines my circle
x = 300;
y = 50;
d = 50;
//this is the color of my circle
r = 0;
g = 255;
b = 0;
}
function draw () {
//this is my drawing program
//on this line, insert noStroke (); Â if you would like no outline
fill (r, g, b);
ellipse (mouseX, mouseY, d, d);
}
function keyPressed(){
//if i press the up key, my brush increases in size
if (keyCode === UP_ARROW){
d += 10;
}
//if i press the down key, it goes the reverse direction (decreases)
else if (keyCode === DOWN_ARROW){
d -= 10;
//if my brush is greater than 50
if (d >= 50){
d -= 2;
}
}
//if i press the right key, make my brush orange
else if (keyCode === LEFT_ARROW) {
//this is the color value for orange
r =255;
g =165;
b =0;
}
//if i push the right key, make my brush green
else if (keyCode === RIGHT_ARROW){
r = 0;
g = 255;
b = 0;
}
//if i push r, change it to red
else if (key ==='r'){
r = 255;
g = 0;
b = 0;
}
}
function mousePressed (){
background ('pink');
}