// JavaScript Document
// Slideshow 0.5
// by Leo Gerber, diewebdesigner.com
// using Prototype and Sriptaculous
var myImageFade = Class.create({
	options: {
		startDelay: 1000,
		imgDelay: 2.0,
		imgFadeTime: 6,
		zStart: 10
	},
	initialize: function(container, options, images) {
		this.count = 1;
		this.loadCount = 0;
		var retOp = $H(this.options).merge($H(options));
        this.options = retOp;
		this.slideContainer = $(container);
		this.slides = [];
		this.images = [];
		this.imageSources = images;
		this.createStructure();
	},
	createStructure: function() {
		this.slideContainer.addClassName('dwImageSlide');
		this.slideContainer.setStyle({
			'position': 'relative'
		});
		this.preload();
	},
	preload: function() {
		i = 0;
		this.imageSources.each(function(imgSrc){
			this.images[i] = new Image();
			this.images[i].src = imgSrc;
			//this.images[i].observe('load', this.loaded.bind(this));
			/*
			 * IE 7 Fix, this.images[i].observe()... -> error in IE7
			 */
			Event.observe(this.images[i], 'load', this.loaded.bind(this));
			i++;
		}, this);
	},
	loaded: function() {
		this.loadCount++;
		if(this.loadCount == this.imageSources.length) {
			this.addSlides(this.slideContainer);
		}
	},
	addSlides: function(container) {
		i = 0;
		this.imageSources.each(function(imgSrc){
			this.slides[i] = new Element('div', {
				'class': 'dwImageSlideImg'
			});
			this.slides[i].setStyle({
				'position': 'absolute',
				'zIndex': this.options.get('zStart') - i
			});
			if(i != 0) {
				this.slides[i].hide();
			}
			this.slides[i].insert(this.images[i]);
			if (i == 0) {
				this.cWidth = this.images[i].width;
				this.cHeight = this.images[i].height;
				this.slideContainer.setStyle({
					'width': this.cWidth+'px',
					'height': this.cHeight+'px'
				});
				this.slideContainer.update(this.slides[i]);
			} else {
				this.slideContainer.insert(this.slides[i]);
			}
			i++;
		}, this);
		this.slideInt = new PeriodicalExecuter(function(pe) {
			this.cycle();
		}.bind(this), this.options.get('imgFadeTime'));
	},
	start: function() {
		this.slideImage2.src = this.preloadImages[1].src;

	},
	cycle: function() {
		var alen = this.slides.length;
		this.slides[1].show();
		new Effect.Opacity(this.slides[0], {
			duration: 2.0,
			from: 1.0,
			to: 0.0,
			afterFinish: function(el){
				var i = 0;
				this.slides[0].hide();
				new Effect.Opacity(this.slides[0],{
					duration: 0,
					delay: 0.5,
					from: 0.0,
					to: 1.0,
					queue: {
						position: 'end',
						scope: 'myImageFade'
					}
				});
				var delSlide = this.slides.shift();
				this.slides.push(delSlide);
				this.slides.each(function(slide){
					this.slides[i].setStyle({
						'zIndex': this.options.get('zStart') - i
					});
					i++;
				}, this);
			}.bind(this),
			queue: {
				position: 'end',
				scope: 'myImageFade'
			}
		});
	}
});