var httpObj;
var timerId;
var timeoutSec = 10;
var fadeinOpacity = 30;
var fadeoutOpacity = 70;
var fadeoutTimer;



function init() {
	resizeWindow();
	// SEARCH ALL ANCHORS
	if (!document.getElementsByTagName) { return; }
	var anchors = document.getElementsByTagName('img');
	for (var i=0; i<anchors.length; i++) {
		var anchor = anchors[i];
		var relAttribute = String(anchor.getAttribute('rel'));
		if (anchor.getAttribute('id') && (relAttribute.toLowerCase().match('detail'))) {
			anchor.onclick = function () { openDetailWindow(this); return false; }
		}
	}
}

function getPageSize() {
	
	var xScroll, yScroll;
	
	if (window.innerHeight && window.scrollMaxY) {	
		xScroll = document.body.scrollWidth;
		yScroll = window.innerHeight + window.scrollMaxY;
	} else if (document.body.scrollHeight > document.body.offsetHeight){
		xScroll = document.body.scrollWidth;
		yScroll = document.body.scrollHeight;
	} else {
		xScroll = document.body.offsetWidth;
		yScroll = document.body.offsetHeight;
	}
	
	var windowWidth, windowHeight;
	if (self.innerHeight) {
		windowWidth = self.innerWidth;
		windowHeight = self.innerHeight;
	} else if (document.documentElement && document.documentElement.clientHeight) {
		windowWidth = document.documentElement.clientWidth;
		windowHeight = document.documentElement.clientHeight;
	} else if (document.body) {
		windowWidth = document.body.clientWidth;
		windowHeight = document.body.clientHeight;
	}
	if(yScroll < windowHeight){
		pageHeight = windowHeight;
	} else { 
		pageHeight = yScroll;
	}
	if(xScroll < windowWidth){	
		pageWidth = windowWidth;
	} else {
		pageWidth = xScroll;
	}
	arrayPageSize = new Array(pageWidth,pageHeight,windowWidth,windowHeight);
	return arrayPageSize;
}

function resizeWindow() {
	var arrayPageSize = getPageSize();
	var contentsHeight = arrayPageSize[3] -70;
	if (document.getElementById('title')) {
		document.getElementById('title').style.top = '0px';
	}
	if (document.getElementById('contents')) {
		document.getElementById('contents').style.height = contentsHeight +'px';
	}
	if (document.getElementById('overray')) {
		document.getElementById('overray').style.height = (arrayPageSize[3]-5)+'px';
	}
	if (document.getElementById('detailImage')) {
		var detailImage = document.getElementById('detailImage');
		var arrayPageSize = getPageSize();
		var pageHeight = arrayPageSize[3];
		var pageWidth = arrayPageSize[2];
		var imageHeight = detailImage.height;
		var imageWidth = detailImage.width;
		detailImage.style.top = ((pageHeight/2)-(imageHeight/2))+'px';
		detailImage.style.left = ((pageWidth/2)-(imageWidth/2))+'px';
	}
	document.getElementById('footer').style.top = (arrayPageSize[3] - 32)+'px';
}

