var bar_length = 100; 
var bar_height = 10; 
var bar_color = "green"; 
var bar_background = "white"; 
var bar_border = "blue";  
var window_background = "black";
var window_border = "white"; 
var text_color = "yelow"; 
var display_close_button = 0; 
var wait = 5000; 

var more = 0; 
var doneyet = 0;  


function setup_bar()
{
	window_width = bar_length + 50;
	window_height = bar_height + 50;
	
	if (document.all) // if IE
	{
		bar_height2 = bar_height - 2; 
		bar_width2 = bar_length + 3;
	}
	else
	{
		bar_height2 = bar_height;
		bar_width2 = bar_length + 1;
	}
	
	document.write('<div id="bar_window" style="position: absolute;'
		+ 'top: ' + ((140 - window_height)/2) + 'px'
		+ ';left: ' + ((1024 - window_width)/2) + 'px'
		+ ';background-color: ' + window_background
		+ ';border: 2px solid ' + window_border
		+ ';width: ' + window_width + 'px'
		+ ';height: ' + window_height + 'px'
		+ ';color: ' + text_color
		+ ';" onClick="close_bar()">');

	if (display_close_button)
	{
		document.write('<div style="position=absolute;'
			+ 'top: 0' + 'px'
			+ ';left: 0' + 'px'
			+ ';width: ' + (window_width - 3) + 'px'
			+ ';background-color: ' + window_background
			+ ';color: ' + text_color
			+ ';text-align: right'
			+ ';">');
		document.write('[X]</div>');
	}
	

	document.write('<div id="empty_bar" style="position: absolute;'
		+ 'top: ' + 25 + 'px'
		+ ';left: ' + 25 + 'px'
		+ ';border: 1px solid ' + bar_border
		+ ';background-color: ' + bar_background
		+ ';width: ' + bar_width2 + 'px'
		+ ';height: ' + bar_height + 'px'
		+ ';">');
	document.write('</div>');
	
	document.write('<div id="bar" style="position: absolute;'
		+ 'top: ' + 26 + 'px'
		+ ';left: ' + 26 + 'px'
		+ ';background-color: ' + bar_color
		+ ';width: ' + 0 + 'px'
		+ ';height: ' + bar_height2 + 'px'
		+ ';">');
	document.write('</div>'); 

	document.write('<div id="percent" style="position: absolute;'
		+ 'top: ' + 25 + 'px'
		+ ';width: ' + window_width + 'px'
		+ ';text-align: center'
		+ ';vertical-align: middle'
		+ ';color: ' + text_color
		+ ';font-size: ' + bar_height + 'px'
		+ ';">');
	document.write('0%'); 
	document.write('</div>');  

	document.write('</div>'); 
		
} 

function progress_bar()
{

var image_count = document.getElementsByTagName("img").length;

var image_array = document.getElementsByTagName("img");

var bar_part = Math.round(bar_length / image_count);

var bar_perc = Math.round(100 / image_count);
	
	var new_width = 0; 
	var j = 0;
	var percent = 0; 
	
	for (var i = 0; i < image_count; i++)
	{

		if (image_array[i].complete)
		{
			percent = percent + bar_perc;
			new_width = new_width + bar_part;
			j++;
		}
	}
	
	 if (new_width <= parseFloat(document.getElementById('bar').style.width)
		&& new_width < (j*bar_part + bar_part))
	{
		more = more + .50;
		new_width = new_width + Math.round(more);	 
		percent = percent + Math.round(more);
	}
	else
		more = 0;  
	
	document.getElementById('percent').innerHTML = percent + '%';

	document.getElementById('bar').style.width = new_width + 'px';
	
	if (percent >= 99)
		doneyet = 1;

	if (j < image_count || j == 0 || doneyet == 0)
		setTimeout('progress_bar();', 500); 
	else 
		setTimeout('close_bar();', 500); 
} 


function close_bar()
{
	document.getElementById('bar_window').style.visibility = 'hidden';
} 



if(document.readyState)	
{
	document.onreadystatechange=checkstate;
}
else if (document.addEventListener) 
{
	document.addEventListener("DOMContentLoaded", saydone, false);
}

	
function checkstate()
{

	if (document.readyState=="complete" ||
		document.readyState=="complete")
		doneyet = 1;

}

function saydone()
{
	doneyet = 1;
} 

setTimeout('saydone();', wait);

setup_bar();
progress_bar(); 

function ShowPopup(hoveritem)
{
	hp = document.getElementById("hoverpopup");
	
	hp.style.top = hoveritem.offsetTop + 18;
	hp.style.left = hoveritem.offsetLeft + 20;
 
	hp.style.visibility = "Visible";
}
 
function HidePopup()
{
	hp = document.getElementById("hoverpopup");
	hp.style.visibility = "Hidden";	
}