// JavaScript Document
/* Create a new XMLHttpRequest object to talk to the Web server */

/*
Bugs: (mozilla firefox 1.5.0.7) image wordt niet getoont, terwijl url en afmetingen wel correct zijn gevuld. (>10% van openen afbeelding, alleen bij showPic(), vnl. bij zelfde afbeelding na elkaar, maar ook soms bij nieuwe afbeelding)
*/

var SLIDESHOW_MIN_TIME = 5000;
var SEND_PAGE_TEXT = "Laden...";
var LOAD_PAGE_TEXT = "Laden...";
var LOAD_IMAGE_TEXT = "Laden...";

var xmlHttp = false;
var slideshowId = -1;
var loadId = -1;
var firstpic = false;
var showTime = 0;
var copyWait = false;
var magfactor = 1;
var curwidth = 0;
var curheight = 0;
var interrupt = false;
var copying = false;
var fotosize = 'medium';

//copy variables
var fotoname = '';
var fotodescription = '';
var fotoprevious = '';
var fotonext = '';
var fotowidth = 0;
var fotoheight = 0;

/*@cc_on @*/
/*@if (@_jscript_version >= 5)
try {
  xmlHttp = new ActiveXObject("Msxml2.XMLHTTP");
} catch (e) {
  try {
    xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
  } catch (e2) {
    xmlHttp = false;
  }
}
@end @*/

if (!xmlHttp && typeof XMLHttpRequest != 'undefined') {
  xmlHttp = new XMLHttpRequest();
}

function closeFotoShow() {
  if (!document.getElementById("fotocontainer")) return true;
  var fotoshow = document.getElementById("fotocontainer");
  fotoshow.style.display = 'none';
  stopSlideShow();
  stopLoadAnimation();
  clearImage();
}

function startLoadAnimation() {
	if(loadId>=0) {
		stopLoadAnimation();
	}
	loadId = window.setInterval("showLoadAnimation()", 1000);
}

function stopLoadAnimation() {
	if(loadId>=0) {
		window.clearInterval(loadId);
		loadId = -1;
	}
	clearStatus();
}

function showLoadAnimation() {
	if (document.getElementById('loading').innerHTML.length < 43) {
		document.getElementById('loading').innerHTML = document.getElementById('loading').innerHTML + ".";
	} else {
		document.getElementById('loading').innerHTML = LOAD_IMAGE_TEXT;
	}
}

function waitASecond() {
	showPicNext();	
}

function checkReadyState(obj)
{
	if(obj.readyState == 0) { document.getElementById('loading').innerHTML = SEND_PAGE_TEXT; }
	if(obj.readyState == 1) { document.getElementById('loading').innerHTML = LOAD_PAGE_TEXT; }
	if(obj.readyState == 2) { document.getElementById('loading').innerHTML = LOAD_PAGE_TEXT; }
	if(obj.readyState == 3) { document.getElementById('loading').innerHTML = LOAD_PAGE_TEXT; }
	if(obj.readyState == 4)
	{
		if(obj.status == 200)
		{
			document.getElementById('loading').innerHTML = "";
			return true;
		}
		else
		{
			document.getElementById('loading').innerHTML = "HTTP " + obj.status;
		}
	}
}

function clearStatus() {
	document.getElementById('loading').innerHTML = "";
}

function getJSONProperty(text, property) { 
	var posStart = text.indexOf('{' + property + '=');
	if (posStart>=0) {
		posStart = posStart + 2 + property.length;
		var posEnd = text.indexOf('}', posStart);
		if (posEnd>=0) {
			return text.substr(posStart, posEnd - posStart);
		} else {
			return null;
		}
	} else {
		return null;	
	}
}

