I had a lot of fun yesterday with a little project. Our photographer sent us our wedding photos, via snail mail. The zipped up photos clocked in at 1.2GB, I think it was. I thought it was curious that she would have to send us our photos via writeable media, but then there still isn’t a good, popular solution for big file transfer.
I loaded up the disk on my one computer left with a disk so my wife and I could view them. I’ll take a second to plug our photographer - Allison Martin did a wonderful job photographing our wedding.
Of course, this is the internet and we’re obligated to share them with our friends and family. The standard thing is to post on Facebook, but I have to be different and a big jerk for standing up for privacy. So I decided I would host them on the same server as this blog.
The first thing I did was to fire up a simple PHP application and just load up the photographs. This technically did work, but the images were in the dozens of megabytes, with no way to preview the photographs, it was a very painful user experience. My friends were quick to let me know when I posted a link to the directory on Facebook.
So I had a few goals. I first needed to compress the images down to a more reasonable size - preferrably without any loss. Secondly, I had to generate thumbnails for each image. And finally, I had to generate a real webpage that would display the thumbnails as links to the full-size image.
During lunch yesterday I was reading through the first few chapters of The Art of Unix Programming. I knew this was a great opportunity to test my Linux skills.
So, starting with
wedding.zip, Here’s how I managed.
The starting point
unzip wedding.zip gave me 135 very large (dozens of MB per image) wedding photos, enumerated in the format
Heather & Dan-xx.jpg. Again, I need to present these on a webpage, compressed, with thumbnails.
Rename the files
First challenge was to rename all the files without spaces and that ampersand. I know
mv, but I don’t know how to use
mv on 135 files at once.
I found out about
rename which would rename a bunch of files with a regex search/replace.
rename Heather\ \&\ Dan- wedding *.jpg
so now I have a bunch of big files named
Compress the images
Compressing took some research to find a program for it. I did fire up one image in GIMP and compress it using its ‘export’ functionality, but that would take forever to do for 135 images. After some DuckDuckGoing, I found The ImageMagick package in the Arch Linux packages.
This enabled me to compress all the images with one command.
for f in *.jpg; do convert -quality 30 $f $f; done
I was surprised to find that I could reduce the file size by 30% and still not have any perceptable loss of quality. I don’t know how ImageMagick did the compression or how jpg compression works (it has something to do with Huffman Encoding), but that was a good enough reduction in file size for me.
Generate the thumbnails
Even more convenient, the same package has a function for creating thumbnails!
for f in *.jpg; do convert -thumbnail 200 $f thumbnail$f; done
So now I have
weddingXX.jpg files and a corresponding
thumbnailweddingXX.jpg, all in one directory.
Generate the web page
At this point I was happy with my command-line usage. I imagine the easiest way to write a script for generating the html would be to just use Bash or maybe Perl. I’m not so strong in those, so I went for a little Python program:
import os files = [f for f in os.listdir('.') if os.path.isfile(f)] for src in files: if "thumbnail" in src: fullsrc = src.replace("thumbnail", ""); print('<a href=\"' + fullsrc + '\"><img src=\"' + src + '\"></a>')
This generated all the tags I needed, I just surrounded it with the appropriate HTML boilerplate,
scp‘d it up to my webserver, and boom! Our wedding photos are presentable to the world!