Instructions for Instructors and Authors

You will need three items to work with this material.

You and your students must have the free Adobe Flash Player 9 installed on your computer. Please follow the link to install or upgrade the plug-in..
You must have the free jsMath installed on your server and you and your students must have the free jsMath fonts installed on their computers. Please follow the link to obtain and install these components.
You will need a directory with several files from this site. Download the compressed folder and unzip the directory and keep it in a safe place. You may want to work with copies of this directory.

Changing the Image

The first thing many people want to do is substitute their own image for the Black Knight image used in this article. This is really easy. The Black Knight image is a .gif file, named basepicture.gif, and is 135 pixels by 135 pixels. Your image should be roughly the same size but it does not need to be square. It should be a gif and it should have the same name, basePicture.gif. Substitute your image file for the one in the imageAnimationsOSSLET directory. You can try your new image out by double-clicking either OSSLET.html or imageAnimations.swf.

Changing the Demonstrations, Examples, and Questions in the OSSLET

When the OSSLET is loaded it reads in an .xml file that describes the demonstrations, examples, and questions. This is an ordinary text file named imageAnimations.xml. The syntax should be fairly obvious. Open this file in your favorite text editor and look at it as we discuss it. You may want to make a back-up copy, so that you can go back to the original if necessary.

The first and last lines of this file are < imageAnimations> and </imageAnimations>. These lines should be left as is.
You will notice several blocks of text that read something like:
```
< matrix a11 = "cos(6 * pi * t)"
    a12 = "-sin(6 * pi * t)"
    a21 = "sin(6 * pi * t)"
    a22 = "cos(6 * pi * t)"  />
	
```
A block like this describes a matrix. The syntax should be self-expanatory.
You will notice several lines of text that read something like:
```
< vector b1 = "2.5 * sin(6 * pi * t)"
    b2 = "2.5 * cos(6 * pi * t)" />
	
```
A line like this describes a vector. The syntax should be self-expanatory.
Toward the beginning you will notice a pair of tags < initial> and < /initial >. This pair of tags describe the vector and matrix (enclosed within the pair) that are shown when the OSSLET is first loaded. This vector and matrix control the display in the lower right. As soon as the user clicks any button other than Play, Pause, or Stop these entries are set to the identity matrix and the zero vector. If you want to present just a list of problems, these should be set to the identity matrix and the zero vector.
You will notice several pairs of tags < problem name = "Question 1"> and < /problem>. Each pair of these tags encloses a matrix and vector that describe a problem. These are not displayed by the OSSLET but they do control what the user sees in the lower left when the Play button is clicked. Notice the phrase name = "Question 1". A phrase like this specifies what should be displayed on the button in the upper right. The problems should be in the order you want them to appear. You can include up to ten. Note that some of these "problems" can be examples. When the OSSLET is first loaded, the first problem is selected. The user selects subsequent problems by clicking the buttons in the upper right.
Often the first "problem" tags and the "initial" tags are used together to set up a demonstration or example in which you want the student to see how something is accomplished. Then subsequent problem tags are real problems in which the student does not see the answers.

The Files in the Directory imageAnimationsOSSLET

basePicture.gif: This file was described above.
The directory bkde: This directory contains the parser files that are used by this OSSLET. It must be included in the same directory as the other files.
imageAnimations.swf: This is the ShockWave file. It should open in Flash Player 9 if you double click it.
OSSLET.html: This is an html file that contains the OSSLET. Look at this file to see the required html code.
fullFormBackdrop.swf: This is another file used by the OSSLET and must be included in the same directory as the other files.
imageAnimations.xml:: This file was described above.
imageAnimations.fla:: This file is the Flash source code. You are welcome to use it if you'd like but there is no need to know Flash to use this OSSLET.