// SLIDESHOW for Typolight by darki777 (sebastian_marek@gmx.net / info@pixelmount.com)
// When you like to use it, then set the css class "slideshow" in your TL Gallery

window.addEvent('domready',function(){
	
	$$('.slideshow').each(function(el,cnt){
		var container = new Element('div',{ 'class': 'slideshowPicture' }).injectTop(el);
		var pics = el.getElements('.image_container img');
		var picsCounter = 1;
		var pics_max = pics.length-1;
		var pics_slideshow_interval = 5000;
		var pics_fx_duration = 750;
		
		pics[0].clone().injectInside(container).setStyles({ 'position': 'absolute' });		// Init First Picture into the Slideshow as Default
		
		// Slideshow Functionality/Interval
		(function(){
			
			var oldPic = el.getElement('.slideshowPicture img');
			var oldPicFX = new Fx.Style(oldPic,"opacity",{ 
				duration:pics_fx_duration,
				onComplete: function(){
					oldPic.remove();		
				} 
			});
			oldPicFX.start(1,0);
			
			var newPic = pics[picsCounter].clone().injectInside(container);
			var newPicFX = new Fx.Style(newPic,"opacity",{
				duration:pics_fx_duration,
				onComplete: function(){
					// any action..., after the new picture is loaded	
				}	
			});
			newPic.setStyles({ 'opacity': 0, 'position': 'absolute' });
			newPicFX.start(0,1);
			
			if(picsCounter >= pics_max) {
				picsCounter = 0;
			} else {
				picsCounter++;
			}
			
		}).periodical(pics_slideshow_interval);
	});
	
});