Conditionals

Part 1

Using variables, draw the diagram you see here. The sketch window is 100 by 100 with a white background. Save the sketch with the name diagonal.

If the mouse is in the upper right triangle of the sketch (the area labeled “A”), highlight it in some color of your choice. Otherwise, highlight the lower right triangle (labeled “B”) in a different color of your choice. The letters in the diagram are there for your reference only. You do not have to draw them in your sketch.

You can tell that the mouse is in area A when the value of mouseX is greater than the value of mouseY.

Part 2

In a sketch window that is 100 by 100 pixels with a white background, draw the diagram you see at the right. Do not draw the letters or the gray line in the middle. Save the sketch with the name diamond.

If the mouse is in area A or area B, then highlight area E in a color of your choice. If the mouse is in area C or area D, then highlight area F in a color of your choice. Otherwise, highlight areas A, B, C, and D in a color of your choice.

Determining the Areas

How can you tell when the mouse is in each of the corner areas? Take a point that is clearly inside each of the four corner areas. Look at the results of mouseX + mouseY and mouseX - mouseY for each of those points and see if you can figure out the appropriate relationships. When you are doing your own programs, you will have to figure out this sort of thing for yourself. If you are totally stuck, here is the answer.

Additional Hint

Set noStroke() at the beginning of draw(). Draw the colored areas first, and save the diamond shape for last. Turn on stroke(0) and then draw the diamond shape.

Part 3

Processing has functions that let you determine the time of day: second(), minute(), and hour(). You will use these functions to control a sketch with three items in it. Save the sketch with the name time.

• Use the hour() function to control the size, color, or position of one of the items in the sketch.
• Use the minute() function to control the size, color or position of the second item.
• Use the second() function to control the size, color, or position of the third item.

For example, you might choose a triangle as the indicator for hour, and change its size depending upon the value of hour(). You might choose a line as the indicator for the minute, and change its color depending on the value of minute(). You might choose an ellipse as the indicator for the second, and change its size depending on the value of second(). None of this requires the use of any conditionals (though if you do want to use conditionals for extra visual effect, feel free). Here are two further specifications which do require conditionals:

• Change the background color of the sketch depending upon which quarter-day it is by hour: 0-5 (midnight to 5:59:59 a.m.), 6-11 (6 a.m. to 11:59:59 a.m)., 12-17 (noon to 5:59:59 p.m)., and 18-23 (6 p.m. to 11:59:59 p.m.)
• Your minute indicator changes either size, color, or position every minute. Select a different attribute. Give that attribute one value for minutes 0-29, and a different value for minutes 30-60. In the example, you might have decided to change the line’s color every minute. So you would have to select a different attribute of the line; say, its position. For the first half hour of every hour, the line might appear at the top of the sketch; for the second half hour of every hour, the line would appear at the bottom of the sketch.

Although you are using the time functions, your sketch does not have to look like a clock. I don’t care if nobody can tell what time it is by looking at your sketch. It can be as representational or as abstract as you like, so be creative!

Testing the Sketch

Clearly, you cannot sit in front of your computer for 24 hours. However, you can set the computer’s clock to times such as 11:59 p.m., 5:59 a.m., 11:59 a.m., and 5:59 p.m. to see if the background color and minute indicator changes work properly. You may also want to set the clock to 4:29 p.m. to see that the half-hour shift works at the bottom of the hour as well as the top of the hour. Just remember to set your computer’s clock back to the correct time when you finish your testing!

When You Finish

Zip up all the sketches into a zip file named conditionals.zip and upload it.