﻿Type.registerNamespace('FutureEggs');

FutureEggs.ImageSwap = function(element)
{
  FutureEggs.ImageSwap.initializeBase(this, [element]);
  
  this._progressElement = null;
  this._rgThumbnails = [];
  this._rgurlImages = [];
  this._imgPreload = null;
}

FutureEggs.ImageSwap.prototype = 
{
  initialize : function()
  {
    FutureEggs.ImageSwap.callBaseMethod(this, 'initialize');

    this._imgPreload = document.createElement('img');
    $addHandlers(this._imgPreload, {load: this._onImageLoad}, this);
    
    var i;
    for (i = 0; i < this._rgThumbnails.length; i++)
    {
      var elem = $get(this._rgThumbnails[i]);
      elem.urlImage = this._rgurlImages[i];
      elem.fCached = (i == 0); // only the first image is cached
      $addHandlers(elem, {mouseover: this._onThumbnailMouseover}, this);
    }
  },

  dispose : function()
  {
    $clearHandlers(this._imgPreload);
    var i;
    for (i = 0; i < this._rgThumbnails.length; i++)
    {
      $clearHandlers($get(this._rgThumbnails[i]));
    }
    FutureEggs.ImageSwap.callBaseMethod(this, 'dispose');
  },
  
  _onImageLoad : function() 
  {
    // Hide the indicator.
    this._progressElement.style.display = 'none';
    
    // Display the image.
    this.get_element().src = this._imgPreload.src;
  },

  _onThumbnailMouseover : function(e)
  {
    if (e.target.fCached)
    {
      this.get_element().src = e.target.urlImage;
    }
    else
    {
      this._progressElement.style.display = '';
      this._imgPreload.src = e.target.urlImage;
      e.target.fCached = true;
    }
  },
  
  get_rgThumbnails : function() {
      return this._rgThumbnails;
  },
  
  set_rgThumbnails : function(value)
  {
    this._rgThumbnails = value;
  },

  get_rgurlImages : function() {
      return this._rgurlImages;
  },
  
  set_rgurlImages : function(value)
  {
    this._rgurlImages = value;
  },

  get_progressElement : function() 
  {
    return this._progressElement;
  },
  
  set_progressElement : function(value) 
  {
    this._progressElement = value;
  }

}
FutureEggs.ImageSwap.registerClass('FutureEggs.ImageSwap', Sys.UI.Behavior);
