Lite Applets, Forms, and Javascript

In this section we look at how the Lite applet Image_and_Cursor can be used together with html forms and Javascript to create highly interactive modules -- in particular, to create modules in which a student can check his or her work by seeing the results rather than looking up the answer in the back of the book. The best way for you to start is by working through the material between the lines below. If you want to cut to the chase without working through the problem try the following answers in the form below:

• Low end of the domain: 0
  
  
• High end of the domain: 423
  
  
• The function f(x): -0.00504238 * x^2 + 2.34528 * x - 69.4962

The photograph above shows water squirting from a water fountain. Your job is to find a function y = f(x) describing the curve formed by the squirting water. As part of describing the function f(x) you will need to specify its domain -- that is, the lowest and highest values of the variable x.

You can click on the photograph above to find the coordinates of the point at which you clicked. You can fine tune the selected point by clicking at the arrows at the four sides of the photograph. Each click on an arrow moves the cursors one pixel in the direction indicated by the arrow.

You must enter three items in the form below to describe the curve formed by the squirting water. The first two items specify the domain of the function f(x) and, thus, the part of the photograph above containing the curve formed by the squirting water. The third item is an algebraic expression -- like x^3 - x + 12, for example -- that defines the function f(x) that describes the shape of the curve.

After you have entered the three items in the form below, click the "Try it!!" button to see your curve superimposed on the photograph.

After you have found a function that you are reasonably happy with that describes the curve formed by the squirting water, discuss why it does not do as good a job as you might have hoped.

Describe the Squirt is the student-ready version of the module above.

The three one sheet documents below explain how this module was created.

• One sheet instructions on adding a curve in Image_and_Cursor.
  
  
• One sheet instructions on using forms.
  
  
• One sheet instructions on creating a new html page on the fly responding to the user.

Complete documentation for the Image_and_Cursor applet is contained in the User's Manual. This applet is very flexible. Included among its features are:

• Extensive control over the appearance of the applet including the colors of all the displayed elements and their placement.
  
  
• The initial position of the cross hairs.
  
  
• Which elements are displayed.
  
  
• What marks are used when the user marks a point and whether the marks are connected by lines.
  
  
• The ability to add a curve to the image using any of the forms y = f(x), x(t) and y(t), and r = f(theta). Control of the number of segments used to draw the curve and the domain of the independent variable used to draw the curve. Control of the color and thickness of the curve.
  
  
• The ability to produce listed output in any one of three different forms designed for use in a spreadsheet, Maple, or Mathematica.
  
  
• The ability to produce polar coordinates as well as Cartesian coordinates for marked points. The ability to specify the location of the origin for polar coordinates.

Because most parameters have the most commonly used options set as default values, most curriculum developers will only need to specify a few parameters. For complete documentation see the User's Manual.

We continue with another module that uses this applet to study the shell of a chambered nautilus.