// CyberGamer Gallery JS

var background = new Image();
background.src = "/images/galleryplaceholder.gif";

var loading = new Image();
loading.src = "/images/gallery/loadinganim.gif";

var menubg = new Image();
menubg.src = "/images/gallerydropdowntileover.gif";


function init() {
	var mydiv = document.getElementById("whereImagesGo");
	var loadEm = mydiv.getElementsByTagName("img");
	for(i = 0; i < loadEm.length; i++) {
		var myAnimation = new Animation(loadEm[i]);
		var newName = "image" + i;
		loadEm[i].setAttribute("name",newName);
	}
	loadEm.lastChild.setAttribute("name","Last");
}

function priorityLoad(URL) {
	var image = document.getElementById(URL);
	activateImage(image);
}

function Animation(image) {
	
	image.onclick = function() {
		activateImage(image);
	}
	
	
	image.onmouseover = function() {
		image.style.left = 5 + "px";
		image.style.top = 5 + "px";
		image.width = 160;
		image.height = 130;
	}
	
	image.onmouseout = function() {
		image.style.left = 10 + "px";
		image.style.top = 10 + "px";
		image.width = 150;
		image.height = 120;
	}
	
}

function activateImage(image) {
	if(document.getElementById('bigfatoverlay') == null) {
		overlayUp();
	}
	else {
		document.getElementById("bigfatoverlay").style.background="url(/images/gallery/loadinganim.gif) center center no-repeat black";
	}
		
	var newImageHolder = imageFrameConstructor();
	var bigImage = imageConstructor();	
	
	bigImage.onload = function() {
		putOnStage(newImageHolder,bigImage);
	}
	
	bigImage.src = image.getAttribute('id');

	newImageHolder = addText(image,newImageHolder,bigImage);
	
	bigImage.onclick = function() {
		var targetNode = image.parentNode.nextSibling;
		var x = 0;
		removeBigImage()
		fadeIn(70);

		while(x < 3) {
			if(targetNode.nodeType == 1) {
				if(targetNode.firstChild.name != "Last") {
					activateImage(targetNode.firstChild);
					break;
				}
				else {
					break;
				}
			}
			else {
				targetNode = targetNode.nextSibling;
				x++;
			}
		}
	
	}
			
	
}


function addText(image,newImageHolder,bigImage) {
	var nodes = image.parentNode.getElementsByTagName('div');
	var title = document.createElement("div");
	var date = document.createElement("div");
	var about = document.createElement("div");
	var usercomments = document.createElement("div");
	title.setAttribute("id","bigtitle");
	date.setAttribute("id","bigdate");
	about.setAttribute("id","bigabout");
	usercomments.setAttribute("id","biguser");
	title.innerHTML = nodes[0].firstChild.innerHTML;
	date.innerHTML = nodes[0].lastChild.innerHTML;
	about.innerHTML = nodes[1].innerHTML;
	usercomments.innerHTML = nodes[2].innerHTML;
	newImageHolder.appendChild(bigImage);
	newImageHolder.appendChild(title);
	newImageHolder.appendChild(date);
	newImageHolder.appendChild(about);
	newImageHolder.appendChild(usercomments);
	
	return newImageHolder;
}

function putOnStage(newImageHolder, bigImage) {
	position(newImageHolder, bigImage);
	document.getElementById("bigfatoverlay").style.background="url(/images/gallery/clicktoleave.gif) 10px 10px no-repeat black";
	document.body.appendChild(newImageHolder);
}

function position(newImageHolder, bigImage) {
	var imageWidth = bigImage.width;
	newImageHolder.style.width = imageWidth + "px";
	var MozpageHeight = window.innerHeight;
	var IEpageHeight = document.documentElement.clientHeight;
	
	var pageWidth = document.body.clientWidth;
	
	var IEHeight = Math.round((IEpageHeight/2)-(bigImage.height/2));
	if(IEHeight < 35 ) {
		IEHeight = 35;
	}
	else if(IEHeight > 150) {
		IEHeight = 150;
	}
	
	var MozHeight = Math.round((MozpageHeight/2)-(bigImage.height/2));
	if(MozHeight < 35) {
		MozHeight = 35;
	}
	else if (MozHeight > 150) {
		MozHeight = 150;
	}
	
	var allWidth = Math.round((pageWidth/2)-(imageWidth/2));
	if(allWidth < 5 ) {
		allWidth = 5;
	}

	if(self.pageYOffset) {
		newImageHolder.style.top = MozHeight + pageYOffset + "px";
	}
	else if( document.documentElement && document.documentElement.scrollTop )
	{
		newImageHolder.style.top = IEHeight + document.documentElement.scrollTop + "px"
	}
	else if( document.body ) 
	{
		newImageHolder.style.top = IEHeight + document.body.scrollTop + "px"
	}
	newImageHolder.style.left = allWidth + "px";
}

function overlayUp() {
	
	//IE FIX FOR SELECTS
	var selects = document.getElementById('whereImagesGo').getElementsByTagName("select");
	var selectsNo = selects.length;
	for(i = 0; i < selectsNo; i++) {
		selects[i].style.display="none";
	}
	//
	
	var black = document.createElement("div");
	var level = 0;
	black.setAttribute("id","bigfatoverlay");
	black.style.opacity = 0;
    black.style.MozOpacity = 0;
    black.style.filter = 'alpha(opacity=' + 0 + ')';
	
	black.onclick = function() {
		
		//IE FIX FOR SELECTS
		for(i = 0; i < selectsNo; i++) {
			selects[i].style.display="inline";
		}
		//
		removeBigImage();
		overlayDown();
	}
	document.body.insertBefore(black, document.body.firstChild);
	fadeIn(level);
}

function overlayDown() {
	var removeBlack = document.getElementById("bigfatoverlay");
	document.body.removeChild(removeBlack);
}

function removeBigImage() {
	var removeMe = document.getElementById("bigHolder");
	if(removeMe != null) {
		document.body.removeChild(removeMe);
	}
}


function fadeIn(level) {
	var target = document.getElementById('bigfatoverlay');
	if(level < 80) {
		newLevel = level + 10;
		target.style.opacity = level/100;
   		target.style.MozOpacity = level/100;
    		target.style.filter = 'alpha(opacity=' + level + ')';
		setTimeout(function() {fadeIn(newLevel)},20);
	}
	else {
		black.style.opacity = .8;
   		black.style.MozOpacity = .8;
    		black.style.filter = 'alpha(opacity=' + 80 + ')';
	}

}

function imageConstructor() {
	var bigImage = new Image();
	return bigImage;
}

function imageFrameConstructor() {
	var newImageHolder = document.createElement("div");
	newImageHolder.setAttribute("id","bigHolder");
	return(newImageHolder);
}

function loadExternalImage(source) {
	overlayUp();
	
	var newImageHolder = imageFrameConstructor();
	var bigImage = imageConstructor();
	newImageHolder.appendChild(bigImage);
	
	bigImage.onload = function() {
		putOnStage(newImageHolder, bigImage);
	}
	
	bigImage.src = source;
}

//window.onload=function(){
//init();
//}