PreViewTube.js

This is another thing which has been on my todo list for a while, 3 years be precise, better late than never eh.

Back in 2012 I was was integrating the YouTube API into a site I was developing, as part of this I had displayed video thumbnails as links to the channels videos. While the thumbnail images were static I was aware that YouTube generated a number of thumbnails for each video uploaded, so I thought it might be nice to have these thumbnails display as an animated preview of the video. I had a search to see if I could find any libraries or tools that could achieve this but came up blank so I set about implementing something myself.

My first thought was to create and an animated GIF for the videos, so I created a PHP script using GDlib to create a GIF with the keyframes on the fly on the first request and then saved it for subsequent requests. This felt a little clunky to me so I set about implementing a solution in JavaScript and the result was this jQuery plugin.

It was my intention to share this at the time as I thought it may be useful to others but I never quite got around to doing so, until now !

Demo

You can checkout the plugin in action and see the usage instruction at:
previewtube.vool.ie

The code for the plugin is also up on Github where you can also find installation instructions.

Leave a Reply