window.addEvent('domready', function() {
	//send the toggle and content arrays to vars
	var toggles = $$('.togglers');
	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: 2,
		
		//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 an element starts to hide
		//will pass all other elements
		//the one closing or not opening
		
	});

});







/* === toggle WIDTH ======= */

function change_width(width, id)
{
	document.getElementById(id).style.width = width+"px";
}


function change_width_open(width, id, whole)
{
	document.getElementById(id).style.width = width+"px";
	
	var innerwidth = whole - 15;
	if (width<=275)
		document.getElementById('col2_text').style.width = width+"px";
	else
		document.getElementById('col2_text').style.display = "block";
}


function toggle(id, minwidth, maxwidth) 
{
	var speed = Math.round(150 / 100);
	var timer = 0;
	
	var whole = maxwidth+50;
	//minwidth = 21
	
	if (document.getElementById(id).offsetWidth > minwidth)
	{				
		//make small - toggle in: ------------- 
		
		document.getElementById('showhideimg').src = "img/show.gif";
		document.getElementById('col2_text').style.display = "none";
		
		for(i = whole; i >= minwidth; i--) 
		{
			setTimeout("change_width(" + i + ",'"+id+"')",(timer * speed));
			timer++;
		}
	}
	else
	{
		//toggle out: ---------------
		
		document.getElementById('showhideimg').src = "img/hide.gif";
						
		for(i = minwidth; i <= whole; i++) 
		{
			setTimeout("change_width_open(" + i + ",'"+id+"', "+maxwidth+")",(timer * speed));
			timer++;
		}
		
	}

}







/* ===== */

function openclose_block(which, opentitleclass, deftitleclass, num)
{
	var i;
	
	for (i=1; i<=num; i++)
	{
		if (i!=which)
		{			
			
			//toggle_height('block_'+i, i, 0);
			
			document.getElementById('block_title_'+i).className = deftitleclass;
			
			document.getElementById('block_'+i).style.display = "none";
		}
	}

	
	if ((document.getElementById('block_'+which).style.display == "block") || (document.getElementById('block_'+which).style.display == "") )
	{
				
		document.getElementById('block_title_'+which).className = deftitleclass;
		
		//toggle_height('block_'+which, which, 0);
		
		document.getElementById('block_'+which).style.display = "none";
	}
	else
	{
				
		document.getElementById('block_title_'+which).className = opentitleclass;
				 
		//toggle_height('block_'+which, which, 1);
		
		document.getElementById('block_'+which).style.display = "block";
	}
}

/* === toggle HEIGHT ======= */

function change_height(height, id)
{
	document.getElementById(id).style.height = height+"px";
}


function toggle_height(id, which, action) 
{
	var speed = Math.round(110 / 100);
	var timer = 0;
	var i;
		
	var whole = document.getElementById(id).offsetHeight;
	
	if (action == 0)	//close
	{
		block_height[which] = whole;
		
		block_content[which] = document.getElementById('block_'+which).innerHTML;
		document.getElementById('block_'+which).innerHTML = "";
		
		for(i = whole; i >= 0; i--) 
		{
			setTimeout("change_height(" + i + ",'"+id+"')",(timer * speed));
			timer++;
		}
	}
	else
	{	
		if (document.getElementById(id).offsetHeight > 0)
		{				
			//make small - toggle in: ------------- 
			
			block_height[which] = whole;
			
			block_content[which] = document.getElementById('block_'+which).innerHTML;
			document.getElementById('block_'+which).innerHTML = "";
			
			for(i = whole; i >= 0; i--) 
			{
				setTimeout("change_height(" + i + ",'"+id+"')",(timer * speed));
				timer++;
			}
		}
		else
		{
			//toggle out: ---------------
			
			document.getElementById('block_'+which).innerHTML = block_content[which];
							
			for(i = 0; i <= block_height[which]; i++) 
			{
				setTimeout("change_height(" + i + ",'"+id+"')",(timer * speed));
				timer++;
			}
			
		}
	}

}