﻿// Global variabelen declaratie
var fadeElementActief = "bannerGliderItem-1";
var fadeElementInactief = "";
var fadeBtnActief = "bannerGliderBtnItem-1";
var fadeBooTimer = true;

var fadebooLock = true;
var fadeBannerWidth = 0;
var fadeNumber = 0;
var fadeTimerInterval = 0;
var fadeEffectInterval = 0;
// Eind declaratie

function InitFadeBanner(timerInt, effectInt) {
	fadeEffectInterval = effectInt;
    fadeTimerInterval = timerInt;
}

function timer(btnNaam, contentNaam) {
    if (fadebooLock) {
        if (fadeBooTimer) {
            if (fadeNumber != 0) {
                if (Ext.get(contentNaam + "-" + (fadeNumber + 1)) == null) {
                    //alert("test");
					fadeNumber = 0;
                }
                test(btnNaam + "-" + (fadeNumber + 1), contentNaam + "-" + (fadeNumber + 1));
            } else {
				fadeNumber++;
			}
        } else {
			alert("test");
		}
    } 
    setTimeout("timer('" + btnNaam + "', '" + contentNaam + "');", fadeTimerInterval);
    
}

function fadeElementOut(naam) {
	
    var inactiveElement = Ext.get(naam);
    inactiveElement.fadeOut({ endOpacity: 0, duration: fadeEffectInterval });
	
	//inactiveElement.setStyle("display", "none");
}

function fadeElementIn(naam) {
    var activeElement = Ext.get(naam);
	activeElement.setStyle("visibility", "visible");
    activeElement.fadeIn({ endOpacity: 1, duration: fadeEffectInterval });
	
	//activeElement.setStyle("visibility", "visible");
}

function inactiveButton(naam) {
    var inactivebutton = Ext.get(naam);
    //inactivebutton.setStyle("background-color", "#FFF");
	inactivebutton.setStyle("background", "transparent url('/images/banner_icons/banner_inactive.png')");
	//background-image: url('/images/banner_icons/banner_active.png');
}

function activeButton(naam) {
    var activeBtn = Ext.get(naam);
    //activeBtn.setStyle("background-color", "#000");
	activeBtn.setStyle("background", "transparent url('/images/banner_icons/banner_active.png')");
	//inactivebutton.setStyle("background-image", "url('/images/banner_icons/banner_inactive.png')");
}

// Fading
function test(htmlInput, divElement) {
    //alert("test");
	var arrHtmlInput = htmlInput.split('-');
    fadeNumber = (parseInt(arrHtmlInput[1]));	
	
    if (fadeElementActief != divElement) {
        var booBezig = false;
        if (fadeElementActief != "") {
            //alert("fadeOut"+ElementActief);
            //var inactiveElement = Ext.get(ElementActief);
            //inactiveElement.fadeOut({ endOpacity: 0, duration: 0.5});
            //alert("fadeOut:"+ElementActief+ "-"+BtnActief);
            fadeElementOut(fadeElementActief);
            //var inactivebutton = Ext.get(BtnActief);
            //inactivebutton.setStyle("background-color", "#FFF");
            if (Ext.get(fadeBtnActief) != null) {
                inactiveButton(fadeBtnActief);
            }
            booBezig = true;
        }
        //var activeElement = Ext.get(divElement);
        //var activeBtn = Ext.get(htmlInput);
        if (booBezig) {
            //alert("1-fadeIn:"+divElement+ "-"+htmlInput);
            //alert("fadeIn"+divElement);
            fadeElementIn(divElement);
            //activeElement.fadeIn({ endOpacity: 1, duration: 0.5});
            if (Ext.get(fadeBtnActief) != null) {
                activeButton(htmlInput);
            }
            //activeBtn.setStyle("background-color", "#000");
            booBezig = false;
        } else {
            //alert("1-fadeIn:"+divElement+ "-"+htmlInput);
            //alert("fadeIn"+divElement);
            fadeElementIn(divElement);
            //activeElement.fadeIn({ endOpacity: 1, duration: 0.5});
            if (Ext.get(fadeBtnActief) != null) {
                activeButton(htmlInput);
            }
            //activeBtn.setStyle("background-color", "#000");
        }
        fadeElementActief = divElement;
        if (Ext.get(fadeBtnActief) != null) {
            fadeBtnActief = htmlInput;
        }

    }
}

function fadeTimerPauze() {
    //document.getElementById("divIndicator").style.background = "#F1F2F3";
    fadeBooTimer = false;
    fadebooLock = false;
	//alert("test1");
}

function fadeTimerContinue(btnNaam, divNaam) {
    //document.getElementById("divIndicator").style.background = "#000000";
    fadeBooTimer = true;
    fadebooLock = true;
	//alert("test2");
}

function updateFadeLeft(item) {
	//alert("update"+gbBtnNumber);
    if (fadeNumber > 1) {
        //alert(gbBtnNumber+"goin left"+ item+"-"+(gbBtnNumber-1));
        test("btn-" + (fadeNumber - 1), item + "-" + (fadeNumber - 1)); //slideTo += gbBannerWidth;
        //gbBtnNumber--;
    }
    //alert("update left");
}

function updateFadeRight(item) {
	//alert("update"+gtBtnNumber);
    if (Ext.get(item + "-" + (fadeNumber + 1)) != null) {
        //alert(gbBtnNumber+"goin right"+item+"-"+(gbBtnNumber+1));
        test("btn-" + (fadeNumber + 1), item + "-" + (fadeNumber + 1)); //slideTo += gbBannerWidth;
        //slideTo -= gbBannerWidth;
        //gbBtnNumber++;
    }
}
