One of the most powerful features of Chime images is the ability to modify them after they are created by using buttons. Buttons are embedded into web pages using the same <EMBED> tag that is used to embed Chime models. The basic format for the <EMBED> tag used for embedding buttons is shown below:


<EMBED type="application/x-spt" target="model" button="push"
width="12" height="12"
script="...">

The 'scr' attribute is replaced with the 'type="application/x-spt"' attribute and the 'name' attribute is replaced with the 'target' attribute. In addition, there is a 'button' and a 'script' attribute. The 'button="push"' attribute creates a push button. The 'type="application/x-spt"' attribute indicates that a script will be sent to a Chime image when the button is pushed. The 'target' attribute provides the name of the Chime model that will receive the script. And the 'script' attribute contains the RasMol script commands that will be sent to the named Chime model.

The RasMol script commands can be found in the RasMol manual.

bullet The online RasMol manual.

To illustrate how buttons are made, edit the "fourthshot.html" file that was created on the "Embedding Chimes" page to include the following:


<HTML>

<HEAD>
<TITLE>My Page</title>
</HEAD>

<BODY>
Sugar is sweet,<P>
But Nutrasweet is sweeter.<P>

<EMBED src="aspartame.pdb" name="model" width="400"
height="400"
display3D="ball&stick"><P>

<EMBED type="application/x-spt" target="model" button="push"
width="12" height="12" script="select *;spacefill on">

</BODY>

</HTML>

The script shown above contains two RasMol commands: 'select *' selects all of the atoms in the model, and 'spacefill on' creates a sphere about each atom that represents its vander Waals' surface. Multiple commands in a script are separated by semi-colons. Save the modified HTML document as a "text only" document named "fifthshot.html". Open this file with your browser and try pushing the button located at the bottom of the page. The page should look like this.

MDL Information Systems, the company that develops and distributes Chime, has produced a nice interactive tutorial that demonstrates quite a few buttons, along with the RasMol script commands that were used with each.

bullet View interactive Chime RasMol Scripting tutorial.

Chime has also extended the RasMol command set to include commands that only work with Chime.

bullet Download a file describing Chime extensions to Rasmol's scripting commands.

A particularly nice addition that Chime has made is the ability to create solvent accessible surfaces about molecules. To demonstrate this, add the following button to the "fifthshot.html" file:


<HTML>

<HEAD>
<TITLE>My Page</title>
</HEAD>

<BODY>
Sugar is sweet,<P>
But Nutrasweet is sweeter.<P>

<EMBED src="aspartame.pdb" name="model" width="400"
height="400" display3D="ball&stick"><P>

<EMBED type="application/x-spt" target="model" button="push" width="12" height="12" script="select *;spacefill on">
<P>

<EMBED type="application/x-spt" target="model" button="push" width="12" height="12" script=
"select *;spacefill off;surface surf1">

</BODY>

</HTML>

This script selects the molecule, turns off the spacefill model, and creates a surface around the molecule that is named "surf1". After making this addition to the "fifthshot.html" file, save it as "sixthshot.html" and open it in your browser. It should look like this.

As a final exercise, add a button that colors the surface according to the electrostatic potential at the surface, and make the surface transparent. The red areas of the surface will be the more electronegative regions, while the blue areas will be the more electropositive regions.


<HTML>

<HEAD>
<TITLE>My Page</title>
</HEAD>

<BODY>
Sugar is sweet,<P>
But Nutrasweet is sweeter.<P>

<EMBED src="aspartame.pdb" name="model" width="400"
height="400" display3D="ball&stick"><P>

<EMBED type="application/x-spt" target="model" button="push" width="12" height="12" script="select *;spacefill on"><P>


<EMBED type="application/x-spt" target="model" button="push" width="12" height="12" script="select *;spacefill off;surface surf1"><P>

<EMBED type="application/x-spt" target="model" button="push" width="12" height="12" script="select *;color list surf1 potential;
list surf1 transparent"
>

</BODY>

</HTML>

Save this file as "seventhshot.html" and open it with your browser. It should look like this.

Students who take Chem406 (Biophysical Chemistry) at UW-Eau Claire are required to write a web-based term paper that is illustrated with Chime models. You might wish to visit the Chem406 web site and take a look at some of the creative ways that our students have found to use Chime models.

bullet Visit the Chem406 web site to look at the student authored web termpapers.


[UWEC Web] [Chemistry Dept.]


Warren Gallagher
Department of Chemistry
(715) 836-5388
wgallagh@uwec.edu

updated: Saturday, January 22, 2005