The embedded media field is a project for Drupal that adds support to embed third party media into content types. Several video providers are already supported, and Drupal user robomalo started adding Vimeo support.
This works for embedding videos, but it did not support fetching thumbnails - until now! I've attached my changes to the Vimeo code that now supports thumbnails.
Embedding video takes a couple of steps. The first is to extract the Vimeo ID number from the URL, then use this to generate the embed code. The Vimeo include file already does this, and provides some options for configuring the embed code.
Supporting thumbnails takes a little bit more effort, as it involves using the Vimeo API to request the video thumbnail API.
The embedded video field uses include files to add support for different video hosts. These include files contain the implementation for various "hooks" that are called to perform various tasks. The hook for adding thumbnail support is called video_cck_PROVIDER_thumbnail - so in this case the function to implement is video_cck_vimeo_thumbnail. This function should return the URL to the thumbnail image.
In order to fetch the thumbnail location, we need to make a call to getThumbnailUrl method of the Vimeo API. In order to make an API call we need to give our API key as provided by Vimeo, and we need to "sign" our request using our Shared Secret with Vimeo. I've added these to options to the video embed settings page, by adding the following code to the end of the video_cck_vimeo_settings hook implementation:
<?php
$form['vimeo']['video_cck_vimeo_api_key'] = array(
'#type' => 'textfield',
'#title' => t('Vimeo API Key'),
'#default_value' => variable_get('video_cck_vimeo_api_key', ''),
);
$form['vimeo']['video_cck_vimeo_api_secret'] = array(
'#type' => 'textfield',
'#title' => t('Vimeo API Shared Secret'),
'#default_value' => variable_get('video_cck_vimeo_api_secret', ''),
);
$form['vimeo']['video_cck_vimeo_thumb_size'] = array(
'#type' => 'select',
'#title' => t('Vimeo Thumbnail Size'),
'#options' => array('96' => '96', '100' => '100', '160' => '160', '200' => '200', '460' => '460'),
'#default_value' => variable_get('video_cck_vimeo_thumb_size', '160'),
);
?>Notice there's also an option to select the size of thumbnail requested from Vimeo.
Now using those three options we can formulate our request to the Vimeo API and generate our signature using an MD5 hash:
<?php
function video_cck_vimeo_thumbnail($field, $item, $formatter, $node, $width, $height) {
$vimeo_id = (substr($item['value'],-1,1)=='/') ? substr($item['value'],0,-1) : $item['value'];
$vimeo_signature = variable_get('video_cck_vimeo_api_secret', '') .
'api_key' . variable_get('video_cck_vimeo_api_key', '') .
'method' . 'vimeo.videos.getThumbnailUrl' .
'size' . variable_get('video_cck_vimeo_thumb_size', '160') .
'video_id' . $vimeo_id;
$vimeo_apicall = 'http://www.vimeo.com/api/rest?' .
'api_key=' . variable_get('video_cck_vimeo_api_key', '') .
'&method=' . 'vimeo.videos.getThumbnailUrl' .
'&size=' . variable_get('video_cck_vimeo_thumb_size', '160') .
'&video_id=' . $vimeo_id .
'&api_sig=' . md5($vimeo_signature);
$api_file = file_get_contents($vimeo_apicall);
$xml = new SimpleXMLElement($api_file);
return $xml->thumbnail;
}
?>Notice that I am using SimpleXML to parse the thumbnail location from the result of the Vimeo API call. This means this code requires PHP5. There may be a better way to do this, but as I always run on PHP5 this isn't a problem.
Usage: download the attached file, you need to place it in the "providers" subdirectory in your emfield folder.
| Attachment | Size |
|---|---|
| vimeo.inc | 10.02 KB |
vimeo
great!
just googled for problems with vimeo thumbnails and here you are! Just what we needed I think - I'm sending it on to Mark.
Hurray for Darren Mothersele :)
Code here needs caching adding
Although this works, it's a good idea to add caching for thumbnail location when used on a production website. It's not too hard to add this using Drupal's built in caching functions.
Vimeo in 200px wide thumbnail
I'm a-gonna try to do this for my Wordpress sidebar. I am a musician with a few videos of my gigs, and because I'm such a nut for how my blog LOOKS, I'm hoping I can use this info to always keep the most recent video near the top of my right sidebar in lovely 200px width.
In other words... to go boldly into HTML land where this Jannie has not gone before. Yikes.
Wish me luck. And thank you!
And if I may be so bold to link to one of said videos of mine...
http://www.janniefunster.com/2009/04/24/i-need-a-chainsaw-man-video/
err, ok
Well, not sure what that has to do with my post, but you've gone to the trouble of posting it, so I guess I'll leave it here :)
Ahhhh, I see now.
Ooo, I guess I misunderstood this whole post. I thought this was about getting the correct code to have my Vimeo show up in my sidebar in a thumbnail. (Insert my somewhat sheepish grin here.)
Does this work for private videos?
We're having a problem retrieving thumbnails for private videos. I'm guessing this code made it into our version of embedded media field, if so, do we need the api key and so on?
try the issue queue
I'm pretty sure the code in the emfield module has improved since this early version. I've not tried emfield with private videos. Have you posted to the issue queue on d.o?
Post new comment