var Accordion = Class.create();
Accordion.prototype = {


	// ******************************************************************************
	// Constants
	// ******************************************************************************
	Version : '0.8',


	// ******************************************************************************
	// vars
	// ******************************************************************************

	accordion : {}, // accordion element
	accordionRows : [],

	activeRowIndex : null,
	


	
	

	//
	//  Initialize the accordions
	//
	initialize: function(options) {
		//Object.extend(this.options, options || {});
		
	    this.options = Object.extend({
	    	
			accordion : {}, // carousel element eg div
		    duration : 0.3,
		    firstOpen : false,
		    stayOpen : false,
			
		    // selectors
			selectors : {
		    	accordion : '#accordion',

				toggle : '.accordion_toggle',
				content : '.accordion_content',
				
				dummy : '#dummy'
			},
			classNames : {
				toggleActive : 'accordion_toggle_active',
				
				dummy : '#dummy'
			},

			dummy : '#dummy'
		}, options || {});
		
	
	    if(!this.options.accordion){
	    	document.observe('dom:loaded', this.start.bind(this));
	    } else {
	    	this.start();
	    }

	},


	start : function(){
		if(this.options.accordion){
			this.accordion = $(this.options.accordion);
		} else {
			this.accordion = $$(this.options.selectors.accordion).first();
		}

		
		this.accordionToggles = this.accordion.select(this.options.selectors.toggle);
		this.accordionContents = this.accordion.select(this.options.selectors.content);
		
		//console.info('this.accordionToggles', this.accordionToggles);
		//console.info('this.accordionContents', this.accordionContents);
		
		
		this.accordionToggles.each(function(toggler, index) {

			//console.info('each', toggler, index);
			//console.info('content:', this.accordionContents[index]);
			
			Event.observe(toggler, 'click', this.toggle.bind(this, index), false);
			
			var content = this.accordionContents[index];

			if(index == 0 && this.options.firstOpen == true) {
				toggler.addClassName(this.options.classNames.toggleActive);
				this.activeRowIndex = index;
			} else {
				content.setStyle({height : '0px'});
			}
			
		}.bind(this));
		

			
			
		
	},
	
	
	//
	//  Activate an accordion 
	//
	toggle : function(index) {
		if (this.animating) {
			return false;
		}
		
		//console.info(index);
		

		effects = [];

		if(this.options.stayOpen == false){
			if(this.activeRowIndex != null && this.activeRowIndex != index){
				// close lost openend row
				var toggler = this.accordionToggles[this.activeRowIndex];
				var content = this.accordionContents[this.activeRowIndex];
				
				toggler.removeClassName(this.options.classNames.toggleActive);
				var startHeight = content.scrollHeight;
				var endHeight = 0;
				
				effects.push(this.getEffect(this.accordionContents[this.activeRowIndex], startHeight, endHeight));
			}
		}
		
		
		var toggler = this.accordionToggles[index];
		var content = this.accordionContents[index];		
		if(toggler.hasClassName(this.options.classNames.toggleActive)){
			// close
			toggler.removeClassName(this.options.classNames.toggleActive);
			var startHeight = content.scrollHeight;
			var endHeight = 0;
			
			this.activeRowIndex = null;
		} else {
			// open
			toggler.addClassName(this.options.classNames.toggleActive);
			var startHeight = 0;
			var endHeight = content.scrollHeight;
			
			this.activeRowIndex = index;
		}

		effects.push(this.getEffect(content, startHeight, endHeight));

		
		
	    new Effect.Parallel(effects, {
			duration: this.options.duration, 
			queue: {
				position: 'end', 
				scope: 'accordionAnimation'
			},
			beforeStart: function() {
				//this.animating = true;
			}.bind(this),
			afterFinish: function() {

			}.bind(this)
		});
		

	},

	// 
	// open an active accordion
	//
	getEffect : function(content, startHeight, endHeight) {

		effect = new Effect.Tween(content, startHeight, endHeight, {
			transition: Effect.Transitions.sinoidal,
			sync: true
		}, function(p){
				content.setStyle({height : p + 'px'});
			}.bind(this)
		);
		return effect;
	}

}