var Collapsible = new Class({
    Implements: Options,
    options: {
        'defaultState': 'visible'
    },
    
    initialize: function(header, box, options) {
        var self = this;
        this.setOptions(options);
        this.header = ($type(header) == 'element') ? header : document.getElement(header);
        this.box = ($type(box) == 'element') ? box : document.getElement(box);
        
        if ($type(this.header) != 'element')
            this._error("initialize(header, box, options)", "<em>header</em> must be an element or valid element selector");
        if ($type(this.box) != 'element')
            this._error("initialize(header, box, options)", "<em>box</em> must be an element or valid element selector");
        
        this.state = this.options['defaultState'];
        this.headerClass = this.header.get('class');
        this.boxDisplay = this.box.getStyle('display');
        
        this.header.addEvents({
            'click': function(e) {
                self.toggle.call(self, e);
            },
            'mouseover': function(e) {
                this.set('class', self.headerClass + " " + self.state + "-hover");
            },
            'mouseleave': function(e) {
                this.set('class', self.headerClass + " " + self.state);
            }
        });
        this.header.setStyle('cursor', 'pointer');
        
        this.header.set('class', this.headerClass + " " + this.state);
        
        if (this.state == 'hidden')
            this.box.setStyle('display', 'none');
    },
   
    toggle: function(e) {
        e.preventDefault();
        switch (this.state) {
        case 'visible':
            this.box.setStyle('display', 'none');
            this.state = 'hidden';
        break;
        case 'hidden':
            this.box.setStyle('display', this.boxDisplay);
            this.state = 'visible';
        break;
        }
        this.header.set('class', this.headerClass + " " + this.state);
    },
   
    _error: function(fn, msg) {
        throw("Collapsible Error in " + fn + ": " + msg);
    }
});