MTJax.ToggleBox = new Class();
MTJax.ToggleBox.prototype = {
	initialize: function(Box)
	{
		var Head = Box.getFirst();
		var Content = Head.getNext();
		
		Box.Head = Head;
		Box.Content = Content;
		Box.ContentRect = Content.getCoordinates();

        Content.setStyle('overflow', 'hidden');

		if (!Box.hasClass('open'))
		{
			var fxClose = new Fx.Tween(Box.Content, {property: 'height', duration:100});
			fxClose.start(0);
		}
		
		
		Box.SlideFx = new Fx.Tween(Box.Content, {property: 'height', duration:800, transition: Fx.Transitions.Bounce.easeOut});
		Box.doOpen = function(Force)
		{
			if (this.hasClass('close') || Force)
			{
				if (this.hasClass('close'))
				{
					this.toggleClass('open');
					this.toggleClass('close');
				}
				
				this.SlideFx;
				this.SlideFx.start(this.Content.scrollHeight);
			}
		};
		
		Box.doClose = function()
		{
			if (this.hasClass('open'))
			{
				this.toggleClass('open');
				this.toggleClass('close');
				
				this.SlideFx;
				this.SlideFx.start(0);				
			}
		};
		
		Box.toggleMe = function()
		{
			if (this.hasClass('open'))
			{
				this.doClose();
			}
			else
			{
				this.doOpen();
			}
		}
		
		
		Head.setStyle('cursor', 'pointer');
		Head.addEvent('click', Box.toggleMe.bind(Box));
	}
};

window.addEvent('domready', function()
{
	document.getElements('div.togglebox').each(function(el)
	{
		new MTJax.ToggleBox(el);
	});
});