// JScript File
var multiView = new Class({});

multiView.implement({
    views:null,
    fxContainer:null,
    container:null,
    
    initialize: function(container)
    {
        this.container=$(container);
        this.fxContainer = fxCache.getFor(this.container);
        this.views=new Abstract();
    },
    
    addView: function(view,active)
    {
        view = $(view);
        if(this.views[view.id]==null)
        {
            this.views[view.id]={"view":view,"active":false || active};
            if (active)
            {
                this.setActive(view.id);
                view.setStyle("display","block");
            }
            else
            {
                view.setStyle("display","none");
            }
        }
    },
	
	setViews: function(selector)
    {
        var list = $$(selector);
        list.each(function(element, idx) {
            this.addView(element, idx==0);
        },this);
    },
    
    setActive: function(viewID)
    {
        this.views[this.getActive().id].active = false;
        this.views[viewID].active = true;
        //if ($defined(console))console.log("SET:" + viewID);
    },
    
    getActive: function()
    {
        var c;
        for (view in this.views)
        {
            var obj = this.views[view];
            if (obj.active)
            {
                //if ($defined(console))console.log("GET:" + obj.view.id);
                c = obj.view;
            }
        }
        return c;
    },   
        
    setTriggers: function(selector)
    {
        var list = $$(selector);
        list.each(function(element) {
            element.addEvent('click', this.onClick.bindAsEventListener(this,[element]));
        },this);
    },
    
    start: function()
    {
        var a = this.getActive();        
        if (a)
        {       
            var fxA = fxCache.getFor(a);
            this.fxContainer.start({height:a.clientHeight}).chain(function(){
                        a.setStyle("display","block");fxA.start({'opacity':1})});
        }
    },
    
    onClick: function(event,element)
    {
        var v = element.rel;//.getAttribute("rel");
        var tab = this.views[v] ? this.views[v].view : $(v);
        var fxTab = fxCache.getFor(tab);
        var fxATab = fxCache.getFor(this.getActive());
        fxATab.start({
            'opacity':0
        }).chain(function(){
            this.getActive().setStyle("display","none");
            tab.setStyle("display","block");
            this.fxContainer.start({height:tab.clientHeight}).chain(function(){
                fxTab.start({'opacity':1}).chain(function(){
                    this.setActive(tab.id);
                    this.fireEvent('onViewChanged', tab);
                }.bind(this));
            }.bind(this));
        }.bind(this));
    }
});

multiView.implement(new Events);