// JavaScript Document

/*
	imgfader.js
	画像をフェードさせながらランダムに入れ替えるJavaScript Ver.2
	http://asamuzak.jp
*/

var isMSIE = /*@cc_on!@*/false;

function addEvent(target, type, listener) {
	if(target.addEventListener) {
		target.addEventListener(type, listener, false);
	}
	else if(target.attachEvent) {
		target.attachEvent('on' + type, function() { listener.call(target, window.event); });
	}
	else {
		target['on' + type] = function(e) { listener.call(target, e || window.event); };
	}
}

function absPath(oPath) {
	var elm = document.createElement('span');
	elm.innerHTML = '<a href="' + oPath + '" />';
	return elm.firstChild.href;
}

function fadeInOutMSIE(rImg) {
	var img = new Image(); img.src = rImg.path + rImg.nxt + rImg.ext;
	var elm = document.getElementById(rImg.id);
	elm.style.filter = "progid:DXImageTransform.Microsoft.Fade(duration=2)";	// duration:フェード秒数
	elm.filters[0].apply(); elm.src = img.src; elm.filters[0].play();
	setNextImg(rImg);
}
function fadeInOut(rImg) {
	var elm = document.getElementById(rImg.id);
	if(elm.style.opacity > 0) {
		elm.style.opacity = Math.floor((elm.style.opacity - 0.05) * 100) / 100;
		if(elm.style.opacity <= 0) {
			elm.style.opacity = 0;
		}
		setTimeout(function() { fadeInOut(rImg) }, 100);	// 2秒フェード
		// setTimeout(function() { fadeInOut(rImg) }, 50);	// 1秒フェード
	}
	else {
		elm.src = rImg.path + rImg.nxt + rImg.ext;
		elm.style.opacity = 1;
		setNextImg(rImg);
	}
}
function setNextImg(rImg) {
	var r = Math.floor(Math.random() * rImg.max) + 1;
	while(r == rImg.nxt) {
		r = Math.floor(Math.random() * rImg.max) + 1;
	}
	if(r != rImg.nxt) {
		var rSrc = rImg.path + r + rImg.ext;
		rImg.nxt = r;
		if(isMSIE && navigator.userAgent.match(/MSIE ([0-9]{1,}[\.0-9]{0,})/) && (parseFloat(RegExp.$1) < 9)) {
			var img = new Image(); img.src = rSrc;
			setTimeout(function() { fadeInOutMSIE(rImg) }, 5000);	// ループ間隔（ミリ秒）
		}
		else {
			var elm = document.getElementById(rImg.id);
			elm.parentNode.setAttribute('style', 'background : url(' + rSrc + '); background-size : 100% 100%;');
			elm.style.opacity = 1;
			setTimeout(function() { fadeInOut(rImg) }, 5000);	// ループ間隔（ミリ秒）
		}
	}
}
function imgFader() {
	if(document.getElementsByTagName) {
		// ランダム表示する画像群の配列（画像群毎にカンマ区切りで配列を追加）
		// [画像の総枚数, 画像フォルダへのパス, 画像のid, 拡張子],
		// [画像2の総枚数, 画像2フォルダへのパス, 画像2のid, 拡張子]…
		var imgArr = [
				[7, 'http://www.lineajapan.co.jp/img/top/', 'random_image', '.jpg'],
				[10, './random2/', 'random_image', '.gif'],
				[10, './random3/', 'random_image2', '.gif']
			];
		for(var i = 0, l = imgArr.length; i < l; i++) {
			var elm = document.getElementById(imgArr[i][2]);
			var reg = new RegExp(absPath(imgArr[i][1]) + '([0-9]+)' + imgArr[i][3]);
			if(elm && elm.src.match(reg)) {
				var rImg = { nxt : RegExp.$1, max : imgArr[i][0], path : imgArr[i][1], id : imgArr[i][2], ext : imgArr[i][3] };
				setNextImg(rImg);
			}
		}
	}
}
addEvent(window, 'load', imgFader);
