var SlideMenu = {
	menu : {
		'トップ' : {
			'href' : '/index.html'
		}
		, 'はじめに' : {
			'href' : '/introduction.html'
		}
		, '掲示板' : {
			'child' : {
				  '掲示板' : { 'href' : '/cgi/bbs/bbs.html' }
				, '一行掲示板' : { 'href' : '/cgi/oneline_bbs/oneline_bbs.html' }
			}
		}
		, '攻略データ' : {
			'child' : {
				  '伝説のオウガバトル外伝' : { 'href' : '/dataarc/obs/index.html' }
				, 'タクティクスオウガ外伝' : { 'href' : '/dataarc/tos/index.html' }
				, 'オウガバトル64(未完成)' : { 'href' : '/dataarc/o64/index.html' }
			}
		}
		, 'コミュニティ' : {
			'child' : {
				  'チャット' : { 'href' : '/cgi/ajaxchat/chat.html' }
				, 'オウガ辞典' : { 'href' : '/cgi/dictionary' }
				, 'オウガバトルコロシアム' : { 'href' : '/cgi/ogrebattle_colosseum' }
			}
		}

		, 'リンク' : {
			'href' : '/link.html'
		}
	}
	, tid : ''
	, focusElement : ''
	, isIE : (document.all && !window.opera) ? true : false
	, initMenu : function () {
		var _Instance = this;
		var _tbody = document.createElement('tbody');
		var _tr = document.createElement('tr');
		_tbody.appendChild(_tr);
		for( var key in this.menu){
			var _Item = this.menu[key];
			
			var _td = document.createElement('td');
			_tr.appendChild(_td);

			if(  'href' in _Item  ){
				_td.name = _Item['href'];
				_td.onclick = function(){
					location.href = this.name
				}
				_td.style.cursor="pointer";
			}
			_td.appendChild( document.createTextNode(key));
			
			if(  'child' in _Item  ){
				_td.onmouseover = function(){
					_Instance._openchild(this);
					_Instance._menuover(this)
				};
			}else{
				_td.onmouseover = function(){
					_Instance._menuover(this);
					try{
						if( _Instance.focusElement ){
							_Instance.focusElement.parentNode.removeChild( _Instance.focusElement );
							_Instance.focusElement=""
						}
					}catch(e){

					}
				};
			}
			_td.onmouseout = function(){
				_Instance._menuout(this)
			};
		}
		var _table = document.getElementById('menu');
		_table.appendChild(_tbody);
	}
 
	, _menuover : function (  obj ){
		obj.style.backgroundImage="url('/image/common/menuBackDark.png')";
		obj.style.fontWeight="Bold"
		obj.style.borderColor="gray #EFEFEF #EFEFEF gray"
	}
	, _menuout : function  ( obj ){
		var _Instance = this;
		obj.style.backgroundImage="url('/image/common/menuBackLight.png')";
		obj.style.fontWeight="normal"
		obj.style.borderColor="#EFEFEF gray gray #EFEFEF"
		
		clearInterval(_Instance.tid);
		this.tid = setInterval(function(){
			if(_Instance.focusElement){
				_Instance.focusElement.parentNode.removeChild(_Instance.focusElement)
				_Instance.focusElement = "";
			}
			clearInterval(_Instance.tid);
		},200);
	}
	, _openchild : function( obj ){
		var _Instance = this;
		clearInterval(_Instance.tid);
		var child = _Instance.menu[obj.firstChild.nodeValue]['child'];

		if( _Instance.focusElement ){
			var isReturn = ( (obj.offsetLeft+'px') == _Instance.focusElement.style.left ) ? true : false;
			try {
				if (isReturn ){
					_Instance.focusElement.style.left="0px";
					_Instance.focusElement.parentNode.removeChild(_Instance.focusElement)
					_Instance.focusElement = "";
					return;
				}else{
					_Instance.focusElement.parentNode.removeChild(_Instance.focusElement)
				}
			}catch(e){
				_Instance.focusElement = "";
			}
		}
		

		_Instance.focusElement = document.createElement('div');
		
		_Instance.focusElement.style.position="absolute";
		_Instance.focusElement.style.left=obj.offsetLeft;
		_Instance.focusElement.style.top=obj.offsetHeight+4;
		_Instance.focusElement.style.zIndex=99
		_Instance.focusElement.className="submenu"
		
		try {
			document.getElementById('menu').parentNode.appendChild(_Instance.focusElement);
		}catch(e){
			return;
		}
		
		for( var key in child){
			var _div = document.createElement('div');
			var _a = document.createElement('a');
			_a.href = child[key]['href']
			_a.appendChild( document.createTextNode(key));
			_div.appendChild( _a );
			_Instance.focusElement.appendChild( _div );
		}
		
		_Instance.focusElement.onmouseover = function(){
			clearInterval(_Instance.tid);
		}
		
		_Instance.focusElement.onmouseout = function(){
			if(_Instance.tid){clearInterval(_Instance.tid);}
			_Instance.tid = setInterval(function(){
				if(_Instance.tid){clearInterval(_Instance.tid);}
				if(_Instance.focusElement){
					_Instance.focusElement.parentNode.removeChild(_Instance.focusElement)
					_Instance.focusElement = "";
				}
				
			},200);
			
		}

	}
}
