//NOTE: $ = frmwrk.js which = mootools
var bios = {
    init: function (options) {
        //bind bio click to anchor tags with rel="expert"
        this.anchors = []; //create a new array to hold anchor tags
        $each(document.links, function (el) {
            //anchor has a rel and that rel == "expert"
            if (el.rel && el.rel.test(/^expert/i)) {
                el.onclick = this.click.pass(el, this);
                this.anchors.push(el); //add anchor to this.anchors
            }
        }, this);

        this.eventPosition = this.position.bind(this);
        this.overlay = new Element('div').setProperty('id', 'overlay-bio').injectInside(document.body);
        this.bioBox = new Element('div').setProperty('id', 'bioBox').setStyles({ display: 'none' }).injectInside(document.body);
        this.bioWrap = new Element('div').setProperty('id', 'bioWrap').injectInside(this.bioBox);
        this.bioHead = new Element('div').setProperty('id', 'bioHead').injectInside(this.bioWrap).onclick = this.overlay.onclick = this.close.bind(this);
        this.bioContent = new Element('div').setProperty('id', 'bioContent').injectInside(this.bioWrap);

        var nextEffect = this.nextEffect.bind(this);

        this.fx = {
            overlay: this.overlay.effect('opacity', { duration: 500 }).hide(),
            bioWrap: this.bioWrap.effect('opacity', { duration: 500, onComplete: nextEffect })
        };
    },

    click: function (link) {
        if (link.rel.length == 6) return this.show(link.href, link.title);

        var j, bioNum, bios = [];
        this.anchors.each(function (el) {
            if (el.rel == link.rel) {
                for (j = 0; j < bios.length; j++) if (bios[j][0] == el.href) break;
                if (j == bios.length) {
                    bios.push([el.href, el.title]);
                    if (el.href == link.href) bioNum = j;
                }
            }
        }, this);
        return this.open(bios, bioNum);
    },

    show: function (url, title) {
        return this.open([[url, title]], 0);
    },

    open: function (bios, bioNum) {
        this.bios = bios;
        this.position();
        this.setup(true);
        this.top = window.getScrollTop() + (window.getHeight() / 15);
        this.bioBox.setStyles({ top: this.top + 'px', display: '' });
        this.fx.overlay.start(0.8);
        this.overlay.setStyles({ display: 'block' });
        return this.changeBio(bioNum);
    },

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

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

    changeBio: function (bioNum) {
        if (this.step || (bioNum < 0) || (bioNum >= this.bios.length)) return false;
        this.step = 1;
        this.activeBio = bioNum;
        this.fx.bioWrap.hide();
        //split the href at the # to get the eb[id]
        this.newBio = this.bios[this.activeBio][0].split('#');
        this.newBioID = this.newBio[1].trim();
        this.nextEffect();
        return true;
    },

    nextEffect: function () {
        switch (this.step++) {
            case 1:
                if ($ES('div', this.bioContent).length = 0) {
                    this.bioContent.firstChild.injectInside(document.body)
                }
                //determine div by taking eb[id] and adding -bio to it
                //inject content inside of eb[id]-bio
                $(this.newBioID + '-bio').injectInside(this.bioContent).setStyles({ display: 'block' });
                this.fx.bioWrap.start(1);
                break;
                this.step++;
            case 2:
                this.step = 0;
        }
    },

    close: function () {
        if (this.step < 0) return;
        this.step = -1;
        for (var f in this.fx) this.fx[f].stop();
        this.bioBox.style.display = 'none';
        this.fx.overlay.chain(this.setup.pass(false, this)).start(0);
        this.overlay.setStyles({ display: 'none' });
        $(this.newBioID + '-bio').setStyles({ display: 'none' });
        return false;
    }
};
//on domready call bios.init.bind(bios);
window.addEvent('domready', bios.init.bind(bios));

// updated version of the js object above for use with
// the new master page bio display
var expertBio = {
    open: function () {
        this.eventPosition = this.position.bind(this);

        this.overlay = new Element('div').setProperty('id', 'overlay-bio').injectInside(document.getElementById('expert-bio'));
        this.bioBox = new Element('div').setProperty('id', 'expert-bioBox').setStyles({ display: 'none' }).injectInside(document.getElementById('expert-bio'));
        this.bioWrap = new Element('div').setProperty('id', 'expert-bioWrap').injectInside(this.bioBox);
        this.bioHead = new Element('div').setProperty('id', 'expert-bioHead').injectInside(this.bioWrap);
        this.bioContent = new Element('div').setProperty('id', 'expert-bioContent').injectInside(this.bioWrap);

        this.position();
        this.setup(true);
        this.top = window.getScrollTop() + (window.getHeight() / 15);
        this.bioBox.setStyles({ top: this.top + 'px', display: '' });
        this.fx = {
            overlay: this.overlay.effect('opacity', { duration: 500 }).hide(),
            bioWrap: this.bioWrap.effect('opacity', { duration: 500 })
        };
        this.fx.overlay.start(0.8);
        this.overlay.setStyles({ display: 'block' });
        this.fx.bioWrap.start(1);
        this.bioContent.setStyles({ display: 'block' });
    },

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

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