*** This post was updated with new JavaScript code on 27-oct-2009 ***

Sure, you can install Video Downloadhelper for Firefox if you want an easy way to download your favourite YouTube videos.

However, these will be downloaded in “FLV” format (Flash video). Nowadays, many videos on YouTube are available in High-Definition (HD) format and you may want to retrieve the higher quality (MP4) movies instead.

Here is a bit of JavaScript which checks if the movie you selected is available as HD 720p. If a HD format is available it will be the preferred download type (fmt24) instead of the usual “high” (fmt18) or
“regular”quality.

I got the javascript code from this page, which I found after my original javascript code stopped working (I guess Google removed the javascript functions to block folks like us):  http://googlesystem.blogspot.com/2008/04/download-youtube-videos-as-mp4-files.html . The new code is a lot uglier than the initial javascript, but it works. That page also has the same code available, nicely reformatted, as a GreaseMonkey script if you have that firefox extension already installed.

Define the following text as a bookmark and you are only a click away from downloading HD YouTube videos (in Firefox, right-click the link below and select “bookmark this link“):

javascript:var%20video_id=null;var%20video_hash=null;var%20video_player=document.getElementById(‘movie_player’);if(video_player){var%20flash_variables=video_player.attributes.getNamedItem(‘flashvars’);if(flash_variables){var%20flash_values=flash_variables.value;if(flash_values){var%20video_id_match=flash_values.match(/[^a-z]video_id=([^(\&|$)]*)/);if(video_id_match!=null)video_id=video_id_match[1];var%20video_hash_match=flash_values.match(/[^a-z]t=([^(\&|$)]*)/);if(video_hash_match!=null)video_hash=video_hash_match[1]}}}if(video_id==null||video_hash==null){var%20args=null;try{args=yt.getConfig(‘SWF_ARGS’)}catch(e){}if(args){video_id=args[‘video_id’];video_hash=args[‘t’]}}if(video_id!=null&&video_hash!=null){var%20fmt=’18’;try{if(yt.getConfig(‘IS_HD_AVAILABLE’))fmt=’22’}catch(e){}if(!document.getElementById(‘download-youtube-video’)){var%20yt_mp4_path=’http://www.youtube.com/get_video?fmt=’+fmt+’&video_id=’+video_id+’&t=’+video_hash;var%20div_embed=document.getElementById(‘watch-embed-div’);if(div_embed){var%20div_download=document.createElement(‘div’);div_download.innerHTML=’%3Cbr%20/%3E%20%3Cspan%20id=\’download-youtube-video\’%3E%20%3Ca%20href=\”+yt_mp4_path+’\’%20onclick=\’blur(this);\’%3EDownload%20as%20MP4%3C/a%3E%3C/span%3E’;div_embed.appendChild(div_download);}if(navigator.appName!=’Microsoft%20Internet%20Explorer’){document.location.href=’http://www.youtube.com/get_video?fmt=’+fmt+’&video_id=’+video_id+’&t=’+video_hash}}}void(0);

Note: this was the old code which now will no longer work:

javascript:if(document.location.href.match(/http:\/\/[a-zA-Z\.]*youtube\.com\/watch/)){document.location.href=’http://www.youtube.com/get_video?fmt=’+(isHDAvailable?’22’:’18’)+’&video_id=’+swfArgs[‘video_id’]+’&t=’+swfArgs[‘t’]}

The proof of the pudding is in the eating. Select a YouTube video, click on “pause” if you do not want to play it in the embedded video frame. Then, click on the bookmark you created and the video will start downloading. It will (always) be saved with the name “video.mp4” so you will have to rename it after the download finishes.

Have fun! Eric