We continued talking about JavaScript, in particular we saw how to use DOM to do input and output through forms (Chapter 9) and how to use functions to make the HTML less clunky (Chapters 7 and 9). We will see more examples of this next week.
1. [JavaScript, volume of the sphere,20pt] Write a web-page that contains a form (named r_form) with two HTML text input fields, one called radius, the other volume and a button. Clicking the button should activate a function comp_volume() defined in a script tag in the header of the document that
retrieves the user-entered radius from the radius input field into a variable called sphere_rad,
computes the area of a circle with radius sphere_rad into a variable named sphere_volume. The formula is V = 4/3 r3 π. (You can get π in JavaScript as Math.PI),
writes the value of sphere_volume into the area input field.
Test your page by entering r = 1. As output you should get 4.19 ...
2. {JavaScript, Colors, 20pt] Write a web-page that has input fields for two colors: one for text, one for background. When clicking a button, the page should change text and background color according to the user specifications. Note: Clicking the button activates a function that obtains the two colors specified by the user and sets the page colors accordingly. You can extend a similar example we did (for background color only) in class. Include some text on your page so you can test the effect. The text color of a document is controlled by document.fgColor (note the uppercase C).
3. [Extra Credit] Write a currency converter that allows you to specify the type of conversion (e.g. Euro->Dollars, Dollars->Euro, Yen->Euro, etc.) using a drop-down list of options. Clicking a button should then perform the currency conversion (using form input fields for input and output). Your converter should support conversions back and forth between three currencies, you can pick which (this means your drop-down list will have six choices). Hint: it's not as difficult as it may seem; in the option tag you can actually specify a value which is different from the choice that appears in the drop-down list. That'll come in very handy.