Author: Stefan Spaeth
Description: Examples for createPhotoWebPages.pl

# createPhotoWebPages.pl - Examples

back to main page

- Step 1 : search and sort images
- Step 2 : modify the selection file
- Step 3 : create draft HTML pages
- Step 4 : rename, comment and rotate images
- Step 5 : applying further changes

This section introduces a small example which hopefully clarifies the basic usage of the script.
Let us assume that we have a directory "./images", in which the following files can be found:

        YellowBoxVertical.Jpg  bluebox3.gif       GreenBoxVertical.Jpg
        Blue_Box.jpeg          REDBOX3.jpg        RedBox.JPG
        blue_box2.jpeg         test.txt           violet_box.png

Let us furtheron assume we have another sub-directory named "./images/Not-A-Box", in which those additional files can be found:

        BLACKCircle.PNG        RED_CIRCLE.GIF     violetSquare.jpg

The following table shows the (small ;-) images in their original format, size and orientation:

Directory `./images`
YellowBoxVertical.Jpg | bluebox3.gif | GreenBoxVertical.Jpg
Blue_Box.jpeg | REDBOX3.jpg | RedBox.JPG
blue_box2.jpeg | "test.txt" is not an image! | violet_box.png
Sub-directory `./images/Not-A-Box`
BLACKCircle.PNG | RED_CIRCLE.GIF | violetSquare.jpg

back to top

## Step 1 : search and sort images

First, we scan for image files, sort them lexically (case insensitive, i.e. not taking into account lower or upper case), and finally add a 2 letter prefix to the image file name.
File extensions are converted from upper case to lower case letters (if needed). Finally, a selection configuration file is created (named "selection-after-scan.txt").

The following command line is used:

          createPhotoWebPages.pl -verbose                 \
                                 -scan                    \
                                 -order name              \
                                 -rename -ext -prefix     \
                                 selection-after-scan.txt \
                                 ./images

