var Slideshow = Class.create({
  initialize: function(background, content) {
    this.background = $(background);
    this.background.setStyle({position: 'relative', overflow: 'hidden'})
    this.overlay = $('overlay');
    this.content = content.map(function(id) {return $(id);});
    this.content.each(function(el) {
      this.background.insert(el);
      el.setStyle({position: 'absolute', left: '960px'});
    }.bind(this));
    // this.current = this.content[0];
    // this.current.setStyle({left: '0px'});
  },
  start: function() {
    this.next(this.content[0]);
    setTimeout(function() {
      this.next(this.content[1]);
      setTimeout(function() {
        this.next(this.content[2]);
        // setTimeout(function() {
          // this.next(this.content[0]);
          // this.start();
        // }.bind(this), 6000);
      }.bind(this), 4000);
    }.bind(this), 3000);
  },
  next: function(next) {
    this.overlay.setStyle({zIndex: 100});
    next.setStyle({left: '960px'});
    new Fx.Style(next, 'left', {onComplete: function() {this.current = next; this.overlay.setStyle({zIndex: '20'})}.bind(this)}).custom(960, 0);
    if (this.current) new Fx.Style(this.current, 'left').custom(0, -960);
  }
});