/*
Building a Better Busy Box (Processing… Please Wait)
http://blogs.crsw.com/mark/archive/2004/11/15/582.aspx
Mark Wagner
Castle Rock Software, LLC
http://blogs.crsw.com/mark 
*/

function BusyBox(id, varName, imageCount, imageNamePrefix, imageNameSuffix, imageDelay, width, height, displayString,url)
{
   // Initialize object
   this.id = id;
   this.ImageCount = imageCount;
   this.CurrentImageIndex = 0;
   this.ImageWidth = 0;
   this.ImageHeight = 0;
   this.ImageNamePrefix = imageNamePrefix;
   this.ImageNameSuffix = imageNameSuffix;
   this.ImageDelay = imageDelay;
   this.displayString = displayString;
   this.DivID = "BusyBoxDiv";
   this.ImgID = "BusyBoxImg";
   this.Enabled = true;
   this.Width = width;
   this.Height = height;
   // Retain the name of the instantiated object variable so that we can animate 
   // using the setTimeout statement
   this.VarName = varName;
   
   // Allows us to stop the animation with clearTimeout(), should we ever want to
   this.timeout_id = null;
   
   // Cache (pre-load) images
  this.CacheImages();
   
   // Url to the page containing the busy box.
  this.BusyBoxUrl = url;
   
   // Get reference to the IFrame object
   this.IFrame = document.getElementById(this.id);
   
   // Hide the busy box
   this.Hide();
   
   if( this.BusyBoxUrl )
      // Load the busy box contents using a custom layout page.
      this.LoadUrl(this.BusyBoxUrl);
   else
      // Load the busy box contents using the internally defined layout.
      this.RenderContent();
   
   // If this browser does not support IFRAME tags then disable this control.  The
   // next version will implement the use of a DIV instead of the IFRAME tag; 
   // even though there are a couple minor issues with using DIV tags.
   if( !frames[this.id] )
      this.Enabled = false;
}

BusyBox.prototype.GetIFrameDocument = function()
{
   var doc;
   
   if( this.IFrame.contentDocument )
      // For NS6
      doc = this.IFrame.contentDocument; 
   else if( this.IFrame.contentWindow ) 
      // For IE5.5 and IE6
      doc = this.IFrame.contentWindow.document;
   else if( this.IFrame.document )
      // For IE5
      doc = this.IFrame.document;
   else
// TODO: Confirm this should be the default
      doc = this.IFrame.document;
   
   return doc;
}

BusyBox.prototype.LoadUrl = function(url)
{
   // Get a reference to the document object in the IFrame
   var IFrameDoc = this.GetIFrameDocument();
   
   // Load the url using the replace method.  This will prevent the browsers 
   // history object from being updated with the new busybox url; thus allowing 
   // the back button to function as desired for the user.
   IFrameDoc.location.replace(url);
}

BusyBox.prototype.RenderContent = function()
{
   // Get the IFrame document object
   var doc = this.GetIFrameDocument();

	// Force stylesheet (also clears the contents)
	doc.open();
	doc.writeln("");
	doc.close();

	var body = doc.getElementsByTagName("body");
	if (!body) {
		// Body didn't exist. Create it
	   var body = doc.createElement("body");
	   doc.documentElement.appendChild(body);
	} else {
		body = body[0];
	}
   body.ondragstart = "return false;";
   body.style.margin = "0";
   body.style.backgroundColor = "#fff";

   var div = doc.createElement("div");
   div.id = this.DivID;
   div.align = "center";
   div.style.border = "navy 3px solid";
   div.style.position = "absolute";
   div.style.width = this.Width + "px";
   div.style.height = this.Height + "px";
   body.appendChild(div);

   var img = doc.createElement("img");
   img.id = this.ImgID;
   div.appendChild(img);

   var br = doc.createElement("br");
   div.appendChild(br);
   
   var p = doc.createElement("p");
   p.style.color = "#0c2c84";
   p.style.display = "block";
   p.style.fontFamily = "Arial,Verdana,Helvetica,sans-serif";
   p.style.fontSize = "12px";
   p.style.textSize = "12px";
   p.style.fontWeight = "bold";
   p.style.marginBottom = "0.8em";
   p.style.marginTop = "0";
   p.style.textAlign = "center";
   p.style.padding = "5px";
   p.innerHTML = this.displayString;
   div.appendChild(p);
}

