// ---------------------------------------------------------------------------------------------
//  All functions for IMAGE-PAGE
// ---------------------------------------------------------------------------------------------

// User defined Vars
   // Image version
   parentBoxId  = "FrameThumbsImages";   // ID of outer box (div) with scollbuttons
   contentBoxId = "ContentThumbsImages";  // ID of inner box (div) with content to be scolled

// ---------------------------------------------------------------------------------------------
// DONT CHANGE ANYTHING BELOW !! 

/************************************************
// Initialize different things on load
/***********************************************/
onload = function() {
  initContentImage();
  setInfoPosition();
  initThumbnails();
  initScrollbar();
  initMovies();
  checkMovie();
}

/************************************************
// Initialize Movies
/***********************************************/
function initMovies() {
  strMovies = document.getElementById('movies').innerHTML;
  strMovies = strMovies.replace(/\s/g,"");  // Delete all whitespaces
  var Movie = strMovies.split(",");
  nrMovies = Movie.length;
	
  movieParts = "";
  movieNR = new Array();
  movieSRC = new Array();
  
  for(i=0; i<nrMovies;i++){
	movieParts = Movie[i].split("|");
	movieNR[i] = movieParts[0];
	movieSRC[i] = movieParts[1];
  }
}

function checkMovie() {
  for(i=0; i<nrMovies; i++){
	if(Math.round(imgNr) == parseInt(movieNR[i])){  // If Movie
	  actI = i;
	  objImg.style.cursor = 'pointer';
	  
	  objImg.onclick = function(){
		document.getElementById('moviebox').innerHTML = '<embed style="width:400px; height:326px;" id="VideoPlayback" type="application/x-shockwave-flash" src="'+movieSRC[actI]+'" flashvars=""> </embed>';
		document.getElementById('moviebox').style.display = "block";
		document.getElementById('FrameThumbsImages').style.display = "none";
	  }
	  
	}
  }
}

function closeMovie(){
  document.getElementById('moviebox').style.display = "none";
  document.getElementById('VideoPlayback').src = "";
  document.getElementById('FrameThumbsImages').style.display = "block";
}


/************************************************
// Initialize Image Scrollbar
/***********************************************/
function initScrollbar() {
  outerBox = document.getElementById(parentBoxId);
  innerBox = document.getElementById(contentBoxId);
}

/**********************************************************
// Set position of div#info2 and fill div with Numbers
/*********************************************************/
function setInfoPosition(){
  iElement = document.getElementById('info2');
  // Fill Numbers
  iElement.innerHTML = "";
  for(i = 1; i <= imgMax; i++){
	if(i < 10){i = "0" + i;}
	iElement.innerHTML += '<a href="#'+i+'" onfocus="if(this.blur) this.blur()" onclick="changeImage(' + i + ');return false;">' + i + '</a> ';
  }
  iHeight = iElement.offsetHeight;
  iElement.style.top = (296 - iHeight) + 'px';
  iElement.style.visibility = 'visible';
  iElement.style.display = 'none';
}

/************************************************
// Init Thumbnails
/***********************************************/
function initThumbnails() {
  thumbsOut = "";
  for(i = 1; i <= imgMax; i++){
	thumbsOut += '<img onfocus="if(this.blur) this.blur()" onClick="changeImage('+i+')" title="'+i+'" src="'+prePath+imgPath.replace(/\d+/, i)+'" height="30">';
  }
  document.getElementById('ContentThumbsImages').innerHTML = thumbsOut;
}


/************************************************
// Content image functions
/***********************************************/
function initContentImage(){
  imgMax = document.getElementById('pagenumber').innerHTML;  // grab total number of images directly from HTML Code
  if(document.getElementById('ContentChangeImage').childNodes.length == 0 || !document.getElementById('ContentChangeImage').firstChild.src || document.getElementById('ContentChangeImage').firstChild.src.substr((document.getElementById('ContentChangeImage').firstChild.src.length -4), 1) != "."){
	document.getElementById('ContentChangeImage').innerHTML = '<img src="fileadmin/img/empty_gallery.gif">';
    document.getElementById('pagenumber').innerHTML = '00 / 00';
	return false;
  }
  else {src = document.getElementById('ContentChangeImage').firstChild.src;}  // src of first image
  prePath = src.substr(0, src.lastIndexOf("/")+1);  // path without image name
  imgPath = src.substr(src.lastIndexOf("/")+1);  // image name with extension
  imgNr = imgPath.match(/\d+/);  // match numbers inside filename
  if(imgNr == null || imgNr == ""){imgNr = "0";}
  if(imgNr < 10){imgNr = "0" + imgNr;}
  if(imgMax < 10){imgMax = "0" + imgMax;}
  document.getElementById('pagenumber').innerHTML = imgNr + " / " + imgMax;
  objImg = document.getElementById('ContentChangeImage').firstChild;
  newSrc = src;
}

