﻿// Global variabelen declaratie
var fadeElementActief = 1;
var fadeBtnActief = 1;

var fadeBooTimer = true;
var fadebooLock = true;

var fadeNumber = 0;
var fadeTimerInterval = 0;
var fadeEffectInterval = 0;
// Eind declaratie

var bannerContainer = "bannerGliderItem";
var bannerButton = "bannerGliderBtnItem";

function InitFadeBanner(timerInt, effectInt) {
	fadeEffectInterval = effectInt;
    fadeTimerInterval = timerInt;
}

function timer() {
    if (fadebooLock) {
        if (fadeBooTimer) {
            if (fadeNumber != 0) {
                if (Ext.get(bannerContainer + "-" + (fadeNumber + 1)) == null) {
                    //alert("test");
					fadeNumber = 0;
                }
                updateBanner(parseInt(fadeNumber + 1));
            } else {
				fadeNumber++;
			}
        }
    } 
    setTimeout("timer();", fadeTimerInterval);
    
}

function fadeBannerOut(nummer) {
    var inactiveElement = Ext.get(bannerContainer +"-"+nummer);
    inactiveElement.fadeOut({ endOpacity: 0, duration: fadeEffectInterval });
}

function fadeBannerIn(nummer) {
	//alert(bannerContainer +"-"+nummer);
    var activeElement = Ext.get(bannerContainer +"-"+nummer);
	activeElement.setStyle("visibility", "visible");
    activeElement.fadeIn({ endOpacity: 1, duration: fadeEffectInterval });
	
	//activeElement.setStyle("visibility", "visible");
}

function inactivateButton(nummer) {
    document.getElementById(bannerButton +"-"+nummer).src = "/images/banner_icons/banner_inactive.png";
	//var inactivebutton = Ext.get(bannerButton +"-"+nummer);
	//alert(inactivebutton);
	//inactivebutton.setStyle("background", "transparent url('/images/banner_icons/banner_inactive.png')");
}

function activateButton(nummer) {
    document.getElementById(bannerButton +"-"+nummer).src = "/images/banner_icons/banner_active.png";
	//var activeBtn = Ext.get(bannerButton +"-"+nummer);
	//activeBtn.setStyle("background", "transparent url('/images/banner_icons/banner_active.png')");
}

// Fading
//function test(htmlInput, divElement) {
function updateBanner(nummer) {
    //alert("test");
	//var arrHtmlInput = htmlInput.split('-');
    fadeNumber = parseInt(nummer);
	var banner = bannerContainer + "-"+nummer;
	var button = bannerButton + "-" + nummer;
    
	if (fadeElementActief != nummer) {
        var booBezig = false;
        if (fadeElementActief != 0) {
            //alert("fadeOut"+ElementActief);
            //var inactiveElement = Ext.get(ElementActief);
            //inactiveElement.fadeOut({ endOpacity: 0, duration: 0.5});
            //alert("fadeOut:"+ElementActief+ "-"+BtnActief);
            fadeBannerOut(fadeElementActief);
            //var inactivebutton = Ext.get(BtnActief);
            //inactivebutton.setStyle("background-color", "#FFF");
            if (Ext.get(bannerButton +"-" + fadeBtnActief) != null) {
                inactivateButton(fadeBtnActief);
            }
            booBezig = true;
        }
        //var activeElement = Ext.get(divElement);
        //var activeBtn = Ext.get(htmlInput);
        if (booBezig) {
            //alert("1-fadeIn:"+divElement+ "-"+htmlInput);
            //alert("fadeIn"+divElement);
            fadeBannerIn(nummer);
            //activeElement.fadeIn({ endOpacity: 1, duration: 0.5});
            if (Ext.get(bannerButton +"-" +fadeBtnActief) != null) {
                activateButton(nummer);
            }
            //activeBtn.setStyle("background-color", "#000");
            booBezig = false;
        } else {
            //alert("1-fadeIn:"+divElement+ "-"+htmlInput);
            //alert("fadeIn"+divElement);
            fadeBannerIn(nummer);
            //activeElement.fadeIn({ endOpacity: 1, duration: 0.5});
            if (Ext.get(bannerButton +"-" +fadeBtnActief) != null) {
                activateButton(nummer);
            }
            //activeBtn.setStyle("background-color", "#000");
        }
        fadeElementActief = nummer;
        if (Ext.get(bannerButton +"-" +fadeBtnActief) != null) {
            fadeBtnActief = nummer;
        }

    }
}

function fadeTimerPauze() {
    fadeBooTimer = false;
    fadebooLock = false;
}

function fadeTimerContinue() {
    fadeBooTimer = true;
    fadebooLock = true;
}

function updateFadeLeft() {
    if (fadeNumber > 1) {
        //updateBanner(parseInt(fadeNumber - 1), item + "-" + (fadeNumber - 1)); 
		updateBanner(parseInt(fadeNumber - 1)); 
    }
}

function updateFadeRight() {
    if (Ext.get(bannerContainer + "-" + (fadeNumber + 1)) != null) {
        //updateBanner("btn-" + (fadeNumber + 1), item + "-" + (fadeNumber + 1)); 
		updateBanner(parseInt(fadeNumber + 1)); 
    }
}

