Drawing with Conditionals

Mouse Events

mouseX and mouseY are special values within p5 that store the X,Y position from the current frame. pmouseX and pmouseY store the X,Y position from the previous frame. Try adding another conditional to clear the canvas (i.e. set it to black) when you press any key. Hint: look up the keyIsPressed() function.

Key Codes

Changing Strokeweight with Keys

Creating a User Interface

Try the following code. You should see that the button works for toggling between rect and line, but unfortunately makes a mess because the stroke color and strokeWeight are also applied to the button itself. How can we fix this? You'll see in the next example.

Let's try to clean up the button mess from the last example. We can decouple the button styling from the rest of the app by storing the current "penColor" as a global variable. Look at how the keyPressed() function has now changed