The script output is shown below (note that the option "-verbose" has been used). As can be seen from the log information the whole output is also logged into the file "selection-after-scan.txt.log".

    ###############################################################
    #### createPhotoWebPages.pl v2.3.09, 06.10.2002
    ###############################################################
    Finished option processing, starting execution of script ...
     info: Parsing selection list and configuration file selection-after-scan.txt ...
     info: Processing configuration parameters read from file selection-after-scan.txt ...
     info: Scanning for image files ...
     info: Processing image information ...
     info: Trying to extract jhead info for ./images/Blue_Box.jpeg ...
     info: Image infos ./images/Blue_Box.jpeg: type jpg, size 975 Bytes, 64 x 48, date: 2002-02-11 (Datei), time: 20:33:48 (Datei)
     info: Trying to extract jhead info for ./images/blue_box2.jpeg ...
     info: Image infos ./images/blue_box2.jpeg: type jpg, size 1.51 kBytes, 64 x 48, date: 2002-02-11 (Datei), time: 20:35:28 (Datei)
     info: Trying to extract GIF and PNG info for ./images/bluebox3.gif ...
     info: Image infos ./images/bluebox3.gif: type gif, size N/A, 64 x 48, date: N/A, time: N/A
     info: Trying to extract jhead info for ./images/GreenBoxVertical.Jpg ...
     info: Image infos ./images/GreenBoxVertical.Jpg: type jpg, size 864 Bytes, 48 x 64, date: 2002-02-11 (Datei), time: 20:38:48 (Datei)
     info: Trying to extract GIF and PNG info for ./images/Not-A-Box/BLACKCircle.PNG ...
     info: Image infos ./images/Not-A-Box/BLACKCircle.PNG: type png, size N/A, 64 x 48, date: N/A, time: N/A
     info: Trying to extract GIF and PNG info for ./images/Not-A-Box/RED_CIRCLE.GIF ...
     info: Image infos ./images/Not-A-Box/RED_CIRCLE.GIF: type gif, size N/A, 48 x 64, date: N/A, time: N/A
     info: Trying to extract jhead info for ./images/Not-A-Box/violetSquare.jpg ...
     info: Image infos ./images/Not-A-Box/violetSquare.jpg: type jpg, size 1.52 kBytes, 64 x 64, date: 2002-02-11 (Datei), time: 20:53:46 (Datei)
     info: Trying to extract jhead info for ./images/RedBox.JPG ...
     info: Image infos ./images/RedBox.JPG: type jpg, size 889 Bytes, 64 x 48, date: 2002-02-11 (Datei), time: 20:31:33 (Datei)
     info: Trying to extract jhead info for ./images/REDBOX3.jpg ...
     info: Image infos ./images/REDBOX3.jpg: type jpg, size 1.49 kBytes, 48 x 64, date: 2002-02-11 (Datei), time: 20:52:01 (Datei)
     info: Trying to extract GIF and PNG info for ./images/violet_box.png ...
     info: Image infos ./images/violet_box.png: type png, size N/A, 64 x 48, date: N/A, time: N/A
     info: Trying to extract jhead info for ./images/YellowBoxVertical.Jpg ...
     info: Image infos ./images/YellowBoxVertical.Jpg: type jpg, size 895 Bytes, 48 x 64, date: 2002-02-11 (Datei), time: 20:45:07 (Datei)
     info: Processing image filenames ...
     info: Renaming image files (if required) ...
     info: Renaming image ./images/Blue_Box.jpeg into ./images/aa_BlueBox.jpeg ...
     info: Renaming image ./images/blue_box2.jpeg into ./images/ab_blue_box2.jpeg ...
     info: Renaming image ./images/bluebox3.gif into ./images/ac_bluebox3.gif ...
     info: Renaming image ./images/GreenBoxVertical.Jpg into ./images/ad_GreenBoxVertical.jpg ...
     info: Renaming image ./images/Not-A-Box/BLACKCircle.PNG into ./images/Not-A-Box/ae_BLACKCircle.png ...
     info: Renaming image ./images/Not-A-Box/RED_CIRCLE.GIF into ./images/Not-A-Box/af_RED_CIRCLE.gif ...
     info: Renaming image ./images/Not-A-Box/violetSquare.jpg into ./images/Not-A-Box/ag_violetSquare.jpg ...
     info: Renaming image ./images/RedBox.JPG into ./images/ah_RedBox.jpg ...
     info: Renaming image ./images/REDBOX3.jpg into ./images/ai_REDBOX3.jpg ...
     info: Renaming image ./images/violet_box.png into ./images/aj_violet_box.png ...
     info: Renaming image ./images/YellowBoxVertical.Jpg into ./images/ak_YellowBoxVertical.jpg ...
     info: Writing back selection list and configuration file selection-after-scan.txt ...
     info: Generation of HTML files not requested.
     info: Generation of image files not requested.
     info: Finished perl script /home/sspaeth/perl/createPhotoWebPages.pl.

Two files have been created in the working directory "./".

- the selection configuration file selection-after-scan.txt, and
- the log file selection-after-scan.txt.log.

Take a look at the image filenames in the directories "./images" and "./images/Not-A-Box". All image filenames have received a two-letter prefix (e.g. "aa_", "ab_", etc.). File extensions have been converted from upper case letters to lower case letters where needed.
And the file "test.txt" has been ignored - as expected - as it is not an image file.

The image files are sorted and renamed as follows (and are listed in that order in the selection configuration file).

      ./images/aa_BlueBox.jpeg
      ./images/ab_blue_box2.jpeg
      ./images/ac_bluebox3.gif
      ./images/ad_GreenBoxVertical.jpg
      ./images/Not-A-Box/ae_BLACKCircle.png
      ./images/Not-A-Box/ag_violetSquare.jpg
      ./images/Not-A-Box/af_RED_CIRCLE.gif
      ./images/ah_RedBox.jpg
      ./images/ai_REDBOX3.jpg
      ./images/aj_violet_box.png
      ./images/ak_YellowBoxVertical.jpg

Note that, unfortunately, sub-directories are sorted with the same priority as image filenames. This leads to the fact that files inside the directory "./images" are not listed together.

The next section explains how this can be corrected.

back to top

## Step 2 : modify the selection file

