var mooCarousel = new Class({

  Implements: [Options, Events],
  options: {
    slideContainer: '',
    slideClass: '.slide',
    controlContainer: '',
    dots: '',
    animation: '',
    pause: false,
    timed: false,
    interval: 1000,
    openOnControlClick: false
  },

  initialize: function(options){

    this.setOptions(options);
    // Add "on" class
    this.options.slideContainer.addClass('on');

    // Activate first slide
    this.slides = this.options.slideContainer.getElements(this.options.slideClass);
    if (this.slides.length > 1){
      this.slides[0].addClass('active');
      this.slides.setStyle('display', 'none');
      this.slides[0].setStyle('display', 'block');
      this.currentSlide = 0;
    }

    if(this.options.dots) {
        var dots = this.options.dots.getElements('li');
        var currentThis = this
        dots.each(function(item, index) {
            item.addEvent('click', function(index) {
                if(!this.hasClass('sel')) {
                    currentThis.stop();
                    currentThis.showSlide(index);
                    currentThis.start();
                }
            }.bind(item, index));
        });
    }
    

    if(this.options.animation == 'slide') {
        var currentThis = this;
        
        $('next_slide').addEvent('click', function() {
              currentThis.stop()
              if (currentThis.currentSlide + 1 < currentThis.slides.length) {
                var nextSlide = currentThis.currentSlide + 1;
              }else {
                var nextSlide = 0
              }
              currentThis.showSlide(nextSlide)
              currentThis.start()
        });
        
        $('prev_slide').addEvent('click', function() {
              currentThis.stop()
              if (currentThis.currentSlide - 1 < 0) {
                var prevSlide = currentThis.slides.length - 1
              }else {
                var prevSlide = currentThis.currentSlide - 1;
              }
              currentThis.showSlide(prevSlide, true)
              currentThis.start()
        });
    }

    if (this.options.controlContainer != ''){
      this.activateControls();
    }
    
    if (this.options.timed == true){

      var playing = true;
      if(this.options.pause) {
          var playButton = new Element('a');
          playButton.setProperties({
            'class': 'playbutton',
            'href': '#',
            'text': 'Pauzeren'
          });
          
          playButton.inject(this.options.slideContainer);

          playButton.addEvent('click', function(el){
            if (playing == true){
              playButton.setProperty('text', 'Afspelen');
              playing = false;
              this.stop();
            }else {
              playButton.setProperty('text', 'Pauzeren');
              playing = true;
              this.start();
            }
            el.stop();
          }.bind(this));
      }
      this.start();

      $$(this.options.slideClass).addEvents({
        mouseenter: function() { this.stop(); }.bind(this),
        mouseleave: function() { this.start(); }.bind(this)
      });
    }

  },

  start: function(){
    var slideIt = function(){
      if (this.currentSlide + 1 < this.slides.length){
        var nextSlide = this.currentSlide + 1;
      }else {
        var nextSlide = 0
      }
      this.showSlide(nextSlide);
    };
    this.timer = slideIt.periodical(this.options.interval, this);
  },

  stop: function(){
    $clear(this.timer);
  },

  activateControls: function(){
    // Create controls
    controlBox = new Element('div');
    controlBox.setProperty('class', 'controlbox');
    var openOnControlClick = this.options.openOnControlClick;
    this.slides.each(function(el){
      var slide = el;
      var controlButton = new Element('a');
      controlButton.setProperties({
        'class': 'controlbutton',
        'href': '#'
      });
      controlButton.addEvents({
        'mouseover': function(){
          this.slides.removeClass('active');
          this.slides.setStyle('display', 'none');
          el.addClass('active');
          el.setStyle('display', 'block');
          controlBox.getElements('.controlbutton').removeClass('active');
          this.addClass('active');
        },
        'click': function(el){
          el.stop();
          if (openOnControlClick && slide.getParent('a')){
            slide.getParent('a').fireEvent('click');
          }
        }
      });
      controlButton.inject(controlBox);
    });
    controlBox.inject(this.options.controlContainer);
    controlBox.getFirst('a.controlbutton').addClass('active');
  },

  showSlide: function(slide, reverse){
    var lastslide = this.currentSlide;
    this.currentSlide = slide;
    this.slides[this.currentSlide].addClass('active');

    if(this.options.dots) {
        var dots = this.options.dots.getElements('li');
        dots[lastslide].removeClass('sel');    
        dots[slide].addClass('sel');    
    }

    if(this.options.animation == 'slide') {
        if(reverse) {
            var width = this.slides[this.currentSlide].getStyle('width').toInt();
            this.slides[this.currentSlide].setStyle('left', 0-width);
            this.slides[lastslide].tween('left', width);
            this.slides[this.currentSlide].setStyle('display', 'block');
            this.slides[this.currentSlide].tween('left', 0);
        } else {
            var width = this.slides[this.currentSlide].getStyle('width').toInt();
            this.slides[this.currentSlide].setStyle('left', width);
            this.slides[lastslide].tween('left', 0-width);
            this.slides[this.currentSlide].setStyle('display', 'block');
            this.slides[this.currentSlide].tween('left', 0);
        }
    } else {
        this.slides[this.currentSlide].setStyle('display', 'block').fade('in');
        this.slides[lastslide].fade('out').setStyle('display', 'none');
    }
    try {
        if (controlBox) {
            controlBox.getElements('.controlbutton').removeClass('active');
            controlBox.getElements('.controlbutton')[this.currentSlide].addClass('active');
        }
    } catch(e) {}
  }

});