[ Return to tenSlide
Home Page ]
The documentation on this page describes how to code you HTML pages to
easily generate interactive slideshows. Use the contents below to move to
specific topics:
Introduction
Specifying tenSlide commands
Submitting commands to tenSlide
Defining location of slide images
Specifying web page to return to after slideshow
Adding titles to your slideshow
Adding links to each slide
Specifying default slideshow parameters
Adding your own logo/links to the slideshow
Using the tenSlide HTML Generation Utility
Command Reference
Download tenSlide Files
Introduction
To define and run a slideshow of your images/ photos using the tenSlide
server, you code simple HTML that defines a form with fields that contain commands for tenSlide.
This form is then submitted to the tenSlide server. The tenSlide
server processes the submitted commands and then builds a framed html page that
displays your slideshow. The generated html page contains javascript code
that interacts with the user and manages the display of the slideshow
images. The tenSlide server is only used to generate the slideshow page --
the server is not accessed once the slideshow begins.
Top
Specifying tenSlide Commands
Each of the commands used to define your slideshow must be specified as a
field value (typically either a TEXT or HIDDEN field) of a form that is
submitted to the tenSlide server. At a minimum, commands must be
provided for each image to be included in the slideshow. The following
HTML is sufficient to define a simple slideshow with three images:
<FORM METHOD="POST" ACTION="http://www.tenholder.net/tenWare/tenSlide.asp">
<INPUT TYPE="HIDDEN" NAME="I1" VALUE="Image=slide2.jpg">
<INPUT TYPE="HIDDEN" NAME="I2" VALUE="Image=slide3.jpg">
<INPUT TYPE="HIDDEN" NAME="I3" VALUE="Image=slide6.jpg">
</FORM>
The above, when submitted to tenSlide, sends the values of the three hidden
form fields as commands (Image=)
that define the images to be included in the slideshow. The ACTION=
parameter of the FORM tag points to the tenSlide server. In this example,
the image files must be located in the same directory as the file containing the
HTML above. Click here to see the result
of the above example
Top
Submitting Commands to tenSlide
In order to send a set of commands to tenSlide, the form
containing the fields must be submitted to tenSlide.asp on the tenWare
server. The ACTION= parameter of the FORM tag points to the target (tenSlide.asp). There are several ways to accomplish submitting the form
and its fields to tenSlide:
 |
