/**
 * ms Slideshow
 */
var msSlideshow = new Class({

	slideshow: null,
	images: null,
	image_loading: null,
	image_loading_loaded: false,
	pic_urls: null,
	akt_pic_nr: 0,
	akt_image: 0,

	Implements: Options,
	options: {
		delay: 3000,
		duration: 1000
	},
    
    /*	*************************************
		Konstruktor
	*/
    initialize: function(element_id, pic_urls, options){
		/*	Gesamte Slideshow	*/
		this.slideshow = $(element_id);
		this.pic_urls = pic_urls;
		this.setOptions(options);

		this.images = [];

		var children = this.slideshow.getChildren('img');
		children.each(function (child) {
			if(child.get('tag') == 'img')	this.images[0] = $(child);				
		}.bind(this));

		this.images[0].setStyle('position', 'absolute');
		this.images[1] = new Element('img');
		this.images[1].setStyle('position', 'absolute');
		this.images[1].inject(this.slideshow);

		this.images[0].setStyle('z-index', 1);
		this.images[1].setStyle('z-index', 0);
		
		this.startDuration();
    },

    image_loading_done: function() {
    	this.image_loading_loaded = true;
//console.log("end loading.");
    },

    startDuration: function() {
    	this.akt_pic_nr++;	if(this.akt_pic_nr >= this.pic_urls.length)	{	this.akt_pic_nr = 0;	}
    	this.akt_image = 1 - this.akt_image;

    	this.image_loading_loaded = false;
//console.log("start loading " + this.pic_urls[this.akt_pic_nr] + " ...");
    	this.image_loading = Asset.image(this.pic_urls[this.akt_pic_nr], {
    		onload: this.image_loading_done.bind(this)
    	});

    	this.images[this.akt_image].set('src', this.pic_urls[this.akt_pic_nr]);
    	if(Browser.Platform.ios) {
    		this.images[this.akt_image].style['-webkit-transition']='opacity 0s linear';
    		this.images[this.akt_image].style['opacity']=1;
    	} else {
    		this.images[this.akt_image].set('tween', {duration: 0});
    		this.images[this.akt_image].tween('opacity', 1);
    	}

    	this.startFade.delay(this.options.delay, this);
    },

    startFade: function() {
    	/* Bild noch nicht fertig geladen ... verzögern
    	 * 
    	 */
//console.log("start fade ...");
    	if(! this.image_loading_loaded) {
//console.log("fade waiting ...");
        	this.startFade.delay(1000, this);
        	return;
    	}
//console.log("fade ok.");

    	if(Browser.Platform.ios) {
    		/*
    		 * funktioniert nicht mit this.images[...].setStyle()
    		 */
    		this.images[1 - this.akt_image].style['-webkit-transition']='opacity '+this.options.duration+'ms linear';
    		this.images[1 - this.akt_image].style['opacity']=0;
    	} else {
    		this.images[1 - this.akt_image].set('tween', {duration: this.options.duration});
    		this.images[1 - this.akt_image].tween('opacity', 1, 0);
    	}

    	this.endFade.delay(this.options.duration, this);
    },
    
    endFade: function() {
    	this.images[this.akt_image].setStyle('z-index', 2);
    	this.images[1 - this.akt_image].setStyle('z-index', 1);

    	this.startDuration();
    }
    
});

