//Thumbnail fading speed
var speed = Math.round(1000 / 100);
var faded = 30;

	
//Initialising display of thumbnails
initIdx = 0;
function initThumbs() {
	if (initIdx >= initThumbsArr.length)
		return;
	else if (initIdx==0) {
		fadeIn(initThumbsArr[initIdx].id, 0, 100);			
	  document.getElementById("slide1").style.backgroundColor="orange";
	} else {
		fadeIn(initThumbsArr[initIdx].id, 0, faded);
	}
	initIdx++;
	setTimeout("initThumbs()",1000);
}

function fadeOut(fadeID, opacStart, opacEnd) {
  var timer = 0;
  for(i = opacStart; i >= opacEnd; i--) {
    setTimeout("changeOpac('fadeOut', " + i + ",'" + fadeID + "')",(timer * speed));
    timer++;
  }
}

function fadeIn(id, opacStart, opacEnd) {
  var timer = 0;
	for(i = opacStart; i <= opacEnd; i++) {
    setTimeout("changeOpac('fadeIn', " + i + ",'" + id + "')",(timer * speed));
    timer++;
	}
}
  
//change the opacity for different browsers
function changeOpac(direction, opacity, fadeID) {
	var obj = document.getElementById(fadeID).style;
  //IE - filter is of form: `alpha(opacity=100)`
  filterStr = obj.filter;
  if (filterStr) {
	  start = filterStr.indexOf("=");
	  strlen = filterStr.indexOf(")") - filterStr.indexOf("=");
	  opacStr = filterStr.substr(start+1, strlen-1);
	  if ((opacStr > (opacity) && direction=="fadeOut") ||
	  		(opacStr < (opacity) && direction=="fadeIn")) obj.filter = "alpha(opacity=" + opacity + ")";
	}
	
	opacity = opacity / 100;
	if ((obj.opacity > opacity && direction=="fadeOut") ||
  		(obj.opacity < opacity && direction=="fadeIn")) obj.opacity = opacity;
  if ((obj.MozOpacity > opacity && direction=="fadeOut") ||
  		(obj.MozOpacity < opacity && direction=="fadeIn")) obj.MozOpacity = opacity;
  if ((obj.KhtmlOpacity > opacity && direction=="fadeOut") ||
  		(obj.KhtmlOpacity < opacity && direction=="fadeIn")) obj.KhtmlOpacity = opacity;
} 

function displayPhoto(fullID, thumbID, a) {
	//Fade in fully
	fadeIn(thumbID, faded, 100);
	
	//Fade out others
	var x = document.getElementById("allThumbs").getElementsByTagName('IMG');
	for (fadeOthersIdx=0; fadeOthersIdx<x.length; fadeOthersIdx++) {
		if (x[fadeOthersIdx].id != thumbID) {
			fadeOut(x[fadeOthersIdx].id, 100, faded);
			//Remove "button" highlight
    	document.getElementById("slide"+(fadeOthersIdx+1)).style.backgroundColor="";
    }
	}
	
	currImg = document.getElementById(fullID).getElementsByTagName('IMG')[0].src;
	if (currImg != preloads[a].src) {
		fadeOut(fullID, 100, 0);	
		setTimeout("foo("+a+")",1000);
		setTimeout("bar('"+fullID+"', "+a+")",1000);
	}
	
}	
	
function foo(a) {
	document.getElementById("photoFrame").getElementsByTagName('IMG')[0].src=preloads[a].src;
}
function bar(fullID, a) {
	fadeIn(fullID, 0, 100);	
	document.getElementById("slide"+(a+1)).style.backgroundColor="orange";
}