Here are steps one could follow to create a Chime tutorial about a different molecule, using a nonlinear button structure similar to that in DNATut2. DNATut2 was actually written in a much less organized fashion, and went through several different approaches before arriving at version 2. After the fact, I have tried to envision a more organized series of steps leading to a new tutorial. However I have not tested this method. If you try it, please let me know where these instructions need improvement.
Each button is defined in dnapairs.htm, but the
scripts for most are generated in b_pairs.js using the
ButtonCallback mechanism described in the section below on implementation.
When debug mode is off, the Strands page does not need the 'immediate button' mechanism (see below) to send to Chime a variable Chime-script dynamically-generated by javascript. Therefore it does not need a 'dummy' frame (see below) and hence uses no frames. This page consists of ordinary HTML including one <embed ...> tag to invoke Chime, plus one for each button.
The page on Ends (file dna53.htm) was as simple as that
on Strands, but has been modified just enough to support the debug mode.
This required the addition of certain javascript controls. By searching
for the word javascript in this file, you can find all such
instances. With debug mode on, this page needs the 'immediate button'
mechanism, and hence frames are present.
The 'zoom' example is only one of several places where javascript is needed
in this page. When this page displays a single base pair, the buttons
labeled End and Replicate must issue different Chime-scripts
than when the DNA helix is displayed. Also, in order for the Reset
button to interrupt a slow movement, an interrupt must be sent to
Chime via the 'immediate mode' (an interrupt fails via the ordinary embed
button mechanism). These requirements necessitate the use of javascript to
generate and send scripts to Chime in the DNA Code page. See the sections
below on
the immediate button mechanism and on
more complex pages for more explanation of how this
works.
The method for sending the dynamically-constructed Chime-script, as a character
string variable, to Chime is as follows. Javascript is used to to write a
new document into a 'dummy' frame which is specified as size 0% of the
window, therefore invisible. (See file fs_code.htm for a definition
of the frameset for the dnacode.htm page.) The new document
contains an <embed...> tag which creates a button for sending a
Chime-script to Chime. This button is very like the many buttons visible in
the tutorial, each of which, when clicked, sends a Chime-script to Chime.
But this button differs in one crucial respect. The embed-tag contains the
parameter immediate=true. This causes the Chime-script to be sent
to Chime immediately, without waiting for the button to be clicked. In
fact, not only is the frame containing this button too small to be
noticable, but the button itself is also hidden. See chiimmed.js, which
creates this embedded button.
Because the Chime-scripts vary, the HTML <embed...> tags,
which create the Chime-script-sending buttons, do not themselves
contain the Chime-scripts. Rather, when a Chime-plugin-targeted
button is clicked, Chime sends the name of the button to
javascript by calling a ButtonCallback function. The name of this
function is specified in the <embed...> tag which creates the
button (see button.js). This function, designed by the user, takes
appropriate action; in this tutorial, it constructs the appropriate
Chime-script and sends it to Chime via an immediate button mechanism. The
ButtonCallback function is bcb() defined in the file
button.js. It is called twice per button-push*. On the second
call, bcb() passes the button name to
bcb_action(), which is defined in the file b_pairs.js. This is
where the variable Chime-scripts are generated for each button.
*The first call is before execution of the Chime-script, if any,
given in the <embed...> tag which created the button.
The second call is afterwards. In NLCS2, the embed tags contain no
Chime-scripts, so the two calls are equivalent. A boolean ButtonCallback
parameter indicates whether the call is before or after; this is used to
avoid issuing each javascript-constructed Chime-script twice. See bcb() in
button.js.
Simple Javascript
Chime's 'immediate button' mechanism
The ability to construct a Chime-script dynamically from
javascript code is a powerful one. It allows the Chime-script to be tailored
to the state of the tutorial (see for example
zoom limits above).
More Complex Pages
The page on Base pairs (file dnapairs.htm), is more complex
because both the invocation of Chime and nearly all the button-issued
Chime-scripts are generated by state-variable dependent javascript. The
invocation of Chime depends on whether or not debug-mode has been enabled.
The Chime-scripts issued by most of the buttons change according to the
previous buttons which were clicked, as recorded by javascript state
variables.