SlideShow = Class.create();
SlideShow.prototype = {
  initialize: function(id, options) {
    this.container = $(id);
    this.current = 1;
    this.options = Object.extend({speed:3}, options)

    this.images = new Array();
    $A(arguments).slice(2,arguments.length).each(function(image) {
      this.images.push({path: image, loaded:false});
    }.bind(this));

    this.content1 = this.container.down();

    // Create a second container
    this.content2 = $(document.createElement("div"));
    this.content2.className = this.content1.className;
    this.content2.style.display = "none";
    this.container.appendChild(this.content2)

    this.currentContent = this.content1;

    setTimeout(this._preloadImages.bind(this), 10);
    setInterval(this._changeImage.bind(this), this.options.speed * 1000);
  },

  _preloadImages: function() {
    this.images.each(function(item) {
      var image = new Image();
      image.onload = function() {
        item.loaded = true;
      }
      image.src= item.path;
    }.bind(this));
  },

  _changeImage: function() {
    var image =  this.images[this.current];
    if (image.loaded) {
      var content = this._otherContent();
      content.hide()
      content.update("<img src='" + image.path + "'/>");
      new Effect.Fade(this.currentContent);
      new Effect.Appear(content);

      this._swapCurrent();
      this.current = (this.current + 1) % this.images.length
    }
  },

  _otherContent: function() {
    return this.currentContent == this.content1 ? this.content2 : this.content1;
  },

  _swapCurrent: function() {
    this.currentContent = this.currentContent == this.content1 ? this.content2 : this.content1;
  }
}

Event.observe(window, "load", function() {new SlideShow("panorama", {speed: 3},
                                                        "img/educatop/panorama/panorama-1.jpg",
                                                        "img/educatop/panorama/panorama-2.jpg",
                                                        "img/educatop/panorama/panorama-3.jpg",
                                                        "img/educatop/panorama/panorama-4.jpg")});