function updatePic() {
  if (checkReadyState(xmlHttp)) {
    var response = xmlHttp.responseText;
	fotoname = getJSONProperty(response, 'id');
	fotoprevious = getJSONProperty(response, 'previousid');
	fotonext = getJSONProperty(response, 'nextid');
	fotourl = getJSONProperty(response, 'url');
	fotodescription = '';
	fotowidth = getJSONProperty(response, 'width');
	fotoheight = getJSONProperty(response, 'height');
	//var url = response.substring(0, response.lastIndexOf(","));
	//var id = response.substring(response.lastIndexOf(",") + 1);
	//werkt niet, script gaat gewoon doorbij instellen image.
	//preLoadImage(url);

	//alert(response);
	if (!firstpic && fotoname==document.getElementById("placeholder").getAttribute("name")) {
		stopLoadAnimation();
	} else {
		document.getElementById('loading').innerHTML = LOAD_IMAGE_TEXT;
		startLoadAnimation();
		copying = true;
		document.getElementById("placeholdercopy").hasloaded = false;
		document.getElementById("placeholdercopy").setAttribute("src", fotourl);
	}
	
	// staat meteen op true
	//if (document.getElementById("placeholder").complete) {
	//	alert("complete");	
	//}
  }
  return true;
}

function clearImage() {
	if (!document.getElementById("placeholder")) return true;
	document.getElementById("placeholder").setAttribute("name", '');
	document.getElementById("description").innerHTML = '';
	document.getElementById("placeholder").setAttribute("src", ' ');
	document.getElementById("placeholdercopy").setAttribute("src", ' ');
}

function copyImage() {
    stopLoadAnimation();
	var curTime = new Date();

	if (interrupt) {
	  interrupt = false;
      copyWait = false;
	  return true;
	}
	
    if((slideshowId>=0) && (curTime.getTime() - showTime < SLIDESHOW_MIN_TIME)) {
		copyWait = true;
	    window.setTimeout('copyImage()', 500);
		return true;
	}
	
	copying = false;
	
	var placeholder = document.getElementById("placeholder");
	
	placeholder.setAttribute("name", fotoname);
	document.getElementById("description").innerHTML = fotodescription;
	placeholder.setAttribute("alt", fotodescription);
	placeholder.setAttribute("src", fotourl); //gaat af en toe fout, code stopt??
    //alert("copyImage9");
    placeholder.style.paddingTop = (((500 - fotoheight) * magfactor) / 2) + 'px';
    placeholder.style.paddingLeft = (((500 - fotowidth) * magfactor) / 2) + 'px';
    placeholder.setAttribute("width", (magfactor * fotowidth));
    placeholder.setAttribute("height", (magfactor * fotoheight));
	curwidth = fotowidth;
	curheight = fotoheight;
	
	document.getElementById("fotoprevious").innerHTML = fotoprevious;
	document.getElementById("fotonext").innerHTML = fotonext;
	
	if (!fotonext) {
		stopSlideShow();
	}
	
	//alert("foto: " + placeholder.getAttribute("name") + "\n" + document.getElementById("description").innerHTML + "\n" + placeholder.getAttribute("src"));
	//alert(fotoname + fotowidth + fotoheight);

//	alert(document.getElementById("placeholder").getAttribute("name") + ": " + document.getElementById("placeholdercopy").getAttribute("name") + "\n" + document.getElementById("placeholder").getAttribute("src") + ": " + document.getElementById("placeholdercopy").getAttribute("src") + "\n" + document.getElementById("description").innerHTML + ": " + document.getElementById("descriptioncopy").innerHTML);
	showTime = curTime.getTime();
	copyWait = false;
	return true;
}

function sendRequest(url) {
  // Open a connection to the server
  xmlHttp.open("GET", url, true);

  // Setup a function for the server to run when it's done
  xmlHttp.onreadystatechange = updatePic;

  // Send the request
  xmlHttp.send(null);
}

function showPicture(whichpic) {
  firstpic = true;

  clearImage();
  
  var source = whichpic.getAttribute("href");

  if (!document.getElementById("placeholder")) return true;
  var placeholder = document.getElementById("placeholder");
  placeholder.setAttribute("name",whichpic.id.substring(4));

  if (!document.getElementById("fotocontainer")) return true;
  var fotoshow = document.getElementById("fotocontainer");
  fotoshow.style.display = 'block';

  var url = "getfoto.php?item=" + document.getElementById("placeholder").getAttribute("name") + "&option=" + document.getElementById("fotooption").innerHTML + "&view=" + fotosize;;
  
  sendRequest(url);

  return false;
}

function buttonNext() {
    if(slideshowId>=0) {
		stopSlideShow();	
	}
	showPicNext();	
}

function buttonPrevious() {
    if(slideshowId>=0) {
		stopSlideShow();	
	}
	showPicPrevious();	
}

