//MAKE: 2.12 Hand-in — Shy Link Is Shy


Saving your work

Use Save as... to save the empty template as "2.12H-ShyLinkIsShy-LastName.html" in your Computer Programming 12 directory.

The assignment

Use function pipelines to create a program that moves animates something smoothly in response to clicks and the movement of the mouse.

Evaluation — [pdf] [pub]

For example: Poor Link is shy! Click on him to see what happens...

Make it your own

This assignment does not have to use Link. Look at the criteria - as long as you meet those criteria you should be good...

Not sure where to start?

These are step by step directions to complete the basic version of this assignment.

Note that this does not include an onclick event

  1. create an element to move, assign it an id, and change its position mode using CSS
  2. create a process function called getRandomDistance that will randomly generate and return a distance between 101 and 200
  3. create a process function called getRandomDirection that will randomly generate and return a number between 1 and 4
  4. create output functions called goUp, goDown, goLeft, and goRight
  5. create a process function called mainProcedure that will be triggered when the element is moused over
  6. If you haven't already, check that you have added descriptive comments to each function
  7. Although it is not required, use console logs at the beginning of each function to tell you where you are