/**
 * クロスフェードするロールオーバー処理
 * rollover2.js
 * Copyright (c) 2007 KAZUMiX
 * http://d.hatena.ne.jp/KAZUMiX/20071017/rollover2
 *
 * Licensed under the MIT License:
 * http://www.opensource.org/licenses/mit-license.php
 *
 * 更新履歴
 * 2009/06/02 ブラウザの「戻る」でフェード状態が残っている場合に対処
 * 2007/10/17 公開
 */

(function(){

	var VarUsrAgt = navigator.userAgent.toLowerCase();
	isGC = VarUsrAgt.lastIndexOf("chrome") != -1;
		if (isGC) {
		return;
	}

	 // ページ遷移時に透明にする用
	 var rolloverImages = [];

	 function setRollOver2(){
		 if(!document.images){return;}
		 var imgs = document.images;
		 var insert = [];
		 for(var i=0,len=imgs.length; i<len; i++){
			 var splitname = imgs[i].src.split('_rollout.');
			 if(splitname[1]){
				var rolloverImg = document.createElement('img');
				rolloverImages.push(rolloverImg);

				rolloverImg.src = splitname[0]+'_rollover.'+splitname[1];
				// rolloverImg.src = "img/mv200905_rollover.png";

				var alpha = 0;
				rolloverImg.currentAlpha = alpha;
				rolloverImg.style.opacity = alpha/100;
				rolloverImg.style.filter = 'alpha(opacity='+alpha+')';
				rolloverImg.style.position = 'absolute';

				//Safari用の補正をかける。style.cssのID.oversafariを参照。
				isSF = VarUsrAgt.indexOf("safari") != -1;
				if(isSF){rolloverImg.id = "overimg";}

				//きちんとMapが適用されるようHTMLアトリビュートを設定
				//ただし、Google Chrome用の補正をかける。Mapを設定するのにsetAttributeを使うと動作しなくなるため。

				var name_attstr		= "name";
				var usemap_attstr	= "useMap";
				var name_attvar		= "mapimg";
				var usemap_attvar	= "#map_a";

				if(!isGC){

					//DOM 1以降ではサポートされているはず
					rolloverImg.name = "mapimg";
					rolloverImg.useMap = "#map_a";

					//その他用
					//rolloverImg.setAttribute(name_attstr,	name_attvar);
					//rolloverImg.setAttribute(usemap_attstr,	usemap_attvar);

					//IE 7以上でOK
					//rolloverImg.attributes.getNamedItem(name_attstr).value = name_attvar;
					//rolloverImg.attributes.getNamedItem(usemap_attstr).value = usemap_attvar;

					//IE6.0以下用
					rolloverImg.setAttribute(name_attstr, name_attvar);
					rolloverImg.setAttribute(usemap_attstr, usemap_attvar);


				}

				//ロールオーバー・アウト処理それぞれを設定
				addEvent(rolloverImg,'mouseover',function(){setFader(this,100);});
				addEvent(rolloverImg,'mouseout',function(){setFader(this,0);});

				// 後で追加するために追加場所と共に保存しておく
				// この時点で追加するとdocument.imagesが書き換わって不都合
				insert[insert.length] = {
					position: imgs[i],
					element: rolloverImg
				};

			}
		 }
		 // ↑で作ったロールオーバー画像を追加
		 for(i=0,len=insert.length; i<len ;i++){
			 var parent = insert[i].position.parentNode;
			 parent.insertBefore(insert[i].element,insert[i].position);

		 }

		 // ページ遷移時にはフェード状態をクリアする
		 addEvent(window,'beforeunload', clearRollover);
	 }

	 // 指定要素を指定透明度にするためのフェードアニメを設定する関数

	 function setFader(targetObj,targetAlpha){
		 targetObj.targetAlpha = targetAlpha;
		 if(targetObj.currentAlpha==undefined){
			 targetObj.currentAlpha = 100;
		 }
		 if(targetObj.currentAlpha==targetObj.targetAlpha){
			 return;
		 }
		 if(!targetObj.fading){
			 if(!targetObj.fader){
				 targetObj.fader = fader;
			 }
			 targetObj.fading = true;
			 targetObj.fader();
		 }
	 }

	 // アルファ値をターゲット値に近づける関数
	 // ターゲット値になったら終了

	 function fader(){
		 this.currentAlpha += (this.targetAlpha - this.currentAlpha)*0.2;
		 if(Math.abs(this.currentAlpha-this.targetAlpha)<1){
			 this.currentAlpha = this.targetAlpha;
			 this.fading = false;
		 }
		 var alpha = parseInt(this.currentAlpha);
		 this.style.opacity = alpha/100;
		 this.style.filter = 'alpha(opacity='+alpha+')';
		 if(this.fading){
			 var scope = this;
			 setTimeout(function(){fader.apply(scope)},30);
		 }
	 }

	 // すべてのロールオーバー画像をを透明にする関数（遷移時用）

	 function clearRollover(){
		 for(var i=0,len=rolloverImages.length; i<len; i++){
			 var image = rolloverImages[i];
			 image.style.opacity = 0;
			 image.style.filter = 'alpha(opacity=0)';
		 }
	 }

	 // イベントを追加する関数

	 function addEvent(eventTarget, eventName, func){
		 if(eventTarget.addEventListener){
			 // モダンブラウザ
			 eventTarget.addEventListener(eventName, func, false);
		 }else if(window.attachEvent){
			 // IE
			 eventTarget.attachEvent('on'+eventName, function(){func.apply(eventTarget);});
		 }
	 }

	 addEvent(window,'load',setRollOver2);

 })();