window.onload = init;

var fadeTime = 800;
var slideTime = 5000;

var imageAltText = new Array();
var imageTitleText = new Array();
var imageAlt = new Array();
var imageTitle = new Array();
var divimages = new Array();
var newImage = null;
var oldImage = null;
var autoStart = true;
var countPictures = 1;
var activePicture = 1;
var fader = null;
var divSlideShow = null;
var oldTitleAlt = null;
var newTitleAlt = null;
var buttons = new Array();
var clicked = false;
var isFirst = true;
function init() {
    if (document.getElementById('slideshow') == undefined) return false;
    divSlideShow = document.getElementById('slideshow');
    var rimages = document.getElementsByTagName('img');
    var x = 1;
    var i = 1;
    var btns = '';
    for (x in rimages) {
        if (rimages[x].className == 'slideshowimage') {
            divimages[i] = rimages[x];
            imageAlt[i] = rimages[x].alt;
            imageTitle[i] = rimages[x].title;
            if (i == 1) {
                activePicture = i;
                oldImage = divimages[i];
            } 
            btns += '<a rel="' + i + '" href="#' + i + '" class="btns">' + i + '</a>';
            i++;
        }
    }

    countPictures = i;

    createTitleAltContainer();

    i = 1;
    x = 1;
    var titleAlt = document.getElementsByTagName('div');
    for (x in titleAlt) {
        if (titleAlt[x].className == 'TitleAlt') {
            imageAltText[i] = titleAlt[x];
            if (i == 1) oldTitleAlt = imageAltText[i];
            i++;
        }
    }

    var newdiv = document.createElement('div');
    newdiv.setAttribute("class","buttons")
    newdiv.innerHTML = btns;
    divSlideShow.appendChild(newdiv);


    buttons = divSlideShow.getElementsByTagName('a');

    x = 1;
    i = 1;
    for (x in buttons) {
        if (buttons[x].className == 'btns') {
            buttons[x].onclick = changeImage;
            i++;
        }
    }

    changeBtnsCSS();
    slideShow(true);

}

function createTitleAltContainer() {
    var x = 1;
    for (x in imageAlt) {
        var newdivOuter = document.createElement('div');
        newdivOuter.setAttribute("class", "TitleAlt");

        var newdiv = document.createElement('div');
        newdiv.setAttribute("class", "alt")
        newdiv.setAttribute("id", "alt_" + x)
        newdiv.innerHTML = imageAlt[x];
        newdivOuter.appendChild(newdiv);

        var newdiv = document.createElement('div');
        newdiv.setAttribute("class", "title")
        newdiv.setAttribute("id", "title_" + x)
        newdiv.innerHTML = imageTitle[x];
        newdivOuter.appendChild(newdiv);

        divSlideShow.appendChild(newdivOuter);
    }
}

function slideShow(first) {
    if (first) {
        changeImageViaSlide();
    } else {
        if (autoStart) {
            fader= window.setTimeout("changeImageViaSlide()", slideTime);
        }
    }
}


function changeBtnsCSS() {
    var x = 1;
    var i = 1;
    for (x in buttons) {
        if (buttons[x].className == 'btns' || buttons[x].className=='btns_active') {
            if (activePicture == i) {
                buttons[x].className = "btns_active";
            } else {
                buttons[x].className = "btns";
            }
            i++;
        }
    }
}


function changeImageViaSlide() {

    setOldImage(activePicture, activePicture,false);
    changeBtnsCSS();
    newImage = divimages[activePicture];
    newAlt = imageAlt[activePicture];
    newTitle = imageTitle[activePicture];
    newTitleAlt = imageAltText[activePicture];

    newImage.setAttribute("style", "display:block;opacity:0.01;filter:alpha(opacity=1); -moz-opacity:0.01")
    newTitleAlt.setAttribute("style", "display:block;opacity:0.01;filter:alpha(opacity=1); -moz-opacity:0.01")

    enablediv_with_fade(fadeTime);




    isFirst = false;
    slideShow(false);
}

function setOldImage(newRel, oldRel,isClick) {
    oldImage = divimages[oldRel];
    oldTitleAlt = imageAltText[oldRel];

    if (isFirst) {
        activePicture = 1;
    } else {
        activePicture = newRel;
        activePicture++;
        if (isClick) activePicture--;
        if (divimages[activePicture] == undefined && countPictures > 1) activePicture = 1;
    }
}


function changeImage() {
    if (!clicked) {
        clicked = true;
        autoStart = false;
        window.clearTimeout(fader);
        setOldImage(this.rel,activePicture,true);

        changeBtnsCSS();
        newImage = divimages[activePicture];
        newAlt = imageAlt[activePicture];
        newTitle = imageTitle[activePicture];
        newTitleAlt = imageAltText[activePicture];

        newImage.setAttribute("style", "display:block;opacity:0.01;filter:alpha(opacity=1); -moz-opacity:0.01")
        newTitleAlt.setAttribute("style", "display:block;opacity:0.01;filter:alpha(opacity=1); -moz-opacity:0.01")

        enablediv_with_fade(fadeTime);

        slideShow(false);

        return false;
    }
}



//ENABLE DIV MIT EFFEKT
function enablediv_with_fade(ms) {
    if (newImage) {
        var fps = Math.round(ms / 100);
        var tmp = 0;
        var opacity = 0;
        var i2 = 100;
        for (i = opacity; i <= 100; i += 1) {
            setTimeout("fadeIN(" + i + "," + i2 + ")", fps * tmp);
            tmp++;
            i2--;
        }
    }
}

function fadeIN(i,i2) {
    if (i < 100) {
        newTitleAlt.style.opacity = (i / 100);
        newTitleAlt.style.MozOpacity = (i / 100);
        newTitleAlt.style.KhtmlOpacity = (i / 100);
        newTitleAlt.style.filter = "alpha(opacity=" + i + ")";
        newTitleAlt.style.filter = 'progid:DXImageTransform.Microsoft.Alpha(Opacity=' + i + ')';

        newImage.style.opacity = (i / 100);
        newImage.style.MozOpacity = (i / 100);
        newImage.style.KhtmlOpacity = (i / 100);
        newImage.style.filter = "alpha(opacity=" + i + ")";
        newImage.style.filter = 'progid:DXImageTransform.Microsoft.Alpha(Opacity=' + i + ')';


        if (oldImage.src == newImage.src) {
        } else {
            oldTitleAlt.style.opacity = (i2 / 100);
            oldTitleAlt.style.opacity = (i2 / 100);
            oldTitleAlt.style.MozOpacity = (i2 / 100);
            oldTitleAlt.style.KhtmlOpacity = (i2 / 100);
            oldTitleAlt.style.filter = "alpha(opacity=" + i2 + ")";
            oldTitleAlt.style.filter = 'progid:DXImageTransform.Microsoft.Alpha(Opacity=' + i2 + ')';

            oldImage.style.opacity = (i2 / 100);
            oldImage.style.MozOpacity = (i2 / 100);
            oldImage.style.KhtmlOpacity = (i2 / 100);
            oldImage.style.filter = "alpha(opacity=" + i2 + ")";
            oldImage.style.filter = 'progid:DXImageTransform.Microsoft.Alpha(Opacity=' + i2 + ')';
        }


    } else {

        if (oldImage.src == newImage.src) {
        } else {
            oldTitleAlt.style.display = "none";
            oldImage.style.display = "none";
        }

        newTitleAlt.style.display = "block";
        newImage.style.display = "block";

        clicked = false;
    }

}