/* Accordian  */

var Accordian = Class.create({
    initialize: function(accordianCSS, headingTag, collapsedHeight) {
        this.accordianList = $$(accordianCSS)[0];
        this.accordianSections = this.accordianList.childElements();
        this.sectionHeights = new Array(this.accordianSections.length);
        this.lastExpanded = null;
        this.headingTag = headingTag;
        this.collapsedHeight = collapsedHeight;
        
        this.accordianList.addClassName("dynamic");
        
        for(var i=0; i < this.accordianSections.length; i++) {
            this.sectionHeights[i] = this.accordianSections[i].getStyle("height");
            this.accordianSections[i].setStyle({height:this.collapsedHeight});
            this.accordianSections[i].down(this.headingTag).observe("click", this.expandCollapseSection.bind(this, i));
            this.accordianSections[i].down(this.headingTag).observe("mouseover", this.ie6Hover.bind(this, i));
            this.accordianSections[i].down(this.headingTag).observe("mouseout", this.ie6Hover.bind(this, i));
        }
        
        this.expandCollapseSection(0);
    },
    
    expandCollapseSection: function(i) {
        var header = this.accordianSections[i].down(this.headingTag);
        if (this.accordianSections[i].getStyle("height") == this.collapsedHeight) {
            header.addClassName("on");
            if(this.lastExpanded && this.accordianSections[i] != this.lastExpanded) {
                this.lastExpanded.down(this.headingTag).removeClassName("on");
                new Effect.Parallel([
                    new Effect.Morph(this.accordianSections[i], {sync: true, style: {height: this.sectionHeights[i]}}),
                    new Effect.Morph(this.lastExpanded, {sync: true, style: {height: this.collapsedHeight}})
                ], {duration: 0.8});
            } else {
                new Effect.Morph(this.accordianSections[i], {style: {height: this.sectionHeights[i]},duration: 0.8});
            }
            this.lastExpanded = this.accordianSections[i];
        } else {
            header.removeClassName("on");
            new Effect.Morph(this.accordianSections[i], {style: {height: this.collapsedHeight},duration: 0.8});
        }
    },
    
    ie6Hover: function(i, event) {
        var header = this.accordianSections[i].down(this.headingTag);
        
        if (event.type == "mouseover") {
            header.addClassName("hover");
        } else if (event.type == "mouseout") {
            header.removeClassName("hover");
        }
    }
});