var slideshow;

window.addEvent('slidesloaded', function(event){
	slideshow.run();
});


var SlideShow = new Class({
	
	act: 0, 
	slides: [],
	image: [],
	vrstnr: null,
	imageloaded: [],
	alt: false,
	effect1: null,
	fade: null,
	source: null,
	
	initialize: function(container, source) {
		this.container = $(container);
		this.container.setStyle('cursor', 'pointer');
		this.source = source;
		this.img1 = new Element('div').setStyles({
			position: 'absolute',
			overflow: 'hidden',
			top: 0,
			left: 0,
			opacity: 1,
			width: this.container.getStyle('width'),
			height: this.container.getStyle('height')
			}).injectInside(this.container);
		this.img2 = this.img1.clone();
		this.img2.setStyles({
			opacity: 0});
		this.img2.injectInside(this.container);
		this.tekst = new Element('div').setStyles({
			position: 'absolute',
			width: 700,
			height: 30,
			top: 296,
			left: 10,
			fontSize: '14pt',
			color: '#EEE'
			}).injectInside(this.container);									 
		this.tekst.set('html', 'Schouwburg Cuijk');
		this.fade = new Fx.Morph(this.img2, {duration: '1000', transition: Fx.Transitions.Sine.easeInOut, link: 'chain'});
		this.move = new Fx.Morph(this.tekst, {duration: '400', transition: Fx.Transitions.Sine.easeInOut});
		this.act = 0;
		this.container.addEvent('click', function() {
			window.location.href='http://www.schouwburgcuijk.nl/voorstellingen.html?vrst='+this.vrstnr;
			}.bind(this));
		this.getJSON();
	},
	
	getJSON: function() {
	var request = new Request.JSON({
			url: 'include/'+this.source,
			onComplete: function(jsonObj) {
				//if (Browser.Engine.gecko) console.log('json loaded'); 
				this.slides = jsonObj.slides;
				this.aantal = this.slides.length;
				//if (Browser.Engine.gecko) console.log(this.aantal); 
				window.fireEvent('slidesloaded');
				for (a=0; a<this.aantal; a++) {
					this.imageloaded[a]=false;
					this.getImage(a);
					}
				}.bind(this)
		}).send();
	},
	
	getImage: function(i) {
		if (!this.imageloaded[i]) {
			this.image[i] = new Asset.images(
				this.slides[i].img, 
				{onComplete: function() {
					window.fireEvent('image_loaded');
					this.imageloaded[i] = true;
					}.bind(this)
				});
			}
	},
	
	run: function() {
		this.volgende();
		this.volgende.periodical(10000, this);
	},
	
	volgende: function() {
		if (this.act >= this.aantal) this.act = 0;
		//if (Browser.Engine.gecko) console.log('this.act: '+this.act);	
		this.getImage(this.act);
		this.move.set({'opacity': 0});
		//this.move.start({'opacity': 1});
		(function(){this.move.start({'opacity': 1})}).delay(200, this);
		
		if (this.alt) {
			this.img1.empty();
			this.image[this.act].injectInside(this.img1);
			(function() {this.fade.start({'opacity': 0});}).delay(100, this);
			}
		else {
			this.img2.empty();
			this.image[this.act].injectInside(this.img2);
			(function() {this.fade.start({'opacity': 1});}).delay(100, this);
			}
		this.alt = !this.alt;
		this.tekst.set('html', this.slides[this.act].tekst);
		this.vrstnr = this.slides[this.act].vrstnr;
		this.act++;
		}
});