﻿
var DsSlideshow = new Class ({
	options: {
		direction: 'RTL',
		changeDirection: false,
		slideElement: false,
		slideContainer: false,
		slideWidth: 0,
		slideHeight: 0,
		moveDuration: 1000,
		waitDuration: 2000,
		moveState: false,
		theEffect: null,
		reteater: null
	},
	
	initialize: function(options){
		this.setOptions(options);
		this.options.theEffect = new Fx.Style( 	this.options.slideElement, 
												'margin-left',{	duration: this.options.moveDuration, 
																transition: Fx.Transitions.Quad.easeInOut,
																onComplete: this.repeat.bind(this)
												})
												// How many LIs are present?
												var lis = $(this.options.slideElement).getElements('li');

												// Create the right size for the slideContainer and the UL.
												var theLi = $(this.options.slideElement).getFirst();
												var dimensions = theLi.getFirst().getSize();
												this.options.slideWidth = dimensions.size.x;
												this.options.slideHeight = dimensions.size.y;
												$(this.options.slideContainer).setStyle('width', '960px');
												$(this.options.slideContainer).setStyle('height', this.options.slideHeight);
												$(this.options.slideElement).setStyle('width', this.options.slideWidth * lis.length);

												// depending on the direction, shift the left margin. And put the last li in front
												if (this.options.direction == 'LTR') {
												    this.options.theEffect.set(-dimensions.size.x);
												    var leftOne = $(this.options.slideElement).getFirst();
												    leftOne.injectAfter($(this.options.slideElement).getLast());
												}

												// Add an onclick handler to the buttons.
//												$('toleft').addEvent('click', this.setLTR.bindWithEvent(this));
//												$('toright').addEvent('click', this.setRTL.bindWithEvent(this));

												this.options.repeater = this.animate.delay(this.options.waitDuration, this);
								},

								animate: function () {
								    if (this.options.moveState) {
								        return;
								    }
								    this.options.moveState = true;
								    if (this.options.changeDirection) {
								        this.options.direction = (this.options.direction == 'LTR') ? 'RTL' : 'LTR';
								        this.rearrange();
								        this.options.changeDirection = false;
								    }
								    if (this.options.direction == 'LTR') {
								        this.options.theEffect.start(-this.options.slideWidth, 0);
								    } else {
								        this.options.theEffect.start(0, -this.options.slideWidth);
								    }
								},

								setLTR: function () {
								    if (this.options.direction != 'LTR') {
								        this.options.changeDirection = true;
								    }
								    if (!this.options.moveState) {
								        this.options.repeatEffect = false;
								        this.animate();
								    }
								},
								setRTL: function () {
								    if (this.options.direction != 'RTL') {
								        this.options.changeDirection = true;
								    }
								    if (!this.options.moveState) {
								        this.options.repeatEffect = false;
								        this.animate();
								    }
								},

								repeat: function () {
								    this.rearrange();
								    this.options.moveState = false;
								    $clear(this.options.repeater);
								    this.options.repeater = this.animate.delay(this.options.waitDuration, this);


								},

								rearrange: function () {
								    if (this.options.direction == 'LTR') {
								        this.options.theEffect.set(-this.options.slideWidth);
								        var rightOne = $(this.options.slideElement).getLast();
								        rightOne.injectBefore($(this.options.slideElement).getFirst());
								    } else {
								        this.options.theEffect.set(0);
								        var leftOne = $(this.options.slideElement).getFirst();
								        leftOne.injectAfter($(this.options.slideElement).getLast());
								    }
								}

				});


                
				DsSlideshow.implement(new Options, new Events);


				window.addEvent('domready', function () {
				    new DsSlideshow({
				        direction: 'RTL',
				        slideElement: 'referentieslideshow',
				        slideContainer: 'referenties',
				        moveDuration: 1000,
				        waitDuration: 4000
				    })
				});

