Norm's Image Index Editor program

Function

This program is for arranging image (JPEG) files for a Slide Show and for showing them. It has several types of shows it can create. The first is for an application running on your computer. The second and third are for use with a browser.

Invoking the program

The program can be started with the command:
With JView or Java 1.1 programs:
  java -cp SlideShowApp.jar ImgIdxEditor <options>
jview /cp SlideShowApp.jar ImgIdxEditor <options>
With the Java2 programs:
  java -jar SlideShowApp.jar <options>

where the options are:

• <path> is the path to the directory containing the slideshow files.
• -fd - loads all jpg files from a directory
• -dl X - to use drive letter X when displaying a slideshow
• -i filename - use index file: filename (an .RSS file) to start with

The Window

The program's window has a menubar, FileName input field, Orientation buttons, Description field, Quality buttons, a row of control buttons, Rename input area and button and display area for the current image.

Menu items

File

• Open Index file... - opens an existing RSS file and reads the list of image names into a table.
• Get single image ... - opens an image file and displays it.
• Get All Images... - gets the filenames of all the .jpg files in a directory and places names in table
• Save - Saves current version of .RSS file from current table
• Save As... - Save current version of index file with selected filename
• Write HTML with Applet... - writes HTML files with an applet that contains list of all images currently in table.
• Write HTML with Javascript... - writes an HTML file that uses Javascript to display the images in the current table.
• Make SlideShow folders... - Creates folders for a SlideShow's files
• View home page - Opens the default browser to a SlideShow's home page.
• Copy SlideShow to... - Select and copy SlideShow's files to a target folder. If target is root, an autorun file is created.
• Exit - exits program

Edit

• Enter Data - Returns window to data entry mode from Full Screen for updates to table data.
• Add Precomment... - Presents data input window for comments that will be added to the home HTML page.
• Add Post Comment... - Presents data input window for comments to added to home HTML page following list of detail links.
• Order images... - displays a list of current image names and allows you to change their position in the list.

Index

• Find in Filename... - searches the list of image filenames for a string
• Find in Description... - searches list of image descriptions for a string
• Select from list... - displays list of image names and allows selection of image to be displayed

Show

Controls how the images are displayed.

• Full screen - increases the size of the display area by removing the input fields and buttons. You can return to Edit mode by selecting Edit|Enter data.
• Show All -
• Next - moves to the next image in the show. Also done by Arrow keys
• Last - moves to last image in the show. Also done by Arrow keys.
• Auto - automatically advances to the next image after a few seconds.
• Faster - shortens the image display time, making a faster show
• Slower - lengthens the image display time, making a slower show

Scale

Controls the size of the image and does some very simple zooming. (This needs to be rewritten!)

• Reduce | Normal - unzooms if zoomed
• Zoom-UL
• Zoom-UR
• Zoom-C
• Zoom-LL
• Zoom-LR

Options

• Image as background - Image is used as HTML page background. This will cause tiling of the image(image is repeated).
• <IMG WIDTH HEIGHT = 100% - Image is scaled to size of browser. Mutually exclusive with the Image as background option.
• Set Home folder - Set home folder for all SlideShows.

Help

• Status - shows which image is being shown and what image display time is
• SetTest - debugging
• About - displays version and author info
• Help Topics - shows this file

Edit and Update buttons

• Add new Image - Adds displayed image to the list
• Update data - Writes changes to index table
• Next - Moves and displays next image.
• Last - Moves to and displays last image.
• Rename image file - Renames current image file to New name.

Status message

Status messages are displayed beneath the Edit/Update buttons

Creating a SlideShow

Slide shows are a collection of images in folders with an index file (.RSS) that lists the images in the show.

• The first step is to create the folders to hold the images and control files and copy the images into their folder. For example: to create a SummerVac show, create a folder named SummerVac and within it a folder named jpg. Then copy all you jpg image files into the jpg folder.
• Now open the program and use the File|Get All Images menu item to select the folder holding the images to be included in this show. The image filename names will be gathered and the first image will be displayed. Images are sorted by their Modified date.
• Filenames can changed by entering a New name and pressing the Rename Image button. The file is now renamed.
• Change the Orientation to Portrait if the image is vertical vs Landscape if horizontal. This is used when HTML is generated for correct spacing. Enter a description for the image.
• Press Update button to temporarily save the changes you've just made. They won't be permanent (written to disk) until you click the File|Save or File|Save As menu item.
• Press the Next button to move to the next slide.
• Finally use File|Save As to save the index (.RSS) file. Place this file in the same folder that the jpg folder is in.

Slideshow Folder Layout

The SlideShow folders should have the following layout.

Note: Replace YourSlideShow with the name you want to give to your slideshow. For example: MyHawaiiTrip.

The root directory for your slideshow should contain:

• RSSLib folder - miscellaneous files needed by the YourSlideShow.html files
• SlideShow.jar - Contains the applet used by theYourSlideShow.html files
• (YourSlideShow folders) - These folders contains the files for your slideshow. There can be one of these for each slideshow you create. You must create this folder and also the jpg folder inside it and copy all your jpg files to the jpg folder before running the slideshow program.
  • jpg folder - holds the jpg files for the slide show
  • YourSlideShowxxx.html - these html files are created by the SlideShow program. They link to the pictures in the jpg folder and to each other
  • YourSlideShow.RSS - This file is created by the SlideShow program. It contains a list of the jpg files included in the slideshow.
• YourSlideShow.html - These files are created the the SlideShow program. The filename will be the same as the folder containing the bits for the show. There will be one for each slideshow. This will be the home page for that slideshow.

 Modifying an Index (.RSS) file

• After starting the program: use the Index|Open Index file... menu item to select a .RSS file to open.
• The index file will be opened and the first image displayed.
• Continue as above: Creating a SlideShow

Creating HTML files for browsing

HTML files(one per image) will be created and written to the slideshow folder. An index HTML file will be written to the folder above that folder. These files will have references to the images and the other files and can't be moved from the folder structure it is created in. The JavaScript HTML file is currently written to the wrong folder and must be moved up to the same folder as the index HTML file.

• After loading an index file: select the File|Write HTML with Applet... menu item.
• Position to the same folder as the index file(.RSS), check filename and press the Save button.
• The HTML files will be written.
• To also write an HTML file that uses JavaScript for the show: select File|Write HTML with Javascript... menu item.
• Position to the same folder as the index file, check filename and press the Save button.
• This file currently has to be moved up one level!!!

If these HTML files and images are to be loaded to a Web site be sure to keep the same directory structure. You need the index HTML file, SlideShow.jar file and RSSLib folder at the top and under it the show folder with the individual HTML files and the image(jpg) folder. You'll want to change the delay between showing images to allow for internet delays. Make these changes:
 For Applets, the value is set by the <PARAM Name=Delay Value=18> statement.
 For JavaScript, add: var dur=18; before the var images = new Array(...
This variable is also set/defined in the JSSlideShow.js file in the RSSLib folder.

Other needed files

You will also need these files for the above HTML shows to work:

• SlideShow.jar - a file that contains the Java Applet programs. This should be in the same folder with the index HTML file.
• RSSLib folder - a folder that contains the files needed for the Javascript slideshow. This folder should be in the same folder as the index HTML file.

Last modified October 3, 2001