// JavaScript Document
// Author: Young Keun Park (http://www.webstorymaker.com)
// Version: 1.1 revised
// Date: April 7, 2009
// Prerequired: YUI 2.7
// Instruction: 1. Create Two Divs with acc_hd and acc_bd assigned as class
//                    2. Must assign ID attribute to those Divs
//                    3. .acc_bd { overflow: hidden; height: 0; display: none; }

function renderAccordion(){
	var headers = YAHOO.util.Dom.getElementsByClassName("acc_hd");
	var bodys = YAHOO.util.Dom.getElementsByClassName("acc_bd");
	
	for(var i = 0; i < headers.length; i++){
		var each_id = headers[i].getAttribute('id');
		add_event(each_id);
	}
	
	function add_event(each_id){
		YAHOO.util.Event.addListener(each_id, "click", function(){
			var this_id = document.getElementById(each_id);
			var next_sibling = YAHOO.util.Dom.getNextSibling(each_id);
			var next_id = next_sibling.getAttribute('id');
			
			if(this_id.getAttribute('data-status') == "closed"){
				next_sibling.style.display = "block";
				next_sibling.style.visibility = "hidden";
				next_sibling.style.height = "auto";
				var anim = new YAHOO.util.Anim(next_id, {
					height: { from: 0, to: next_sibling.offsetHeight}
				}, 0.5, YAHOO.util.Easing.easeOut);
				next_sibling.style.visibility = "visible";
				next_sibling.style.height = "0";
				this_id.setAttribute('data-status', 'opened');
				
				//get ancestor and set height to auto
			 	if(YAHOO.util.Dom.getAncestorByClassName(this_id, 'acc_bd')){
					var ancestor = YAHOO.util.Dom.getAncestorByClassName(this_id, 'acc_bd');
					ancestor.style.height = "auto";
				}
				
				anim.animate();
			} else if(this_id.getAttribute('data-status') == "opened"){
				var anim = new YAHOO.util.Anim(next_id, {
					height: { from: next_sibling.offsetHeight , to: 0 }
				}, 0.5, YAHOO.util.Easing.easeOut);
				anim.animate();
				
				//get ancestor and set height to auto
			 	if(YAHOO.util.Dom.getAncestorByClassName(this_id, 'acc_bd')){
					var ancestor = YAHOO.util.Dom.getAncestorByClassName(this_id, 'acc_bd');
					ancestor.style.height = "auto";
				}
				
				this_id.setAttribute('data-status', 'closed');
			} else {
				next_sibling.style.display = "block";
				next_sibling.style.visibility = "hidden";
				next_sibling.style.height = "auto";
				var anim = new YAHOO.util.Anim(next_id, {
					height: { from: 0, to: next_sibling.offsetHeight}
				}, 0.5, YAHOO.util.Easing.easeOut);
				next_sibling.style.visibility = "visible";
				next_sibling.style.height = "0";
				this_id.setAttribute('data-status', 'opened');
				
				//get ancestor and set height to auto
			 	if(YAHOO.util.Dom.getAncestorByClassName(this_id, 'acc_bd')){
					var ancestor = YAHOO.util.Dom.getAncestorByClassName(this_id, 'acc_bd');
					ancestor.style.height = "auto";
				}
				
				anim.animate();
			}
		});
	}
}
YAHOO.util.Event.onDOMReady(renderAccordion);