Picture Management

Organization

I organize my pictures into folders named with the date and event such as "2009-12-05 Snow in Chattanooga" for example. This helps with sorting. I have also started using a year folder to reduce the number of albums in a single folder.

Rotation batch file

Before moving pictures to a folder I first automatically rotate them using this batch file:

rotate.bat

jhead -autorot *.jpg

The batch file requires jhead.exe and jpegtran.exe which are both free (see Free_Tools#Graphics for download links).

Resize and remove thumbs.db

I also upload pictures to my online gallery (UPDATE: I now upload the full resolution photos to SmugMug which retains the full quality images for me instead of resizing them). In order to save time and server side resources, I used to use the following batch file to automatically remove all the thumbs.db files and resize the images to a resolution of 1600 on the longest side. I first copied any albums that I wanted to upload into a "to upload" folder where this batch file resides. The batch file does modify the files so I made sure to keep another copy of the high quality images elsewhere.

mogrify.bat

for /f "tokens=*" %%a in ('dir /b /a:d 2^>NUL') do attrib -s -h "%%a\Thumbs.db"
for /f "tokens=*" %%a in ('dir /b /a:d 2^>NUL') do del "%%a\Thumbs.db"
for /f "tokens=*" %%a in ('dir /b /a:d 2^>NUL') do "c:\program files\ImageMagick-6.5.0-Q16\mogrify" -resize 1600x1600 "%%a"\*.*

Online Photo Sharing

After using a few free services that eventually went away I then used my own installation of Gallery for several years. I then migrated to SmugMug due to a number of factors which are listed on my SmugMug page.

Backups

I store my photos locally on a Western Digital Mybook World Edition II network attached drive with 2 drives configured in mirrored mode. I also upload my pictures to SmugMug and they keep the original image files online where I could retrieve them if the local drive failed. I used to burn CDs and then DVDs regularly but with higher resolution pictures this has become harder to keep up with.

Displaying pictures on a web page or within a blog article

Use html spans to float pictures left and right with captions in a block of text

For reference here is the related CSS that I use:

.float-left   {
              float:left;
              text-align:center;
              margin:10px 10px 10px 0px;
              border:1px solid #999;
              }

.float-right  {
              float:right;
              text-align:center;
              margin:10px 0px 10px 10px;
              border:1px solid #999;
              }

I then use the following syntax to display an image:

<span class="float-right"><img src="image.jpg" width="400" height="300"><br />Mojave Preserve</span>

Evenly insert spans into a text block using a script

I use the following steps to insert a number of smaller pictures into a block of text for posting on a web site.

1. Resize all pics to a 400 pixels on the long side using mogrify (see above for syntax)
2. Upload pictures to folder containing the script below
3. Upload the text document and name it update.txt
4. run

   php addpics.php > update_with_pics.txt

   1. add exif dates to any files that don't have them using this:

      ./exifedit -a "date-taken=2011-10-16" image.jpg

5. fill in the captions

Script to insert pics:

<?php
/* Written by: Andrew Porter
   Date: 4/16/2008
   Description:
   This script will take a text file and insert spans for each JPG in the current directory.
   It will evenly space the pictures within the text using the height of each picture and
   the total number of characters in the text file.  It will insert the pictures in
   chronological order using the date the pictures were taken as stored in the exif data.
   To determine the date pictures were taken this script calls the program called exiflist
   which is available here: http://www.hugsan.com/EXIFutils
*/

$filename="update.txt";
$img_folder="./";

//create list of images in the current folder
$imglist='';
$imgs = dir($img_folder);

while ($file = $imgs->read()) {
   if (eregi("jpg", $file)) $imglist .= "$file ";

 } closedir($imgs->handle);

//clean up image list and get number of images in the list
$imglist = explode(" ", $imglist);
array_pop($imglist);
$num_images = sizeof($imglist);

//initialize variables
$total_height=0;

//get width, height and date taken for each image and store in a new 2 dimensional array
foreach($imglist as $element => $image)
 {
   list($width, $height, $type, $attr) = getimagesize($image);
   $total_height += $height;
   $time_taken = exec("./exiflist $image | grep \"Time Taken\"");
   $time_taken = substr($time_taken, 29);
   $dated_images[] = array($time_taken,$image,$width,$height,$attr);
 }

//sort the new array by date taken
sort($dated_images);

//read text file and get number of characters
$text=file_get_contents($filename);
$characters=strlen($text);

//initialize variables
$cumalative_height=0;

//loop through the new array and add text blocks of calculated length from the text file to each array element
foreach ($dated_images as $element => $image)
 {
   $position = $next_position;
   $cumalative_height += $image[3];
   $next_position = round(($cumalative_height / $total_height) * $characters);
   $length = $next_position - $position;
   $dated_images[$element][5] = substr($text, $position, $length);
   $dated_images[$element][6] = $position;
   $dated_images[$element][7] = $next_position;
   $dated_images[$element][8] = $length;
   $attr = $dated_images[$element][4];
   if (($element%2))
    {
      $attr = "<span class=\"float-left\"><img src=\"/images/$image[1]\" $attr><br />caption</span>";
    }
   else
    {
      $attr = "<span class=\"float-right\"><img src=\"/images/$image[1]\" $attr><br />caption</span>";
    }
   $dated_images[$element][4] = $attr;
 }

//uncomment to print entire array for debugging
#print_r($dated_images);

//loop through the array and output the text with spans inserted
foreach ($dated_images as $image)
 {
   echo "$image[4]$image[5]";
 }

?>