//JavaScript Document
//Place functions within this document
//Call functions within the dom ready in the html page

window.addEvent('domready', function() {
	//send the toggle and content arrays to vars
	var toggles = $$('.toggler');
	var content = $$('.elements');
	
	//set up your object var
	//create a "new" Accordian object
	//set the toggle array
	//set the content array
	//set your objects and events 
	var AccordionObject = new Accordion(toggles, content, {
		//when you load the page
		//will "show" the content (by index)
		//with NO transition, it will just be open
		//also note: if you use "fixedHeight," 
		//show will not work when the page first loads
		//"show" will override "display"
		//show: 0, 
	
	
		//when you load the page
		//this will "display" the content (by index)
		//and the content will transition open
		//if both display and show are set, 
		//show will override display
		display: 5,
		
		//defaults to true
		//this creates a vertical accordian
		height : true,
		
		//this is for horizontal accordians
		//tricky to use due to the css involved
		//maybe a tutorial for another day?
		width : false,
		
		//defaults to true
		//will give the content an opacity transition
		opacity: true,
		
		//defaults to false, can be integar - 
		//will fix height of all content containters
		//would need an overflow css rule
		//wont work on page load if you use "show"
		fixedHeight: false, 
		
		//can be false or an integer
		//similiar to fixedHeight above, 
		//but for horizontal accordians
		fixedWidth: false,
		
		//lets you toggle an open item closed
		alwaysHide: true
	
		//standard onComplete event
		//passes a variable containing the element for each content element		
		
		
		//this will fire when you toggle open an element
		//will pass the toggle control element
		//and the content element that is opening
		
		
		//this will fire when an element starts to hide
		//will pass all other elements
		//the one closing or not opening
		
	});
	
	$('add_section').addEvent('click', function(){
		//the new section is made up of a pair 
		//(the new toggle ID and the corresponding Content ID) 
		//followed by where you want to place it in the index
		AccordionObject.addSection('togglerID', 'elementsID', 0);    
	});
	
	$('display_section').addEvent('click', function(){
		//will determine which object displays first on page load
		//will override the options display setting
		AccordionObject.display(4);  
	});

});