Event.observe(
	window,
	'load',
	function(){
		new initRolloversNew();
		new colorRows();
//		new FlashReload(); //body閉じタグ後に実行させないとバグ？
		new ImageChanger();
		new BackgroundChanger();
		new DisplayChanger();
		new Menu();
		new heightLine();
	},
	false
);


/*** rolloverNew ***/
/*
■例
<div class="imgover">
	<a><img src="foo.gif"></a>　←反応する
	<a><img src="bar.gif"></a>　←反応する
	<a><img src="foobar.gif" class="imgactive"></a>　←反応しない
	<img src="foo2.gif">　←反応しない
</div>

■解説
<div class="imgover">〜</div>内にあるリンク画像(<a>タグに囲まれている<img>)の
マウスオーバー時に画像が「画像名_o.拡張子」に切り替わる。（foo.gif→foo_o.gif）
もちろんマウスアウトで元の画像に戻る。
リンクでは無い画像や、class="imgactive"を付与された画像ではマウスオーバー時の切替しない。

■NEW!
複数クラス指定にも対応
*/
function initRolloversNew() {
	if (!document.getElementById) return
	
	var aPreLoad = new Array();
	var sTempSrc;
	elm = document.getElementsByClassName("imgover");

	for (var j = 0; j < elm.length; j++) {
		a=elm[j].getElementsByTagName("a");
		for(k=0;k<a.length;k++){
			if((aImages=a[k].getElementsByTagName("img"))!=null){
				for(i=0;i<aImages.length;i++){
					var activeFlag = false;
					var aImagesClass = aImages[i].className.split(/\s+/);
					for(var l = 0; l < aImagesClass.length; l++) {
						if(aImagesClass[l] == 'imgactive'){
							activeFlag = true;
						}
					}
					if(!activeFlag){
						var src = aImages[i].getAttribute('src');
						var ftype = src.substring(src.lastIndexOf('.'), src.length);
						var hsrc = src.replace(ftype, '_o'+ftype);
						aImages[i].setAttribute('hsrc', hsrc);
						
						aPreLoad[i] = new Image();
						aPreLoad[i].src = hsrc;
						
						aImages[i].onmouseover = function() {
							sTempSrc = this.getAttribute('src');
							this.setAttribute('src', this.getAttribute('hsrc'));
						}	
						
						aImages[i].onmouseout = function() {
							if (!sTempSrc) sTempSrc = this.getAttribute('src').replace('_o'+ftype, ftype);
							this.setAttribute('src', sTempSrc);
						}
					}
				}
			}
		}
	}
}




/*** tableColor ***/
/*
■例
<table class="coloredRow">
	<tr>　←ここがclass="rowTint"に。
		<th></th><td></td>
	</tr>
	<tr>
		<th></th><td></td>
	</tr>
	<tr>　←ここがclass="rowTint"に。
		<th></th><td></td>
	</tr>
</table>

■解説
<table class="coloredRow">〜</table>内のtrタグに交互に
class="rowTint"を付与する。
cssで.rowTintに色をつければ交互色に。

■TODO
ul,ol,dlあたりでもできるように。
*/
function colorRows() {
	table=document.getElementsByClassName("coloredRow");
	for(i=0;i<table.length;i++){
		tr=table[i].getElementsByTagName('tr');
		for (j=0;j<tr.length;j++) {
			if(j%2){
				tr[j].className='rowTint';
			}
		}
	}
}



/*** Flash ***/
/*
■例
<script>flash("foo.swf",500,200)</script>

■解説
フラッシュが表示される。
IEセキュリティ対策。
<noscript>も併記しておくと親切。
*/
function flash(swf, width, height){
	document.open();
	document.write('<object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" codebase="http://fpdownload.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=8,0,0,0" width="');
	document.write(width);
	document.write('" height="');
	document.write(height);
	document.writeln('" align="middle">');
	document.writeln('<param name="allowScriptAccess" value="sameDomain" />');
	document.write('<param name="movie" value="');
	document.write(swf);
	document.writeln('" />');
	document.writeln('<param name="quality" value="high" />');
	document.writeln('<param name="wmode" value="transparent" />');
	document.write('<embed src="');
	document.write(swf);
	document.write('" quality="high" width="');
	document.write(width);
	document.write('" height="');
	document.write(height);
	document.writeln('" align="middle" allowScriptAccess="sameDomain" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" />');
	document.writeln('</object>');
}


