/*
* Prototype based TabPanel
*/
var TabPanel = Class.create();
TabPanel.prototype = {
    initialize: function (element, options) {
        this.element = element;
        this.setOptions(options);
        this.setup();
    },
    setOptions: function (options) {
        this.options = {
            tabsel: '.tabs img:not([class~=calendar])',
            tabcur: { cursor: "pointer" },
            pnlsel: '.tabpanel',
            initidx: 0
        };
        Object.extend(this.options, options || {});
    },
    setup: function () {
        // find tabs
        this.tabcount = 0;
        this.tabs = [];
        tabs = this.element.select(this.options.tabsel);
        tabs.each(function (s, index) {
            s.setStyle(this.options.tabcur);
            this.tabs[index] = new Tab(index, s, this.onTabClick.bind(this));
            this.tabcount++;
        } .bind(this));
        // find panels
        this.pnlcount = 0;
        this.panels = [];
        pnls = this.element.select(this.options.pnlsel);
        pnls.each(function (s, index) {
            this.panels[index] = s;
            this.pnlcount++;
        } .bind(this));
        // init
        if (this.tabcount > 0) {
            this.onTabClick(this.options.initidx);
        }
    },
    onTabClick: function (id) {
        for (i = 0; i < this.pnlcount; i++) {
            active = (i == id) ? true : false;
            this.tabs[i].setActive(active);
            if (active) {
                this.panels[i].show();
            } else {
                this.panels[i].hide();
            }
        }
        this.panels[id].fire("custom:resize");
    }
};
// TabPanel invoke helper method
Element.addMethods({
    tabpanel: function (element) {
        new TabPanel(element);
    }
});
/*
* Simple prototype based tab class for TabPanel
*/
var Tab = Class.create();
Tab.prototype = {
    initialize: function (tabid, element, callback) {
        this.tabid = tabid;
        this.element = element;
        this.callback = callback;
        this.setup();
    },
    setup: function () {
        this.rollover = new Roll(this.element);
        // sink events
        Event.observe(this.element, 'click', this.onClick.bindAsEventListener(this));
    },
    setActive: function (onoff) {
        this.rollover.setActive(onoff);
    },
    onClick: function (e) {
        this.callback(this.tabid);
        Event.stop(e);
    }
};