/**************************************************************

	Script		: mooCollapsibles
	Version		: 1.1.1
	Usage		: window.addEvent('domready', function(){
					  if($$('.collapsible').length > 0)//only triggered if 'collapsible' class found on page
					  {
						 var initCollapsibles = new mooCollapsible({
						  	 cllpsContainers: $$('.collapsible'),//passes content/contents to be collapsed
						  	 cllpsHeaders: $$('.collapsible .header').reverse(),//the headers inside containers
						  	 cllpsBodies: $$('.collapsible .body').reverse(),//the bodies inside containers
						  	 buildToggler: true,//'expand all | collapse all' buttons will be generated if true
						 	 expandDefault: false,//have the collapsibles open or closed by deafult
						  	 sldDuratation: 350,//duration of slide effect
						 	 sldTransition: Fx.Transitions.Cubic.easeOut,//transition type
						  	 accordionEffect: false//will simulate MooTools Accordion
					  	}).start();
					 };
				});

**************************************************************/

//start mooCollapsibles class
var mooCollapsible = new Class({
	
	//implements
	Implements:[Options],

	//options
	options:{
		buildToggler: false,
		expandDefault: true,
		sldDuratation: 500,
		sldTransition: Fx.Transitions.Cubic.easeOut,//transition type
		accordionEffect: false
	},
	
	//initialization
	initialize:function(options)
	{
		//set options
		this.setOptions(options);
	},
	
	//detect whether or not cookies are enabled
	start:function()
	{
		//set up cookies - 0 = closed 1 = open
		var myCookieSet = Cookie.write('mooCollapsibles','1',{duration:365});
		var myCookieRead = Cookie.read('mooCollapsibles');
		var myCookieSaved = Cookie.read('mooCollapsiblesSaved');
			
		//if cookie above was not successfully set then display error div but only if first visit
		/*if(myCookieRead == 1 && myCookieSaved == null)
		{
			//build div
			var cookieAlert = new Element('div').inject(this.options.cllpsContainers[0],'before');
			cookieAlert.addClass('mooCollapsiblesAlertGreen');
			cookieAlert.set('html','<p>Your settings will be saved from now on!</p>');
				
			//set cookie so this loop isnt triggered for another year
			Cookie.write('mooCollapsiblesSaved','1',{duration:365});
		}
		else if(myCookieRead == null)
		{
			//build enable cookie alert div
			var cookieAlert = new Element('div').inject(this.options.cllpsContainers[0],'before');
			cookieAlert.addClass('mooCollapsiblesAlertRed');
			cookieAlert.set('html','<p>You need to enable cookies for settings to be saved!</p>');
		};*/
		
		//call next function
		this.buildCollapsibles();
	},
	
	//start building the collapsibles
	buildCollapsibles:function()
	{
		//array to store slides in
		var cllpsArr = [];
		
		//for each collapsible header
		this.options.cllpsHeaders.each(function(el,i)
		{			 
			//for each element create a slide effect
			var cllpsSlide = new Fx.Slide(this.options.cllpsBodies[i],{
				duration: this.options.sldDuratation,
				transition: this.options.sldTransition
			});
			
			//and store it in the array
			cllpsArr[i] = cllpsSlide;
			
			//get expand cookie for each collapsible element
			var myCookie = Cookie.read('expand'+i);
			
			//loop through each box collapsing it or expanding it
			if(myCookie == null)//users first time visiting page
			{
				//check whether accordion option is true
				if(this.options.accordionEffect == true)
				{
					//first time using and accordion option true so leave last collapsible open
					if(i != this.options.cllpsHeaders.length-1)
					{//alert("0");
						cllpsArr[i].hide();
						Cookie.write('expand'+i,'collapsed',{duration:365});
						this.options.cllpsHeaders[i].removeClass('RotateButton');
					}
					else
					{//alert("test");//alert("hello: "+Cookie.read('expand'+i));
						if(Cookie.read('expand'+i) != null)
						{//alert("1");
							if(Cookie.read('expand'+i) == 'expanded')
							{//alert("2");
								cllpsArr[i].show();
								this.options.cllpsHeaders[i].addClass('RotateButton');
							}
							else
							{//alert("3");
								cllpsArr[x].hide();
								this.options.cllpsHeaders[i].addRemove('RotateButton');
							};
						}
						else
						{//alert("4"+Cookie.read('expand'+i));
							cllpsArr[i].show();
							Cookie.write('expand'+i,'expanded',{duration:365});
							this.options.cllpsHeaders[i].addClass('RotateButton');
						};
					};
					//};
				}
				else
				{
					//if we set in the options to expand by default
					if(this.options.expandDefault == true)
					{
						//boxes are to be open by default
						cllpsSlide.show();
						Cookie.write('expand'+i,'expanded',{duration: 365});
						el.addClass.delay(this.options.sldDuratation,el,'RotateButton');
					}
					else
					{
						//boxes are to be closed by default
						cllpsSlide.hide();
						Cookie.write('expand'+i,'collapsed',{duration: 365});
						el.removeClass.delay(this.options.sldDuratation,el,'RotateButton');
					};
				};
			}
			else
			{
				//there are cookies to be read
				if(myCookie == 'expanded')
				{
					//boxes are to be left open so rotate the button to point up the way
					cllpsSlide.show();
					el.addClass.delay(this.options.sldDuratation,el,'RotateButton');
				}
				else
				{
					//boxes are to be closed and make sure button is down the way
					cllpsSlide.hide();
					el.removeClass.delay(this.options.sldDuratation,el,'RotateButton');
				};
			};
		
		
			//build the clickable link button
			var linkButton = new Element('a',{
				'href':'Javascript:;',
				'title':'Collapse/Expand content',
				'class':'OpenCloseButton',
				'html':'<span class="cllpsHidden">Open/Close</span>',
				'styles':{
					'opacity': 0
				},
				'events':{
					'click':function()
					{
						//retrieve 'expand' cookie value for each collapsible element
						var myCookie = Cookie.read('expand'+i);
						
						//check whether accordion option is true
						if(this.options.accordionEffect == true)
						{//alert("10");
							//toggle the slider
							cllpsSlide.toggle();
							
							//loop through each one leaving first one open
							for(x=0; x<cllpsArr.length; x++)
							{
								//check whether its the one clicked on
								if(x != i)
								{//alert("6");
									//collpase other boxes
									cllpsArr[x].slideOut();
									Cookie.write('expand'+x,'collapsed',{duration:365});
									this.options.cllpsHeaders[x].removeClass.delay(this.options.sldDuratation,this.options.cllpsHeaders[x],'RotateButton');
								}
								else
								{//alert("7");
									//expand this box
									if(Cookie.read('expand'+i) == 'expanded')
									{//alert("14");
										Cookie.write('expand'+x,'collapsed',{duration:365});
									}
									else
									{//alert("15");
										Cookie.write('expand'+x,'expanded',{duration:365});
									};
									
									//unlike in a regular accordion, you can toggle open items, so check which class it has before switching
									if(this.options.cllpsHeaders[x].hasClass('RotateButton') == true)
									{//alert("8");
										this.options.cllpsHeaders[x].removeClass.delay(this.options.sldDuratation,this.options.cllpsHeaders[x],'RotateButton');
									}
									else
									{//alert("9");
										this.options.cllpsHeaders[x].addClass.delay(this.options.sldDuratation,this.options.cllpsHeaders[x],'RotateButton');
									};
								};
							};
						}
						else
						{//alert("11");
							//toggle the slider
							cllpsSlide.toggle();
						
							//checks whether box is open or closed when user clicks and then does the opposite
							if(myCookie == 'expanded')
							{//alert("12");
								//box is open so lets close it
								Cookie.write('expand'+i,'collapsed',{duration:365});
								el.removeClass.delay(this.options.sldDuratation,el,'RotateButton');
							}
							else
							{//alert("13");
								//box is closed so lets open it
								Cookie.write('expand'+i,'expanded',{duration:365});
								el.addClass.delay(this.options.sldDuratation,el,'RotateButton');
							};
						};
					}.bind(this)
				}
			},this);
			
			//inject created link buttons into the header
			linkButton.inject(el,'inside');
			
			//fade the link buttons in gently
			linkButton.set('tween',{duration:2000,transition:Fx.Transitions.Expo.easeIn}).tween('opacity',1);
		},this);
		
		
		//add overflow style to contain floated content (better than injecting unecesarry clearing div
		this.options.cllpsBodies.each(function(el,i)
		{
			el.setStyle('overflow','hidden');
		});
		
		
		//if option to build togglers is true and accordion effect is false
		if(this.options.buildToggler && this.options.accordionEffect != true)
		{
			//build toggler div
			var myToggler = new Element('div').inject(this.options.cllpsContainers[0],'before');
			myToggler.addClass('mooCollapsiblesToggler');
			myToggler.set('html','<a href="javascript:;" title="Collapse all" id="collapse-all">collapse all</a> | <a href="javascript:;" title="Expand all" id="expand-all">expand all</a>');
			
			//collapse all
			$('collapse-all').onclick = function()
			{
				this.options.cllpsHeaders.each(function(el,i)
				{
					//slide all collapsibles in
					cllpsArr[i].slideOut();
					Cookie.write('expand'+i,'collapsed',{duration:365});
					el.removeClass.delay(this.options.sldDuratation,el,'RotateButton');
				},this);
			}.bind(this);
			
			//expand all
			$('expand-all').onclick = function()
			{
				this.options.cllpsHeaders.each(function(el,i)
				{
					//slide all collapsibles out
					cllpsArr[i].slideIn();
					Cookie.write('expand'+i,'expanded',{duration:365});
					el.addClass.delay(this.options.sldDuratation,el,'RotateButton');
				},this);
			}.bind(this);
		};
	}
});