/*** IE ActiveX対策 ***/
/*
■例
<div class="flaFix">
	<object>〜〜</object>
</div>
■解説
フラッシュが表示される。
IEセキュリティ対策。
*/
function FlashReload(){
	fla = document.getElementsByClassName('flaFix');
	for(i=0;i<fla.length;i++){
		fla[i].innerHTML=fla[i].innerHTML;
	}
}



/*** 画像切替 ***/
/*
■例
ターゲットが別オブジェクトの場合
<a class="chimg" chimg="hogehoge">text</a>
<img src="foo.gif" id="hogehoge">

ターゲットがオブジェクト自身の場合
<img src="hogehoge.gif" class="chimg" />
<input type="image" src="hogehoge.gif" class="chimg" />

<a href="" chimg="hogehoge"><img src="hogehoge.gif" id="hogehoge" /></a>

■解説
class="chimg"のリンクにマウスオーバーでchimg=""に指定したIDの画像が
chimg=""が指定されてなかったら自分自身の画像が
「画像名_o.拡張子」に切り替わる。（foo.gif→foo_o.gif）
もちろんマウスアウトで元の画像に戻るよ。
*/
var ImageChanger=Class.create();

ImageChanger.prototype={
	initialize: function(){
		this.changer=document.getElementsByClassName("chimg");
		
		for(i=0;i<this.changer.length;i++){
			Event.observe(this.changer[i],'mouseover',this.changeImage.bindAsEventListener(this.changer[i]),false);
			Event.observe(this.changer[i],'mouseout',this.returnImage.bindAsEventListener(this.changer[i]),false);
		}
	},
	
	changeImage: function(e){
		var src=Event.element(e);
		var chimg=src.getAttribute("chimg");
		if(chimg==null){
			var target=src;
		}else{
			var target=$(chimg);
		}
		
		if(target.getAttribute("chimgStatus") != "over"){
			var img=target.getAttribute("src");
			var ftype = img.substring(img.lastIndexOf('.'), img.length);
			var postfix=src.getAttribute("postfix");
			if(postfix==null){
				postfix="o";
			}
			var hsrc = img.replace(ftype, '_'+postfix+ftype);
			
			target.setAttribute("src", hsrc);
			target.setAttribute("chimgStatus","over");
		}
	},
	
	returnImage: function(e){
		var src=Event.element(e);
		
		var chimg=src.getAttribute("chimg");
		if(chimg==null){
			var target=src;
		}else{
			var target=$(chimg);
		}
		
		if(target.getAttribute("chimgStatus") == "over"){
			var img=target.getAttribute("src");
			var ftype = img.substring(img.lastIndexOf('.'), img.length);
			
			var postfix=src.getAttribute("postfix");
			if(postfix==null){
				postfix="o";
			}
			
			var hsrc = img.replace('_'+postfix+ftype, ftype);
			
			target.setAttribute("src", hsrc);
			target.setAttribute("chimgStatus","non");
		}
	}
};



/*** 背景画像切替 ***/
/*
	class="chbg"
*/
var BackgroundChanger=Class.create();

