Building a Photo Gallery

Setting up ffmpeg

I don't know a great deal about video except that H264 offers excellent compression, verg high quality and can be played by recent versions of Flash player. As a result it is the video format of choice for the gallery.

I followed a combination of these two guides:

• http://www.getlifebox.org/tag/x264/

• http://ubuntuforums.org/showthread.php?t=786095

Neither guide quite worked for me but a combination did. In particular I needed the --enable-libamr-nb --enable-libtheora --enable-libvorbis --enable-libamr-wb flags Here are the exact commands I used (Ubuntu 8.10, 3rd May 2009):

sudo apt-get purge ffmpeg x264 libx264-dev
sudo apt-get install build-essential subversion git-core \
checkinstall texi2html libfaac-dev libfaad-dev \
libmp3lame-dev libtheora-dev libxvidcore4-dev
cd ~/
wget http://www.tortall.net/projects/yasm/releases/yasm-0.7.2.tar.gz
tar xzvf yasm-0.7.2.tar.gz
cd yasm-0.7.2
./configure
make
sudo checkinstall --pkgname=yasm --default
sudo dpkg -i yasm*.deb
cd ~/
git clone git://git.videolan.org/x264.git
cd x264
./configure --enable-shared
make
sudo checkinstall --fstrans=no --install=yes --pkgname=x264 \
--pkgversion "1:0.svn`date +%Y%m%d`-0.0ubuntu1" --default
sudo ldconfig
sudo dpkg -i x264*.deb
cd
wget http://ftp.penguin.cz/pub/users/utx/amr/amrwb-7.0.0.3.tar.bz2
tar jxfv amrwb-7.0.0.3.tar.bz2
cd amrwb-7.0.0.3/
./configure
make
sudo make install
cd
wget http://ftp.penguin.cz/pub/users/utx/amr/amrnb-7.0.0.2.tar.bz2
tar jxfv amrnb-7.0.0.2.tar.bz2
cd amrnb-7.0.0.2/
./configure
make
sudo make install
cd
svn checkout svn://svn.ffmpeg.org/ffmpeg/trunk ffmpeg
cd ffmpeg
./configure --enable-gpl --enable-nonfree --enable-pthreads --enable-libfaac --enable-libfaad --enable-libmp3lame --enable-libtheora --enable-libx264 --enable-libxvid --enable-libamr-nb --enable-libamr-wb
make
sudo mkdir /usr/local/lib/pkgconfig
sudo mkdir /usr/local/include/libavdevice
sudo mkdir /usr/local/include/libavformat
sudo mkdir /usr/local/include/libavcodec
sudo mkdir /usr/local/include/libavutil
sudo mkdir /usr/local/include/libswscale
sudo mkdir /usr/local/share/ffmpeg
sudo mkdir /usr/lib/vhook
sudo checkinstall --fstrans=no --install=yes --pkgname=ffmpeg --pkgversion "3:0.svn`date +%Y%m%d`-12ubuntu3" --default
sudo dpkg -i ffmpeg*.deb
sudo ln -s /usr/local/lib/libamrnb.so.3 /usr/lib/libamrnb.so.3
sudo ln -s /usr/local/lib/libamrwb.so.3 /usr/lib/libamrwb.so.3

Creating the H264 Video

Here's the command I use to create the videos:

/usr/local/bin/ffmpeg -y -i ../Desktop/untitled\ folder/CIMG2750.AVI -pass 1 -vcodec libx264 -vpre fastfirstpass -b 512k -bt 512k -threads 0 -f mp4 -an /dev/null && /usr/local/bin/ffmpeg -i ../Desktop/untitled\ folder/CIMG2750.AVI -pass 2 -acodec libfaac -ab 128k -ac 2 -vcodec libx264 -vpre hq -b 512k -bt 512k -threads 0 -f mp4 ../Desktop/output.mp4

This compresses a 14Mb file down to 1.1Mb with no really noticable loss of quality (it was an underwater video anyway).

Extracting the EXIF Data from JPEGs

Install exiv2:

sudo apt-get install exiv2

Then extract data like this:

exiv2 pr Desktop/CIMG2745.JPG > exif.txt

Resizing an Image

Install ImageMagick and ufraw (for raw camera images)

sudo apt-get install imagemagick ufraw dcraw

You can do this fairly easily like this, only resizing images greater than 1024x1024 in either dimension.

convert -auto-orient -thumbnail 1024x1024> -unsharp 0x.5 input.JPG output.jpg

Creating a High Quality Thumbnail

I used to create a 100x100 thumbnail, scaled so that the whole photo is visible. This time I want to use 150x150 thumbnails but zoomed in a little so that the image fills the square. I've also found in the past that thumbnails can look a little blurry so I want to sharpen them up a bit. We can also strip the EXIF data from the thumbnails (the -thumbnail option does this anyway.

Run the command:

convert -auto-orient -thumbnail x150 -crop 150x150+0+0 +repage -gravity center -unsharp 0x.5 input.JPG thumb.jpg

See also:

• http://www.imagemagick.org/Usage/

Generating Stills

This is the command I use to create a thumbnail from CIMG2750.AVI. Notice the -ss 00:00:08.5 part. This says to take the still from 8.5 seconds into the video:

ffmpeg -i CIMG2750.AVI -an -ss 00:00:08.5 -an -r 1 -vframes 1 -y thumb.jpg

The full size stills go in the stills directory but also need to be resized to go in the thumbnails directory.

wget http://jimmyg.org/blog/2009/building_a_gallery/video.png

convert -auto-orient -thumbnail x150 -crop 150x150+0+0 +repage -gravity center -unsharp 0x.5 test.jpg -draw "image over  0,0 150,150 'video.png'" thumb.jpg

Flash Video Player

This was the most promising open source flash HD player I found: http://www.weberdesignlabs.com/blog/?p=24. Unfortunately it doesn't allow configuration of which video to play unless you have Adobe CS3. Luckliy someone in the comments left this version: http://drop.io/fg9dhch. You can configure it in the HTML and it seems to work well. There is a copy here.