// JavaScript Document

var CCarouselafbeelding = {
  
	load: function() 
	{   
		this.items = $$('.carouselafbeelding');
		//this.obj = obj;
		//alert(this.items.length);
		this.pe = false;		
		if(this.items.length==0) return false;
		for(var i=0; i<this.items.length; i++)
			this.set(this.items[i]);

	},
	autoslide: function()
	{
		
		if(this.pe)
			this.pe.stop();
		this.pe = new PeriodicalExecuter(this.autonext.bind(this),5);
		return true;			
	},
	
	autonext: function()
	{
		this.items = $$('.carouselafbeelding');
		//this.obj = obj;
		//alert(this.items.length);
		if(this.items.length==0) return false;
		for(var i=0; i<this.items.length; i++)
		{
			var obj = this.items[i];
			var afbeeldingen = obj.select('div.afbeelding');
			if(afbeeldingen.length==0) continue;
			var next = obj.select('span.next')[0].ancestors()[0];
			
			//next.obj = obj;
//			next.simulate('click');
			this.next(next);
		}
	},
	
	set: function(obj)
	{
		var afbeeldingen = obj.select('div.afbeelding');
		var next = obj.select('span.next')[0];
		var prev = obj.select('span.prev')[0];		
		if(afbeeldingen.length==0) return false;
		var dim = afbeeldingen[0].getDimensions();
		var pos = afbeeldingen[0].positionedOffset();		
//		afbeeldingen[0].setStyle({left: 0+'px'});
		for(var i=1; i<afbeeldingen.length; i++)
		{
			afbeeldingen[i].show();
			afbeeldingen[i].setStyle({left: 0+'px'});	
			afbeeldingen[i].setOpacity(0);		
	//		afbeeldingen[i].setStyle({left: -dim.width+'px'});

			

		}
		//afbeeldingen[0].show();
		next.hide();
		prev.hide();		
		if(afbeeldingen.length>1)
		{		


			//next.obj = obj;
			//prev.obj = obj;
			//next.observe('click',this.triggernext.bind(this));
			//prev.observe('click',this.triggerprev.bind(this));			
			//next.show();
			//prev.show();	
//			obj.pe = new PeriodicalExecuter(this.autonext,10);

			this.autoslide();			
			//obj.writeAttribute('running',false);
		}
	},
	triggernext: function(event)
	{
		var element = Event.findElement(event, 'span').ancestors()[0];
		this.next(element);
	},
	triggerprev: function(event)
	{
		var element = Event.findElement(event, 'span').ancestors()[0];
		this.prev(element);
	},	
	
	next: function(element)
	{	

		
			
			var afbeeldingen = element.select('div.afbeelding');
			var current = null;
			var next = null;
			for(var i=0; i<afbeeldingen.length; i++)
			{
				//alert(afbeeldingen[i].getStyle('left'));
				if(afbeeldingen[i].visible())
				{
					//alert(i+ ' ' +afbeeldingen[i].getStyle('left'));
					current = i;
					next = i+1;				
					if(next>=afbeeldingen.length)
						next = 0;		
				}
				else
				{
					afbeeldingen[i].setStyle({'zIndex' : -100});					
					afbeeldingen[i].hide();
				}				
			}
			if(current==null || next==null) return;		
			afbeeldingen[current].setStyle({'zIndex' : 10});	
			afbeeldingen[next].setStyle({'zIndex' : 9});				
			this.moveleft(afbeeldingen[current],afbeeldingen[next]);
	},
	

	
	prev: function(element)
	{
			var afbeeldingen = element.select('div.afbeelding');
			var current = null;
			var prev = null;		
			for(var i=0; i<afbeeldingen.length; i++)
			{
				//alert(afbeeldingen[i].getStyle('left'));
				if(afbeeldingen[i].visible())
				{
					current = i;
					prev = i-1;				
					if(prev<0)
						prev = afbeeldingen.length-1;
														
				}
				else
				{
					afbeeldingen[i].setStyle({'zIndex' : -100});
					afbeeldingen[i].hide();
				}
			}
			if(current==null || prev==null) return;
			afbeeldingen[current].setStyle({'zIndex' : 10});	
			afbeeldingen[prev].setStyle({'zIndex' : 9});				
			this.moveright(afbeeldingen[current],afbeeldingen[prev]);

	},
	
	moveright: function(current,obj)
	{
		if(this.pe)
			this.pe.stop();		
		var dim = $(obj).getDimensions();
		/*var pos = $(obj).positionedOffset();		
		$('log').update(
			'pos : ' + pos.left + ' ' + pos.top + '<br>' +
			'dim : ' + dim.width + ' ' + dim.height + '<br>'
			);*/
		//$(obj).setStyle({left: -dim.width+'px'});
		//$(obj).show();
/*new Effect.Parallel([
		
		new Effect.Move(current, {  sync: true,x: dim.width, mode: 'absolute', transition: Effect.Transitions.linear}),
		new Effect.Move(obj, {  sync: true,x: 0, mode: 'absolute', transition: Effect.Transitions.linear })

		],
		{afterFinish: this.autoslide.bind(this), queue: 'end' }*/
		
	new Effect.Parallel([
		
		
		new Effect.Fade(current, {  sync: true, transition: Effect.Transitions.linear}),
		new Effect.Appear(obj, {  sync: true, transition: Effect.Transitions.linear})

		],
		{afterFinish: this.autoslide.bind(this), queue: 'end' }		
		
);					
		
	},
	
	moveleft: function(current,obj)
	{
		if(this.pe)
			this.pe.stop();
		var dim = $(obj).getDimensions();
		/*var pos = $(obj).positionedOffset();		
		$('log').update(
			'pos : ' + pos.left + ' ' + pos.top + '<br>' +
			'dim : ' + dim.width + ' ' + dim.height + '<br>'
			);*/
		//$(obj).setStyle({left: dim.width+'px'});
		//$(obj).show();
/*new Effect.Parallel([
		
		new Effect.Move(current, {  sync: true,x: -dim.width, mode: 'absolute', transition: Effect.Transitions.linear}),
		new Effect.Move(obj, {  sync: true,x: 0, mode: 'absolute', transition: Effect.Transitions.linear })

		],
		{afterFinish: this.autoslide.bind(this), queue: 'end' }*/

new Effect.Parallel([
		
		new Effect.Fade(current, {  sync: true, transition: Effect.Transitions.linear}),
		new Effect.Appear(obj, {  sync: true, transition: Effect.Transitions.linear})

		],
		{afterFinish: this.autoslide.bind(this), queue: 'end' }		
);					
		
	}	
};

//var oCarouselpageafbeelding = new CCarouselpageafbeelding();
//oCarouselpageafbeelding.set('carouselpageafbeelding');