// ====================================================================================================
//
// Author  : mashimonator
// Create  : 2009/02/26
// Update  : 2009/02/26
// Description : アコーディオンを実装する
//
// ====================================================================================================


// Loadが終わるまで非表示にする
// ----------------------------------------
document.write('<style type="text/css">');
document.write('.accordion dd {display:none;}');
document.write('</style>');
// ----------------------------------------

var accordion = {

	//-----------------------------------------
	// 設定値
	//-----------------------------------------
	conf : {
		targetClass : 'accordion',                      // 対象とするクラス名
		targetTag : 'dl',                               // 対象とする要素名
		buttonTag : 'dt',                               // ボタン部分の要素名
		menuTag : 'dd',                                 // メニュー部分の要素名
		initOpen : 'accordionOpen',                     // 初期オープン状態に指定するクラス名
		activeClass : 'accordionActive',                // アクティブなボタンに付加されるクラス
		overClass : 'accordionOver',                    // mouseover時にボタンに付加されるクラス
		count : '01'                                    // ※変更不可
	},

	//-----------------------------------------
	// Main処理
	//-----------------------------------------
	main : function() {
		var elements = accordion.getTargetElements(accordion.conf.targetClass, accordion.conf.targetTag);
		for (var i = 0; i < elements.length; i++) {
			accordion.createMenu(elements[i]);
		}
	},

	//-----------------------------------------
	// アコーディオンメニュー作成
	//-----------------------------------------
	createMenu : function(element) {

		var buttons = element.getElementsByTagName(accordion.conf.buttonTag);
		var menus = element.getElementsByTagName(accordion.conf.menuTag);
		
		for (var i = 0; i < buttons.length; i++) {
			
			// クラス名生成
			var clsName = 'accordionMenu'+accordion.conf.count;
			
			// --------------------------------------
			// ボタン操作
			// --------------------------------------
			buttons[i].style.cursor = 'pointer';
			buttons[i].className += ' '+clsName;
			
			var span = buttons[i].getElementsByTagName('span');
			try{
				span[0].addEventListener('mouseover',accordion.over,false);
				span[0].addEventListener('mouseout',accordion.out,false);
			}catch(e){
				span[0].attachEvent('onmouseover', (function(el){return function(){accordion.over.call(el);};})(span[0])); 
				span[0].attachEvent('onmouseout', (function(el){return function(){accordion.out.call(el);};})(span[0])); 
			}
			
			
			// --------------------------------------
			// メニュー操作
			// --------------------------------------
			menus[i].className += ' '+clsName;
			// 非表示 JQuery ----------------------------
			if ( menus[i].className && !menus[i].className.match(accordion.conf.initOpen) ) {
				menus[i].style.display = 'none';
			} else {
				accordion.active(span[0]); // ボタンアクティブ
				menus[i].style.display = 'block';
			}
			
			// メソッド登録 JQuery ----------------------------
			$(accordion.conf.buttonTag+'.'+clsName).click(function(){
				var button = accordion.getTargetElements(this.className, accordion.conf.buttonTag);
				var span = button[0].getElementsByTagName('span');
				var menu = accordion.getTargetElements(this.className, accordion.conf.menuTag);
				for (var x = 0; x < menu.length; x++) {
					if ( menu[x].style.display == 'none' ) {
						$(accordion.conf.menuTag+'.'+this.className.replace(/^\s/,'')).slideDown("slow");
						accordion.active(span[0]); // ボタンアクティブ
					} else {
						$(accordion.conf.menuTag+'.'+this.className.replace(/^\s/,'')).slideUp("slow");
						accordion.nonactive(span[0]); // 非ボタンアクティブ
					}
				}
				return false;
			});
			
			var intCnt = parseInt(accordion.conf.count,10);
			if ( intCnt < 9 ) {
				intCnt = intCnt + 1;
				accordion.conf.count = '0' + intCnt;
			} else {
				intCnt = intCnt + 1;
				accordion.conf.count = '' + intCnt;
			}
			
		}

	},
	over : function() {
		if ( !this.className.match('accordionActive') ) {
			this.className += ' accordionOver';
		}
	},
	out : function() {
		if ( !this.className.match('accordionActive') ) {
			this.className = this.className.replace('accordionOver', '');
		}
	},
	active : function(element) {
		if ( element.className ) {
			//alert(element.className);
			element.className = element.className.replace('accordionOver', '');
		}
		element.className += ' accordionActive';
	},
	nonactive : function(element) {
		if ( element.className ) {
			element.className = element.className.replace('accordionActive', '');
		}
	},

	//-----------------------------------------
	// ターゲットタグを取得する
	//-----------------------------------------
	getTargetElements : function(cls, tag) {

		var elements = new Array();
		var targetElements = document.getElementsByTagName(tag);

		for (var i = 0; i < targetElements.length; i++) {
			if (targetElements[i].className.match(cls)) {
				elements[elements.length] = targetElements[i];
			}
		}

		return elements;

	},

	//-----------------------------------------
	// イベントに追加
	//-----------------------------------------
	addEvent : function(event, target, func) {
		try {
			target.addEventListener(event, func, false);
		} catch (e) {
			target.attachEvent('on' + event, func);
		}
	},

	//-----------------------------------------
	// Loadイベントに追加
	//-----------------------------------------
	addLoadEvent : function() {
		try {
			window.addEventListener('load', this.main, false);
		} catch (e) {
			window.attachEvent('onload', this.main);
		}
	}

}

accordion.addLoadEvent();