if(typeof Prototype == 'undefined' || !Prototype.Version.match("1.6"))
  throw("Prototype-UI library require Prototype library >= 1.6.0");

if (Prototype.Browser.WebKit) {
  Prototype.Browser.WebKitVersion = parseFloat(navigator.userAgent.match(/AppleWebKit\/([\d\.\+]*)/)[1]);
  Prototype.Browser.Safari2 = (Prototype.Browser.WebKitVersion < 420);
}

if (Prototype.Browser.IE) {
  Prototype.Browser.IEVersion = parseFloat(navigator.appVersion.split(';')[1].strip().split(' ')[1]);
  Prototype.Browser.IE6 =  Prototype.Browser.IEVersion == 6;
  Prototype.Browser.IE7 =  Prototype.Browser.IEVersion == 7;
}

BackgroundSlider = Class.create({
  initialize: function(element, options) {
    this.container = $(element);
    this.slider = this.container.select('.background_slider_images').first();
    this.currentImage = this.container.select('.current_img').first();
    this.targetImage = this.container.select('.target_img').first();
    this.imagePreloader = new Image();
    this.imagePreloader.onload = this.imageLoaded.bindAsEventListener(this);
    //Event.observe(this.imagePreloader, "load", this.imageLoaded.bindAsEventListener(this));
  },
  scrollToImage: function(src) {
    new Effect.Morph(this.slider, {style: "opacity:0.5", duration: 0.2});
    this.imagePreloader.src = src;
  },
  imageLoaded: function(event) {
    this.targetImage.src = this.imagePreloader.src;
    var that = this;
    new Effect.MoveBy(this.slider, 570, 0, {duration: 1.0, afterFinish: function() { that.scrollFinished() }});
    new Effect.Morph(this.slider, {style: "opacity:1.0", duration: 0.2});
  },
  scrollFinished: function() {
    this.currentImage.src = this.targetImage.src;
    this.slider.setStyle({top: -570+'px'});
  }
});