/**************************************
 *	Fadeshow
 **************************************/

var Fadeshow = new Class({
	object:				null,
	data: 				null,
	language:			null,
	index: 				0,
	effect: 			null,
	periodicalTimer: 	null,
	
	setOptions: function(options){
		this.options = {
			interval: 5000,
			duration: 2000
		}
		Object.extend(this.options, options || {});
	},
	
	initialize: function(object, data, options){
		this.object		= object;
		this.data		= data;
		this.language	= object.getElement('input[name=language]').value;
		
		this.setOptions(options);
		if (this.options.duration > this.options.interval) { this.options.interval = this.options.duration + 2000 }
		
		this.showNew();
		if(this.data.length > 1){
			this.periodicalTimer = this.transist.periodical(this.options.interval, this);
		}
	},
	
	transist: function(){
		//Fade out
		this.effect = new Fx.Style(this.object, 'opacity', {duration: this.options.duration / 4, onComplete: this.showNew.bind(this)});
		this.effect.start(1,0);
	},
	
	showNew: function(){
		//Set new image + url
		this.setCurrentData(this.data[this.index]);
		
		//Fade in
		this.effect = new Fx.Style(this.object, 'opacity', {duration: this.options.duration});
		this.effect.start(0,1);
		
		//Next index
		if(this.index == this.data.length -1) { 
			this.index = 0;
		} else { 
			this.index++;
		}
	},
	
	setCurrentData: function(data){
		// Image
		this.object.getElement('img').src 	= '/nl/image/?process=resizecrop&width=182&height=172&file=' + data.image_filename;
		this.object.getElement('img').title = data.name;
		
		// Info
		this.object.getElement('div.description p').innerHTML = data.information + '...';
		
		// Title
		this.object.getElement('h3').innerHTML = data.name;	
		
		// Price
		this.object.getElement('div.price span').innerHTML = '€ ' + data.price;
		
		// Link
		this.object.addEvent('click', function(){
			location =  '/' + this.language + '/producten/' + data.category_quicklink + '/' + data.subcategory_quicklink + '/' + data.quicklink;
		}.bind(this));
	}
})

fireOn = Window.ie ? 'load' : 'domready';
window.addEvent(fireOn, function(){
	
	// Load fadeshow
	var spotlight		= $E('#hotspot div.spotlight div.inner');
	var spotlightData	= spotlight.getElement('input[name=fadeshowData]');
	if(spotlightData){
		new Fadeshow(spotlight, Json.evaluate(spotlightData.value) , {duration: 2000, interval: 8000} );
	}
});