Assignment 2

Extend the Little Transport-themed Animation

Individual Assignment

The goal of the assignment is to do some basic animation and interaction. Make the Processing applet draw on a 500 x 500 display size.

For this assignment part, create a Processing applet by developing the application in the Processing development window, then Select File->Export. This will create a folder with index.html plus the source code and the JAR file that contains your applet. Upload this folder to your pub_html folder on fraser.sfu.ca. You can then access this applet by going to the URL http://www.sfu.ca/~YourSFUID/yourIAT334Assignment2Folder/theAppletYouJustLoaded.

Upload a link to you assignment in the Sakai IAT 334 DropBox: Assignment2
Upload a link that points your assignment, and be sure to set the button that says "Send an email notification to the Instructor(s)"
You must demonstrate the result to the TA, and be prepared to change it to adjust its functionality in the lab.
You will not get credit without demoing it to the TA.

Required Features

Depending on the last digit of your student number, you must have one and only one of the following features in your animation.

Click means press and release the mouse button.
Drag means press the mouse button and move the mouse while the button is held.

• 0
  Draw a bus that moves horizontally from left to right.
  When the vehicle hits the right boundary, it "wraps around" to the left and moves down 50 pixels.
  Draw a road for the bus to travel on.
  When you press and release the b key, this will toggle bus motion. Press the key repeatedly to stop and continue the vehicle animation.
  Add: An image of a bus instead of a bus made of polygons.
  When you click on the bus, it reverses direction.
  When you click on the bus and drag it, it follows the mouse. The bus continues to drive from the point you drop it.
  Update the road based on where you drop it!
• 1
  Draw a single train car that moves horizontally from left to right.
  When the vehicle hits the right boundary, it "wraps around" to the left and moves down 65 pixels.
  Draw a track for the train to travel on. When you press and release the t key, this will toggle train motion.
  Press the key repeatedly to stop and continue the vehicle animation.
  Add: An image of a train instead of a train made of polygons.
  When you click on the train, it grows in size.
  When you click on the train and drag it, it follows the mouse. The train continues to move horizontally from the point you drop it.
  Update the track based on where you drop it!
• 2
  Draw an automobile that moves horizontally from left to right.
  When the vehicle hits the right boundary, it "wraps around" to the left and moves down 80 pixels.
  Draw a road for the car to travel on.
  When you press and release the c key, this will toggle car motion. Press the key repeatedly to stop and continue the vehicle animation.
  Add: An image of a car instead of a car made of polygons.
  When you click on the car, it turns right.
  When you click on the car and drag it, it follows the mouse. The car continues to drive from the point you drop it.
  Don't update the road. The car has off-road capabilities.
• 3
  Draw a bus that moves vertically from top to bottom.
  When the vehicle hits the bottom boundary, it stops, jumps to the right 50 pixels and moves vertically up to the top.
  When the vehicle hits the bottom boundary, it stops, jumps to the left 50 pixels and moves down to the bottom.
  Draw a road for the bus to travel on. When you press and release the b key, this will toggle bus motion. Press the key repeatedly to stop and continue the vehicle animation.
  Add: An image of a bus instead of a bus made of polygons.
  When you click on the bus, it turns left 90 degrees.
  When you click on the bus and drag it, it follows the mouse. The bus continues to drive from the point you drop it.
  Update the road based on where you drop it, and accounting for each turn!
• 4
  Draw a single train car that moves vertically from top to bottom.
  When the vehicle hits the bottom boundary, it stops, jumps to the right 65 pixels and moves vertically up to the top.
  When the vehicle hits the bottom boundary, it stops, jumps to the left 65 pixels and moves down to the bottom.
  Draw a track for the train to travel on. When you press and release the t key, this will toggle train motion. Press the key repeatedly to stop and continue the vehicle animation.
  Add: An image of a train instead of a train made of polygons.
  When you click on the train, it turns right.
  When you click on the train and drag it, it follows the mouse. The train continues to move horizontally from the point you drop it.
  Update the track based on where you drop it, and account for each turn!
• 5
  Draw an automobile that moves vertically from top to bottom.
  When the vehicle hits the bottom boundary, it stops, jumps to the right 80 pixels and moves vertically up to the top.
  When the vehicle hits the bottom boundary, it stops, jumps to the left 80 pixels and moves down to the bottom.
  Draw a road for the car to travel on. When you press and release the c key, this will toggle car motion. Press the key repeatedly to stop and continue the vehicle animation.
  Add: An image of a car instead of a car made of polygons.
  When you click on the car, it grows 10%.
  When you click on the car and drag it, it follows the mouse. The car continues to drive from the point you drop it.
  Update the road based on where you drop it!
• 6
  Draw a bus that moves diagonally from the top left towards the bottom right
  When the vehicle hits the bottom boundary, it "wraps around" to the top and moves to the right 50 pixels.
  When the vehicle hits the right boundary, it "wraps around" to the left boundary and continues.
  Draw a road for the bus to travel on. When you press and release the b key, this will toggle bus motion. Press the key repeatedly to stop and continue the vehicle animation.
  Add: An image of a bus instead of a bus made of polygons.
  When you click on the bus, it turns alternatively left or right so that it is moving either horizontally or vertically.
  When you click on the bus and drag it, it follows the mouse. The bus continues to drive from the point you drop it.
  Update the road based on where you drop it, and accounting for each turn!
• 7
  Draw a train that moves diagonally from the top left towards the bottom right
  When the vehicle hits the bottom boundary, it "wraps around" to the top and moves to the right 65 pixels.
  When the vehicle hits the right boundary, it "wraps around" to the left boundary and continues.
  Draw a track for the train to travel on. When you press and release the t key, this will toggle train motion. Press the key repeatedly to stop and continue the vehicle animation.
  Add: An image of a train instead of a train made of polygons.
  When you click on the train, gets 10% larger.
  When you click on the train and drag it, it follows the mouse. The train continues to move horizontally from the point you drop it.
  Update the track based on where you drop it!
• 8
  Draw a car that moves diagonally from the top left towards the bottom right
  When the vehicle hits the bottom boundary, it "wraps around" to the top and moves to the right 80 pixels.
  When the vehicle hits the right boundary, it "wraps around" to the left boundary and continues.
  Draw a road for the car to travel on. When you press and release the c key, this will toggle car motion. Press the key repeatedly to stop and continue the vehicle animation.
  Add: An image of a car instead of a car made of polygons.
  When you click on the car, it turns alternatively left or right so that it is moving either horizontally or vertically.
  When you click on the car and drag it, it follows the mouse. The car continues to drive from the point you drop it.
  Don't update the road. The car has off-road capabilities.
• 9
  Draw a bus that moves along a circular path centered at the center of the screen
  Draw a circular road for the bus to travel on.
  When you press and release the b key, this will toggle bus motion.
  Press the key repeatedly to stop and continue the vehicle animation.
  Add: An image of a bus instead of a bus made of polygons.
  When you click on the center of the ring road, the bus jumps to the center and starts travelling downward. When it hits the top or bottom boundary, it reverses direction.
  When you click on the bus and drag it (once it's travelling down), it follows the mouse. The bus continues to drive down from the point you drop it.
  Create a new vertical road based on where you drop it!

Due: In Lab Thursday/Friday, January 27/28