/**
*	Load Slider when document is loaded
**/
$(document).ready(
    function() {
        initSlider();
        startSlider($('#slides > .active').attr('rel'));
        
    }
);
    
var sliderTimeout;

function initSlider() {
    
    if(typeof headerResources !== "undefined" && headerResources != null) {
        preloadSlides();
        
        for (var i = 0; i < headerResources.length; i++) {
            var tempSlideElement = document.createElement('div');
            tempSlideElement.setAttribute('class', 'slide');
            tempSlideElement.setAttribute('rel', headerResources[i].duration*1000);
            
            var tempLabelElement = document.createElement('div');
            tempLabelElement.setAttribute('class', 'slideInfo');
            var sliderText = headerResources[i].text;
            sliderText = sliderText.replace(/<br\s*\/*>/g, '');
            sliderText = sliderText.replace(/\s/g, '');
            
            // @ TODO compute label position top/bottom css attribute
            if(headerResources[i].y > 500) {
                $(tempLabelElement).css({bottom: 10});
            } else {
                $(tempLabelElement).css({top: headerResources[i].y});
            }
            
            $(tempLabelElement).css({left:headerResources[i].x});
            
            var tempImgElement = document.createElement("img");
            tempImgElement.setAttribute('src', headerResources[i].path);
            //@TODO check image width/height
            tempImgElement.setAttribute('width', 595);
            tempImgElement.setAttribute('height', 220)
            
            if(sliderText.length != 0) {
                tempLabelElement.innerHTML = $.trim(headerResources[i].text);
                tempSlideElement.appendChild(tempLabelElement);
            }
            
            tempSlideElement.appendChild(tempImgElement);
            
            
            $('#slides').append(tempSlideElement);
        }
        
        if(headerResources.length == 1) {
            
            $('.slide:first').addClass('active');
            $('.slide:first').clone().appendTo('#slidingWindow');  
            $('#slidingWindow').children().eq(0).remove();
            
        } else if(headerResources.length > 1) {  

            $('#slides > .slide:first').addClass('active').clone().appendTo('#slidingWindow');
            $('#slidingWindow').children().eq(0).remove();
            
            $('#slides > .slide:nth-child(2)').addClass('next').clone().appendTo('#slidingWindow');
        } 
    }
}

function rebuildAnimation() {
    $('#slides').children('.active').removeClass('active');                    
    $('#slides').children('.next').addClass('active').removeClass('next');                    

    // start at first slide if last is shown
    if($('#slides > .active').next().length == 0) {
        $('.slide:first').addClass('next');
    } else {
        $('#slides > .active').next().addClass('next');
    }    
}

function animate() {
    $('#slidingWindow > .slide:first').fadeOut(2500, function(){
        rebuildAnimation();

        $('#slidingWindow > .active').remove();
        $('#slidingWindow > .next').addClass('active').removeClass('next');                    

        $('#slides > .next').clone().appendTo('#slidingWindow');
        startSlider($('#slides > .next').attr('rel'));
    });
}

function startSlider(timeout) {
    if(typeof headerResources  === "undefined" || headerResources == null) {
        return;
    }
    
    if(headerResources.length <= 1) {
        return;
    }
    
    sliderTimeout = setTimeout('animate()', timeout);
   
}

function preloadSlides(){
    document.preload = new Array();
    for(var i = 0; i < headerResources.length; i++) {
        document.preload[i] = new Image();
        document.preload[i].src = headerResources[i].path;
    }
}