/**
 * Please keep this if you choose to use this code.
 * Creator: Ryan Kahn
 * Source Site: http://ryan-kahn.com
 */

/**
 * Initializes drop items on window load.
 */
Event.observe(window, 'load', function() {
	initializeDropItems();
});

/**
 * Contracts every drop item on pageload. They load expanded so people without javascript suffer no losses.
 */
function initializeDropItems(){
	//Foreach dropItem we want to add the observer for clicks and hide the elements
	$$(".dropItem").each(function (dropItem){
		dropItem.down("div.title").observe("click",toggleItem);
		//Scriptaculous has issues with padding on elements with blind down and up. they suggest using a wrapper.
		//I dont like having the user add this wrapper so I will use js to add the wrapper
		wrappedItem = dropItem.down("div.content").wrap('div',{'class':'content'});
		//Add the padded classname
		wrappedItem.down("div.content").addClassName("paddedContent");
		//Now remove the content class on the wrapped item
		wrappedItem.down("div.content").removeClassName("content");
		//Hide the wrapped item
		wrappedItem.hide();
	});
}

/**
 * Toggles specified drop menu item
 * @param dropItemId
 */
function toggleItem(){
	//Locate the dropItem, since the thing being clicked on is the title we know its one up!
	dropItemId = this.up().identify();
	//Scriptaculous queues are amazing, they allow me to only have one animation happening at a time! So while its expanding they cant contract and break things
	var queue = Effect.Queues.get(dropItemId);
	//If there is nothing in the queue we can do our function
	if(queue.size() == 0){
		var animationDuration = .4;
		var content = $(dropItemId).down("div.content");
		var title = $(dropItemId).down("div.title");
		if(title.hasClassName("expanded")){//If its expanded
			//Hide the content
			Effect.BlindUp(content.identify(),{duration:animationDuration, queue: { limit: 1, scope: dropItemId}});
			//It's no longer expanded so go back to the default +
			title.removeClassName("expanded");
		}else{//If its contracted
			//Show the content
			Effect.BlindDown(content.identify(),{duration:animationDuration, queue: { limit: 1, scope: dropItemId}});
			//Its expanded so we display the -
			title.addClassName("expanded");
		}
	}
}