//------------------------------------------------------------------------------

var collageClass = {
	container: 'slide-img',
	b_left: 'collage_left',
	b_right: 'collage_right',
	iterator: 0,
	delay: 5,
	timer: null,

	images: [
		'slide1.jpg', 'slide2.jpg', 'slide3.jpg', 'slide4.jpg'
	],

	click: function(e){
		var offset = e.element().id == collageClass.b_left ? -1 : 1;
		collageClass.change(offset);
		if(collageClass.timer != null) clearInterval(collageClass.timer);
		collageClass.timer = setInterval(collageClass.change, collageClass.delay);
	},

	change: function(offset){
		var offset = offset || 1;
		collageClass.iterator += offset;
		if(collageClass.iterator < 0) collageClass.iterator = collageClass.images.length - 1;
		if(collageClass.iterator > collageClass.images.length - 1) collageClass.iterator = 0;

		new Effect.Opacity(collageClass.container, {
			from: 1.0,
			to: 0.0,
			duration: 0.5,
			afterFinish: function(){
				$(collageClass.container).setStyle({backgroundImage: 'url(/slide/' + collageClass.images[collageClass.iterator] + ')'});
				new Effect.Opacity(collageClass.container, {
					from: 0.0,
					to: 1.0,
					duration: 0.5
				});
			}		
		});
	},

	init: function(){
		if($(collageClass.container)){
			$A(collageClass.images).each(function(i){
				new Element('img', {src: '/slide/' + i});
			});
			$(collageClass.container).setStyle({backgroundImage: 'url(/slide/' + collageClass.images[collageClass.iterator] + ')'});
			//$(collageClass.b_left).observe('click', collageClass.click);
			//$(collageClass.b_right).observe('click', collageClass.click);
			collageClass.timer = setInterval(collageClass.change, collageClass.delay * 1000);
		}
	}
};
