var QuoteShow = Class.create();
  QuoteShow.prototype = {
    initialize: function(element, options) {
      this.element = $(element);
      this.options = Object.extend({className: 'quote', duration: 15}, options);
      this.quotes = document.getElementsByClassName(this.options.className, this.element);

      this.prepareQuotes();
      this.registerCallback();
    },

    prepareQuotes: function() {
      this.currentQuote = this.quotes.first();
      this.element.style.position = 'relative';
      this.element.style.height = this.quotes.max(function(quote) {
        var visible = Element.visible(quote), height;
        Element.setStyle(quote, {position: 'absolute', width: '425px', left: '0px'});
        if (!visible) Element.show(quote);
        height = Element.getHeight(quote);
        if (!visible) Element.hide(quote);
        return height;
      }).toString() + 'px';
    },

    nextQuote: function() {
      return this.quotes[(this.quotes.indexOf(this.currentQuote) + 1) % this.quotes.length];
    },

    registerCallback: function() {
      window.setTimeout(this.tick.bind(this), this.options.duration * 1000);
    },

    tick: function() {
      var currentQuote = this.currentQuote, nextQuote = this.nextQuote();

      new Effect.Parallel([
        new Effect.Fade(currentQuote, {sync: true}),
        new Effect.Appear(nextQuote, {sync: true})
      ], {
        duration: 2,
        afterFinish: (function(effect) {
          this.currentQuote = nextQuote;
          this.registerCallback();
        }).bind(this)
      })
    }
  }

  Event.observe(window, 'load', function() {
    new QuoteShow('quote-show');
  })