Creating Contact Sheet For TimeSlider Tooltip Plugin (LINUX)

Objective : 

Creating video preview picture and contact sheet that can be used for JW Player and Time Slider Tooltip Plugin under linux environment (console) . 

Tools : 

1. FFMPEG
2. IMAGEMAGICK

First we'll extract thumbnail from the video using ffmpeg, then those images combined in 5x5 tiles that produce 25 pictures in single canvas using montage from imagemagick (without frame etc). Each tumbnails are 108x60, these combination will produce 540x300 canvas.

How to Use :

# sh ./thumbgen.sh convert_me.mp4 1 120

convert_me.mp4 --> file name
1 --> create video tumbnails every 1 sec

120 --> create video preview image at 120 sec

these are the commands :

#!/bin/sh

# Script untuk membuat preview image dan contact sheet image dari video 

# untuk digunakan di JW Player dan Tooltip Plugin

# digitalismic.blogspot.com | modification are welcome

file=$1

# membuang ekstension sehingga nama file dapat digunakan sebagai identifikasi unik 

# setiap file yang digenerate

file_name=`echo "$file" | sed 's/....$//'`

# membuat preview image pada detik x (input ke-3), dengan ukuran 854x480

ffmpeg  -y -itsoffset -$3  -i $file -vcodec mjpeg -vframes 1 -an -f rawvideo -s 854x480 preview-$file_name.jpg

# membuat thumbnails temporary untuk membuat contact sheet dengan ukuran 108x60 

ffmpeg  -i $file -vcodec mjpeg -vf fps=fps=1/$2 -s 108x60 thumb-$file_name-%05d.jpg 

echo

echo "---------------------------------------"

count_thumbs=`find ./ -name "thumb-$file_name-*" | wc -l`

echo Finish Generate prewiew image at position $3-sec

echo Finish Generating $count_thumbs Tumbnails

echo Now Start To Create Contact Sheet "(5x5)"

echo "---------------------------------------"

# membuat contact sheet dengan ukuran 5x5

montage thumb-$file_name-*.jpg -tile 5x5 -geometry 108x60+0+0 contact-sheet-$file_name-%05d.jpg

echo Removing Generated Tumbnails

# karena sudah tidak diperlukan, maka semua file thumbnail di delete

rm -f thumb-$file_name-*.jpg

echo Finished

example result (contact sheet): 

example result (preview image):