var images = new Array(
  'images/front_page_img_1.jpg',
  'images/front_page_img_2.jpg',
  'images/front_page_img_3.jpg',
  'images/front_page_img_4.jpg',
  'images/front_page_img_5.jpg',
  'images/front_page_img_6.jpg',
  'images/front_page_img_7.jpg',
  'images/front_page_img_8.jpg',
  'images/front_page_img_9.jpg',
  'images/front_page_img_10.jpg',
  'images/front_page_img_11.jpg',
  'images/front_page_img_12.jpg');

var nextImage = 1;
var currentImage = 0;
var imageWidth = 765;
var imageHeight = 508;
var imageTimeout = 1500;
var timeoutID1;
var timeoutID2;
var timeoutID3;
var timeoutID4;
var secondTimeoutID;
var paused = false;



function setOpacity(el, opacity) {

	//  Which opacity method does this browser support?

	opacity /= 100;

	el.style.opacity = opacity;
	el.style.MozOpacity = opacity;
	el.style.filter = "alpha(opacity=" + (opacity*100) + ")";

}

function fadeImage(el, currentOpacity) {

	currentOpacity += 5;

	if (currentOpacity > 100) {
		setOpacity(el, 100);
		var prevEl = el.previousSibling ? el.previousSibling : el.parentNode.lastChild;
		prevEl.style.visibility = 'hidden';
		el.style.zIndex = 1;
		timeoutID1 = setTimeout(startFading, imageTimeout);
	}
	else {
		setOpacity(el, currentOpacity);
		timeoutID2 = setTimeout(function() { fadeImage(el, currentOpacity); }, 50);
	}

}

function fadeSingleImage(el, currentOpacity) {

	currentOpacity += 5;

	if (currentOpacity > 100) {
		setOpacity(el, 100);
		var cur = document.getElementById('fading_image_container').childNodes[currentImage];
		//var prevEl = el.previousSibling ? el.previousSibling : el.parentNode.lastChild;
		cur.style.visibility = 'hidden';
		el.style.zIndex = 1;
	}
	else {
		setOpacity(el, currentOpacity);
		timeoutID3 = setTimeout(function() { fadeSingleImage(el, currentOpacity); }, 50);
	}

}



function startFading() {

	var el = document.getElementById('fading_image_container').childNodes[nextImage];
	
	el.style.visibility = 'visible';
	el.style.zIndex = 2;
	setOpacity(el, 0);
	fadeImage(el,0);
	currentImage = nextImage;
	actImage = currentImage + 1;
	nextImage = (nextImage < images.length-1) ? nextImage + 1 : 0;
	activateImg(actImage + '');
	
}

function pageLoad() {
	activateImg('1');
	var el = document.getElementById('fading_image_container');

	while (el.firstChild) { el.removeChild(el.firstChild); }

	el.style.width = imageWidth + 'px';
	el.style.height = imageHeight + 'px';

	for(var i=0; i<images.length; i++) {

		var t = document.createElement('IMG');
		t.setAttribute('src',images[i]);
		t.setAttribute('width',imageWidth);
		t.setAttribute('height',imageHeight);
		t.style.position = 'absolute';
		t.style.visibility = 'hidden';
		el.appendChild(t);

	}

	el.firstChild.style.visibility = 'visible';
	
	timeoutID4 = setTimeout("startFading()", imageTimeout);

}

function activateImg(imgid) {
document.getElementById('img_1').style.backgroundImage = 'url(images/front_img_sml_1.jpg)';
document.getElementById('img_2').style.backgroundImage = 'url(images/front_img_sml_2.jpg)';
document.getElementById('img_3').style.backgroundImage = 'url(images/front_img_sml_3.jpg)';
document.getElementById('img_4').style.backgroundImage = 'url(images/front_img_sml_4.jpg)';
document.getElementById('img_5').style.backgroundImage = 'url(images/front_img_sml_5.jpg)';
document.getElementById('img_6').style.backgroundImage = 'url(images/front_img_sml_6.jpg)';
document.getElementById('img_7').style.backgroundImage = 'url(images/front_img_sml_7.jpg)';
document.getElementById('img_8').style.backgroundImage = 'url(images/front_img_sml_8.jpg)';
document.getElementById('img_9').style.backgroundImage = 'url(images/front_img_sml_9.jpg)';
document.getElementById('img_10').style.backgroundImage = 'url(images/front_img_sml_10.jpg)';
document.getElementById('img_11').style.backgroundImage = 'url(images/front_img_sml_11.jpg)';
document.getElementById('img_12').style.backgroundImage = 'url(images/front_img_sml_12.jpg)';

document.getElementById('img_'+imgid).style.backgroundImage = 'url(images/front_img_sml_' + imgid + '_o.jpg)';
}

function gotoImg(id,imgid) {
	activateImg(imgid);
	nextImage = id;
	var el = document.getElementById('fading_image_container').childNodes[currentImage];
	el.style.visibility = 'hidden';
	el.style.zIndex = 0;
	setOpacity(el, 0);	
	var el = document.getElementById('fading_image_container').childNodes[nextImage];
	el.style.visibility = 'visible';
	el.style.zIndex = 3;
	setOpacity(el, 100);
	currentImage = nextImage;
	
	nextImage = (nextImage < images.length-1) ? nextImage + 1 : 0;
	

	window.clearTimeout(timeoutID1);
	window.clearTimeout(timeoutID2);
	window.clearTimeout(timeoutID3);
	window.clearTimeout(timeoutID4);	
}