/*
TPGpan  -  pans across designated IMG elements at specified speed

Each IMG element to be panned must have CLASS attribute of "TPGpan".  The HEIGHT attribute can be set but the Width attribute cannot be set.  To limit displayed size width, enclose the IMG in a DIV element of the appropriate size.

The ONLOAD attribute of the BODY element must contain a call to TPGinitPans(speed), where speed in the rate of pan in pixels per second.  If omitted, speed defaults to 45.

TPGinitPans sets the window.onresize event handler to a routine that will adjust the pan parameters.  It also scans the entire document for IMG elements with CLASS = "TPGpan" and creates a TPGpanImage object for each, which it stores in the array TPGpanImages.  The style elements of each such IMG element are altered so that the "left" property is explicitly set to 0, the "position property is set to "relative, and the verticalAlign property is set to "bottom".  Futhermore, the image's "onclick" event handler is set to pause/resume its pan.

It then initiates a poll of each of these images to see if its loading had been completed, recording the load status in the TPGpanLoads array.  That poll is repeated every second until all images have been loaded.  As a loaded image is found, its pan is initiated.

Clicking on a panning image pauses the pan.  Clicking again resumes the panning.

*/

var TPGpanImages = new Array();
var TPGpanLoads = new Array();

function TPGstartPan()
{
  this.panDirection = -1;
  this.panLeft = 0;
  this.panTimer = 0;
  this.panState = false;
  containerWidth = this.imageEl.parentNode.offsetWidth;
  imageWidth = this.imageEl.offsetWidth;
  this.panLow = containerWidth - imageWidth;
  if (this.panLow < 0)
  {
    this.resumePan();
  }
}

function TPGpausePan()
{
  window.clearInterval(this.panTimer);
  this.panState = false;
}

function TPGresumePan()
{
  var callBack = "TPGpanImages[" + this.localIndex + "].doPan();";
  this.panTimer = window.setInterval(callBack, Math.floor(1000.0/this.panSpeed));
  this.panState = true;
}

function TPGtogglePan()
{
  if (this.panState)
  {
    this.pausePan();
  }
  else
  {
    this.resumePan();
  }
}

function TPGdoPan()
{
  this.panLeft = this.panLeft + this.panDirection;
  this.imageEl.style.left = this.panLeft + "px";
  if ((this.panLeft >= 0) || (this.panLeft <= this.panLow))
    {
      this.panDirection = -1 * this.panDirection;
    }
}

function TPGpanImage(thisImageElement, thisIndex)
{
  this.localIndex = thisIndex;
  this.imageEl = thisImageElement;
  this.panState = false;

  this.imageEl.style.position = "relative";
  this.imageEl.style.left = "0px";
  this.imageEl.style.verticalAlign = "bottom";
  this.imageEl.onclick = new Function("TPGpanImages[" + thisIndex + "].togglePan();");
  this.imageEl.parentNode.style.overflow = "hidden";
}

function TPGsweepLoads(needsReset)
{
  if (needsReset)
  {               // if for reset, cancel load status to force new startPan
     for (var k = 0; k < TPGpanImages.length; k++)
     {
        TPGpanLoads[k] = false;
     }
  }  
  var notLoadedCount = 0;
  for (var j = 0; j < TPGpanImages.length; j++)
  {
     if (!TPGpanLoads[j])     
     {
       if (TPGpanImages[j].imageEl.complete)
        {
           if (TPGpanImages[j].panState)
           {            // if for reset, check and then clear on-going pan
              window.clearInterval(TPGpanImages[j].panTimer);
           }
           TPGpanLoads[j] = true;
           TPGpanImages[j].startPan();
        }
        else
        { 
           notLoadedCount++;
        }
     }
  }
  if (notLoadedCount > 0)
  {
     window.setTimeout("TPGsweepLoads(false)", 1000);
  }
}

function TPGresetPans()
{
   TPGsweepLoads(true);
}


function TPGinitPans(speed)
{
  if ((arguments.length > 0) && (speed > 1) && (speed < 100))
  {  TPGpanImage.prototype.panSpeed = speed; }
  else
  {  TPGpanImage.prototype.panSpeed = 45; }
  TPGpanImage.prototype.startPan = TPGstartPan;
  TPGpanImage.prototype.pausePan = TPGpausePan;
  TPGpanImage.prototype.resumePan = TPGresumePan;
  TPGpanImage.prototype.togglePan = TPGtogglePan;
  TPGpanImage.prototype.doPan = TPGdoPan;
  TPGpanImages.length = 0;
  TPGpanLoads.length = 0;
  for (var icount = 0; icount < document.images.length; icount++)
  {
     if (document.images[icount].className == "TPGpan")
     {
        var insertIndex = TPGpanImages.length;
        TPGpanImages[insertIndex] = new TPGpanImage(document.images[icount], insertIndex);
        TPGpanLoads[insertIndex] = false;
     }
  }
  window.onresize = TPGresetPans;
  TPGsweepLoads(false);
}