BackgroundChanger.prototype={
	initialize: function(){
		this.changer=document.getElementsByClassName("chbg");
		
		for(i=0;i<this.changer.length;i++){
			this.setSrc(this.changer[i]);
			Event.observe(this.changer[i],'mouseover',this.changeBackgroundImage.bindAsEventListener(this.changer[i]),false);
			Event.observe(this.changer[i],'mouseout',this.returnBackgroundImage.bindAsEventListener(this.changer[i]),false);
		}
	},
	
	setSrc: function(src){
		var style = src.currentStyle || document.defaultView.getComputedStyle(src,'');
		var img=style.backgroundImage;
		var ftype = img.substring(img.lastIndexOf('.'), img.length);
		var postfix=src.getAttribute("postfix");
		if(postfix==null){
			postfix="o";
		}
		var hsrc = img.replace(ftype, '_'+postfix+ftype);
		src.setAttribute("bg",img);
		src.setAttribute("bg_o",hsrc);
	},
	
	changeBackgroundImage: function(e){
		this.style.backgroundImage=this.getAttribute("bg_o");
	},
	
	returnBackgroundImage: function(e){
		this.style.backgroundImage=this.getAttribute("bg");
	}
};

/*** 表示/非表示の切替 ***/
/*
■例
<a class="chdisp" chdisp="hogehoge1">text</a>
<a class="chdisp" chdisp="hogehoge2">text</a>
<div id="hogehoge1" class="cheddisp">sample text 1</div>
<div id="hogehoge2" class="cheddisp">sample text 2</div>
<div id="chdispdefault" class="cheddisp">default sample text</div>


■解説
class="chdisp"のリンクにマウスオーバーでchdisp=""に指定したIDがdisplay:blockで表示される。
class="cheddisp"が指定された他のタグはすべてdisplay:noneで見えなくなる。
マウスアウトでそれぞれのタグのchdispdefaultで指定したIDのタグが表示されて他のタグは非表示になる。

TODO:
	複数グループ対応
*/
var DisplayChanger=Class.create();

DisplayChanger.prototype={
	initialize: function(){
		this.changer=document.getElementsByClassName("chdisp");
		
		for(i=0;i<this.changer.length;i++){
			Event.observe(this.changer[i],'mouseover',this.changeDisp.bindAsEventListener(this),false);
			Event.observe(this.changer[i],'mouseout',this.returnDisp.bindAsEventListener(this),false);
		}
		
		this.changee=document.getElementsByClassName("cheddisp");
		this.dispdefault=$("chdispdefault");
		for(i=0;i<this.changee.length;i++){
			this.changee[i].style.display="none";
		}
		if(this.dispdefault!=null){
			this.dispdefault.style.display="block";
		}
	},
	
	changeDisp: function(e){
		var src=Event.element(e);
		while(!src.hasAttribute("chdisp")){
			src=src.parentNode;
		}
		
		var target=src.getAttribute("chdisp").split(" ");
		
		for(i=0;i<this.changee.length;i++){
			this.changee[i].style.display="none";
		}
		for(i=0;i<target.length;i++){
			$(target[i]).style.display="block";
		}
		return true;
	},
	
	returnDisp: function(e){
		for(i=0;i<this.changee.length;i++){
			this.changee[i].style.display="none";
		}
		if(this.dispdefault!=null){
			this.dispdefault.style.display="block";
		}
		return true;
	}
};


/*** ドロップダウンメニュー ***/
/*
■例
=== HTML ===
<ul id="ddMenu">
	<li></li>
	<li>
		<ul>
			<li></li>
			<li>
				<ul>
					<li></li>
				</ul>
			</li>
		</ul>
	</li>
</ul>

=== CSS ===
#ddMenu{}
	#ddMenu li{ ←親階層
		position:relative;
	}
		#ddMenu li ul{ ←子階層
			display:none;
			position:absolute;
		}
		#ddMenu li:hover ul,
		#ddMenu li.hover ul{ ←mouseover
				display:block;
		}
			#ddMenu li li{}
				#ddMenu li li ul,
				#ddMenu li:hover li ul,
				#ddMenu li.hover li ul{ ←孫階層
					display:none;
				}
				#ddMenu li:hover li:hover ul,
				#ddMenu li.hover li.hover ul{ ←mouseover
						display:block;
				}

■解説
liのマウスオーバー時に「hover」クラスを追加。
あとはご随意に。

*/