If the form defining the slideshow is contained on an HTML
page that contains other content, then a SUBMIT button can be added to the
form, allowing the user to click on the SUBMIT button to display the
slideshow.
|
|
If a separate HTML page is used to define the slideshow,
then the page should be set up to automatically submit the form with the
tenSlide commands using the ONLOAD parameter of the BODY tag. This
way, a simple link to the HTML page will cause the slideshow to be submitted
and displayed. Sample code to accomplish this follows: |
<BODY ONLOAD="javascript:document.SS.submit()">
<FORM
NAME="SS"
ACTION="http://www.tenholder.net/tenWare/tenSlide.asp">
<INPUT TYPE="HIDDEN" NAME="I1"
VALUE="Image=slide2.jpg">
<INPUT TYPE="HIDDEN" NAME="I2"
VALUE="Image=slide3.jpg">
<INPUT TYPE="HIDDEN" NAME="I3"
VALUE="Image=slide6.jpg">
</FORM>
</BODY>
Top
Defining Location of Slideshow Images
The tenSlide software normally looks for each slide image in the same
web directory that contains the HTML page defining the slideshow. You can
specify an alternate location of the images using the Folder
command. For example:
<INPUT TYPE="HIDDEN" NAME="F1" VALUE="Folder=http://www.myweb.com/images/">
Top
Specifying web page to return to after slideshow
You can have a Finished button displayed along with the other
slideshow controls. When the user clicks the Finished button, the
page you specify with the Return=URL command will be displayed. If
the slideshow is displayed within another frameset, the specified page will
replace the slideshow within the frameset. Use the ReturnTop=Yes
command to have the specified page displayed within the browser window. If
you have displayed the slideshow within its own window, you can have tenSlide
close that window when the Finished button is clicked by specifying the Return=Close
command. If you use a separate HTML page to define and auto-submit the
slideshow commands, you will want to use the Return command because if
the user simply presses the browser Back button, the HTML page will be
rerun and the slideshow auto-submitted once again. Samples of these
commands follow:
<INPUT TYPE="HIDDEN" NAME="x" VALUE="ReturnTop=Yes">
<INPUT TYPE="HIDDEN" NAME="x" VALUE="Return=http://www.myweb.com/mypage.html">
<INPUT TYPE="HIDDEN" NAME="x" VALUE="Return=Close">
Top
Adding titles to your slideshow
You can display a title above one or more slides with the Title=
command. The commands below will display four slides: The first two
with the same title, the third with no title, and the fourth with another title.
<BODY ONLOAD="javascript:document.SS.submit()">
<FORM
NAME="SS"
ACTION="http://www.tenholder.net/tenWare/tenSlide.asp">
<INPUT TYPE="HIDDEN" NAME="F1" VALUE="Folder=http://www.tenholder.net/tenWare/tenSlide/Samples/">
<INPUT TYPE="HIDDEN" NAME="T1" VALUE="Title=Mark
McGwire Show">
<INPUT TYPE="HIDDEN" NAME="I1"
VALUE="Image=slide2.jpg">
<INPUT TYPE="HIDDEN" NAME="I2"
VALUE="Image=slide3.jpg">
<INPUT TYPE="HIDDEN" NAME="T3" VALUE="Title=">
<INPUT TYPE="HIDDEN" NAME="I3" VALUE="Image=slide4.jpg">
<INPUT TYPE="HIDDEN" NAME="T4" VALUE="Title=Mark
Arrives at Home">
<INPUT TYPE="HIDDEN" NAME="I4"
VALUE="Image=slide6.jpg">
<INPUT TYPE="HIDDEN" NAME="R1" VALUE="Return=Close">
</FORM>
</BODY>
Click here to see the result
of the above example
Top
Adding links to each slide
You can optionally add a link URL for each slide so that when the user clicks
on the slide image the link will be followed to the specified URL. The Link=
command works similarly to the Title= command in that the specified URL
will be applied to each succeeding slide. The commands below will add a
link to the second slide (link to the tenWare home page):
<BODY ONLOAD="javascript:document.SS.submit()">
<FORM
NAME="SS"
ACTION="http://www.tenholder.net/tenWare/tenSlide.asp">
<INPUT TYPE="HIDDEN" NAME="F1" VALUE="Folder=http://www.tenholder.net/tenWare/tenSlide/Samples/">
<INPUT TYPE="HIDDEN" NAME="I1"
VALUE="Image=slide2.jpg">
<INPUT TYPE="HIDDEN" NAME="L2" VALUE="Link=http://www.tenholder.net/tenWare">
<INPUT TYPE="HIDDEN" NAME="I2"
VALUE="Image=slide3.jpg">
<INPUT TYPE="HIDDEN" NAME="L3" VALUE="Link=">
<INPUT TYPE="HIDDEN" NAME="I4"
VALUE="Image=slide6.jpg">
<INPUT TYPE="HIDDEN" NAME="R1" VALUE="Return=Close">
</FORM>
</BODY>
Click here to see the result
of the above example
Top
Specifying default slideshow
parameters
Several controls are displayed for the user to use to control the slideshow
operation. You can specify default values for these controls in your HTML
using the commands below:
 |