function getImage(img){
  if(img == 'next'){++imgNr;}
  else if(img == 'last'){--imgNr;}
  else {imgNr = img;}
  if(imgNr <= 1){imgNr = 1;}  // Set range
  if(imgNr >= imgMax){imgNr = imgMax;}  // Set range
  newSrc = prePath + imgPath.replace(/\d+/, imgNr);
  return (newSrc);
}

function changeImage(img){
  newSrc = getImage(img);
  if(imgNr < 10){imgNr = "0" + imgNr;}
  document.getElementById('pagenumber').innerHTML = imgNr + " / " + imgMax;
  objImg.src = newSrc;
  objImg.onclick = "";
  objImg.style.cursor = "default";
  checkMovie();
}

/****************************************************************************************/
//  Slideshow functions
/****************************************************************************************/
slide = 0;
function Slideshow() {
  icon = document.getElementById('playpause').firstChild.src;
  if(slide == 1){
    slide = 0;
	document.getElementById('playpause').firstChild.src = icon.replace(/play/, 'pause');
	document.getElementById('last').style.display = 'block';
	document.getElementById('next').style.display = 'block';
  }
  else {
    slide = 1;
    document.getElementById('playpause').firstChild.src = icon.replace(/pause/, 'play');
	document.getElementById('last').style.display = 'none';
	document.getElementById('next').style.display = 'none';
	startSlideshow();
  }
}
function startSlideshow() {
  if(imgNr >= imgMax){imgNr = 0;}
  newSrc = getImage(++imgNr);  // get next image
  document.getElementById('ContentChangeImage').style.backgroundImage = 'url(' + newSrc + ')';  // set next image as background
  if(slide == 1){window.setTimeout("fadeOut("+100+")", 1000);}
}
function fadeOut(opac) {
  // Set new opacity
  if(objImg.style.filter != undefined){objImg.style.filter = 'Alpha(opacity='+opac+')';}  // IE 
  else {objImg.style.MozOpacity = (opac/100);}  // Mozilla etc
  // Lowers opacity and restart fadeOut
  if(opac >= 1) {
	  opac--;
	  var active = window.setTimeout("fadeOut("+(opac-1)+")", 1); // Restart with new opacity level
  }
  else {
	  window.clearTimeout(active);  // Stop recursion
      changeImage(imgNr);  // Set new image number as the new one
	  fadeIn(0);
  }
}
function fadeIn(opac) {
  // Set new opacity
  if(objImg.style.filter != undefined){objImg.style.filter = 'Alpha(opacity='+opac+')';}  // IE 
  else {objImg.style.MozOpacity = (opac/100);}  // Mozilla etc 
  // Increase opacity and restart fadeIn
  if(opac <= 100) {
	  opac++;
	  var active = window.setTimeout("fadeIn("+(opac)+")", 1); // Restart with new opacity level
  }
  else {
    window.clearTimeout(active);  // Stop recursion
    if(slide == 1){window.setTimeout("startSlideshow()", 1000);}
  }
}

/****************************************************************************************/
//  Scolling functions
/****************************************************************************************/

// Set vars
xPos = 0;
run = 0;

/************************************************
// Main function for images
/***********************************************/
function goScrollImg(step) {
  maxScollWidth = -(innerBox.offsetWidth - outerBox.offsetWidth)+4; // +4 = image padding on "#ContentThumbsImages img" in "imagepage.css"
  moveImg(step);
  v = step;
  if ((run) && (xPos < 0)) setTimeout("goScrollImg(v)",1);
}

/************************************************
// This function moves images!
/***********************************************/
function moveImg(step) {  
  // Out of range? Stop scrolling!
  if (xPos + step < maxScollWidth) {xPos = maxScollWidth; run = 0;}  // Right
  else if (xPos + step > 0) {xPos = 0; run = 0;}  // Left
  else { // No
	xPos += step;
	innerBox.style.left = xPos + 'px'; // Here we go!
  }
}

/****************************************************************************************/
//  Show / Hide elements
/****************************************************************************************/
function showhide(id, opac){
  // Get element
  element = document.getElementById(id);
  // Set opacity
  if(element.style.filter != undefined){element.style.filter = 'Alpha(opacity='+opac+')';}  // IE 
  else if(element.style.MozOpacity != undefined){element.style.MozOpacity = (opac/100);}  // Mozilla etc
  // Show or hide element
  if(opac){element.style.display = 'block';}
  else {element.style.display = 'none';}
  //if(element.style.display == 'none' || !element.style.display){element.style.display = 'block';}
  //else {element.style.display = 'none';}
}


