var theImages = new Array()     
theImages[0] = 'images/startupimages/Startbild_mitarbeiter.jpg'
theImages[1] = 'images/startupimages/Startbild_natur.jpg'
theImages[2] = 'images/startupimages/Startbild_people.jpg'
theImages[3] = 'images/startupimages/Startbild_touch.jpg'

var startImageName = 'startupimage';
var fadeImageName = 'fadeimage';

var p = theImages.length;
var whichImage = Math.round(Math.random()*(p-1));

function StartImageSlide()
{
    SetNewImage(startImageName);
    SetNewImage(fadeImageName);
    StartTimer();
}

function StartTimer()
{
    setTimeout(function() { SwitchImage() }, 8000);
}

function SetNewImage(imageName)
{
    var el=document.getElementById(imageName);
    el.src = theImages[whichImage];
}

function SwitchImage()
{
    var oldImage = whichImage
    
    while (oldImage == whichImage)
    {
        whichImage = Math.round(Math.random()*(p-1));
    }
    
    if (GetOpacity(document.getElementById(fadeImageName)) == 0)
    {
        SetNewImage(fadeImageName);
        Fade(fadeImageName, startImageName);
    }
    else
    {
        SetNewImage(startImageName);
        Fade(startImageName, fadeImageName);
    }

    StartTimer();
}

function Fade(imageName1, imageName2)
{
    FadeImage(imageName1, 0, 100);
    FadeImage(imageName2, 100, 0);
}

function FadeImage(imageName, from, to)
{
    var element=document.getElementById(imageName);
    if (element.timer) window.clearTimeout(element.timer); 
    var startMS = (new Date()).getTime();
    element.timer = window.setTimeout("ChangeOpacity('" + imageName + "',1000," + startMS + "," + from + "," + to + ")",1);
}

function SetOpacity(object,opacityPct)
{
    // Old mozilla and firefox
    object.style.MozOpacity = opacityPct/100;
    // Everything else.
    object.style.opacity = opacityPct/100;
    // IE.
    object.style.filter = 'alpha(opacity=' + opacityPct + ')';
}

function GetOpacity(object)
{
    var opacity = 100;
    
    // Old mozilla and firefox
    opacity = object.style.MozOpacity;
    // Everything else.
    opacity = object.style.opacity;
        // IE.
    opacity = object.style.filter;

    return opacity;
}

function ChangeOpacity(id,msDuration,msStart,fromO,toO)
{
    var element=document.getElementById(id);
    var opacity = element.style.opacity * 100;
    var msNow = (new Date()).getTime();
    opacity = fromO + (toO - fromO) * (msNow - msStart) / msDuration;
    if (opacity<0) 
    SetOpacity(element,0)
    else if (opacity>100)
    SetOpacity(element,100)
    else
    {
        SetOpacity(element,opacity);
        element.timer = window.setTimeout("ChangeOpacity('" + id + "'," + msDuration + "," + msStart + "," + fromO + "," + toO + ")",1);
    }
}