//get the page scroll
var getPageScroll = function(){
	var sx = window.pageXOffset || document.body.scrollLeft || document.documentElement.scrollLeft;
	var sy = window.pageYOffset || document.body.scrollTop || document.documentElement.scrollTop;
	return new Array(sx,sy);
	}
//get the current viewport size
var getViewPortSize = function(){
	var pw = window.innerWidth || document.documentElement.clientWidth || document.body.clientWidth;
	var ph = window.innerHeight || document.documentElement.clientHeight || document.body.clientHeight;
	return new Array(pw,ph);
	}
//get the page size:
var getPageSize = function(){
	var vp = getViewPortSize();
	var pw = document.body.offsetWidth;
	var ph = document.body.offsetHeight;
	//assign viewport size if body size smaller then viewport
	if( vp[0]>pw )
		pw = vp[0];
	if( vp[1]>ph )
		ph = vp[1];
	return new Array(pw,ph);
	}
var adjustPosition = function(){
	var pageSize = getViewPortSize();
	var ps = getPageScroll();
	var h = $('#jBox')[0].offsetHeight;
	var w = $('#jBox')[0].offsetWidth;
	var cX = Math.round(pageSize[0]/2)-Math.round(w/2)+ps[0];
	var cY = Math.round(pageSize[1]/2)-Math.round(h/2)+ps[1];
	$('#jBox').css({left:cX+'px',top:cY+'px'});
	}
var fadeTimeout;
var fadeFunction = function(){
	clearInterval( fadeTimeout );
	if( $('#jOverlay') ){ 
		$('#jOverlay').fadeOut('slow');
		}
	if( $('#jBox') ){
		$('#jBox').fadeOut('slow');
		//new Effect.BlindUp('jBox', { duration: 0.5 });
		}
	}
//remove the overlay
var removeOverlay = function(){
	fadeTimeout = setInterval(fadeFunction, 1000 );
	}
var createOverlay = function(p){
	if(typeof jQuery == 'undefined'){
		alert('jQuery not loaded!');
		return;
		}
	this.title = p.title?p.title:'Attention';
	this.msg = p.msg?p.msg:'msg: ';
	this.errCode = p.errCode?p.errCode:0;
	this.onClose = p.onClose?p.onClose:function(){};
	this.opacity = p.opacity?p.opacity:0.5;
	//remove previous overlay
	$('#jOverlay').remove();
	$('#jBox').remove();
	
	var jBody = $("body")[0];
	var jOverlay = document.createElement("div");
	jOverlay.setAttribute('id','jOverlay');	
	jBody.appendChild(jOverlay);
	$('#jOverlay').css({position:'absolute',zIndex:98,left:0,top:0,width:'100%',height:getPageSize()[1]+'px',opacity:0});
	//$('#jOverlay').html('test div');
	if( this.errCode ) $('#jOverlay').addClass('jError');
	else $('#jOverlay').addClass('jSuccess');
	var jBox = document.createElement("div");
	jBox.setAttribute('id','jBox');
	jBody.appendChild(jBox);
	//set the msg of the center container
	$('#jBox').html('<div class="popupBox">\
		<a id="jClose" return false;" title="close"><b>close</b></a>\
		<h3>'+this.title+'</h3>\
		<div>'+this.msg+'</div>\
	</div>');
	$('#jBox').css({position:'absolute',left:0,top:0,height:'auto',opacity:0,zIndex:99});
	adjustPosition();
	$(window).keydown(function(e){
		if(e.which == 27)
			fadeFunction();
		});
	$('#jClose').click(fadeFunction);
	$('#jClose').click(this.onClose);
	$(window).scroll(adjustPosition);
	$(window).resize(adjustPosition);
	$('#jOverlay').fadeTo('slow',this.opacity);
	$('#jBox').fadeTo('slow',1.0);
	}