var FeatureVideo = new Class({
    initialize: function() {
        this.container = $('player_video');
        this.videos = new Array();
    },
    
    addVideo: function(player, name, position, team, title, content) {
        var info = new Object();
        info.player = player;
        info.name = name;
        info.position = position;
        info.team = team;
        info.title = title;
        info.content = content;
        info.id = this.videos.length;
        this.videos[this.videos.length] = info;
    },
    
    display: function() {
        if (this.videos.length > 0) {
            this.videobox = new Element('div', { 'styles': { 'text-align': 'center' }}).inject(this.container);
            
            var num = 1;
            this.videos.each(function(v) {
                if (v.id > 0) new Element('div', { 'class': 'spacer' }).inject(this.container);
                v.element = new Element('div', { 'class': 'videolink', 'events': { 'click': function() {
                        this.showVideo(v.id);
                    }.bind(this)}}).inject(this.container);

                var col = new Element('div', { 'class': 'left' }).inject(v.element);
                new Element('img', { 'src': '/images/nums/' + num.toString() + '.png' }).inject(col);
                
                col = new Element('div', { 'class': 'right' }).inject(v.element);
                if (v.position.length > 0)
                    new Element('a', { 'class': 'highlight', 'href': '/player.aspx?id=' + v.player }).set('text', v.name + ' - ' + v.position).inject(col);
                else
                    new Element('a', { 'class': 'highlight', 'href': '/player.aspx?id=' + v.player }).set('text', v.name).inject(col);
                new Element('br').inject(col);
                new Element('span').set('text', v.team).inject(col);
                new Element('br').inject(col);
                new Element('span', { 'class': 'caption' }).set('text', v.title).inject(col);
                new Element('div', { 'styles': { 'clear': 'both' }}).inject(col);
                num++;
            }.bind(this));
            this.showVideo(0);
        }
    },
    
    showVideo: function(id) {
        this.videobox.set('html', this.videos[id].content);
        this.videos.each(function(v) {
            if (v.id == id) {
                if (!v.element.hasClass('playing'))
                    v.element.addClass('playing');
            }
            else {
                if (v.element.hasClass('playing'))
                    v.element.removeClass('playing');
            }
        }.bind(this));
    }
});