Slideshow = Class.create();
Object.extend(Slideshow.prototype, {
  
  initialize: function(container_id,options){
    this.options = Object.extend({
      fadeDuration: 0.5,
      interval: 3
    }, arguments[1] || {});
    this.container_id = container_id;
    this.container_div = $(this.container_id);
    this.at = 1;
    this.initItems();
    this.cloneFirst();
    this.initItems();
    this.hideItems();
    this.interval = window.setInterval( function(){this.next()}.bind(this), (this.options.interval*1000));
  },
  
  initItems: function(){
    Element.cleanWhitespace(this.container_div);
    this.items = $A(this.container_div.childNodes);
  },
  
  // Copy the first item to the end of the list so it can be faded in over the previous items
  cloneFirst: function(){
    this.container_div.appendChild(this.items.first().cloneNode(true));
  },
  
  // Hide all but the first item
  hideItems: function(){
    for(i=1;i<this.items.length;i++){
      $(this.items[i]).hide();
    }
  },
  
  next: function(){
    new Effect.Appear(this.items[this.at], 
      {
        duration: this.options.fadeDuration,
        afterFinish: function(){
          this.at ++;
          if(this.at == this.items.length){
            this.at = 1;
            this.hideItems();
          }
        }.bind(this)
      }
      );
  }

});
