var rotatorsArray = new Array();

var rotators = {
    url: 'xml/slideshow.xml',
    
    init: function(container){
        if($('.rotator').length == 0) return;
        $.ajax({
            type: "GET",
            url: rotators.url,
            dataType: "xml",
            success: function(xml) {
                // meerdere rotators per pagina mogelijk
                $(xml).find('slideshows').each(function(){
                    var slideShow = $(this);
                    // Elke rotator/slideshow moet wel een elementId van de container-div hebben
                    if($(container).length == 0) return;

                    // maakt en init een nieuw Rotator object
                    var rotator 		= new Rotator;
                    rotator.container	= $(container);
                    rotator.title       = slideShow.find('title').text();
                    rotator.slidesData  = slideShow.find('slide');
                    rotator.totalSlides = rotator.slidesData.length;

                    // else krijgt hij default value via constructor
                    if(slideShow.find('slides').attr('slideTime') != null){
                        rotator.slideTime   = (1000 * Number(slideShow.find('slides').attr('slideTime')));
                    }
                    if(slideShow.find('slides').attr('transition') != null){
                        rotator.transition  = slideShow.find('slides').attr('transition');
                    }

                    // referenties in array
                    rotatorsArray.push(rotator);

                    // alles binnen, dan bouwen die handel!
                    rotator.build();
                });
            },
            error: function(XMLHttpRequest, textStatus, errorThrown){
                // hier moet een standaard afbeelding getoond worden, mocht er iets fout gaan...
                //console.log(errorThrown);
            }
        });
    }
}

/* Rotator object constructor */
function Rotator(){
    this.container      = null;
	this.title          = null;
    this.slidesData     = null; // xml
    this.slidesArray    = new Array();
	this.totalSlides    = null;
	this.counter        = 0;

    // default effect settings
    this.transition     = "fade"
    this.slideTime      = 5000;
    this.slideInterval  = null;
	this.transitionTime = 1000;

    this.activeImage    = 0;
}

function Slide(){
    this.nr     = 0;
    this.img    = null;
	this.url    = null;
    this.color  = null;
}

Rotator.prototype.build = function(){
    this.container.append("<h1 class='rotator_title'>"+this.title+"</h1>"); // pagination nav
    this.container.append("<ul class=\"rotator_media\"></ul>"); // media container
    this.container.append("<ul class=\"rotator_nav\"></ul>"); // pagination nav

    var rotRef = this;
    var counter = 0;

    this.slidesData.each(function(){
        // dient wel een backup image aanwezig te zijn!
        if($(this).find('backupImage').attr('path') != null){
            var slide = new Slide;
            slide.nr = counter;
            slide.img = $(this).find('backupImage').attr('path');
            slide.url = $(this).find('url').text();
            slide.color = $(this).find('color').text().toLowerCase().replace(/ /gi, "_");

            // vul media en pagination
            var slideLink = $("<li class='slide_"+counter+"'><a href='#' class='"+slide.color+"'>"+slide.nr+"</a></li>").appendTo($(".rotator_nav", rotRef.container));
            var slide = $("<li><a href='"+slide.url+"'><img src="+slide.img+" alt='' /></a></li>").appendTo($(".rotator_media", rotRef.container));

            $(".rotator_nav li:eq("+(0)+")", this.container).addClass('active');

            // toon eerste afbeelding
            if(counter != 0) slide.animate({opacity: 0}, 0, "linear");

            // highlight eerste paginator/navigator
            if(counter == 0) slideLink.addClass('active');

            rotRef.slidesArray.push(slide);
            counter++;
        }
    });
    this.start();
}

Rotator.prototype.start = function(){
    var rotRef = this;

    if(this.slidesArray.length > 1){
        this.slideInterval = setInterval(function(){rotRef.fade()}, this.slideTime);
    }

    $(".rotator_nav li", this.container).hover(
        function (){ // hover
            rotRef.pauze();
            if(!$(this).hasClass('active')){
                var active = $(this).attr('class').split('_')[1];
                rotRef.activeImage = active;
                $(".rotator_nav li", rotRef.container).removeClass('active');
                rotRef.showSlide();
            }
        },
        function(){ // out
            $(this).addClass('active');
            if(rotRef.slidesArray.length > 1){
                rotRef.slideInterval = setInterval(function(){rotRef.fade()}, rotRef.slideTime);
            }
            
        }
    );

    $(".rotator_media li", this.container).hover(
        function (){ // hover
            rotRef.pauze();
            rotRef.showSlide(false);
        },
        function(){ // out
            if(rotRef.slidesArray.length > 1){
                rotRef.slideInterval = setInterval(function(){rotRef.fade()}, rotRef.slideTime);
            }
        }
    )
}

Rotator.prototype.fade = function(){
    $(".rotator_nav li", this.container).removeClass('active');

    if(this.activeImage == (this.slidesArray.length - 1)){
        $(".rotator_nav li:eq("+(0)+")", this.container).addClass('active');

        $(this.slidesArray[this.activeImage]).animate({opacity: 0}, this.transitionTime, "linear");
        $(this.slidesArray[0]).animate({opacity: 1}, this.transitionTime, "linear");
        this.activeImage = 0;
    }else{
        this.activeImage = Number(this.activeImage);
        $(this.slidesArray[this.activeImage]).animate({opacity: 0}, this.transitionTime, "linear");
        $(this.slidesArray[Number(this.activeImage + 1)]).animate({opacity: 1}, this.transitionTime, "linear");

        $(".rotator_nav li:eq("+(this.activeImage + 1)+")", this.container).addClass('active');
        this.activeImage++;
    }
}

Rotator.prototype.pauze = function(){
    if(this.slideInterval != null) clearInterval(this.slideInterval);
}

Rotator.prototype.showSlide = function(fade){
    $(this.slidesArray).each(function(){
        $(this).animate({opacity: 0}, 0, "linear");
    });

    if(fade == false){
        $(this.slidesArray[(this.activeImage)]).animate({opacity: 1}, 0, "linear");
    }else{
        $(this.slidesArray[(this.activeImage)]).animate({opacity: 1}, 500, "linear");
    }
    
}
/*
$(document).ready(function(){
    var flashVersion = swfobject.getFlashPlayerVersion();
    if(flashVersion.major == 0){
        // flash niet aanwezig
        rotators.init("#rotator");
    }else{
        swfobject.embedSWF("rotator.swf", "flash_content", "720", "275", "9.0.0");
    }
});*/
