﻿/*
MooCarousel - a simple carousel. In MooTools.

License:
  MIT-style license.

Credits:
  posttoast ( <http://posttoast.nl> ) 2011-05-05
*/

var mooCarousel = new Class({

  Implements: [Options, Events],
  options: {
    slideContainer: '', // The container which contains the slideshow
    slideClass: '.slide', // The class for the elements that will function as slides
    controlClass: '',
    timed: false, // "true" enables automatic slideshow
    interval: 1000, // Sets the automatic slideshow interval
    hoverStop: false // "true" will freeze the slideshow while hovering over it
  },

  initialize: function(options){

    this.setOptions(options);

    // Load the slides
    this.slides = this.options.slideContainer.getElements(this.options.slideClass);

    if (this.options.controlClass != ''){
      this.activateControls();
    }

    // Activate first slide
    if (this.slides.length > 1){
      this.currentSlide = 0;
      this.showSlide(this.currentSlide);
    }

    // If slideshow is supposed to play automatically, do it
    if (this.options.timed == true){
      this.start();

      if (this.options.hoverStop){
        $$(this.options.slideContainer).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 = parseInt(this.currentSlide) + 1;
      }else {
        var nextSlide = 0
      }
      this.showSlide(nextSlide);
    };
    this.timer = slideIt.periodical(this.options.interval, this);
  },

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

  activateControls: function(){
    this.options.controls = this.options.slideContainer.getElements(this.options.controlClass);
    this.options.controls[0].addClass('active');
    var counter = 0;
    this.options.controls.each(function(el){
      el.setProperty('rel', counter);
      counter++;
    });
    that = this;
    this.options.controls.addEvent('mouseenter', function(){
      that.options.controls.removeClass('active');
      that.showSlide(this.getProperty('rel'));
    });
  },

  showSlide: function(slide){
    this.currentSlide = slide;
    // console.log(slide);
    // this.slides.setStyle('display', 'none');
    this.slides.fade('out');
    // this.slides[slide].setStyle('display', 'block');
    this.slides[slide].fade('in');
    if (this.options.slideParent){
      this.slides.getParent(this.options.slideParent).removeClass('active');
      this.slides[this.currentSlide].getParent(this.options.slideParent).addClass('active');
    }

    // Set the slide counter
    if (this.options.counter){
      currentSlideCounter.set('text', slide + 1);
    }

    // Add class if first or last slide is active
    if (this.currentSlide == 0){
      this.options.slideContainer.addClass('firstSlide');
    }else {
      this.options.slideContainer.removeClass('firstSlide');
    }

    if (this.options.controlClass != ''){
      this.options.controls.removeClass('active');
      this.options.controls[slide].addClass('active');
    }

    if (this.currentSlide == this.slides.length - 1){
      this.options.slideContainer.addClass('lastSlide');
    }else {
      this.options.slideContainer.removeClass('lastSlide');
    }
  },

  showNext: function(){
    if (this.currentSlide + 1 < this.slides.length){
      var nextSlide = this.currentSlide + 1;
    }else {
      var nextSlide = 0
    }
    this.showSlide(nextSlide);
  },

  showPrevious: function(){
    if (this.currentSlide - 1 > -1){
      var previousSlide = this.currentSlide - 1;
    }else {
      var previousSlide = this.slides.length - 1;
    }
    this.showSlide(previousSlide);
  }

});
