window.b_screenOn = false;
function createSpinner(imageURL){
	// create the layer if doesn't exist
	if (window.e_spinner == null) {
		window.e_spinner = document.createElement("div");
		window.e_spinner.innerHTML = '<div><img src="'+imageURL+'" border="0"></div>'+
									 '<div id="spinnerText">'+
									 '<font class="helpText" title="Sometimes, due to a slow Internet connection, '+
									 'a page may take longer than usual to load, causing the page loading indicator display '+
									 'to stay on the screen. This could potentially prevent the user from interacting with the page. '+
									 'Choose Skip if you would like clear the indicator.">The page is loading!</font> '+
									 '<a href="#" onclick="fadeSpinner()">Skip</a></div>';
		window.e_spinner.style.position = 'absolute';
		window.e_spinner.id = 'spinner';
		document.body.appendChild(window.e_spinner);		
	}				
}

function fadeSpinner(){
	var s = document.getElementById("spinner");
	if(s) {
		s.style.display = 'none';
		f_putScreen(false);
	}
}
function showSpinner(){
	var s = document.getElementById("spinner");
	if(s) {		
		var n_width  = 172; //172
		var n_height = 100; //100  
		
		var a_docSize = f_documentSize();		
		var screen_width = a_docSize[0];
		var n_spinner_left = (screen_width/2) - n_width/2;
		var screen_height = a_docSize[1];
		var n_spinner_top = (screen_height/2) - n_height/2;			
		window.e_spinner.style.left = n_spinner_left+'px';
		window.e_spinner.style.top = n_spinner_top+'px';
		window.e_spinner.style.width = n_width+'px';
		window.e_spinner.style.height = n_height+'px';
		window.e_spinner.style.padding = '0px';
		window.e_spinner.style.zIndex = 1002;
		s.style.display = 'block';
		f_putScreen(true);
	}
}

function f_putScreen (b_show) {	
	//alert('f_putScreen: '+b_show);
	if (b_show == null && !window.b_screenOn){	
		return;
	}

	if (b_show == false) {
		window.b_screenOn = false;
		if (window.e_screen) window.e_screen.style.display = 'none';
		
		
		// remove event
		if (document.removeEventListener) {			
			window.removeEventListener('resize', f_putScreen, false);
			window.removeEventListener('scroll', f_putScreen, false);
		}
		else if (window.detachEvent) {
			window.detachEvent('onresize', f_putScreen);
			window.detachEvent('onscroll', f_putScreen);
		}
		else {
			window.onresize = function(){};
			window.onscroll = function(){};
		}			
		window.e_screen = null;/**/
		
		return;
	}
	if (window.e_spinner == null) return;
	if (window.e_spinner.style.display=='none') return;
	
	// create the layer if doesn't exist
	if (window.e_screen == null) {		
		window.e_screen = document.createElement("div");
		window.e_screen.innerHTML = "&nbsp;";
		window.e_screen.style.position = 'absolute';
		window.e_screen.id = 'modalScreen';
		document.body.appendChild(window.e_screen);
		
		// attach event		
		if (document.addEventListener) {
			window.addEventListener('resize', f_putScreen, false);
			window.addEventListener('scroll', f_putScreen, false);
		}
		if (window.attachEvent) {
			window.attachEvent('onresize', f_putScreen);
			window.attachEvent('onscroll', f_putScreen);
		}
		else {
			window.onresize = f_putScreen;
			window.onscroll = f_putScreen;
		}
	}   

	// set properties
	var a_docSize = f_documentSize();
	window.e_screen.style.left = a_docSize[2] + 'px';
	window.e_screen.style.top = a_docSize[3] + 'px';
	window.e_screen.style.width = a_docSize[0] + 'px';
	window.e_screen.style.height = a_docSize[1] + 'px';
	window.e_screen.style.zIndex = 1001;
	window.e_screen.style.display = 'block';
	window.b_screenOn = true;
}
// returns the size of the document
function f_documentSize () {

	var n_scrollX = 0,
	n_scrollY = 0;

	if (typeof(window.pageYOffset) == 'number') {
		n_scrollX = window.pageXOffset;
		n_scrollY = window.pageYOffset;
	}
	else if (document.body && (document.body.scrollLeft || document.body.scrollTop )) {
		n_scrollX = document.body.scrollLeft;
		n_scrollY = document.body.scrollTop;
	}
	else if (document.documentElement && (document.documentElement.scrollLeft || document.documentElement.scrollTop)) {
		n_scrollX = document.documentElement.scrollLeft;
		n_scrollY = document.documentElement.scrollTop;
	}

	if (typeof(window.innerWidth) == 'number')
		return [window.innerWidth, window.innerHeight, n_scrollX, n_scrollY];
	if (document.documentElement && (document.documentElement.clientWidth || document.documentElement.clientHeight))
		return [document.documentElement.clientWidth, document.documentElement.clientHeight, n_scrollX, n_scrollY];
	if (document.body && (document.body.clientWidth || document.body.clientHeight))
		return [document.body.clientWidth, document.body.clientHeight, n_scrollX, n_scrollY];
	return [0, 0];
}