function showPicNext() {
  if (copyWait) return true;
  firstpic = false;
  if (!document.getElementById("placeholder")) return true;

  if((slideshowId>=0)&&(loadId>=0)) {
    window.setTimeout('waitASecond()', 1000);
	return true;
  }
  
  var fotoId = document.getElementById("fotonext").innerHTML;
  
//  if(fotoId>0) {
    var url = "getfoto.php?item=" + fotoId + "&option=" + document.getElementById("fotooption").innerHTML + "&view=" + fotosize;
    sendRequest(url);
//  }

  return true;
}

function showPicPrevious() {
  if (copyWait) return true;
  firstpic = false;
  stopSlideShow();
  if (!document.getElementById("placeholder")) return true;


  var fotoId = document.getElementById("fotoprevious").innerHTML;
//  var fotoNextId = document.getElementById("fotonext").innerHTML;
  
//  if(fotoNextId>1) {
    var url = "getfoto.php?item=" + fotoId + "&option=" + document.getElementById("fotooption").innerHTML + "&view=" + fotosize;
    sendRequest(url);
//  }

  return true;
}

function showPicResize() {
  if (!document.getElementById("placeholder")) return true;

  var placeholder = document.getElementById("placeholder");
  var fotoitem = placeholder.getAttribute("name");

  if (!document.getElementById("fotocontainer")) return true;

  var url = "getfoto.php?item=" + fotoitem + "&option=" + document.getElementById("fotooption").innerHTML + "&view=" + fotosize;;
  
  sendRequest(url);

  return false;
}

function startSlideShow() {
    if(slideshowId>=0) {
		stopSlideShow();	
	} else {
		var fotoId = document.getElementById("fotonext").innerHTML;
//		if (fotoId>0) {
		  var curTime = new Date();
		  showTime = curTime.getTime();
		  document.getElementById("slideshow").setAttribute("src", "images/slideshow_ani.gif");
		  slideshowId = window.setInterval("showPicNext()", 500);
//		}
	}
}

function stopSlideShow() {
    if(slideshowId>=0) {
		if (copyWait) {
		  interrupt = true;
		}
		window.clearInterval(slideshowId);
		slideshowId = -1;
		document.getElementById("slideshow").setAttribute("src", "images/slideshow.gif");
	}
}

function prepareGallery() {
  //zet objecthandler aan voor placeholder
  addObjLoadEvent(document.getElementById("placeholdercopy"), copyImage);

  if (!document.getElementsByTagName) return false;
  if (!document.getElementById) return false;
  if (!document.getElementById("view")) return false;
  var gallery = document.getElementById("view");
  var links = gallery.getElementsByTagName("a");
  for ( var i=0; i < links.length; i++) {
    links[i].onclick = function() {
      return showPicture(this);
	}
    links[i].onkeypress = links[i].onclick;
    links[i].href = 'javascript:showPicture(this)';
  }
}

function addObjLoadEvent(object, func) {
  var oldonload = object.onload;
  if (typeof object.onload != 'function') {
    object.onload = func;
  } else {
    object.onload = function() {
      oldonload();
      func();
    }
  }
}

function addLoadEvent(func) {
  var oldonload = window.onload;
  if (typeof window.onload != 'function') {
    window.onload = func;
  } else {
    window.onload = function() {
      oldonload();
      func();
    }
  }
}

function resize() {
  var fotoview = document.getElementById("fotoview");
  var placeholder = document.getElementById("placeholder");
  if (magfactor != 1) {
	  magfactor = 1;
	  fotosize = 'medium';
  } else {
	  magfactor = magfactor + 0.5;
	  fotosize = 'large';
  }
  
  fotoview.style.width = (500 * magfactor) + 'px';
  fotoview.style.height = ((500 * magfactor) + 85) + 'px';
  placeholder.style.paddingTop = (((500 - curheight) * magfactor) / 2) + 'px';
  placeholder.style.paddingLeft = (((500 - curwidth) * magfactor) / 2) + 'px';
  placeholder.setAttribute("width", (magfactor * curwidth));
  placeholder.setAttribute("height", (magfactor * curheight));
  
  showPicResize();
}

addLoadEvent(prepareGallery);