var speed=100; //transition speed
var pause = 5000; //pause before image fades out (in miliseconds)

// ####### Don't edit below this line

var Images = new Array();
var Texts = new Array();

var intrvl;

var firstImage = 3;
var secondImage = 4;
var thirdImage = 5;
var ImageNumber;

var value1 = 0;

var transitions = { 
//    img1st : null ,
//    img2nd : null ,
//    img3rd : null ,
    txtcontent : null,
    currentDirection : 2,
    
    init : function(){
    transitions.img1st = document.getElementById("firstImage");
    transitions.img2nd = document.getElementById("secondImage");
    transitions.img3rd = document.getElementById("thirdImage");
    
    },
	start : function(){
	    if (window.sidebar)
	    {
	    transitions.MOZFadeIn();
	    
	    }
	    if (document.all)
	    {
	    transitions.IEFadeIn();
	    
	    }
	},

	fadein : function(){
	
	},

	IEFadeIn : function(){
	    if (value1<100)
	    {
	        value1+=5;
	        setTimeout("transitions.IEFadeIn()", speed);
	    }
	    else{
            setTimeout("transitions.IEFadeOutCall()", pause);
	    }
	    
	    this.img1st.filters[0].opacity=value1;
	    this.img2nd.filters[0].opacity=value1;
	    this.img3rd.filters[0].opacity=value1;
	},
	
	IEFadeOutCall : function(){
	    transitions.IEFadeOut();
	},
	
	IEFadeOut : function(){
	    if (value1>0)
	    {
	        value1-=5;
	        setTimeout("transitions.IEFadeOut()", speed);
	    }
	    else
	    {
	        this.getNextPair();
	    }

	    this.img1st.filters[0].opacity=value1;
	    this.img2nd.filters[0].opacity=value1;
	    this.img3rd.filters[0].opacity=value1;
	},

	MOZFadeIn : function(){
	    if (value1<100)
	    {
	        value1+=5;
	        setTimeout("transitions.MOZFadeIn()", speed);
	    }
	    else{
            setTimeout("transitions.mozFadeOutCall()", pause);
	    }
	    this.img1st.style.opacity = value1/100; //ends as 0
	    this.img2nd.style.opacity = value1/100; //ends as 1
	    this.img3rd.style.opacity = value1/100;
	    
	},
	
	mozFadeOutCall : function(){
	    transitions.MOZFadeOut();
	},
	
	MOZFadeOut : function(){
	    if (value1>0)
	    {
	        value1-=5;
	        setTimeout("transitions.MOZFadeOut()", speed);
	    }
	    else
	    {
	        this.getNextPair();
	    }
	    this.img1st.style.opacity = value1/100; //ends as 0
	    this.img2nd.style.opacity = value1/100; //ends as 1
	    this.img3rd.style.opacity = value1/100;
	    
	},
	getNextPair : function(){
	    
	    if(this.currentDirection == 2)
	    {
            firstImage = firstImage + 3 < ImageNumber  - 1 ? firstImage + 3 : 0;
            secondImage = firstImage + 1 < ImageNumber  - 1 ? firstImage + 1 : 0;
            thirdImage = secondImage + 1 < ImageNumber - 1 ? secondImage + 1 : 0;
            
            
            if (window.sidebar)
	        {
	            this.img3rd.style.opacity=0;
                this.img2nd.style.opacity=0;
                this.img1st.style.opacity=0;
	        }
	        if (document.all)
	        {
	            this.img1st.filters[0].opacity=0;
	            this.img2nd.filters[0].opacity=0;
	            this.img3rd.filters[0].opacity=0;
	        }
	        
            this.img3rd.src = Images[thirdImage];
            this.img2nd.src = Images[secondImage];
            this.img1st.src = Images[firstImage];
            
            transitions.start();
            
        }
        else
	    {
            secondImage = firstImage;
            firstImage = firstImage != 0 ? firstImage - 1 : ImageNumber - 1;
            this.img2nd.style.opacity=0;
            this.img1st.style.opacity=100;
            
            this.img3rd.src = Images[thirdImage];
            this.img2nd.src = Images[secondImage];
            this.img1st.src = Images[firstImage];
        }
        
        value1=0;
	},
	Reverse : function()
	{
	    x = firstImage;
        secondImage = x != 0 ? x - 1 : ImageNumber - 1;
        this.img2nd.src = Images[secondImage];
        this.img1st.src = Images[firstImage];
	}
};

if (window.sidebar)
{
var moz=1;
var ie=0;
}
if (document.all)
{
var ie=1;
var moz=0;
}

function Slide(option){
    clearInterval(intrvl);

    transitions.init();
    transitions.currentDirection = option;
    transitions.start();

    if(option == 1)
        transitions.Reverse();
    }

window.onload = function() {
    x = 0;
    var cont = document.getElementById("fade_slike");
    
    for(var i=0 ; i<cont.childNodes.length ; i++)
        {
            if(cont.childNodes[i].nodeType == 1)
                if(cont.childNodes[i].className == "panel")
                    {
                                Images[x] = cont.childNodes[i].getElementsByTagName('img')[0].src;
                                Texts[x] = cont.childNodes[i].getElementsByTagName('span')[0].innerHTML;
                                x++;
                    }
        }
        ImageNumber = Images.length;
        Slide(2);
}