var Toggle = new Class({

        Implements: [Options],

        initialize: function(options)
        {
            this.setOptions(options);

            this.el = $(options.element);
            this.ctrl = $(options.control);

            this.h = this.el.scrollHeight;

            this.fx = new Fx.Morph(this.el, {duration: 500, transition: Fx.Transitions.Sine.easeOut});

            this.visible = options.visible;

            if (!options.visible)
            {
                this.fx.set({
                    'height': 0,
                    'opacity': 0
                });
            }
            else
            {
                this.fx.set({
                    'height': this.h,
                    'opacity': 1
                });
            }


            this.ctrl.addEvent('click', this.click.bindWithEvent(this));
        },

        click: function()
        {
            if (this.visible)
            {
                this.hide();
            }
            else
            {
                this.show();
            }

            this.visible = !this.visible;
        },

        show: function()
        {
            this.fx.start({
                'height': [0, this.h],
                'opacity': [0, 1]
            });

            if (null != this.options.hide_text &&  this.options.hide_text)
            {
                this.ctrl.set('text', this.options.hide_text);
            }
        },

        hide: function()
        {
            this.fx.start({
                'height': [this.h, 0],
                'opacity': [1, 0]
            });

            if (null != this.options.show_text && this.options.show_text.length > 0)
            {
                this.ctrl.set('text', this.options.show_text);
            }
        }

    });