window.onload = boot;
var prevSelTr;
var prevSelTrCn;

var prevTr;
var prevTrCn;

var nextTr;
var nextTrCn;

var nrImgs = 0;
var zeroHeight = 0;
var middleHeiht = 0;

var opVal = 0;

var ssTimer = 0;

var canSS = false;
var xhr = false;

var page;
var lastPage;
var limit = 8;
var pageLimit;

function boot () {
	page = 0;
	lastPage = parseInt(document.getElementById("nrPages").value);
	
	document.getElementById("ssInput").onclick = function () { document.getElementById("ssInput").select();	}
	document.onkeydown = keyController;
		
	document.getElementById("previousPage").href = "javascript:previousPage("+ pPage() +")";
	document.getElementById("nextPage").href = "javascript:nextPage("+ nPage() +")";
	pageLimit = page * limit;
	nextPage(page, true);
}

function activateSelection() {
	//alert(document.getElementById("photosFixedDiv").innerHTML);
	//alert("page:"+page);
	pageLimit = page * limit;
	var allImgs = document.getElementById("photosFixedDiv").getElementsByTagName("img");
	nrImgs = allImgs.length;
	for (var i = 0; i < nrImgs; i++) {
		var imgTr = allImgs[i].parentNode.parentNode;
		//alert(imgTr.id);
		imgTr.onclick = function () { maximize(this.id); }
	}
	//alert("pageLimit:"+pageLimit);
	var firstPicTrId = (pageLimit <= 0) ? 0 : pageLimit;
	//alert(firstPicTrId);
	prevSelTr = document.getElementById("tr" + firstPicTrId);
	prevSelTrCn = "par";
	//alert("pageLimit:"+pageLimit+" nrImgs:"+nrImgs+" prevTr:"+ (pageLimit + (nrImgs-1)));
	var mix = (pageLimit + (nrImgs-1));
	prevTr = document.getElementById("tr"+mix);
	prevTrCn = prevTr.className;
	
	var mix2 = (firstPicTrId + 1);
	nextTr = document.getElementById("tr"+mix2);
	nextTrCn = nextTr.className;
	
	maximize("tr" + firstPicTrId);
	//alert(document.getElementById("tr"+(firstPicTrId+5)).className);
}

function pPage() {
	return (page <= 0) ? lastPage : (page - 1);
}

function nPage() {
	return (page >= lastPage) ? 0 : (page + 1);
}

function previousPage(pageNr) {
	if (pPage() == lastPage)
		page = lastPage;
	else
		page--;
	document.getElementById("previousPage").href = "javascript:previousPage("+ pPage() +")";
	document.getElementById("nextPage").href = "javascript:nextPage("+ nPage() +")";
	
	if (window.XMLHttpRequest) {
		xhr = new XMLHttpRequest();
	}
	else {
		if (window.ActiveXObject) {
			try {
				xhr = new ActiveXObject("Microsoft.XMLHTTP");
			}
			catch (e) { }
		}
	}
	if (xhr) {
		var url = "../config/load_fotos.php";
		var params="page="+pageNr;
		xhr.onreadystatechange =  previousPageResponse;
		xhr.open("POST", url+"?sid="+Math.random(), true);
		xhr.setRequestHeader("Content-type", "application/x-www-form-urlencoded"); //"application/x-www-form-urlencoded"
		xhr.setRequestHeader("Content-length", params.length);
		xhr.setRequestHeader("Connection", "close");
		xhr.send(params);
	}
	else {
		alert("Sorry, but I couldn't create an XMLHttpRequest");
	}
}

function previousPageResponse() {
	if (xhr.readyState == 4 && xhr.status == 200) {
		outMsg = xhr.responseText;
		document.getElementById("photosFixedDiv").innerHTML = outMsg;
		activateSelection();
	}
}

function nextPage(pageNr, boot) {
	if (!boot) {
		if (nPage() == 0)
			page = 0;
		else
			page++;
	}

	document.getElementById("previousPage").href = "javascript:previousPage("+ pPage() +")";
	document.getElementById("nextPage").href = "javascript:nextPage("+ nPage() +")";
	
	if (window.XMLHttpRequest) {
		xhr = new XMLHttpRequest();
	}
	else {
		if (window.ActiveXObject) {
			try {
				xhr = new ActiveXObject("Microsoft.XMLHTTP");
			}
			catch (e) { }
		}
	}
	if (xhr) {
		var url = "../config/load_fotos.php";
		var params="page="+pageNr;
		xhr.onreadystatechange =  nextPageResponse;
		xhr.open("POST", url+"?sid="+Math.random(), true);
		xhr.setRequestHeader("Content-type", "application/x-www-form-urlencoded"); //"application/x-www-form-urlencoded"
		xhr.setRequestHeader("Content-length", params.length);
		xhr.setRequestHeader("Connection", "close");
		xhr.send(params);
	}
	else {
		alert("Sorry, but I couldn't create an XMLHttpRequest");
	}
}

function nextPageResponse() {
	if (xhr.readyState == 4 && xhr.status == 200) {
		outMsg = xhr.responseText;
		document.getElementById("photosFixedDiv").innerHTML = outMsg;
		//alert(outMsg);
		activateSelection();
	}
}

