CISC103, Fall 2005

Activity 5: JavaScript Calculations using a for loop

Introduction

In this activity, you'll be given a sample problem involving a for loop, and a solution to that problem.

You'll then be given a similar problem, and you'll asked to come up with your own solution.

The solved problem is similar to one covered in lecture: namely constructing a table of fahrenheit to celsius conversions.

The problem where you will come up with your own solution will be to produce a table of miles to kilometer conversions.

Learning objectives

By the time you complete this activity, you should know how to do the following in JavaScript:

write out a table using a for loop
understand the initialization, test and increment values in a for loop.

Other skills you'll also need that comes from previous activities:

do simple calculations using assignment statements
construct an HTML table element using tr, th and td elements where appropriate.
write out HTML to the main document using document.write() statements.

You should also know how to put JavaScript into an XHTML file that will pass validation at validator.w3.org.

Step-by-Step Instructions

Step 1: Look over the fahrenToCelsius web page

Here is the assignment for the file fahrenToCelsius.html. Read over this assignment, then look at the solved problem in the file fahrenToCelsius.html (located in the folder activity05 under the activities link on the course web page.) Note especially the use of the toFixed() method (this is a method of the Number class).

Write out a table containing a conversion from Fahrenheit to Celsius. The table should have two columns with appropriate headings. The values in the table should range from 50 to 100, stepping up in increments of 5. The celsius temperatures should be accurate to two digits after the decimal point.

Include an XHTML comment near the top of the file that includes the file name, your name, the date, and the assignment (activity 3 for CISC103).

Be sure all your tags follow the XHTML standard: i.e. they should be all closed, properly nested, and written with lowercase letters. Your file should pass validation at http://validator.w3.org

Try reloading the page several times. Also do a "view source" and read through and try to understand the XHTML and JavaScript source. Finally, note that if you run this through validator.w3.org, it will pass validation as XHTML 1.0 Transitional.

Step 2: Put the fahrenToCelsius.html file on your web site on copland

Your next step is to put this pizzaForm.html file on your web site on copland, so that if you click on the link below (where your userid is in place of "userid"), the file comes up.

http://copland.udel.edu/~userid/cisc103/activity05/fahrenToCelsius.html

Here's what you need to do:

Download the file to the hard drive of your PC
Open the ssh secure file transfer program, and connect to copland.udel.edu.
On the copland side of the window, navigate into public_html, and create a folder called cisc103 (if it doesn't already exist). Navigate into that folder.
Now, inside cisc103 (which is inside public_html), create a folder called activity05
Upload the correct HTML file into the folder activity05.
Make sure that
http://copland.udel.edu/~userid/cisc103/activity05/fahrenToCelsius.html

links to the correct page.

Note: If you have trouble with errors such as "403 forbidden", then you need to right click on the file in the SSH File transfer program, and set the permissions of the file to the octal number "755". You may need to do this on the folders public_html, cisc103, and activity05 as well, if it was not already done.
When you have done this, you are ready to move on to steps 3 and 4. If you can't get it to work, you can move on to step 3 until you can get help from your TA or your instructor, but you won't be able to proceed to step 4 until you get this step to work.

Step 3: Write your own web page milesToKilometers.html

Now write a page similar to pizza.html called gas.html that solves the following problem. Save the file under a folder called activity05 under your personal folder on the H drive.

Write out a table containing a conversion from miles to kilometers. The table should have two columns with appropriate headings. The values in the table should range from 100 to 1000, stepping up in increments of 50. The kilometer values should be accurate to one digit after the decimal point.

Include an XHTML comment near the top of the file that includes the file name, your name, the date, and the assignment (activity 3 for CISC103).

Be sure all your tags follow the XHTML standard: i.e. they should be all closed, properly nested, and written with lowercase letters. Your file should pass validation at http://validator.w3.org

Note that in order for the JavaScript section to pass validation, you need to enclose it in an XHTML comment.

Step 4: Upload gasForm.html to your web site on copland

Now, to submit the file, use the same process you used in step 2 to upload this file to the following URL:

http://copland.udel.edu/~userid/cisc103/activity05/milesToKilometers.html

Evaluation and Grading

This activity counts as a regular lab grade out of 50 pts, broken down as follows:

10 pts	Validation	Validate milesToKilometers page against validator.w3.org. There should be no XHTML errors (10 points each)
10 pts	Style	XHTML and JavaScript code should be clean and neat, with tags aligned and indented properly to make the code readable. JavaScript code should contain comments to explain what is happening in the code (10 points each)
20 pts	Correctness	The web page should behave as described in the assignment description (20 points each)
10 pts	Following directions	The web page should be submitted according to the directions in the assignment.

Copyright 2005, Phillip T. Conrad, CIS Dept., University of Delaware. Permission to copy for non-commercial, non-profit, educational purposes granted, provided appropriate credit is given; all other rights reserved.