CS110 (Introduction to Computing)

Fall 2012 - Section 2

Assignment #2

Due by 4:00 pm on Tuesday, September 25, 2012

Task: Design an interactive sketch that does the following:

• It should have a background generated using randomness and iteration (for-in- or while-loops).
  
• For example, you might draw a nighttime sky filled with randomly colored and sized stars over a green field with random blades of grass, or a tessellated background with random colors.
  
• Each time the user presses a key, the program should erase the sketch and redraw a new random background.  The background should be different with each subsequent key press.
• As the user clicks on the sketch with the mouse, it should draw an object at the mouse location.  Something about the physical shape of this object must change based on its location. 
• For example, the size of a house could increase as the user clicks closer to the center of the sketch, or a smiley face's eyes could enlarge and its mouth grin depending on where it was placed.
• After several clicks, your sketch should have multiple copies of the object at different locations on the screen, each varying slightly based on the mouse position.
• You could even draw multiple different types of objects, depending on the mouse location.
  

Somewhere within your sketch, you must use (1) variables, (2) conditional if or if-else statements, and (3) for or while loop iteration.

Other hints:

• Make sure that it is at least 500 pixels by 500 pixels.
• Your objects can be simple.  For example, clouds could be made of multiple ellipses, flowers could be made with nested colored ellipses and a green rectangle.
• Your code should use variables as appropriate.
  
• Include proper sketch source code header and adequate comments.
• We recommend the following steps to develop your program.  After each step, you should run and test your program thoroughly, ensuring that it works.

1. Begin by randomly generating the background.  Develop this slowly, building up complexity as you go.  Test it to make sure it works after every few lines of code.
   
2. Handle the onKeyPressed event with a custom function that clears the background.  Test that it works.
   
3. Handle the onMousePressed or onMouseClicked event with a custom function that draws a simple shape (e.g., a single ellipse) at the mouse location upon a click.  Test that you can draw multiple objects and randomly regenerate the background.
4. Change the simple shape to the more complex looking object you want to draw.  Test your code.
5. Modify your complex object to adjust some aspect of its appearance (i.e. shape or size) based on the mouse location.  Test your completed program.

• Do not try to write the entire program at once. Trying to do everything at once and expecting it to work is the pathway to frustration.  Instead, build your program up slowly, testing as you go, you'll ensure that you always have a working program (and if it doesn't work, the error was in the small bit of code you just wrote).

Use the following structure for your program.

# 1. Header comments

# 2. Load the Processing module and create a new window
# 3. Declare variables (if any)
# 4. Define your drawBackground() and drawShape() event handler functions, using the following templates

def drawBackground(o, e):
    # Draw a background that contains random elements and repetition using a for or while loop
    pass

def drawShape(o, e):
    # Draw the object at the current mouse position
    # Use mouseX(), mouseY() values to change the physical shape or color of your object
    pass

# 5. Call the drawBackground() method once to initialize the background

# 6. Handle the onKeyPressed event with the drawBackground function
#    Handle the onMousePressed or onMouseClicked event with the drawShape function

Requirements:

• Generated background using randomness and for/while loop iteration
  
• Pressing a key clears the sketch and redraws a new random background
  
• Clicking the mouse causes different types of objects to be drawn on the sketch at the mouse location
  
• The physical appearance of the object (size, shape, color, etc.) changes based on the mouse location
  
• Conditional if- or if-else tests are used somewhere in the assignment
• Variables used appropriately in the remainder of the assignment
  
• Includes proper header and adequate comments