function openDetailWindow(targetNode) {

	addOverray();

	var srcValue = targetNode.src;
	if (srcValue.match('[no]or[0-9]{3}\.jpg')) {
		var srcSplitValue = srcValue.match('[no]or[0-9]{3}\.jpg');
		var subjectValue = srcSplitValue[0].match('[no]or');
		var detailImageUrl = 'images/'+subjectValue+'/details/'+srcSplitValue[0];
	} else {
		var targetImage = targetNode.id;
		var detailImageUrl = 'images/eor/details/'+targetImage+'.jpg';
	}
	
	imgPreloader = new Image();

	imgPreloader.onload = function() {
		// create element
		var detailImage = document.createElement('img');
		detailImage.id='detailImage';
		// appendChild
		document.body.appendChild(detailImage);
		addListener(detailImage,'click',removeDetailWindow,false);
		detailImage.src = detailImageUrl;
		
		// set position
		var arrayPageSize = getPageSize();
		var pageHeight = arrayPageSize[3];
		var pageWidth = arrayPageSize[2];
		var imageHeight = imgPreloader.height;
		var imageWidth = imgPreloader.width;
		detailImage.style.top = ((pageHeight/2)-(imageHeight/2))+'px';
		detailImage.style.left = ((pageWidth/2)-(imageWidth/2))+'px';
		
		var funcRef = function() {
			fadeinOpacity = fadeinOpacity + 10;
			detailImage.style.filter = 'alpha(opacity='+fadeinOpacity+')';
			var nonIeOpacity = fadeinOpacity / 100;
			detailImage.style.mozOpacity = nonIeOpacity;
			detailImage.style.opacity = nonIeOpacity;
			if (fadeinOpacity >= 100) {
				clearInterval(fadeinTimer);
				fadeinOpacity = 30;
			}
		};
		fadeinTimer = setInterval(funcRef,5);	
	};

	imgPreloader.src = detailImageUrl;

}
function removeDetailWindow(e) {
	
	if (document.getElementById('detailImage')) {
		
		var detailImage = document.getElementById('detailImage');
		var ua = navigator.userAgent;
		if (ua.indexOf("Opera") >= 0) {
			detailImage.parentNode.removeChild(detailImage);
		return;
		}
		var funcRef = function() {
			fadeoutOpacity = fadeoutOpacity - 10;
			if (fadeoutOpacity <= 0) {
				clearInterval(fadeoutTimer);
				detailImage.parentNode.removeChild(detailImage);
				fadeoutOpacity = 70;
			}
			detailImage.style.filter = 'alpha(opacity='+fadeoutOpacity+')';
			var nonIeOpacity = fadeoutOpacity / 100;
			detailImage.style.mozOpacity = nonIeOpacity;
			detailImage.style.opacity = nonIeOpacity;
		};
		removeOverray();
		fadeoutTimer = setInterval(funcRef,5);
	}
}


function addOverray() {
	var newElem = document.createElement('div');
	newElem.id = 'overray';
	document.body.appendChild(newElem);
	var arrayPageSize = getPageSize();
	document.getElementById('overray').style.height = (arrayPageSize[3]-5)+'px';
}
function removeOverray() {
	var removeElem = document.getElementById('overray');
	document.body.removeChild(removeElem);
}


function getTargetNode(e) {
	var tagetNode;
	if (e.target) {
		targetNode = e.target;
	} else {
		targetNode = e.srcElement;
	}
	if (targetNode.nodeType == 3) {
		targetNode = targeNode.parentNode;
	}
	return targetNode;
}

function httpRequest(targetUrl,functionReference) {
	try {
		if (window.XMLHttpRequest) {
			httpObj = new XMLHttpRequest();
		} else if (window.ActiveXObject) {
			httpObj = new ActiveXObject("Microsoft.XMLHTTP");
		} else {
			httpObj = false ;
		}
	} catch(e) {
		httpObj = false;
	}
	if (! httpObj) {
		httpObjGenerateFail();
	}
	
	timerId = setInterval('timeoutCheck()',1000);
	httpObj.open("GET",targetUrl,true);
	httpObj.onreadystatechange = function() {
		if (httpObj.readyState == 4) {
			clearInterval(timerId);
			if (httpObj.status == 200) {
				functionReference(httpObj.responseText);
			} else {
				alert(httpObj.status+':'+httpObj.statusText);
				return false;
			}
		}
	}
	httpObj.send('');
}

function httpObjGenerateFail() {
	alert('ご利用のブラウザでは当サイトをご利用頂けません');
	return false;
}

function timeoutCheck() {
	timeoutSec --;
	if (timeoutSec <= 0) {
		clearInterval(timerId);
		httpObj.abort();
		alert('タイムアウトです');
		return false;
	}
}

function addListener(elem,eventType,func,cap) {
	if (elem.addEventListener) {
		elem.addEventListener(eventType,func,cap);
	} else if (elem.attachEvent) {
		elem.attachEvent('on'+eventType,func);
	} else {
		alert('ご利用のブラウザはサポートされておりません');
		return false;
	}
}

function removeListener(elem,eventType,func,cap) {
	if (elem.removeEventListener) {
		elem.removeEventListener(eventType,func,cap);
	} else if (elem.detachEvent) {
		elem.detachEvent('on'+eventType,func);
	}
}

addListener(window,'load',init,false);