Replace YouTube URL into a Video

by Taufik Nurrohman

HTML

<p>
    http://youtu.be/-joKveiaabA
    http://www.youtube.com/watch?v=-joKveiaabA
</p>

CSS

body {
    padding:10px;
    background-color:#ccc;
}

img.youtube-thumbnail {
    display:block;
    margin:0px auto 10px;
    border:2px solid black;
}

JavaScript

$('p').html(function(i, html) {
    var re  = /(?:http:\/\/)?(?:www\.)?(?:youtube\.com|youtu\.be)\/(?:watch\?v=)?(.+)/g,
        vidthumb = '<a href="http://www.youtube.com/watch?v=$1" target="_blank"><img class="youtube-thumbnail" src="http://i2.ytimg.com/vi/$1/0.jpg" /></a>';
    return html.replace(re, vidthumb);

});