var xmlhttp;
var currentpage = 1;
var totalperpage = 12;

function gallerydata(gvars) {	
	$.ajax({
		type: "GET",
		url: "fanart_data.php?gvars="+gvars,
		dataType: "html",
		success: function(responseText) {
			writePage(responseText);
		}
	});
}

function opengalimg(imgid) {
	$.ajax({
		type: "GET",
		url: "fanart_data.php?gvars="+imgid,
		dataType: "html",
		success: function(responseText) {
			imgpopup(responseText);
		}
	});
}

function imgpopup(data) {

	var ScrollY;
	var windowHeight;
	if (window.innerHeight && window.scrollMaxY) {	
		ScrollY = window.innerHeight + window.scrollMaxY;
	} else if (document.body.scrollHeight > document.body.offsetHeight){
		ScrollY = document.body.scrollHeight;
	} else {
		ScrollY = document.body.offsetHeight;
	}
	if (self.innerHeight) {
		windowHeight = self.innerHeight;
	} else if (document.documentElement && document.documentElement.clientHeight) {
		windowHeight = document.documentElement.clientHeight;
	} else if (document.body) {
		windowHeight = document.body.clientHeight;
	}	
	if(ScrollY < windowHeight) {
		pageHeight = windowHeight;
	} else { 
		pageHeight = ScrollY;
	}


	if(!document.getElementById("bgblackout")) {
		bgblackoutElement = document.createElement("div");
		bgblackoutElement.style.background = '#000000';
		bgblackoutElement.style.opacity = '0.7';
		bgblackoutElement.style.filter = 'alpha(opacity=70)';
		bgblackoutElement.style.zIndex = '500';
		bgblackoutElement.style.height = pageHeight;
		bgblackoutElement.style.width = '100%';
		bgblackoutElement.id = "bgblackout";
		bgblackoutElement.innerHTML = "";
	} else {
		document.getElementById("bgblackout").style.display = "";
	}

	imgwrapper = document.getElementById("imgwrapper");
	imgtext = document.getElementById("imgtext");

	imgdata = data.split("|");

	imgid = imgdata[0];
	filename = imgdata[1];
	fext = imgdata[2];
	sender = imgdata[3];
	description = imgdata[4];
	dateadded = imgdata[5];

	imgwrapper.innerHTML = '<a href="javascript:closepopup();"><img src="http://www.shurtugal.com/images/fan_art_sys/'+filename+'-resized.'+fext+'" border="0"><br>[X] - Click Image to Close</a>';
	imgtext.innerHTML = '<h1>Fan Art Viewer</h1><b>Description:</b> '+description+'<br><b>Sent By:</b> '+sender+'<br><b>Date Submitted:</b> '+dateadded;
	document.getElementsByTagName("body")[0].appendChild(bgblackoutElement);
	imgwrapper.className = 'imgwrapper';
	imgtext.className = 'imgtext';

}

function closepopup() {

	document.getElementById("bgblackout").style.display = "none";
	imgwrapper = document.getElementById("imgwrapper");
	imgtext = document.getElementById("imgtext");
	imgwrapper.className = 'imgwrapper-hide';
	imgtext.className = 'imgtext-hide';
	
}

function writePage(responseData) {
	output = "";

	responseData1 = responseData.split("\^");
	metaData = responseData1[0].split("|");
	totalimgs = metaData[0];
	for(n=1;n<(responseData1.length-1);n++) {

		tmpData = responseData1[n].split("|");
		fileid = tmpData[0];
		filename = tmpData[1];
		fileext = tmpData[2];
		output += "<div><a href=\"javascript:opengalimg("+fileid+")\"><img src=\"http://www.shurtugal.com/images/fan_art_sys/"+filename+"-thumb."+fileext+"\" border=\"0\"></a></div>";
	}

	if(totalimgs == 0) {
		output = "<center><font size=\"3\"><b>There are no fan art images in the database.</b></font></center>";
	} else {

	totalpages = Math.ceil(totalimgs/totalperpage);
	if(totalpages == 1) {
		output2 = "<table border=\"0\" cellspacing=\"0\" cellpadding=\"0\" width=\"511\"><tr><td width=\"22%\" align=\"center\"></td><td width=\"56%\" align=\"center\">Page 1 of 1</td><td width=\"22%\" align=\"center\"></td>";
	} else if(currentpage == 1) {
		nextpage = totalperpage * currentpage;
		nextpagenum = currentpage + 1;
		output2 = "<table border=\"0\" cellspacing=\"0\" cellpadding=\"0\" width=\"511\"><tr><td width=\"22%\" align=\"center\"></td><td width=\"56%\" align=\"center\">Page "+currentpage+" of "+totalpages+"</td><td width=\"22%\" align=\"center\"><a href=\"javascript:currentpage = nextpagenum; gallerydata('"+nextpage+";"+totalperpage+"');\">Next Page >></a></td>";
	} else if(currentpage == totalpages) {
		if(currentpage == 2) {
			lastpage = "0";
		} else {
			lastpage = totalperpage * (currentpage-2);
		}
		lastpagenum = currentpage - 1;
		output2 = "<table border=\"0\" cellspacing=\"0\" cellpadding=\"0\" width=\"511\"><tr><td width=\"22%\" align=\"center\"><a href=\"javascript:currentpage=lastpagenum; gallerydata('"+lastpage+";"+totalperpage+"');\"><< Prev. Page</a></td><td width=\"56%\" align=\"center\">Page "+currentpage+" of "+totalpages+"</td><td width=\"22%\" align=\"center\"></td>";
	} else {
		nextpage = totalperpage * currentpage;
		if(currentpage == 2) {
			lastpage = "0";
		} else {
			lastpage = totalperpage * (currentpage-2);
		}
		nextpagenum = currentpage + 1;
		lastpagenum = currentpage - 1;
		output2 = "<table border=\"0\" cellspacing=\"0\" cellpadding=\"0\" width=\"511\"><tr><td width=\"22%\" align=\"center\"><a href=\"javascript:currentpage=lastpagenum; gallerydata('"+lastpage+";"+totalperpage+"');\"><< Prev. Page</a></td><td width=\"56%\" align=\"center\">Page "+currentpage+" of "+totalpages+"</td><td width=\"22%\" align=\"center\"><a href=\"javascript:currentpage = nextpagenum; gallerydata('"+nextpage+";"+totalperpage+"');\">Next Page >></a></td>";
	}
	output += "<span id=\"galleryMenu\">"+output2+"</span>";
	}

	document.getElementById("galleryWrapper").innerHTML = output;
}