JAME.Package('JAME.Components');

JAME.Components.Accordeon= function(options) {
	var self        = this;
	this.hidden     = options.hidden;
	this.visible    = options.visible;
	this.options    = options;

	this.onExpand   = options.onExpand   || function() {return true;};
	this.onClose    = options.onClose    || function() {};
	this.postExpand = options.postExpand || function() {};
	this.postClose  = options.postClose  || function() {};
	this.closing    = options.closing;

	JAME.each(options.hidden,function(elm,i) {self.hideContents(elm,i)});


	this.openedAccordeon = (options.opened===-1) ? undefined : options.visible[options.opened] || options.visible[0];


	if(this.openedAccordeon) {
		this.openedAccordeon.opened=true;

		this.expand(this.openedAccordeon);
	}

	JAME.each(options.visible,function(elm,i) {self.attachVisibleHandlers(elm,i)});
};

JAME.Components.Accordeon.prototype = {

	closeSettings : {
		duration : 300,
		easing   : JAME.FX.Transition.Expo.In
	},
	openSettings : {
		duration : 300,
		easing   : JAME.FX.Transition.Expo.Out
	},

	attachVisibleHandlers : function(title,i) {

		title.pos    = i;
		title.opened = false;
		if(i===this.options.opened)  title.opened = true;

		title.style.cursor = 'pointer';
		var self           = this;
		JAME.Events.addListener(title,'click',function(e) {
			e.stopPropagation();
			e.preventDefault();
			//already animating so return
			if(self.isAnimating || self.isAnimating2)         return;

			//if it is already opened
			if(self.openedAccordeon===title) {
				//always one element at a time so return
				if(!self.closing) return;
				//or close it
				self.openedAccordeon=undefined;
				return self.close(title,e);
			}
			else {
				//save the one actually opened as the toggle function will overwrite it
				var opened = self.openedAccordeon;
				//we open this one
				var ret    = self.toggle(title,e);
				//we close the one actually open
				if(!ret) self.toggle(opened,e);
			}
		});
	},

	hideContents : function(link,i) {
		var maxHeight = parseInt(JAME.CSS.getStyle(link,'height'));
		var olink     = JAME.DOM.wrapNode(link,'div');
		olink.style.overflow = 'hidden';
		olink.maxH           = maxHeight;
		olink.style.display  = 'none';
	},

	close : function (elm,e) {

		var me = this;

		me.onClose.call(this,elm,e);

		if(!elm) return;

		var elementToHide = JAME.DOM.nextNode(elm);
		if(!elementToHide) return 	elm.opened=false;

		this.isAnimating=true;

		new JAME.FX.Tween(elementToHide,{height:[elementToHide.maxH,0]},this.closeSettings).queue(
		function() {
			elementToHide.style.display='none';
			me.postClose(elm);
			me.isAnimating=false;
		});
		elm.opened=false;
	},

	expand : function (elm,e) {

		var me = this;

		if(!me.onExpand.call(this,elm,e)) return;

		if(!elm) return;

		this._open(elm);
	},

	_open : function(elm) {
		var me = this;
		var elementToShow = JAME.DOM.nextNode(elm);
		if(!elementToShow) {
			elm.opened           = true;
			this.openedAccordeon = elm;
			return;
		}

		this.isAnimating2=true;

		var mfx = new JAME.FX.Tween(elementToShow,{height:[0,elementToShow.maxH],display:['none','block']},this.openSettings).queue(function() {
			me.postExpand(elm);
			me.isAnimating2=false;
		});
		elm.opened           = true;
		this.openedAccordeon = elm;

	},

	toggle : function(elm,e) {

		if(elm && elm.opened)
			return this.close(elm,e);
		if(elm)
		return this.expand(elm,e);
	}
};