ImagesSlider = Class.create({
  initialize: function(options) {
    this.options = {
      initialIndex:       0,                                // The initial image to show.
      classes:            ['mountain', 'winter', 'plant'],  // The array containing the images clases.
      delayDuration:      9,                                // The time between to show one image to another one. [s]
      transitionDuration: 1.6,                              // The time effect opacity duration. [s]
      activeClassName:    'active',                         // The class named added to the image container.
      imageContainer:     '.footer-background'              // The css selector to the image container.
    };
    Object.extend(this.options, options || {});
    this.activeContainer = this.options.imageContainer + '.' + this.options.activeClassName;
    if (!!$$(".csstransitions")[0]) {
      this.slideImages(this.options.initialIndex, this.options.classes);
    } else {
      this.slideImagesWithTransition(this.options.initialIndex, this.options.classes);
    }
  },
  slideImages: function(index) {
    var active = $$(this.activeContainer);
    $(active[0]).removeClassName(this.options.activeClassName);
    $($$(this.options.imageContainer + '.' + this.options.classes[index])[0]).addClassName(this.options.activeClassName);
    this.slideImages.bind(this).delay(this.options.delayDuration, (index+1) % this.options.classes.length);
  },
  slideImagesWithTransition: function(index) {
    var active = $$(this.activeContainer);
    var elementToActive = $$(this.options.imageContainer + '.' + this.options.classes[index]);
    new Effect.Opacity(active[0], { from: 1.0, to: 0.0, duration: this.options.transitionDuration, afterFinish: function() {
      $(active[0]).removeClassName(this.options.activeClassName);
    }.bind(this) });
    new Effect.Opacity(elementToActive[0], { from: 0.0, to: 1.0, duration: this.options.transitionDuration, afterFinish: function() {
      $(elementToActive[0]).addClassName(this.options.activeClassName);
    }.bind(this) });
    this.slideImagesWithTransition.bind(this).delay(this.options.delayDuration, (index+1) % this.options.classes.length);
  }
})