garden tote with tools
back link arrowPhyspics

PICTOOLS

Tools for websites
two beers
with nobg: Click me!

by Zweibieren

Up ArrowPhyspics
Up ArrowAnnals of ZB
Pictools

The garden tote above was for sale at roominakit.com. I scaled it to 1/6 and  removed the background with

nobg -t -f 2.2 -b 5x.5 gardentote.jpg
Three or four tries sufficed to find the right  -f and -b values.

Pictools are my tools for managing physpics.com. Their focus is on building pages with lots of pictures (three thousand and counting).

A Makefile system and directory structure provide a framework for organizing the build and deployment of pages. (They are built into a local structure and later uploaded quickly.) Templates allow different projects to display thumbnail pictures in different designs. A set of commands are available, though mostly they are used through the Makefiles. A description of how I use these commands may help you.

Amongthe commands are a macro processor, genhtml, and a pair of commands for removing backgrounds from images: nobg and nosur. The later have a description page of their own.

The rest of this page is a reference manual with pointers to the individual makefiles, templates, and commands.

Pictools operates over three directory trees: a source tree, a staging area, and the installation on the server. Each of these trees has, recursively, the same set of subdirectories, although sometimes the source tree will have additional directories that do not get built to the staging area or uploaded to the server.

Here is an outline of a directory tree, say C:\websrc

sample directory tree

There are two other trees with the same shape, one on the same host, perhaps at C:\physpics.com, and the other on the server, say physpics.com:httpdocs/. The images directories contains pictures, icons and graphics. For instance, the image just above is C:\websrc\pictools\images\dirtree.png. However, large sets of photos are managed separately (see Using these Tools) from another child, pix. The subdirectories of annals have pix/ subdirectories. Resources directories are only on the source tree and contain files that are notes or serve as source for derivation of other files.

Communication to the server is with ssh. You may need to ask your service provider to enable it. Also ask for writable access to a .ssh directory. In it you will want to have an authorized-keys files established as directed in ssh-keygen. (Otherwise you have to give your password for every upload.)

Most directories in the web sources tree have a Makefile, but only a small one. For a directory having subdirectories, the Makefile could be as little as
    SUBDIRS = subdirectory-1 subdirectory-2 ...
    include ${PICTOOLS}/MakeVars
    include ${PICTOOLS}/MakeTargets
and if there are no subdirectories, not even the first line is needed. MakeVars defines variables for later use by MakeTargets. Between the two include lines, the client Makefile can set additional values or modify the values of variables already set.

Environment Variables

With the XP version of MSW, the environment variables are found by clicking the "system" entry on the control panel, selecting the "adnvanced tab, and finally clicking the "Environment Variables" button at the bottom.

The following environment variables tell pictools where to find the trees. These values must NOT end in slashes.
PICTOOLS
Path to the directory containing the tools.
Examples: /cygdrive/C/websrc/pictools or /usr/local/pictools
The MSW version of the name should be added to MSW's environment variable PATH. Corresponding to the two examples would be C:\websrc\pictools or C:\cygwin\usr\local\pictools
PICSRC
The root of the tree of source directories.
Example: /cygdrive/C/websrc.
PICSTAGE
Root of the tree of staging directories where pages get built before uploading. After being built, they can be browsed on the local machine. Example: c:/physpics.com The browser path to this directory is file:///c:/physpics.com (there is no real reason to name the directory with the same name as the server).
PICSERVER, PICSDIR
Together these give the scp destination string for upload to the server. PICSERVER is in the form username@serverURL. Example: physpics@physpic.com. PICSDIR is a directory string to place the root of the tree below the top level. Example: httpdocs. The full generated scp destination is $PICSERVER:$PICSDIR; for the examples, that is physpics@physpics.com:httpdocs.
PICTOOLSDEBUG
If 1, some pictools append entries to /tmp/pictoolsdebug.log. At present the affected tools are MakeTargets, gensite, gendirs. Values larger than 1 may give more information.

PICPASS
PICSCP=fakescp OR scp
PICTURESROOT=/cygdrive/c/Physpics/pictures/DigestedPictureSets


Makefiles

Building and uploading from pictools directories is aided as described in "Makefiles."  Most Makefiles are then just the inclusion of one or two files and the setting of a few variables. For flexibility, the scheme allows ordinary make rules to be included as well.

MakeVars, MakeTargets. Most Makefiles include these. They provide for building html files to the staging area and uploading them from there. Example, the Makefile from /annals/2007/halo:
#SUBDIRS = resources images tar
include $(PICTOOLS)/MakeVars
COPYFILES = pngfix.js
LOCALJUNK = images
include $(PICTOOLS)/MakeTargets
# forward the install target to ./halo/, where the tools are
.PHONY: install
install:
$(MAKE) -C halo install
Note the ordinary make rule for install. 

MakeResources. Files in resources/ subdirectories usually only include MakeResources. This tool does little building or uploading, focusing instead on creating files for ../images. These files can be generated automatically with nobg or nosur, by listing them in TRANSPARENTBACKGROUND or TRANSPARENTSURROUND, respectively. The Makefile for pictools/resources is
# websrc/pictools/resources/Makefile
BUILDFILES = ../images/dirtree.png
include $(PICTOOLS)/MakeResources
../images/dirtree.png: dirtree.png
nosur -f 0 -b 1x.1 $< $@
The directory tree image, could have been listed in TRANSPARENTSURROUND, but the default parameters reduce the lines too much. Instead, an explicit rule appears and specifies parameters better suited to dirtree.png.

