Youtube Code

by aaronk85

HTML

<div id="youtube-wrap">
    <div id="embed"></div>
    <div id="videos"></div>
</div>

JavaScript

$(document).ready(function() {
        
    $("#embed").replaceWith("<div id ='play-video'></div>");
    $.getJSON("http://gdata.youtube.com/feeds/api/users/aflnorthernterritory/uploads?max-results=1&orderby=published&v=2&alt=jsonc&callback=?", function(data) {
        var dataContainer = $("#play-video");
        $.each(data.data.items, function(i, val) {
            if (typeof(val.player) !== 'undefined' && typeof(val.title) !== 'undefined') {
                dataContainer.append("<iframe width='284' height='220' src='http://www.youtube.com/embed/"+val.id+"?rel=0&autohide=1&amp;wmode=transparent' frameborder='0' name='vid-frame' id='vid-fade' allowfullscreen></iframe>");
            }
        });
    });
    $("#videos").replaceWith("<div id ='thumbs'></div>");
    $.getJSON("http://gdata.youtube.com/feeds/api/users/aflnorthernterritory/uploads?max-results=4&orderby=published&v=2&alt=jsonc&callback=?", function(data) {
        var dataContainer = $("#thumbs");
        $.each(data.data.items, function(i, val) {
            if (typeof(val.player) !== 'undefined' && typeof(val.title) !== 'undefined') {
                dataContainer.append("<div class='vid-thumb thumb-id-"+ (i+1) +"'><a href = 'http://www.youtube.com/embed/"+val.id+"?rel=0' target = 'vid-frame' id='click-vid'><img src='"+val.thumbnail.sqDefault+"' width='68'></a></div>");
            }
        });
    });     
});