Paintbrush and Drawable area
1. The first step was to designate a drawable area in the canvas. For this, I chose an equilateral square of specific coordinates having the center in the center of the canvas. This polygon was then graphically represented.
2.A paintbrush (pattern) was created by temporarily giving the program coordinates to draw two concentric circles, one smaller than the other, the small with black fill, the bigger one with pink fill; and a blue triangle.
3. The previous temporary coordinates where replaced by the mouseX and mouseY variables. The center of the circles was selected to be as the exact mouse coordinates. The other coordinates were adjusted by adding or subtracting dimensions so they could replicate the original pattern as the mouse moved.
4. Since the purpose of the exercise was only to be able to draw in the designated area, while the mouse button was pressed it was important to create a set of constraints inside my sketch. The first constraint referred to the situation where the mouse was either pressed or not. In the case it was pressed the code will identify if the mouse position was inside the area by comparing x and y coordinates to the limits of the area. These were done using the conditional statement If.
5. Another button was created for saving images using the save frame (filename) command. This button just works when you run it in processing, not when used in the web browser. As you roll-over the button it turns yellow as a feed back and when you click in turns blue.
6. A similar button was done at the right corner of the canvas which is used to clear the drawable area.
