//sorry I was wrong lasy night, I was tired, and I was writing objective-c code(mac) lately.
//globals
var myAccordion; //cast it early, so everything knows about it.


window.addEvent('load', function() {
	loadAccordion(); //loads the accordion
	myAccordion.displayAnchoredSection('h3.toggler');//if there is an anchored section in the URL,
	// displays it. In this case, your sections are children of the 'h3.toggler' tag.
});





Array.prototype.findIndex = function(value){
	var ctr = "";
	for (var i=0; i < this.length; i++) {
		// use === to check for Matches. ie., identical (===), ;
		if (this[i] == value) {
			return i;
		}
	}
	return ctr;
}

Accordion.prototype.displayAnchoredSection = function(wrapperElement){
	
	var displaySection = 0;
	var anchor = window.location.href.split('#')[1];
	if(anchor){
		var sections = $$(wrapperElement);
		console.log(sections);
		var items = new Array();
		for (var i=0; i < sections.length; i++) {					
			items[i]=sections[i].getElementsByTagName('a')[0].getAttribute("name");
		};
		displaySection = items.findIndex(anchor);
		this.display(displaySection);
	}else{
		return false;
	};
	
}

function loadAccordion() {
	var stretchers = $$('div.accordion');
	var togglers = $$('h3.toggler');

	stretchers.setStyles({'height': '0', 'overflow': 'hidden'});
	
	togglers.each(function(toggler, i){
		toggler.color = toggler.getStyle('background-color');
				toggler.store('$tmp', $H({}));
				toggler.retrieve('$tmp').first = toggler.getFirst();
				toggler.retrieve('$tmp').fx = new Fx.Tween(toggler, 'background-color', {'wait': false, 'transition': Fx.Transitions.Quart.easeOut});
			});

			//the accordion
			myAccordion = new Accordion(togglers, stretchers, {
				'opacity': false,
				'start': false,
				'transition': Fx.Transitions.Quad.easeOut,

				onActive: function(toggler){
					toggler.retrieve('$tmp').fx.start('background-color','#af1f24');
					toggler.retrieve('$tmp').first.setStyle('color', '#fff');
				},

				onBackground: function(toggler){
					 toggler.retrieve('$tmp').fx.cancel();
					 toggler.setStyle('background-color', toggler.color); 
					 toggler.getFirst().setStyle('color', '#222');
				}
			});
	
}

function showSection(section){//use this function to open an accordion section from the navigation.
	myAccordion.display(section);
}