window.addEvent('domready', function(){
//	$$('.slideshow_car_element').addEvent('click', function() {
//		var position = $$('.slideshow_car_element')[0].get('sspos');
//		var href = $(this).get('href').replace('[[SSPOS]]', position);
//		window.location.href = href;
//	});
	
	var slideshow = new Slideshow({
		element: $$('.slide_detail').shift()
	});

	slideshow.gotoImage($$('.slide_detail').shift().get("rel"));
	
//	$$('.slide_detail').addEvent('click', function() {
//		slideshow.gotoNext();
//	});
});



// <?if($i==$current){?>slideshow_car_element_cursor<?}?>

var Slideshow = new Class({
	
	Implements: Options,
	
	options: {
		element: null
	},
	
	slideItMoo: null,
	
//	selected: null,
	
	initialize: function(options) {
		this.setOptions(options);
		
		// Verre van mooi maar wel pragmatisch
		this.slideItMoo = new SlideItMoo({
			overallContainer: 'slideshow_car',
			elementScrolled: 'slideshow_car_inner',
			thumbsContainer: 'slideshow_car_thumbs',
			elemsSlide: 1,
			itemsVisible: 5,
			duration: 400,
			itemsSelector: '.slideshow_car_element',
			showControls: 1,
			setContainerSizes: false
		});
		
//		$$('.slideshow_car_element').each(function(el) {
//			el.addEvent('click', function(event) {
//				this.gotoImage(el.get('order'));
//			}.bind(this));
//		}.bind(this));
	},

	gotoNext: function() {
		this.gotoImage(this.selected+1);
	},
	
	gotoImage: function(order) {
		var nElements = this.slideItMoo.totalElements;
		order = (order.toInt() + nElements) % nElements;
		
		if (this.selected == order) {
			return;
		}
		this.selected = order;
		
//		var el = this.options.element;
//		el.getElements('.slidenr').set('html', order.toInt()+1);		
//		el.getElements('.slide_detail_img').setStyle('visibility', 'hidden');
//		el.getElements('.slide_title').set('html', '');
//		el.getElements('.slide_description').set('html', 'Laden..');
		
		$$('#slideshow_car .slideshow_car_element').removeClass('slideshow_car_element_cursor');
		$$('#slideshow_car .slideshow_car_element[order='+order+']').addClass('slideshow_car_element_cursor');
		
		var turningPoint = Math.floor(nElements/2) - 1;
		this.slideItMoo.slide((order - 2 - this.slideItMoo.currentElement + nElements + turningPoint) % nElements - turningPoint);
		
//		var article_id = el.get('article_id');
//		new Request.JSON({
//			url: 'slideshow/getitem',
//			onSuccess: function(json) {
//				el.getElements('.slidenr').set('html', json.order.toInt()+1);
//				el.getElements('.slide_detail_img').set('src', json.imagepath).setStyle('visibility', 'visible');
//				el.getElements('.slide_title').set('html', json.title);
//				el.getElements('.slide_description').set('html', json.description);
//			}.bind(this)
//		}).get({ 'article_id': article_id, 'order': order });
	}
	
});