<INPUT TYPE="HIDDEN" NAME="P1" VALUE="Play=Yes">
<INPUT TYPE="HIDDEN" NAME="P2" VALUE="Duration=1.0">
<INPUT TYPE="HIDDEN" NAME="P3" VALUE="Loop=Yes">
|
The commands below will automatically display three slides, with a pause of 1
second between slides:
<BODY ONLOAD="javascript:document.SS.submit()">
<FORM
NAME="SS"
ACTION="http://www.tenholder.net/tenWare/tenSlide.asp">
<INPUT TYPE="HIDDEN" NAME="I1"
VALUE="Image=slide2.jpg">
<INPUT TYPE="HIDDEN" NAME="I2"
VALUE="Image=slide3.jpg">
<INPUT TYPE="HIDDEN" NAME="I3"
VALUE="Image=slide6.jpg">
<INPUT TYPE="HIDDEN" NAME="P1" VALUE="Play=Yes">
<INPUT TYPE="HIDDEN" NAME="P2" VALUE="Loop=Yes">
<INPUT TYPE="HIDDEN" NAME="P3" VALUE="Duration=1.0">
<INPUT TYPE="HIDDEN" NAME="P4" VALUE="Return=Close">
</FORM>
</BODY>
Click here to see the result
of the above example
Top
Adding your own logo/links to the slideshow
When the slideshow is displayed, a small frame at the bottom left of the
slideshow displays a logo with a link to more information about tenSlide.
You can easily change the contents of this frame to anything you like by coding
a simple HTML page with the desired contents and then referencing this page with
the LogoURL= command. For example, if you saved a page as http://www.tenholder.net/tenWare/tenSlide/Samples/Logo.htm
with the following contents:
<html>
<body bgcolor="#0000FF">
<p align="center"><b><font
color="#FFFF00">
Your<br>Sample<br>Logo</font></b></p>
</body>
</html>
then, the following commands would display three slides with the above HTML
displayed in the bottom left corner of the slideshow:
<BODY ONLOAD="javascript:document.SS.submit()">
<FORM
NAME="SS"
ACTION="http://www.tenholder.net/tenWare/tenSlide.asp">
<INPUT TYPE="HIDDEN" NAME="I1"
VALUE="Image=slide2.jpg">
<INPUT TYPE="HIDDEN" NAME="I2"
VALUE="Image=slide3.jpg">
<INPUT TYPE="HIDDEN" NAME="I3"
VALUE="Image=slide6.jpg">
<INPUT TYPE="HIDDEN" NAME="P1" VALUE="Play=Yes">
<INPUT TYPE="HIDDEN" NAME="P2" VALUE="Loop=Yes">
<INPUT TYPE="HIDDEN" NAME="P3" VALUE="Duration=1.0">
<INPUT TYPE="HIDDEN" NAME="P4" VALUE="Return=Close">
<INPUT TYPE="HIDDEN" NAME="P5" VALUE="LogoURL=http://www.tenholder.net/tenWare/tenSlide/Samples/Logo.htm">
</FORM>
</BODY>
Click here to see the result
of the above example
Top
Using the tenSlide HTML Generation Utility
The easiest way to code the HTML page containing your tenSlide commands is to
use the supplied HTML Generation Utility. Click
here to download. Features include:
| Generates HTML onto the clipboard for pasting into your HTML editor of
choice (or Notepad).
|
| Select images to include in the slideshow from standard drive and
directory listboxes.
|
| All tenSlide commands are generated with a simple click of the
mouse.
|
| Each slideshow definition is saved in the directory containing the slide
images for easy modification. |
Top
Command Reference
The following commands are recognized by tenSlide:
| Folder= |
Specifies the fully-qualified URL of the web directory that
contains the slide image files |
| Image= |
Specifies the filename of an image to be included in the
slide show |
| Title= |
Specifies a title to be displayed above each succeeding
slide. If Title=* is specified, the Title command is ignored
and the previous title is used for all succeeding slides. |
| Link= |
Specifies a fully-qualified URL to be used as a link
reference for each succeeding slide |
| Return= |
If specified, a Finished button will be included in
the slideshow controls. If a fully-qualified URL is specified,
clicking the Finished button will transfer to the specified
URL. If Return=Close is specified, the window containing the
slideshow will be closed when the Finished button is clicked. |
| ReturnTop= |
Valid parameters: Yes or No. If Yes
is specified, along with a Return= command containing a URL
parameter, then when the Finished button is clicked, the specified
URL will be displayed as the top page within the browser window (not
within an existing frame). |
| Play= |
Starts playing the slideshow automatically when the page is
loaded. |
| Loop= |
Loops from the last slide to the first slide. |
| Duration= |
Number of seconds to pause between slides when Play=Yes. |
| LogoURL= |
URL of an HTML page to be displayed in the lower left
portion of the generated slideshow screen. |
| 