function maximize (trId) {
	document.getElementById("display").innerHTML = "loading...";
	var id = parseInt(trId.substr(2));
	//alert("idMaximize:"+id);
	var prevId = id-1;
	var nextId = id+1;
	if (prevId < pageLimit) {
		//alert(pageLimit);
		prevId = (pageLimit + nrImgs) - 1;
	}		
	if (nextId >= (pageLimit+nrImgs)) {
		nextId = pageLimit;
	}
	//alert("prevId:"+prevId+" nextId:"+nextId);
	prevTr = document.getElementById("tr"+prevId);
	prevTrCn = prevTr.className;
	
	nextTr = document.getElementById("tr"+nextId);
	nextTrCn = nextTr.className;
		
	prevSelTr.className = prevSelTrCn;
	var selected = document.getElementById("tr"+id);
	prevSelTr = selected;
	prevSelTrCn = prevSelTr.className;
	
	selected.className = "selected";
	
	var img = document.getElementById(selected.id).getElementsByTagName("img")[0];
	var src = img.src;

	var end = src.length - 7;
	var bigSrc = src.substr(0, end);
	bigSrc += ".jpg";
	
	var bigImgLink = '<img id="img'+id+'" alt="loading..." src="'+bigSrc+'">';
	document.getElementById("display").innerHTML = bigImgLink;
	var bigImg = document.getElementById("img"+id);
	fadeIn(bigImg);
}

function fadeIn(img) {
	opVal = 0;
	img.style.visibility='visible';
	var imgId = parseInt(img.id.substr(3));
	fadeIn2(0.07, imgId);
}

function fadeIn2(incOp, imgId) {
	var img = document.getElementById("img"+imgId);
	if (!img)
		return;
	opVal = opVal + incOp;
	opVal = (opVal > 1) ? 1 : opVal;
	img.style.filter = 'alpha(opacity='+parseInt(100 * opVal)+')';
	img.style.opacity = opVal;
	if (opVal < 1)
		setTimeout("fadeIn2("+incOp+", "+imgId+")", 10);
}

function keyController(e) {
	var keynum;
	var keychar;
	var numcheck;

	if (window.event) { // IE
		keynum = window.event.keyCode;
	}
	else if (e.which) { // Netscape/Firefox/Opera
		keynum = e.which;
	}
	
	if (keynum == 37 || keynum == 38) {
		maximize(prevTr.id);
	}
	
	else if (keynum == 39 || keynum == 40) {
		maximize(nextTr.id);
	}
}

function startSlideShow() {
	var link = document.getElementById("ssText");
	link.innerHTML = 'stop';
	link.href = 'javascript:stopSlideShow()';
	
	var ssVal = document.getElementById("ssInput").value; // time of view of a picture
	if (isInt(ssVal)) {
		if (ssVal < 1) {
			alert("Please enter a value greater than 1.");
			stopSlideShow();
			return;
		}
		else if (ssVal > 30) {
			alert("That takes forever!");
			stopSlideShow();
			return;
		}
	}
	else {
		alert("Please enter a number.");
		stopSlideShow();
		return;
	}
	
	var selectTr = nextTr;
	var selectTrIdNr = parseInt(selectTr.id.substr(2));
	
	maximize(selectTr.id);
	ssTimer = setTimeout("startSlideShow()", (ssVal * 1000));
}

function stopSlideShow() {
	var link = document.getElementById("ssText");
	link.innerHTML = 'slideshow';
	link.href = 'javascript:startSlideShow()';
	document.getElementById("ssInput").value = 2;
	document.getElementById("ssInput").select();
	clearTimeout(ssTimer);
}

function isInt(val) {
	if (parseInt(val) != (val-0)) {
		return false;
	}
	return true;
}

function changeTrClassName(trId, trCn) {
	var tr = document.getElementById(trId);
	if (tr.className == "selected")
		return;
	tr.className = trCn;
}
	
function showImage (img, imgTimer) {
	alert(img.style.visibility);
	img.style.visibility = "visible";
	clearTimeout(imgTimer);
}

/**
 * Returns the absolute X and Y positions of an object.
 * @param {HTMLObject} obj HTML Object.
 * @return {Object} Returns an accessor with .x and .y values.
 */
function getXY(obj) {
  var curleft = 0;
  var curtop = obj.offsetHeight + 5;
  var border;
  if (obj.offsetParent) {
    do {
      // XXX: If the element is position: relative we have to add borderWidth
      if (getStyle(obj, 'position') == 'relative') {
        if (border = _pub.getStyle(obj, 'border-top-width')) curtop += parseInt(border);
        if (border = _pub.getStyle(obj, 'border-left-width')) curleft += parseInt(border);
      }
      curleft += obj.offsetLeft;
      curtop += obj.offsetTop;
    }
    while (obj = obj.offsetParent)
  }
  else if (obj.x) {
    curleft += obj.x;
    curtop += obj.y;
  }
  return {'x': curleft, 'y': curtop};
}
/**
 * Returns the specified computed style on an object.
 * @param {HTMLObject} obj HTML Object
 * @param {String} styleProp Property name.
 * @return {Mixed} Computed style on object.
 */
function getStyle(obj, styleProp) {
  if (obj.currentStyle)
    return obj.currentStyle[styleProp];
  else if (window.getComputedStyle)
    return document.defaultView.getComputedStyle(obj,null).getPropertyValue(styleProp);
}