Plugins by Scott Hurlbert

The Slide Show Plugin creates a page containing HTML "IMG" tags for each image in a folder.

Syntax: #

[{INSERT SlideShowPlugin photodir='<<dirname>>' thumbsdir='<<thumbsdir>>' phototype='<<phototype>>' template='<<template>>'}]

Parameters#

photodir (mandatory)
This is the directory of images to be displayed. This path should be the relative path from photo.file.root in your jspwiki.properties. When used with a template the entire path is placed where ever the template has %FILEPATH%. For example, if your picture file root is c:\mywiki\pics\ and you want to display the photos in the folder c:\mywiki\pics\trips\sf_zoo\ then you would use:
photodir='trips\\sf_zoo\\'
thumbsdir (optional)
Default: photodir
This is the path to thumbnail versions of your photo. You can use this to provide, for example, 100 pixel high versions of your photos so the index page will load quickly. If you use a template with a link to the photos in photodir, your thumbnails will link to the large photos in photodir. When used with a template the entire path to the thumbs is placed where ever the template has %THUMBSPATH%.
phototype (optional)
Default: JPG
This is the extension type to be displayed ('JPG', 'GIF', 'BMP').
template (optional)
Default: As specified in photo.default.template in jspwiki.properties.
This is a template string used to generate the HTML The simplest example is probably:

'<img src=\"%FILEPATH%\"/>'

When the plugin runs, it calculates a relative path to each image in photodir and then replaces the text %FILEPATH% with the relative path. The %FILEPATH% may be used more than once, so a template such as:

'<a href=\"%FILEPATH%\"><img src=\"%FILEPATH%\"/></a>'

displays the image and adds a link directly to the image.

SlideShowPlugin has one mandatory parameter, photodir. This directory must be under the directory specified with photo.file.root in jspwiki.properties.

To avoid exposing the filing system to the wiki, this plugin only serves images that are within the wiki's sub-directories. This requires mapping between the file system's directories and wiki urls to the files. As you can see from the properties below in step 1 of the installation, there is a 'photo.file.root,' which maps to the source directory for images. All other image sub-directories should be below this directory.

The property 'photo.url.root' should be the wiki version of the path listed in 'photo.file.root.' These two properties allow the plugin to map from the file system to the wiki without directly exposing the file system.


Steps to install this plugin:#

Step 1) Add these properties to your jspwiki.properties

# Slideshow plugin's setup.
#
# - photo.file.root is the directory which holds the subdirectories with 
#   your picture.
# - photo.url.root is the relative wiki path (excluding the wikihome) to 
#   the photo.file.root location.
# - photo.default.template is the html that gets inserted by the plugin to 
#   make the slideshow.
#
photo.file.root = C:\\TomCat\\webapps\\MyWiki\\files\\pics\\
photo.url.root = files/pics/
photo.default.template = <img src=\"%FILEPATH%\" height=\"500\" /><br/><br/>
Note
I have my photo.default.template set to include a link to the photo file.

photo.default.template = <a href=\"%FILEPATH%\"><img src=\"%FILEPATH%\" height=\"500\" /></a><br/><br/>

or if using thumbs

photo.default.template = <a href=\"%FILEPATH%\"><img src=\"%THUMBSPATH%\" height=\"500\" /></a><br/><br/>

(I'd be careful about using THUMBSPATH in your default template - if you do, you'll need thumbs for every set that uses the default. It might be better to override the template when you need thumbs.)

Step 2) Add com.hurlbert.jspwiki.plugin to your jspwiki.plugin.searchPath in jspwiki.properties

Step 3) Add the SlideShowPlugin.class to your classes using the path com.hurlbert.jspwiki.plugin.

The plugin should now be ready for use. You can follow the usage examples below. Email me if you have any questions.


See the attached screen shots for examples of the output.

SCREENSHOT ONE SCREENSHOT TWO

Usage:#

<!-- Adds all images in 'A31208 - Christmas Tree'. -->
<!-- This example uses the default template in jspwiki.properties. -->
[{INSERT SlideShowPlugin photodir='2003\\A31208 - Christmas Tree\\' }]

<!-- Adds all images in 'A31208 - Christmas Tree' using the template parameter. -->
[{INSERT SlideShowPlugin photodir='2003\\A31208 - Christmas Tree\\' 
     template='<a href=\"%FILEPATH%\"><img src=\"%FILEPATH%\" height=\"100\" /></a>   '}]

Enjoy - Scott Hurlbert


Oy! This is cool stuff! Thanks Scott! :) --JanneJalkanen


Sounds good - have you considered having the photodir somehow being specified to being the attachements to a wikipage without anyone having to know too much about the underlying storage model? --KurtGluck

Yes - I thought about doing that with a zip. The zip could of course include an image dir and a thumbs dir. Though in the current version the reason you set the photo.file.root property in the properties file is to avoid exposing knowledge of your operating system. I like your idea - when can you have the plug in refactored? :-) -- Scott Hurlbert]


Add new attachment

Only authorized users are allowed to upload new attachments.

List of attachments

Kind Attachment Name Size Version Date Modified Author Change note
jpg
Default.JPG 116.1 kB 1 19-Jan-2004 11:58 24.4.112.168
zip
SlideShowPlugin v2.zip 176.9 kB 1 20-Mar-2004 23:27 24.4.111.209
zip
SlideShowPlugin.zip 176.6 kB 1 19-Jan-2004 11:58 24.4.112.168
jpg
Thumbnails.JPG 105.6 kB 1 19-Jan-2004 11:58 24.4.112.168
« This page (revision-69) was last changed on 25-Dec-2007 21:26 by HarryMetske