var carusel = new Class({
	options: {
		btPrev: 'a.prev',
		btNext: 'a.next',
		holder: '.gallery-slide-inner',
		mover: '.slides',
		scrollEl: 'li',
		duration : 2000,
		autoSlide:false,
		btndisableclass:'disabled',
		effect: Fx.Transitions.Expo.easeOut
	},

	// create class
	initialize: function(element, options){
	    this.setOptions(options);
		var _this = this;

		if (this.options.btNext)
				this.next = element.getElement(this.options.btNext);
			else this.next = false;
		if (this.options.btPrev)
				this.prev = element.getElement(this.options.btPrev);
			else this.prev = false;
		if (this.options.tabLinks)
				this.links = element.getElements(this.options.tabLinks);
			else this.links = false;

		this.disableClass = this.options.btndisableclass;
		this.holder = element.getElement(this.options.holder);
		this.mover = this.holder.getElements(this.options.mover)[0];
		this.scrollEl = this.holder.getElements(this.options.scrollEl);
		this.size = this.scrollEl[0].getSize();
		this.step = this.size.x;

		this.animated = false;
		this.duration = this.options.duration;
		this.maxMargin = this.scrollEl.length * this.scrollEl[0].getSize().x - (parseInt(this.holder.getSize().x/this.step))*this.step;
		this.length = Math.floor(this.maxMargin/this.step)+1;
		this.current = 0;
		this.margin = 0;
		this.timer = false;
		
		if (this.disableClass) {
			if (this.current == this.length) $(this.next.parentNode).addClass(this.disableClass);
			if (this.current == 0) $(this.prev.parentNode).addClass(this.disableClass);
		}

		this.mover.fx = new Fx.Tween(this.mover, {
			duration:_this.duration,
			transition: _this.options.effect,
			onStart: function(){
				_this.animated = true;
			},
			onComplete: function(){
				_this.animated = false;
			}
		});

		if (this.options.autoSlide) {
			this.autoSliding();
		}

		if (this.maxMargin%this.step == 0) this.length -= 1;

		this.mover.addEvent('mouseover', function(){
			if (_this.timer) clearInterval(_this.timer);
			return false;
		}).addEvent('mouseout', function(){

			//_this.autoSliding();
			return false;
		});

		if (this.next) {
			this.next.addEvent('click', function(){
				if (!_this.animated) {
					_this.nextSlide();
				}
				return false;
			});
		}
		if (this.prev) {
			this.prev.addEvent('click', function(){
				if (!_this.animated) {
					_this.prevSlide();
				}
				return false;
			});
		}
	},
	nextSlide: function(){
		if (this.current < this.length) {
			this.current += 1;
			this.margin = this.step*this.current;
			if (this.current >= this.length) this.margin = this.maxMargin;
			this.mover.fx.start('marginLeft', -(this.margin));
		}
		if (this.current > this.length) {
			this.current = 0;
			if (this.disableClass) {
				$(this.prev.parentNode).addClass(this.disableClass);
				$(this.next.parentNode).removeClass(this.disableClass);
			}
		}else{
			if (this.disableClass) {
				$(this.prev.parentNode).removeClass(this.disableClass);
			}
		};
		if (this.current == 0) {
			$(this.next.parentNode).removeClass(this.disableClass);
			$(this.prev.parentNode).addClass(this.disableClass);
		}
		if (this.current == this.length) {
			$(this.prev.parentNode).removeClass(this.disableClass);
			$(this.next.parentNode).addClass(this.disableClass);
		}
	},
	prevSlide: function(){
		if (this.current > 0) {
			this.current -= 1;
			this.margin = this.step*this.current;
			if (this.current >= this.length) this.margin = this.maxMargin;
			this.mover.fx.start('marginLeft', -(this.margin));
		}
		if (this.current < 0) {
			this.current = this.length;
			if (this.disableClass) {
				$(this.next.parentNode).addClass(this.disableClass);
				$(this.prev.parentNode).removeClass(this.disableClass);
			}
		}else{
			if (this.disableClass) {
				$(this.next.parentNode).removeClass(this.disableClass);
			}
		};
		if (this.current == 0) {
			$(this.next.parentNode).removeClass(this.disableClass);
			$(this.prev.parentNode).addClass(this.disableClass);
		}
		if (this.current == this.length) {
			$(this.prev.parentNode).removeClass(this.disableClass);
			$(this.next.parentNode).addClass(this.disableClass);
		}
	},
	autoSliding : function(){
		var _this = this;
		this.timer = setInterval(function(){_this.nextSlide()}, this.options.autoSlide);
	},

	// add options and events
	Implements : [Options, Events]
});

window.addEvent('domready', function(){
	if ($('gallery1')) {
		var _carusel = new carusel($('gallery1'));
	}
  var transition = 'alternate';
  $$('input[name=transition]').addEvent('click', function(){ transition = this.value; });
  var slideAvailable = ['slide-left', 'slide-right', 'slide-top', 'slide-bottom', 'fade'];
  var slideTransition = function(){
    switch(transition){
      case 'alternate':
        if(! $defined(this.count)) this.count = -1;
        return slideAvailable[++this.count % slideAvailable.length];
      case 'random': return slideAvailable.getRandom();
      default: return transition;
    }
  }
  
  
  var slideshow = new BarackSlideshow('slideshow-menu', 'slideshow-slide', 'loading', {
	transition: 'fade',
	auto: true,
	autostart:true,
	autointerval:20000
  });
  
  // the example above is only fitting for this demo, since we let the user pick the transition and turn auto on/off
  // for most scenarios, it's only enough with: 
  // new BarackSlideshow('menu', 'pictures', 'loading', {transition: '<transition here>', auto: true});
  // transitions can be 'slide-left', 'slide-right', 'slide-top', 'slide-bottom', 'fade'
});