var Menu=Class.create();

Menu.prototype={
	initialize: function(){
		this.top=$("ddMenu");
		if(this.top != null){
			var li=this.top.getElementsByTagName("li");
			for(i=0;i<li.length;i++){
				li[i].onmouseover=function(){
					this.className+=" hover";
				}		//this.dispChild;
				li[i].onmouseout=function(){
					this.className=this.className.replace(new RegExp("hover\\b"),"");
				}		//this.hiddenChild;
			}
		}
	},
	
	dispChild: function(e){
		var src=Event.findElement(e,"li");
		var c=src.className.split(" ");
		c.push("hover");
		
		src.className=c.join(" ");
	},
	
	hiddenChild: function(e){
		var src=Event.findElement(e,"li");
		src.className=src.className.replace(new RegExp("hover"),"");
	}
};



/*--------------------------------------------------------------------------*
 *  
 *  heightLine JavaScript Library beta1
 *  
 *  MIT-style license. 
 *  
 *  2007 Kazuma Nishihata 
 *  http://www.webcreativepark.net
 *  
 *--------------------------------------------------------------------------*/
function heightLine(){
	var className="heightLine";
	var parentClassName="heightLineParent"
	var reg = new RegExp(className+"-([a-zA-Z0-9-_]+)", "i");
	var objCN =new Hash();
	
	var objAll = document.getElementsByTagName ? document.getElementsByTagName("*") : document.all;
	for(var i = 0; i < objAll.length; i++) {
		var eltClass = objAll[i].className.split(/\s+/);
		for(var j = 0; j < eltClass.length; j++) {
			if(eltClass[j] == className) {
				if(!objCN["main CN"]) objCN["main CN"] = new Array();
				objCN["main CN"].push(objAll[i]);
				break;
			}else if(eltClass[j] == parentClassName){
				if(!objCN["parent CN"]) objCN["parent CN"] = new Array();
				objCN["parent CN"].push(objAll[i]);
				break;
			}else if(eltClass[j].match(reg)){
				var OCN = eltClass[j].match(reg)
				if(!objCN[OCN]) objCN[OCN]=new Array();
				objCN[OCN].push(objAll[i]);
				break;
			}
		}
	}
	
	
	//check font size
	var e = document.createElement("div");
	var s = document.createTextNode("S");
	e.appendChild(s);
	e.style.visibility="hidden"
	e.style.position="absolute"
	e.style.top="0"
	document.body.appendChild(e);
	var defHeight = e.offsetHeight;
	
	changeBoxSize = function(){
		keys = objCN.keys();
		for(var k=0;k<keys.length;k++){
			key=keys[k];
			if(key == "parent CN"){
				for(var i=0 ; i<objCN[key].length ; i++){
					var max_height=0;
					var CCN = objCN[key][i].childNodes;
					for(var j=0 ; j<CCN.length ; j++){
						if(CCN[j] && CCN[j].nodeType == 1){
							var tmp=CCN[j].cloneNode(true);
							CCN[j].style.height="auto";
							max_height = Math.max(max_height,CCN[j].offsetHeight);
						}
					}
					for(var j=0 ; j<CCN.length ; j++){
						if(CCN[j].style)CCN[j].style.height = max_height + "px";
					}
				}
			}else{
				var max_height=0;
				for(var i=0 ; i<objCN[key].length ; i++){
					objCN[key][i].style.height="auto";
					max_height = Math.max(max_height,objCN[key][i].offsetHeight);
				}
				for(var i=0 ; i<objCN[key].length ; i++){
					objCN[key][i].style.height = max_height + "px";
				}
			}
		}
	}
	
	
	checkBoxSize = function(){
		if(defHeight != e.offsetHeight){
			changeBoxSize();
			defHeight= e.offsetHeight;
		}
	}
	
	changeBoxSize();
	
	setInterval(checkBoxSize,1000)
}