/**
 * SimpleTabs - Unobtrusive Tabs with Ajax
 *
 * @example
 *
 *  var tabs = new SimpleTabs($('tab-element'), {
 *      selector: 'h2.tab-tab'
 *  });
 *
 * @version     1.0
 *
 * @license     MIT License
 * @author      Harald Kirschner <mail [at] digitarald.de>
 * @copyright   2007 Author
 */
var SimpleTabs = new Class({

    Implements: [Events, Options],

    /**
     * Options
     */
    options: {
        show: 0,
        selector: '.tab-tab',
        classWrapper: 'tab-wrapper',
        classMenu: 'tab-menu',
        classContainer: 'tab-container',
        onSelect: function(toggle, container, index) {
            toggle.addClass('tab-selected');
            container.setStyle('display', '');
        },
        onDeselect: function(toggle, container, index) {
            toggle.removeClass('tab-selected');
            container.setStyle('display', 'none');
        },
        onRequest: function(toggle, container, index) {
            container.addClass('tab-ajax-loading');
        },
        onComplete: function(toggle, container, index) {
            container.removeClass('tab-ajax-loading');
        },
        onFailure: function(toggle, container, index) {
            container.removeClass('tab-ajax-loading');
        },
        onAdded: Class.empty,
        getContent: null,
        ajaxOptions: {},
        cache: true
    },

    /**
     * Constructor
     *
     * @param {Element} The parent Element that holds the tab elements
     * @param {Object} Options
     */
    initialize: function(element, options) {
        this.element = $(element);
        this.setOptions(options);
        this.selected = null;
        this.build();
    },

    build: function() {
        this.tabs = [];
        this.menu = new Element('ul', {'class': this.options.classMenu});
        this.wrapper = new Element('div', {'class': this.options.classWrapper});

        this.element.getElements(this.options.selector).each(function(el) {
            var content = el.get('href') || (this.options.getContent ? this.options.getContent.call(this, el) : el.getNext());
            this.addTab(el.innerHTML, el.title || el.innerHTML, content);
        }, this);
        this.element.empty().adopt(this.menu, this.wrapper);

        if (this.tabs.length) this.select(this.options.show);
    },

    /**
     * Add a new tab at the end of the tab menu
     *
     * @param {String} inner Text
     * @param {String} Title
     * @param {Element|String} Content Element or URL for Ajax
     */
    addTab: function(text, title, content) {
        var grab = $(content);
        var container = (grab || new Element('div'))
            .setStyle('display', 'none')
            .addClass(this.options.classContainer)
            .inject(this.wrapper);
        var pos = this.tabs.length;
        var evt = (this.options.hover) ? 'mouseenter' : 'click';
        var tab = {
            container: container,
            toggle: new Element('li').grab(new Element('a', {
                href: '#',
                title: title
            }).grab(
                new Element('span', {html: text})
            )).addEvent(evt, this.onClick.bindWithEvent(this, [pos])).inject(this.menu)
        };
        if (!grab && $type(content) == 'string') tab.url = content;
        this.tabs.push(tab);
        return this.fireEvent('onAdded', [tab.toggle, tab.container, pos]);
    },

    onClick: function(evt, index) {
        this.select(index);
        return false;
    },

    /**
     * Select the tab via tab-index
     *
     * @param {Number} Tab-index
     */
    select: function(index) {
        if (this.selected === index || !this.tabs[index]) return this;
        if (this.ajax) this.ajax.cancel().removeEvents();
        var tab = this.tabs[index];
        var params = [tab.toggle, tab.container, index];
        if (this.selected !== null) {
            var current = this.tabs[this.selected];
            if (this.ajax && this.ajax.running) this.ajax.cancel();
            params.extend([current.toggle, current.container, this.selected]);
            this.fireEvent('onDeselect', [current.toggle, current.container, this.selected]);
        }
        this.fireEvent('onSelect', params);
        if (tab.url && (!tab.loaded || !this.options.cache)) {
            this.ajax = this.ajax || new Request.HTML();
            this.ajax.setOptions({
                url: tab.url,
                method: 'get',
                update: tab.container,
                onFailure: this.fireEvent.pass(['onFailure', params], this),
                onComplete: function(resp) {
                    tab.loaded = true;
                    this.fireEvent('onComplete', params);
                }.bind(this)
            }).setOptions(this.options.ajaxOptions);
            this.ajax.send();
            this.fireEvent('onRequest', params);
        }
        this.selected = index;
        return this;
    }

});
/**
 * Erweiterung für die SimpleTabs.
 *  
 * @author stefan
 * @version 0.1.0
 * 
 * Die geöffneten Tabs werden in einem cookie gepeichert.
 * 
 * Aufruf dann wie gehabt
 * var tabs = new SimpleMemoryTabs('demo-block', {
 *     selector: 'h4',
 *     show: 1
 * });
 * 
 */
var SimpleMemoryTabs = new Class({
    Extends: SimpleTabs,
    options: {
        onSelect: function(toggle, container, index) {
            toggle.addClass('tab-selected');
            container.setStyle('display', '');
            this.storeSelectedTab(index);
        }
    },
    
    initialize: function(element,options) {
        if ($type($(element)) === false) {
            return false;
        }
        this.cookie_name = 'selectedTab-' + $(element).get('id');
        this.setOptions(options);
        this.options.show = this.getStoredSelectedTab();
        this.parent(element,this.options);
    },
    
    getStoredSelectedTab: function() {
        if ($chk(Cookie) === false) {
            return this.options.show;
        }
        var selected_tab = Cookie.read(this.cookie_name);
        if ($type(selected_tab) !== false) {
            return selected_tab.toInt();
        }
        return this.options.show;
    },
    
    storeSelectedTab: function(index) {
        if ($chk(Cookie) === false) {
            return false;
        }
        Cookie.write(this.cookie_name, index, {
            duration: 30
        });
    }
});