Templates

These files contain $var values and are processed by genhtml to replace those values appropriately. Examples of the files are shown and described on the Templates page.

copyright.html is an include file for the bottom of a webpage. My version includes author, copyright, and a $date that genhtml expands into the installation date.

template.tpl is a webpage used by gensite and gendirs to produce the index.html file for a segment of the pictures in a .cap file.

frame.tpl is the template for displaying an individual full-size image. Gendirs copies frame.tpl for each image, linking them together with Next and Prev pointers.

pictd.tpl is a wrapper used by genhtml as it creates a cell for each thumbnail for a $pictures macro. By revising this template, the user can change the appearance of the thumbnails, for examle, the placement of the caption.

Commands

These tools are  described in detail in  "Pictools Commands."

Genhtml
genhtml [-n ncols] [-c captionsfile] [-t title] [-f fdir] [-depend] \
        [-Dsym=value]... [-o outfile] [infile]
... is a build-time macro expander for generating web pages. Macros begin with a dollar-sign. For example, the page bottom boiler plate is generated with
$includebody(${PICTOOLS}/copyright.html)
The date is inserted in the page trailer with
$date(%e %b %Y&nbsp; %I:%M %p)
By convention, inputs to genhtml are given the extension ".hin". A rule in MakeTargets converts .hin files in PICSRC to .html files in PICSTAGE.

Genthumbs
genthumbs [maxdimension]
... processes a directory of images creating for each a thumbnail of a given maximum dimension, say 128,  and storing the thumbnails in a subdirectory named with the size: thumbs-128 for maximum dimension 128. The output is always a .jpg file.

Gencaps
gencaps [-p prefix] [-d picturesdir] [outputfilename|-]
... finds all the image files in a directory and creates a captions file listing them, though with blank captions.

Splittxt
splittxt  captionsfile
... reads a segmented captions file and produces one captions file for each segment. Segments start with a line "file: segmentname title words," as shown above. The idea is that you edit a single captions file, include segment headers, and then the individual captions files for each segment are generated by splittxt.

Genother
genother [-k] [[-d] picturesdir]
When editing captions files, it is common to reorder them and delete some. The deleted entries will be in the installed directory, but  orphaned, without a link to them. Genother finds all images that are not mentioned in .cap files and writes (to stdout) a new captions text that just lists those orphans.

Gensite
gensite [-n ncols] [-w wrapperfile] captions.cap
...processes a segmented captions file and produces an HTML file for each segment. The source for the HTML files is a template. It is expanded with a section generated from the captions file for its segment. Typically, in these templates, a click on a thumb image will bring up the full image in a separate window; that window is reused for viewing all full-sized images. See, for example, my Semester at Sea pictures.

Gendirs
gendirs [-n ncols] [-w templatefile] [-v picwrapper] captions.cap
... is similar to gensite, but creates a new subdirectory for each segment of the captions file. It is used with a template that generates a separate HTML file for each photo. When viewing at the full-size, the pages cycle through these individual pages. There are not two windows as for gensite. One example is my pictures of Peru and Ecuador.

Nobg, nosur.
nobg  [-f fuzz-precent] [-b blur-spread] [-t]  file [outfile]
nosur [-f fuzz-precent] [-b blur-spread] [-t]  file [outfile]
These are the halo removal tools. They process images to remove monochrome backgrounds.
   
Prerr
prerr text
... is a trivial C program that prints its command line argument to stderr. It is used for error messages in scripts whose output to stdout is usually redirected to a file.

Gentransparencytable
gentransparencytable
... creates ${PICTOOLS}/transparencytable.png, a file required by nosur and nobg.


Halo Removal 
Documentation
Samples
Tools to make
backgrounds transparent
without leaving haloes.

Many icons are not by nature rectangular. Some have holes. In this icon, next in a box, the background color shines through. When making gifs transparent, the original backround sometimes adheres to the edge of the icon, leaving an ugly halo: bear from ableweb.com (see the little white bits). This package offers two scripts—nobg and nosur—which make backgrounds transparent and reduce halos: able bear after nobg  For more on halos, see the demonstration by Bob Osala, who also describes a kludge needed for older versions of InternetExplorer. For too much more on nobg and nosur, see the documentation and samples.

The halo tools are in Pictools and can be downloaded as shown just below.

Download Pictools 
The following are needed to use pictools:
  • The Makefiles are heavily dependent on GNU make.
  • Some form of unix is required; all development has been under Cygwin and windows XP.
  • ImageMagick is used for image manipulation; the cygwin version is fine.
  • Disk space: about a mega-byte for pictools. Much more for cygwin. Still more for pictures if you have too many.
Further information is in the README. Click button to
Copyright boilerplate for zweibieren
Copyright 2008, Zweibieren
12 Sep 2008  05:35 PM
Page maintained by Zweibieren  two steins of beer