var DynamicSlideShow = Class.create({
	initialize: function(selector, container, script)
	{
		this.index     = 1;
		this.selectors = $$(selector);
		this.script    = script;
		this.container = $$(container).first();
		
		var dyn = this; // because closure = new scope
		dyn.selectors.each(function(element, idx) {
			element.observe('mouseover', dyn.selectorEventHandler.bind(dyn));
			element.observe('mouseout', dyn.startSlideShow.bind(dyn, 10));
		});
		dyn.container.observe('mouseover', dyn.stopSlideShow.bind(dyn));
		dyn.container.observe('mouseout', dyn.startSlideShow.bind(dyn, 10));

		this.getContent();
	},
	getContent: function()
	{
		var dyn = this; // in closures(?) se creaza un nou scope, si 'this' n-ar mai referi obiectul
	
		new Ajax.Request(this.script, {
			onComplete: function(req)
			{
				dyn.content = req.responseJSON;
				dyn.startSlideShow(10).bind(dyn);
			}
		});
	},
	selectorEventHandler: function(event)
	{
		event.preventDefault();
		count = Event.element(event).readAttribute('count');
		this.index = (Number(count) + 1) % 4;
		this.changeContent(count);
		this.pe.stop();
	},
	changeContent: function(toIndex)
	{
		var	dyn	= this;
		if (!Object.isUndefined(toIndex))
			toIndex = new Number(toIndex);
		else
			toIndex = 0;

		dyn.container.hide();
		dyn.container.update(dyn.content[toIndex]);
		new Effect.Appear(dyn.container, { duration: 0.4 });
		
		/*new Effect.Fade(dyn.container, { duration: 0.3, afterFinish: function() {
				dyn.container.update(dyn.content[toIndex]);
				new Effect.Appear(dyn.container, { duration: 0.5 });
			}
		});*/
		
		/*new Effect.Parallel([
			new Effect.Fade(dyn.container, { sync: true }),
			new Effect.Appear(dyn.container, { sync: true })
		], {
			duration: 1
		});*/
	},
	startSlideShow: function(seconds)
	{
		var dyn   = this;
		dyn.pe = new PeriodicalExecuter(function() {
			dyn.changeContent(dyn.index);
			dyn.index = (dyn.index + 1) % 4;
		}, seconds);
	},
	stopSlideShow: function()
	{
		this.pe.stop();
	}
});