Introduction to Javascript

How to submit this assignment

• create a directory named hw4 in your protected directory, which is a subdirectory of your public_html.
• Write the solutions for the three parts of this problem set in files p1.html, p2.html and p3.html.
• Make a page assign4.html in hw4 and create links from it to p1.html, p2.html and p3.html.
• In assign4.html please add a sentence to tell us how many hours you spent working on this assignment.
• Upload all the relevant files into folder hw4. As always, you need to test and make sure everything works properly from the server.

Part 1: Mad Lib

Many of us played with Mad Libs as kids. The idea is to ask someone — a friend, a victim — for some words, such as (1) a name, (2) a color, (3) an animal, and so forth. Then, you fill the words into a story, yielding an odd result, because they made their choices without any idea what the story would be:

Hillary was out driving in her new purple car when she accidentally ran over a rhinoceros. "Oh, no," cried Hillary...

Create a web page that serves as an interactive Mad Lib program. More specifically, your program should do the following:

1. Use prompt() statements to ask the user to enter 4 kinds of missing words: a noun for a name, a noun for an object, an adjective, and an adverb.
2. Store the user's replies in javascript variables.
3. Display the resulting story on the web page (not in a pop up window!).

The story will be dynamically produced, and it will incorporate the user's input. So, every time the page is reloaded, the user will have the chance to enter new words, and therefore the resulting story will be different, depending on those words.

The requirements for the story are:

1. It must be at least 4 sentences long.
2. At least one of the missing words must appear at least 3 times in the story. For example, the person's name was used twice in the sample story above. (Note that duplicated words are entered only once by the user!)
3. A title for the story should appear at the top of the produced page. This story title should includes your own name (if you are Wendy, something like “Wendy's Crazy Mad Lib Story!”). Use your story title as the title for your HTML page as well.

The content of the story can be anything that you like — be creative!

Part 2: Computing Gas Costs

For this assignment you need to write a web page to help the user compute the cost of gas for the road trip they are planning.

Your page should ask the user to input:

• the total distance they plan to travel, in miles (specify a whole number, such as 100).
• the current cost of gas per gallon (specify dollars and cents, such as 3.15)
• The mileage they get on their car, in miles per gallon (specify a whole number, such as 25).

Then, use Javascript to compute:

1. the gas cost for this particular trip.
2. the gas cost for the same trip (same distance, same gas price), if the car was a small-sized hybrid car. Assume mileage to be 44 miles per gallon for such a car.
3. How much money would the user save on this trip, if they were using a hybrid car?

Show the results of the above questions on the web page. Display only the final dollar amounts; to remove the digits after the decimal point, use the parseInt() function.

Part 3: GIF File Size Calculations

1. A GIF image of 300 by 215 pixels uses 128 colors. How many bytes are needed to:
   1. Represent the pixels for this image?
   2. Store the color table for this image?
2. Recalculate the answers if the image uses 230 colors.
3. Recalculate again if the image uses only 32 colors.

Back to the top of the page

Introduction | Syllabus | Assignments | Documentation | Project

Computer Science 110
Last Modified: February 2008