The selection configuration file is now first renamed to "selection-before-rename.txt" (this is normally not required, but we do this to be able to see the differences between the files). This new file is then modified according to our needs.
Here is what we want to do:

- First, we move all images that belong to the directory "./images" to the beginning of the selection.
- Then we create separate groups for the images in the different directories "./images" and "./images/Not-A-Box". These separate groups receive separate thumbnail HTML pages and separate subtitles ("SUBTITLE").
- Furthermore we intend to adapt a few general entries to meet our needs.

The newly generated selection configuration file is named selection-before-rename.txt.

Take a look - it is for free ;-)
The following entries (among a few others) have been changed or adapted:
`TITLE`
`EMAIL`
`LEVEL_UP`
`HTML_CREATE_TOP`
`HTML_TOP_CAPTION`
`HTML_TOP_BACK`
`HTML_TOP_TEXT`
`SUBTITLE`
`HTML_SUB_TEXT`

back to top

## Step 3 : create draft HTML pages

Now, let us start creating the first real HTML pages:

          createPhotoWebPages.pl -verbose                    \
                                 selection-before-rename.txt

As usual, the log file can be found at selection-before-rename.txt.log.

The results can be viewed in the HTML file examples_en/pages-before-rename/index.html.

Well, this looks already pretty nice, doesn't it?
On the other hand, ... A few images still have the wrong orientation and the image names and image captions could be different as well. Let us change the selection configuration file once more.

back to top

## Step 4 : rename, comment and rotate images

We now have to rename the selection configuration file to "selection-after-rename.txt" (well, not really, but ...). This file is then again changed to make corrections and add what is missing.
(In real life you would probably always change the same file, although it is never a bad idea to have backup copies ;-)

The image "Green Box Vertical" should be rotated by 90 degrees, whereas the image "Yellow Box Vertical" should be rotated by 270 degrees (counter-clock-wise). This is accomplished with the "IMAGE_ROT" entry.

Besides that we want to change some of the image names and add a bit of descriptive text. In one or the other case we also like to generate additional EXIF info HTML pages for the JPEG images. ("IMAGE_INFO" entry).

Finally, we want to see the images "REDBOX 3" and "RED CIRCLE" as representatives on the top thumbnail HTML page ("IMAGE_SEL" entry).

The newly created selection configuration file is named selection-after-rename.txt.

Ok. Let us now re-create our HTML pages. Note the "-rename". It ensures that original images get rotated (and not copies of the originals) and it also makes sure that the image file names are adapted.

          createPhotoWebPages.pl -verbose                    \
                                 -rename                     \
                                 selection-after-rename.txt

As usual, the log file can be found at selection-after-rename.txt.log.

The results are placed in the HTML file examples_en/pages-after-rename/index.html.

Note that the selection configuration file selection-after-rename.txt is overwritten when executing the script with the "-rename" option.
The new image file names need to be adapted and the "IMAGE_ROT" entries are reset to a value of "0" (as the images now have their final and correct orientation).

back to top

## Step 5 : applying further changes

All further steps are left to your personal preferences.

If you want to make a few experiments, then simply modify the file my-selection.txt and re-run the script..

The following command line would be apropriate (but you are, of course, free to use any other options as well):

          createPhotoWebPages.pl -verbose          \
                                 my-selection.txt

The log file could then be found at my-selection.txt.log.

The results would be available under the HTML file examples_en/index.html.

Here is another nice example:

The following entries have been changed:
`THUMBNAIL_ROTATION_ANGLE = 2`
`THUMBNAIL_RANDOM_ROTATE = 1`
`WEB_READY = 1`
`TARGET_DIR = ./web-ready-pages/`
and the selection configuration file has been renamed to selection-web-ready.txt.

This is the command line:

          createPhotoWebPages.pl -verbose          \
                                 selection-web-ready.txt

As usual, the result can be found in the HTML file examples_en/web-ready-pages/index.html.

This is actually an interesting example. It slightly rotates all thumbnail images which gives an interesting touch to the HTML pages. In addition, this sub directory may be copied to any other place as the links to the original images are now missing.

You are, of course, encouraged to continue with your own experiments.

back to top, back to main page