// Script written by Ivo Yordanov
// 07.04.2011

// This array will hold only the divs for the slides
var slides = new Array();

// Thus array will hold the tab buttons
var tabs = new Array();

// Holds the current slide number.
// This is needed in order to know which slide is being shown at any given moment;
// All function changing the slides should also change the value of this var.
var currentSlide = 0;

// This var is holding the interval in which the slides are changing
// It needs to be global in order the be accessable by all functions using
// setInterval() and clearInterval()
var interval;

// Fill the array holding the slides if there are any
function getSlides() {
	var slidesCount = 0;
	var divs = document.getElementsByTagName("div");

	for (var i = 0; i < divs.length; i++) {
		if (divs[i].getAttribute("id") == "slide") {
			slides[slidesCount] = divs[i];
			slidesCount++;
		}
	}
}

// Fills the array holding the tabs
function getTabs() {
	var tabsCount = 0;
	var imgs = document.getElementsByTagName("img");

	for (var i = 0; i < imgs.length; i++) {
		if (imgs[i].getAttribute("id") == "tab") {
			tabs[tabsCount] = imgs[i];
			tabsCount++;
		}
	}
}

// Changes the tab src
function selectTab(selectedTab) {
	tabs[selectedTab].src = "images/tab-selected.gif";
}

// Returns the tab src
function deselectTab(selectedTab) {
	tabs[selectedTab].src = "images/tab.gif";
}


// Hides all slides
function hideSlides() {
	for (var i = 0; i < slides.length; i++) {
		slides[i].style.opacity = 0;
		slides[i].style.visibility = "hidden";
	}
}

// Shows the desired slide
function showSlide(slide) {
	slides[slide].style.visibility = "visible";
	slides[slide].style.opacity = 1;
	
	selectTab(slide);
	
	currentSlide = slide;
}

// Shows the next slide
function showNextSlide() {
	if (currentSlide == slides.length - 1) {
		currentSlide = 0;
		hideSlides();
		showSlide(currentSlide);
	}
	else {
		currentSlide++;
		hideSlides();
		showSlide(currentSlide);
	}
}

// Shows the next slide after 5 seconds
function slidesAutoTransition() {
	interval = setInterval('showNextSlide()', 5000);
}

// Shows a random slide
function showRandomSlide() {
	var rand = Math.floor(Math.random() * slides.length);
	showSlide(rand);
}

// The functions above include no aniamtion. They instantly hide the current
// slide and show the next one or the chosen one from the tabs buttons.
//
// The functions below include smooth fade-in/fade-out animation between
// the slides change.

// Holds the opacity value of the currently shown slide
var opacity = 1.0;
var opacityIE = 100;

// Intervals and Timeouts for fade-in/fade-out animations
var slideFadeOut;
var slideFadeIn;

var delayChangeSlide;
var delayFadeInSlide;

// Reduce fraction of the opacity of the current slide
function reduceSlideOpacity() {
	opacity -= 0.1;
	
	if (opacity <= 0) {
		clearInterval(slideFadeOut);
		slides[currentSlide].style.visibility = "hidden";
	}
	
	slides[currentSlide].style.opacity = opacity;
}

// Fade-out the current sldie
function aniHideCurrentSlide() {
	slideFadeOut = setInterval ('reduceSlideOpacity()', 40);
}

// Increase fraction of the opacity of the current slide
function increaseSlideOpacity() {
	opacity += 0.1;
	
	if (opacity >= 1.0) {
		clearInterval(slideFadeIn);
	}
	
	slides[currentSlide].style.opacity = opacity;
}

// Fade-in the current sldie
function aniShowCurrentSlide() {
	
	for (var i = 0; i < slides.length; i++) {
		slides[i].style.visibility = "hidden";
		slides[i].style.opacity = 0;
	}
	
	selectTab(currentSlide);
	slides[currentSlide].style.visibility = "visible";
	slideFadeIn = setInterval ('increaseSlideOpacity()', 40);
}

// Changes the number of the current slide with the next one
function changeSlideNumber() {
	if (currentSlide == slides.length - 1) {
		currentSlide = 0;
	}
	else {
		currentSlide++;
	}
}

// Set the slide number to the desired one
function getSlideNumber(slide) {
	currentSlide = slide;
}

// Shows the next slide with smooth transition
function aniShowNextSlide() {
	// First we need to clear all Intervals and Timeouts
	clearInterval(slideFadeOut);
	clearInterval(slideFadeIn);
	clearTimeout(delayChangeSlide);
	clearTimeout(delayFadeInSlide);
	
	// Then do the animation
	aniHideCurrentSlide();
	deselectTab(currentSlide);
	delayChangeSlide = setTimeout('changeSlideNumber()', 600);
	delayFadeInSlide = setTimeout('aniShowCurrentSlide()', 700);
}

function aniSlidesAutoTransition() {
	interval = setInterval('aniShowNextSlide()', 5000);
}

// Changes the slide. This function is called from the tabs
// buttons, part of the HTML
function changeSlide(slide) {
	clearInterval(slideFadeOut);
	clearInterval(slideFadeIn);
	clearInterval(interval);
	clearTimeout(delayChangeSlide);
	clearTimeout(delayFadeInSlide);

	var opacity = 1.0;
	var opacityIE = 100;

	hideSlides();
	deselectTab(currentSlide);
	
	showSlide(slide);
	selectTab(slide);
	
	aniSlidesAutoTransition();
}

// Its called by the HTML body on load
function startUp() {
	getSlides();
	getTabs();
	showRandomSlide();
	aniSlidesAutoTransition();
}