/*	Here I have created	an object with all my page functions and variables. Rather
		than just doing something like this:

function test(){
	....stuff
};

		I put my functions and variables in an object. This keeps all my code together 
		and tidy, but, more importantly, it keeps my variables and function namespaces
		out of the global namespace. So if I want a variable called "links" I don't
		have to worry about some other script overwriting what is otherwise a rather
		generic variable name.
		
var myPageNamespace = {
	test: function(){
		....stuff
	}
};

		Now I can reference my function as myPageNamespace.test().
		*/
var guide = {

	
	/*	makeAccordions finds all the accordion layouts on the page and makes an accordion
			for each one. If I wanted this function to be more useful, I might make the selector
			that is passed in a variable.	*/
	makeAccordions: function(){
		/*	find all the dl elements with the class "Accordion"	*/
		$$('dl.Accordion').each(function(el){
			/*	make a new accordion with the elements in the dl element.
			
			Element.getElements works like $$() does - it returns an array of
			elements that match that selector. Unlike $$(), getElements starts
			at the Element on which it's called so it acts like a filter.	*/
			new Accordion(el.getElements('dt.stretchtoggle'), el.getElements('dd.stretcher'));
		});
	},
		/*	finally, I collect all the functions I want to call on pageload to keep things tidy.
			I could also just list these in the domReady call I make just past it, but I like to
			keep them like this so I can call them again if I need to.
		*/

	init: function(){
		this.makeAccordions();
		
	}
};
/*	window.onDomReady will call my guide.init on page load, but the "this" will be the window, so
		I bind the guide to the function call explicitly. I wouldn't have this problem if I wrote it
		this way:

window.onDomReady(function()[
	guide.init();
});
		But that's more verbose than it needs to be.
		*/
window.onDomReady(guide.init.bind(guide));