/**
 * Slideshow Class
 * Aron Rotteveel
 * 
 * Gebruik: new Slideshow('id_van_container', imagechangerArray);
 *
 * Methods: start()             Start de slideshow
 *          stop()              Stop de slideshow
 *          getImages()         Alle afbeeldingen ophalen
 *          setDelay()          Delay tussen afbeeldingen instellen (in milliseconden)
 *          getDelay()          Delay verkrijgen
 *          setEffectSpeed()    Snelheid van effect instellen (in seconden)
 *          getEffectSpeed()    Snelheid van effect verkrijgen (in seconden)
 *          setContainer()      Container element instellen
 *          getContainer        Container element verkrijgen
 *
 * @requires prototype 1.6.0.2 +
 * @requires effects.js 1.8.0 +
 * @version 1.0
 * @lastmod 12-09-08
 */
var Slideshow = Class.create({ 

    /**
     * Index van huidige afbeelding
     * @var int
     */
    _index: 0,

    /**    
     * Array van afbeeldingen
     * @var int
     */
    _images: [],
    
    /**
     * Delay in milliseconden tussen afbeeldingswissel
     * @var int
     */
    _delay: 3000,
    
    /**
     * Snelheid in seconden van fade effect
     * @var int
     */
    _effectSpeed: 6,
    
    /** 
     * Container element waar de afbeeldingen in moeten staan
     * @var object
     */
    _container: null,
    
    /**
     * Timer
     * @var object
     */
     
    _timer: null,

    /** 
     * Class constructor
     */
    initialize: function(container, images) {
        this._container = $(container);
        this._setup(images);
        this.start();
    },
    
    /**
     * Start methode. Start de slideshow
     */
    start: function() {
        this._timer = setInterval(this._next.bind(this), this._delay);
    },
    
    /**
     * Stop de slideshow
     */
    stop: function() {
        clearInterval(this._timer);
    },
    
    /**
     * Array met alle afbeeldingen opvragen
     * @return array
     */
    getImages: function() {
        return this._images;
    },

    /**
     * Delay tussen wissel instellen
     * @var int delay
     */
    setDelay: function(delay) {    
        this._delay = delay;
    },
    
    /**
     * Delay opvragen
     * @return int
     */
    getDelay: function() {
        return this._delay;
    },
    
    /**
     * Effect speed instellen
     * @var int speed
     */
    setEffectSpeed: function(speed) {
        this._effectSpeed = speed;    
    },
    
    /**
     * Effect snelheid opvragen
     * @return int
     */
    getEffectSpeed: function() {
        return this._effectSpeed;
    },
    
    /**
     * Container instellen
     * @var string|object container
     */
    setContainer: function(container) {
        this._container = $(container);
    },
    
    /**
     * Container object opvragen
     * @return object
     */
    getContainer: function() {
        return $(this._container);
    },
    
    /**
     * Volgende afbeelding weergeven
     */
    _next: function() {
        if (this._images[this._index+1]) {
            var next = this._index + 1;
        } else {
            var next = 0;
        }
        
        var effects = [];
        effects.push(new Effect.Fade(this._images[this._index].element, { 
            sync: true
        }));
        effects.push(new Effect.Appear(this._images[next].element, { 
            sync: true
        }));        
        
        this.stop();
        
        new Effect.Parallel(effects, { 
            duration: this._effectSpeed,
            afterFinish: function() {
                this._index = next;
                this.start();
            }.bind(this)
        });
    },
    
    /**
     * Afbeeldingstag in container genereren
     * @param string $preloadedImage src naar afbeelding
     * @return object
     */
    _createTag: function(preloadedImage) {
        var img = document.createElement('img');
        img.src = preloadedImage;
        img.style.display = 'none';
        this.getContainer().appendChild(img);
        return img;
    },
    
    /**
     * Benodigde data initialiseren
     * @var array images
     */
    _setup: function(images) {
        var imageID = 0;
        for (var i = 0; i < images.length; i++) {
            if (!parseInt(images[i])) {
	            this._images[imageID] = {};
	            this._images[imageID].src = images[i];
	            this._images[imageID].element = this._createTag(images[i]);
	            if (i == 0) {
	                this._images[imageID].element.style.display = 'block';
	            }
                
            } else {
                this._delay = images[i];
                imageID++;
            }
        }   
    }
});