BusyBox.prototype.Resize = function()
{
   	 // Resize the busy box IFrame.
     // Set the width by looking at its contents
     var div = frames[this.id].document.getElementById(this.DivID);
     this.IFrame.style.width = div.offsetWidth + "px";
     this.IFrame.style.height = div.offsetHeight + "px";
}
	
BusyBox.prototype.Center = function()
{
   if( !this.IFrame )
      return;
   
   // Center the BusyBox in the window regardless of the scroll positions
   /*var objLeft = (document.body.clientWidth - this.IFrame.offsetWidth) / 2;
   var objTop = (document.body.clientHeight - this.IFrame.offsetHeight) / 2;
   objLeft = objLeft + document.body.scrollLeft;
   //objTop = objTop + document.body.scrollTop;
   objTop = 300;*/
   var objLeft = 350;
   var objTop = 350;
   
   
   // Position object
   this.IFrame.style.position = "absolute";
   this.IFrame.style.top = objTop + "px";
   this.IFrame.style.left = objLeft + "px";
}

BusyBox.prototype.CacheImages = function()
{
   // Instantiate the array to store the image references
   this.Images = new Array(this.ImageCount);
   
   // Load all the images to cache into the aniframes array
   for(var i = 0; i < this.ImageCount; i++)
   {
      this.Images[i] = new Image();
      this.Images[i].src = "/cms/sites/images/busybox/" + this.ImageNamePrefix + i + this.ImageNameSuffix;
   }
}

BusyBox.prototype.IsAnimating = function()
{
   if( this.timeout_id == null)
      return false;
   else
      return true;
}

BusyBox.prototype.IsVisible = function()
{
   var ifrm = document.getElementById(this.id);
   
   if( ifrm.style.visibility == "visible" && ifrm.style.width > 0 )
      return true;
   else
      return false;
}

BusyBox.prototype.Animate = function()
{
   // Assign the current image sequence to display
   if( frames[this.id] )
      // browser supports frames
      frames[this.id].document.getElementById(this.ImgID).src = this.Images[this.CurrentImageIndex].src;
   else
      // browser does not support frames
      document.getElementById(this.ImgID).src = this.Images[this.CurrentImageIndex].src;
   
   // Auto re-center and re-size the busy box.  This will force the busy box to 
   // always appear in the center of the window even if the user scrolls.
   this.Resize();
   this.Center();
   
   pause(250);

   if (this.CurrentImageIndex > 0){
	   // Increment the current image index
	   this.CurrentImageIndex = (this.CurrentImageIndex + 1)%this.ImageCount;
		  // Display the next image in (imageDelay value) milliseconds (i.e. 125)
	   this.timeout_id = setTimeout(this.VarName + ".Animate();", this.ImageDelay);
   }
}

BusyBox.prototype.StartAnimate = function()
{
   if( this.IsAnimating() )
      return;
   
   this.Animate();
}

BusyBox.prototype.StopAnimate = function()
{
   clearTimeout(this.timeout_id);
   this.timeout_id = null;
}

BusyBox.prototype.Hide = function()
{   
//   this.StopAnimate();
   
   // Hide the busy box.
   this.IFrame.style.visibility = "hidden";
   this.IFrame.style.width = 0;
   this.IFrame.style.height = 0;
}

BusyBox.prototype.Show = function()
{
   if( !this.Enabled )
      return;

   if( this.IsAnimating() || this.IsVisible() )
      return;   

   this.Resize();
   this.Center();
   
   // Set the busy box to be visible and make sure it is on top of all other controls.	
   this.IFrame.style.visibility = "visible";
   this.IFrame.style.zIndex = "999999";
   this.IFrame.style.width = this.Width + "px";
   this.IFrame.style.height = this.Height + "px";
   
   // Start the animation
   this.StartAnimate();
}



function pause(numberMillis) {
	var now = new Date();
	var exitTime = now.getTime() + numberMillis;
	while (true) {
		now = new Date();
		if (now.getTime() > exitTime)
			return;
	}
}
