window.addEvent('domready', function() {

//make the accordion
//The following options are available for the accordion:

    //* show - the value for show should be the integer of the index of the div we want to have open when the page loads. The way MooTools does this is it finds each instance of your toggler and element combination and puts them into a numbered array, starting with 0. So if you want the second toggler and element combination to be open when the page loads, you would set show equal to 1. The default value for show is 0.
    //* display - display works the same way as show, except that it adds a transition effect to the toggler/element combination. If you have different values for show and display, only the element whose index number is the value for show will be open on page load and it will not have a transition effect applied to it. The default value for display is 0.
    //* fixedHeight - the value for fixedHeight should be an integer and the integer is measured in pixels. fixedHeight defines the height of your element and it overrides the CSS height property if you have it set. Its default value is false, which means that the height for the element is determined through CSS rather than by MooTools.
    //* fixedWidth - fixedWidth works the exact same way as fixedHeight, except in controls the width property of the element.
    //* height - the value for height is boolean, which means that it is either true or false. height adds a vertical transition effect when an element is opened. The default value for height is true.
    //* opacity - opacity will add a transition effect to the element opening that fades from the background color to the color of the element. The value for opacity is boolean and the default value is true.
    //* width - width functions the exact same way as height except that it is trickier to implement. You will need to employ some complex CSS in order to create a horizontal accordion. Because of the degree of difficulty, the default value for width is set to false.
    //* alwaysHide - alwaysHide enables you to have all of the elements closed at the same time, but it does not hide automatically hide all elements on page load. Its values are boolean and the default is set to false.

// window.accordion makes it super global 

window.accordion = new Accordion($$('.toggler'),$$('.element'), {
	opacity: 0,
	display: -1, //displays item in the array as for ex.: display: 0 displays first item.
	//alwaysHide: true	
	
	onActive: function(toggler) { 
	toggler.setStyle('color', '#CA3827');
	toggler.setStyle('background', 'url(images/bulletTriRedDown.gif) no-repeat top left');
	},
	onBackground: function(toggler) { 
	toggler.setStyle('color', '#CA3827');
	toggler.setStyle('background', 'url(images/bulletTriGray.gif) no-repeat top left');
	}
	// alert ("<?php echo $dir; ?>");
	// alert ("<?php echo 'hello!'; ?>");
	
});

//make it open on hover
$$('.toggler').addEvent('mouseenter', function() { this.fireEvent('click'); });


//
// Home Pg mouseover action
//

showContent = function(el) {
	// el - s the id of the link img element & el s the graphic name too
	$$('.imgLink').setStyle('opacity','0.3');	// apply opacity to all the link img s
	$(el).setStyle('opacity','1.0');	// take out the opacity for the current element
	$(el).setStyle("background","transparent url(images/"+el+"_over.jpg) no-repeat scroll center top"); // change the current link Img
	$$('.bodyText').setStyle('display','none'); // hide all the body divs
	$(el+'Text').setStyle('display','block'); // show the current body div
	// accordion.display(showNav); // pass the number to display the secondary nav
} // showContent

//
// Home Pg mouseout action
//

hideContent = function() {
	$$('.imgLink').setStyle('opacity','1.0'); // reset the opacity for all the link img s
	$('informalScience').setStyle('background','transparent url(images/informalScience_on.jpg) no-repeat scroll center top'); // reset the BackGnd of link img
	$('math').setStyle('background','transparent url(images/math_on.jpg) no-repeat scroll center top'); // reset the BackGnd of link img
	$('leadership').setStyle('background','transparent url(images/leadership_on.jpg) no-repeat scroll center top'); // reset the BackGnd of link img
	$$('.bodyText').setStyle('display','none'); // hide all the body div s
	$('homeText').setStyle('display','block'); // show the default body div
	// accordion.display(-1); // hide all the secondary nav s
} // hideContent


hideContentSec = function() {

}// hideContentSec
/*
showContent = function(el) {
	// alert (el);
	$$('.imgLink').setStyle('opacity','0.3');
	$(el).setStyle('opacity','1');
	$$('.bodyText').setStyle('display','none'); // hide all the body divs
	$(el+'Text').setStyle('display','block'); // show the current body div
	$(el).setStyle("background","transparent url(images/"+el+"_over.jpg) no-repeat scroll center top"); // change the current link Img
}

hideContent = function() {
	$$('.imgLink').setStyle('opacity','1');
	$$('.imgLink').setStyle('opacity','1.0'); // reset the opacity for all the link img s
	$('informalScience').setStyle('background','transparent url(images/informalScience_on.jpg) no-repeat scroll center top'); // reset the BackGnd of link img
	$('math').setStyle('background','transparent url(images/math_on.jpg) no-repeat scroll center top'); // reset the BackGnd of link img
	$('leadership').setStyle('background','transparent url(images/leadership_on.jpg) no-repeat scroll center top'); // reset the BackGnd of link img
	$$('.bodyText').setStyle('display','none'); // hide all the body div s
	$('homeText').setStyle('display','block'); // show the default body div
}
*/
}); // DOM