从自定义播放器中提取YouTube标题

Question

我正致力于构建自定义YouTube播放器，以便在网站上嵌入视频Feed。我对此很陌生，而且我在网上搜索时没有多少运气。

使用教程中有用代码的片段，我创建了一个主视频播放器和一个缩略图轮播，供用户点击将该视频加载到播放器中。但是，唯一缺少的是我希望当前所选视频的标题显示在iframe标记下方。对此有何帮助？或者有人能指出我正确的方向吗？

这是我的剧本：

<script>
(function() {
    function createPlayer(jqe, video, options) {
        var ifr = $('iframe', jqe);
        if (ifr.length === 0) {
            ifr = $('<iframe scrolling="no">');
            ifr.addClass('player');
        }
        var src = 'http://www.youtube.com/embed/' + video.id;
        if (options.playopts) {
            src += '?';
            for (var k in options.playopts) {
                src+= k + '=' + options.playopts[k] + '&';
            }  
            src += '_a=b';
        }
        ifr.attr('src', src);
        jqe.append(ifr);  
    }

    function createCarousel(jqe, videos, options) {
        var car = $('div.carousel', jqe);
        if (car.length === 0) {
            car = $('<div>');
            car.addClass('carousel');
            jqe.append(car);

        }
        $.each(videos, function(i,video) {
            options.thumbnail(car, video, options); 
        });
    }

    function createThumbnail(jqe, video, options) {
        var imgurl = video.thumbnails[0].url;
        var img = $('img[src="' + imgurl + '"]');
        if (img.length !== 0) return;
        img = $('<img>');    
        img.addClass('thumbnail');
        jqe.append(img);
        img.attr('src', imgurl);
        img.attr('title', video.title);
        img.click(function() {
            options.player(options.maindiv, video, $.extend(true,{},options,{playopts:{autoplay:1}}));
        });
    }


    var defoptions = {
        autoplay: false,
        user: null,
        player: createPlayer,
        carousel: createCarousel,
        thumbnail: createThumbnail,
        loaded: function() {},
        playopts: {
            autoplay: 0,
            egm: 1,
            autohide: 1,
            fs: 1,
            showinfo: 0
        }
    };


    $.fn.extend({
        youTubeChannel: function(options) {
            var md = $(this);
            md.addClass('youtube');
            var allopts = $.extend(true, {}, defoptions, options);
            allopts.maindiv = md;
            $.getJSON('http://gdata.youtube.com/feeds/users/' + allopts.user + '/uploads?alt=json-in-script&format=5&callback=?', null, function(data) {
                var feed = data.feed;
                var videos = [];
                $.each(feed.entry, function(i, entry) {
                    var video = {
                        title: entry.title.$t,
                        id: entry.id.$t.match('[^/]*$'),
                        thumbnails: entry.media$group.media$thumbnail
                    };
                    videos.push(video);
                });
                allopts.allvideos = videos;
                allopts.carousel(md, videos, allopts);
                allopts.player(md, videos[0], allopts);
                allopts.loaded(videos, allopts);
            });
        } 
    });

})();

$(function() {
    $('#player').youTubeChannel({user:'oklahomadaily'});
});


</script>

这是我的HTML：

<div class="video">
    <div class="boxTitle">Featured videos</div>
    <div id="player"></div>
    <div id="title"><p class="multimedia">Could not find a description...</p></div>
</div>

感谢您的耐心和帮助。