/**
 * 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.1
 * @lastmod 22-04-09
 */
var Slideshow = Class.create({ 

    /** 
     * Class constructor
     */
    initialize: function(container, images) {
		
		// reset properties
		this._reset();
		
        this._container = $(container);
        this._setup(images);
        this.start();
    },
    
    /**
     * Start methode. Start de slideshow
     */
    start: function() {
        this._timer = setTimeout(function() {
			this._next();
		}.bind(this), this._delay);
    },
    
    /**
     * Stop de slideshow
     */
    stop: function() {
        clearTimeout(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 fadeEffect = new Effect.Fade(this._images[this._index].element, { 
			sync: true
        });
		var appearEffect = new Effect.Appear(this._images[next].element, { 
            sync: true
        });
        
		var queue = [];
        queue.push(fadeEffect);
        queue.push(appearEffect);
        
        this.stop();
		
        var animation = new Effect.Parallel(queue, { 
            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 = new Element('img', {
			src: preloadedImage,
			id: 'gen-' + new Date().getTime() + '-' + Math.ceil(Math.random()*1000)
		}).setStyle({
			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.setDelay(images[i]);
                imageID++;
            }
        }   
    },
	
	/**
	 * Globale properties naar de default waardes resetten
	 * 
	 */
	_reset: function() {
	    /**
	     * Index van huidige afbeelding
	     * @var int
	     */
	    this._index = 0;
	
	    /**    
	     * Array van afbeeldingen
	     * @var int
	     */
	    this._images = [];
	    
	    /**
	     * Delay in milliseconden tussen afbeeldingswissel
	     * @var int
	     */
	    this._delay = 3000;
	    
	    /**
	     * Snelheid in seconden van fade effect
	     * @var int
	     */
	    this._effectSpeed = 4;
	    
	    /** 
	     * Container element waar de afbeeldingen in moeten staan
	     * @var object
	     */
	    this._container = null;
	    
	    /**
	     * Timer
	     * @var object
	     */
	     
	    this._timer = null;		
	}
});