/*
	13 Jan 2009 Eric Bennett <eric@jaze.com.au>
        See http://docs.bluetree7.com.au/Site/Docs/Page/Aurora.Expander for documentation.
	
*/
Aurora.Expander = new Class({
	
	Implements: Options,
	
	options: {
		startClosed: true,
		labelClass: 'aurora-expander-label',
		labelClass_close: 'aurora-expander-close',		
		contentClass: 'aurora-expander-content',
		labelClass_expanded: 'aurora-expander-label-expanded',
		labelClass_contracted: 'aurora-expander-label-contracted',
		contentClass_expanded: 'aurora-expander-content-expanded',
		contentClass_contracted: 'aurora-expander-content-contracted',
		fx: true
	},
	
	initialize: function( target, options )
	{
		this.setOptions( options );
		this.$el = $( target );

		this.$content = this.$el.getElement( '.' + this.options.contentClass );		
		this.$label = this.$el.getElement( '.' + this.options.labelClass );
		this.$close = this.$el.getElement( '.' + this.options.labelClass_close );
		
		this.defaults = {
			overflow: this.$content.getStyle( 'overflow' )
		};
		
		if ( this.options.startClosed == true ) 
		{
			this.$content.setStyles({ 'display' : 'none' });
			this.isExpanded = false;
		} else {
			// Should be expanded in CSS, so no need to call expand();
			this.isExpanded = true;	
		}
			
		// Event bindings
		this.$label.addEvent( 'click', this.toggle.bind( this ) );
		
		if ( this.$close ) {
			this.$close.addEvent( 'click', this.contract.bind( this ) );
		}

	},
	
	toggle: function()
	{
		if ( this.isExpanded )
			this.contract();
		else
			this.expand();
	},
	
	expand: function()
	{
		var defaults = this.defaults;
		
		if ( this.options.fx )
		{
			this.$content.setStyles({
					display: 'block',
					visibility: 'hidden',
					position: 'absolute'
				});
			var toHeight = this.$content.getSize().y;
			this.$content.setStyles({
					height: 1,
					position: 'relative',
					overflow: 'hidden',
					visibility: 'visible'
				})
				.get('tween')
					.start( 'height',  1, toHeight )
					.chain( function() {
						this.element.setStyles({
								height: '',
								overflow: defaults.overflow
							}); 
				 	} );
		} else {
			this.$content.setStyles({
					display: 'block',
					visibility: 'visible'
				 });
		}
		this.$label.removeClass( this.options.labelClass_contracted ).addClass( this.options.labelClass_expanded );
		this.$content.removeClass( this.options.contentClass_contracted ).addClass( this.options.contentClass_expanded );
		this.isExpanded = true;
	},
	
	contract: function()
	{
		if ( this.options.fx )
		{
			this.$content.setStyle( 'overflow', 'hidden' )
				.get('tween')
				.start( 'height',  1 ).chain( function() {
					this.element.setStyles({
							height: '',
							display: 'none'
					}); 
				 });
		}
		else
		{
			this.$content.setStyles({ 'display' : 'none' });
		}
		this.$label.removeClass( this.options.labelClass_expanded ).addClass( this.options.labelClass_contracted );
		this.$content.removeClass( this.options.contentClass_expanded ).addClass( this.options.contentClass_contracted );
		this.isExpanded = false;
	}
	
});

document.addEvent( 'domready', function() {

	$$( '.aurora-expander' ).each( function( el ) {
			el.store( 'expander', new Aurora.Expander( el ) );
	})

});