CS 101 Web Construction, Winter 2008, Instructor: Jeffrey Horn ASSIGNMENTS

Assignment 6 "JavaScript (with Image Maps)"

Handed out: Wednesday, November 19, 2008

Due: End of weekend (Sunday, December 7, 2008), end of day.

Goals:
1. Create client-side scripts
2. Learn basic Javascript
3. Create hot spots (clickable areas) on any image with <map>
4. Learn about "event-driven programming" by assigning Javascript code to the "onclick" attribute

Details: OPTION I: Find Waldo

- Implement a "Find-Waldo" type of game.
- The game should:
  1. Show the user an image.
  2. Ask the user/player to find something in the image and click on it.
  3. If the user's click is correct, then increase the score. If incorrect, do not increase score.
  4. You must have at least TWO somethings ("Waldos") that the user can click on.
  5. Score should cumulative and displayed.
Help:
- Example Code
- ISMAP Attribute: To help you find out the coordinates of items in your image, use the ismap attribute in your img element. This allows you to see the coordinates of your mouse! Try it here.

Grading Guidelines: OPTION I (Find Waldo)

For approx. "C": make an effort!
For approx. "B": a game that actually WORKS! (as specified in "Details" above).
For approx. "A": one or more "enhancements", such as...
1. Two or more images each with one or more "Waldos".
2. Use of the "poly" shape. (See here for info on shapes like poly, circle, and rect.. Look under the "optional attributes", in particular the attributes "coords" and "shape".)
I will grade this one solely on the basis of functionality (i.e., does it work?)

Details: OPTION II: Graphically Filling out a Form (discussed in class)

Turn-in Procedure: Upload to web. Send me URL: