var BannerImages = { 
        images: ["/images/img_1.jpg","/images/img_2.jpg","/images/img_3.jpg","/images/img_4.jpg","/images/img_5.jpg"], 
        nextImage: new Image(), 
        imgNumber: 1, 
        activeElem: document.getElementById("ImgRoofImage1"), 
        inactiveElem: document.getElementById("ImgRoofImage2"), 
        
        Rotate: function() { 
            BannerImages.nextImage = new Image();
            BannerImages.nextImage.onload = function() { BannerImages.CrossFade(); };
            BannerImages.nextImage.src = BannerImages.images[BannerImages.imgNumber % BannerImages.images.length];
        },
        
        CrossFade: function() { 
            BannerImages.inactiveElem.src = BannerImages.nextImage.src;
            BannerImages.activeElem.style.zIndex = 2;
            BannerImages.inactiveElem.style.zIndex = 3;
            SetOpacity(BannerImages.inactiveElem, 1);
            BannerImages.inactiveElem.style.display = "inline";
            FadeOpacity(BannerImages.inactiveElem.id, 1, 100, 1000, 12);
            FadeOpacity(BannerImages.activeElem.id, 100, 1, 1000, 12);
            
            setTimeout(function() { BannerImages.activeElem.style.display = "none"; var temp = BannerImages.activeElem; BannerImages.activeElem = BannerImages.inactiveElem; BannerImages.inactiveElem = temp; temp = null; BannerImages.imgNumber++; }, 1250);
            setTimeout(function() { BannerImages.Rotate(); }, 5000);

        }
    };
function SetupRandomImage()
{
    var image = document.getElementById("ImgRoofImage1");
    var imagenumber = Math.floor(Math.random() * 5);
    BannerImages.activeElem.src = BannerImages.images[imagenumber];
    BannerImages.inactiveElem.src = BannerImages.images[imagenumber+1];
    imagenumber++;
    BannerImages.imgNumber = imagenumber;
}
SetupRandomImage();
if (BannerImages.images.length > 1) setTimeout(function() { BannerImages.Rotate(); }, 4000);
    
function SetOpacity(elem, opacityAsInt)
{
	var opacityAsDecimal = opacityAsInt;
	
	if (opacityAsInt > 100)
		opacityAsInt = opacityAsDecimal = 100; 
	else if (opacityAsInt < 0)
		opacityAsInt = opacityAsDecimal = 0; 
	
	opacityAsDecimal /= 100;
	if (opacityAsInt < 1)
		opacityAsInt = 1; // IE7 bug, text smoothing cuts out if 0
	
	elem.style.opacity = opacityAsDecimal;
	elem.style.filter  = "alpha(opacity=" + opacityAsInt + ")";
}

function FadeOpacity(elemId, fromOpacity, toOpacity, time, fps)
{
	var steps = Math.ceil(fps * (time / 1000));
	var delta = (toOpacity - fromOpacity) / steps;
	
	FadeOpacityStep(elemId, 0, steps, fromOpacity, delta, (time / steps));
}

function FadeOpacityStep(elemId, stepNum, steps, fromOpacity, delta, timePerStep)
{
    SetOpacity(document.getElementById(elemId), Math.round(parseInt(fromOpacity) + (delta * stepNum)));

    if (stepNum < steps)
        setTimeout("FadeOpacityStep('" + elemId + "', " + (stepNum+1) + ", " + steps + ", " + fromOpacity + ", " + delta + ", " + timePerStep + ");", timePerStep);
}