var Videobox = {

    init: function(options) {
        this.options = $extend({
            resizeDuration: 200,
            resizeTransition: false, // default transition
            width: 380,
            height: 212,
            animateCaption: true,
            showCounter: false
        }, options || {});

        this.anchors = [];
        $each(document.links, function(el) {
            if (el.rel && el.rel.test(/^videobox/i)) {
                el.onclick = this.click.pass(el, this);
                this.anchors.push(el);
            }
        }, this);
        this.eventKeyDown = this.keyboardListener.bindAsEventListener(this);
        this.eventPosition = this.position.bind(this);

        this.overlay = new Element('div', { 'id': 'vbOverlay' }).injectInside(document.body);
        this.centerVideo = new Element('div', { 'id': 'vbCenterVideo', 'styles': { 'width': 240, 'height': 100, 'marginLeft': -(240 / 2), 'display': 'none'} }).injectInside(document.body);
        this.memberVideo = new Element('div', { 'class': 'member_video_380' }).injectInside(this.centerVideo);
        this.videoHolder = new Element('div', { 'class': 'video_holder' }).injectInside(this.memberVideo);
        this.divPlayer = new Element('div', { 'id': 'divPlayer_1' }).injectInside(this.videoHolder);
        this.player = null;

        this.bottomContainer = new Element('div', { 'id': 'vbBottomContainer', 'styles': { 'display': 'none', 'width': this.options.width } }).injectInside(document.body);
        this.bottom = new Element('div', { 'id': 'vbBottom' }).injectInside(this.bottomContainer);
        new Element('a', { 'id': 'vbCloseLink', 'href': '#' }).injectInside(this.bottom).onclick = this.overlay.onclick = this.close.bind(this);
        new Element('div', { 'styles': { 'clear': 'both'} }).injectInside(this.bottom);

        var nextEffect = this.nextEffect.bind(this);
        this.fx = {
            overlay: this.overlay.effect('opacity', { duration: 500 }).hide(),
            resize: this.centerVideo.effects($extend({ duration: this.options.resizeDuration, onComplete: nextEffect }, this.options.resizeTransition ? { transition: this.options.resizeTransition} : {})),
            bottom: this.bottom.effect('margin-top', { duration: 400, onComplete: nextEffect })
        };
    },

    click: function(link) {
        var iVideo = link.rel.substr(9);
        return this.show(iVideo);
    },

    show: function(iVideo) {
        this.open();
        this.player = new Element('iframe', { 'src': 'video_popup.aspx?v=' + iVideo + '|380|212', 'frameBorder' : '0' }).injectInside(this.divPlayer);
        this.player.width = this.options.width;
        this.player.height = this.options.height;

		this.step = 1;
        var nextEffect = this.nextEffect.bind(this);
        window.setTimeout(nextEffect, 100);

        return false;
    },

    open: function() {
        this.position();
        this.setup(true);
        this.top = window.getScrollTop() + (window.getHeight() / 15);
        this.centerVideo.setStyles({ top: this.top, display: '' });
        this.fx.overlay.start(0.5);
    },

    position: function() {
        this.overlay.setStyles({ 'top': window.getScrollTop(), 'height': window.getHeight() });
    },

    setup: function(open) {
        var elements = $A(document.getElementsByTagName('object'));
        elements.extend(document.getElementsByTagName(window.ie ? 'select' : 'embed'));
        elements.each(function(el) {
            if (open) el.vbBackupStyle = el.style.visibility;
            el.style.visibility = open ? 'hidden' : (el.vbBackupStyle ? el.vbBackupStyle : 'hidden');
        });
        var fn = open ? 'addEvent' : 'removeEvent';
        window[fn]('scroll', this.eventPosition)[fn]('resize', this.eventPosition);
        document[fn]('keydown', this.eventKeyDown);
        this.step = 0;
    },

    keyboardListener: function(event) {
        switch (event.keyCode) {
            case 27: case 88: case 67: this.close(); break;
        }
    },

    nextEffect: function() {
        switch (this.step++) {
            case 1:
                this.centerVideo.className = '';
                if (this.centerVideo.clientHeight != this.options.height){
                    this.fx.resize.start({height: this.options.height});
                    break;
                }
                this.step++;
            case 2:
                if (this.centerVideo.clientWidth != this.options.width){
                    this.fx.resize.start({width: this.options.width, marginLeft: -this.options.width/2});
                    break;
                }
                this.step++;
            case 3:
                this.bottomContainer.setStyles({ top: this.top + this.centerVideo.clientHeight, height: 0, marginLeft: this.centerVideo.style.marginLeft, display: '' });
                if (this.options.animateCaption) {
                    this.fx.bottom.set(-this.bottom.offsetHeight);
                    this.bottomContainer.style.height = '';
                    this.fx.bottom.start(0);
                    break;
                }
                this.bottomContainer.style.height = '';
            case 4:
                this.step = 0;
        }
    },

    close: function() {
        if (this.step < 0) return;
        this.step = -1;
        for (var f in this.fx) this.fx[f].stop();
        this.centerVideo.style.display = this.bottomContainer.style.display = 'none';
        this.fx.overlay.chain(this.setup.pass(false, this)).start(0);
        this.divPlayer.removeChild(this.player);
        this.player = null;
        return false;
    }
};

window.addEvent('domready', Videobox.init.bind(Videobox));