/**
 * Slideshow with performance optimisation
 *
 * @category Symmetrics
 * @author symmetrics gmbh <info@symmetrics.de>, Andreas Timm <at@symmetrics.de>
 * @copyright symmetrics gmbh
 * @license http://opensource.org/licenses/osl-3.0.php  Open Software License (OSL 3.0)
 */
var SymmetricsSlideShow = function()
{
    this.data = {
        box: null,
        current_id: 0,
        images: []
    };
    
    this.init = function()
    {
        this.prepareData();
        if ($('references-slider-data')) {
            $('references-slider-data').remove();
        }
        if ($$('.block-references .block-content') && $$('.block-references .block-content')[0]) {
            sliderDiv = '<div id="references-slider" class="slide-show"><a href="#" target="_blank"></a></div>';
            $$('.block-references .block-content')[0].insert(sliderDiv);
            this.data.box = $$('#references-slider > a')[0];
            this.loadImage(0, function(){
                SymmetricsSlideShow.showImage(0, function(){
                    SymmetricsSlideShow.nextImage();
                });
            });
        }
    };

    this.prepareData = function()
    {
        $$('#references-slider-data li').each(function(item){
            var a = item.getElementsBySelector('a')[0]; 
            var img = a.getElementsBySelector('img')[0]; 
            var image_data = {
                url: a.readAttribute('href'),
                img_url: img.readAttribute('src'),
                alt: img.readAttribute('alt')
            };
            SymmetricsSlideShow.data.images.push(image_data);
        });
    };

    this.loadImage = function(index, callback)
    {
        var image = new Image();
        image.src = this.data.images[index].img_url;
        this.loadImageComplete(image, function(){
            SymmetricsSlideShow.data.images[index].object = image;
            callback();
        });
    };
    
    this.loadImageComplete = function(img, callback)
    {
        var img = $(img);
        if(img.complete) {
            callback();
        } else {
            setTimeout(function(){
                SymmetricsSlideShow.loadImageComplete(img, callback);
            }, 100);
        }
    };

    this.showImage = function(index, callback)
    {
        var img = this.data.images[index].object;
        img.writeAttribute('class', 'slideshow_image');
        img.writeAttribute('style', 'position:absolute;');
        img.setOpacity(0);
        this.data.box.insert(img);
        this.data.box.writeAttribute({
            'href': this.data.images[index].url,
            'alt': this.data.images[index].alt
        });
        new Effect.Appear(img, {
            duration: 2,
            from: 0,
            to: 1,
            afterFinish: function(){
                SymmetricsSlideShow.cleanBox();
                setTimeout(function(){
                    callback();
                }, 3000);
            }
        });
    };

    this.cleanBox = function()
    {
        var elements = this.data.box.getElementsByClassName('slideshow_image');
        var length = elements.length;
        if (length > 1) {
            var index = 0;
            for (index = 0; index < length - 1; index++) {
                elements[index].remove();
            }
        } 
    };
    
    this.nextImage = function()
    {
        this.data.current_id++;
        if (this.data.current_id >= this.data.images.length) {
            this.data.current_id = 0;
        }
        var img = this.data.images[this.data.current_id].object;
        if (img === undefined) {
            this.loadImage(this.data.current_id, function(){
                SymmetricsSlideShow.showImage(SymmetricsSlideShow.data.current_id, function(){
                    SymmetricsSlideShow.nextImage();
                });
            });
        } else {
            this.showImage(this.data.current_id, function(){
                SymmetricsSlideShow.nextImage();
            });
        }
    };
};
SymmetricsSlideShow = new SymmetricsSlideShow;
document.observe('dom:loaded', function() {
    SymmetricsSlideShow.init();
});