function showFloater(element, focus_element){
	var sn = document.getElementById(element);
	if (sn==null){return;}
	setUp();
	center(element);
	Element.setStyle('overlay', {height: getHeight()});
	new Effect.Appear('overlay', { duration: 0.3, from: 0.0, to: 0.8, queue: 'front' });
	new Effect.Grow(element, {direction: 'center', duration: 0.3, queue: 'end'});
	//focus stuff...
	if(focus_element==null){ 
		//if we don't specify a field to focus on we'll look for the first field in the first form
		forms = $(element).getElementsByTagName("form");
		if(forms.length > 0){
			theForm = forms[0];
			setTimeout("Form.focusFirstElement(theForm);",800);
		}
	}else{
		setTimeout("Field.focus('"+focus_element+"')",800);
	}
	return false;
}

function hideFloater(element){
	var sn = document.getElementById(element);
	if (sn==null){return;}
	new Effect.Shrink(element, {direction: 'center', duration: 0.2, queue: 'front'});
	new Effect.Fade('overlay', { duration: 0.2, queue: 'end'});
	if($('errorExplanation')!=null){
		new Effect.Shrink('errorExplanation', {direction: 'center', duration: 0.2});
	}
	return false;
}

function setUp(){
	//sets up the page to ready for the floater
	var objBody = document.getElementsByTagName("body").item(0);
	var objOverlay = document.createElement("iframe");
	objOverlay.setAttribute('id','overlay');
	objOverlay.setAttribute('src','floater-system.html');
	objOverlay.setAttribute('frameborder','2');
	objOverlay.style.display = 'none';
	objBody.appendChild(objOverlay);
	
}

function getHeight(){
	var yScroll;
	
	if (window.innerHeight && window.scrollMaxY) {	
		yScroll = window.innerHeight + window.scrollMaxY;
	} else if (document.body.scrollHeight > document.body.offsetHeight){ // all but Explorer Mac
		yScroll = document.body.scrollHeight;
	} else { // Explorer Mac...would also work in Explorer 6 Strict, Mozilla and Safari
		yScroll = document.body.offsetHeight;
	}
	
	var windowWidth, windowHeight;
	if (self.innerHeight) {	// all except Explorer
		windowHeight = self.innerHeight;
	} else if (document.documentElement && document.documentElement.clientHeight) { // Explorer 6 Strict Mode
		windowHeight = document.documentElement.clientHeight;
	} else if (document.body) { // other Explorers
		windowHeight = document.body.clientHeight;
	}	
	
	// for small pages with total height less then height of the viewport
	if(yScroll < windowHeight){
		pageHeight = windowHeight;
	} else { 
		pageHeight = yScroll;
	}
	return pageHeight + 'px';
}


function center(element){
    try{
        element = document.getElementById(element);
    }catch(e){
        return;
    }

    var my_width  = 0;
    var my_height = 0;

    if ( typeof( window.innerWidth ) == 'number' ){
        my_width  = window.innerWidth;
        my_height = window.innerHeight;
    }else if ( document.documentElement && 
             ( document.documentElement.clientWidth ||
               document.documentElement.clientHeight ) ){
        my_width  = document.documentElement.clientWidth;
        my_height = document.documentElement.clientHeight;
    }
    else if ( document.body && 
            ( document.body.clientWidth || document.body.clientHeight ) ){
        my_width  = document.body.clientWidth;
        my_height = document.body.clientHeight;
    }

    element.style.position = 'absolute';
    element.style.zIndex   = 999999;

    var scrollY = 0;

    if ( document.documentElement && document.documentElement.scrollTop ){
        scrollY = document.documentElement.scrollTop;
    }else if ( document.body && document.body.scrollTop ){
        scrollY = document.body.scrollTop;
    }else if ( window.pageYOffset ){
        scrollY = window.pageYOffset;
    }else if ( window.scrollY ){
        scrollY = window.scrollY;
    }

    var elementDimensions = Element.getDimensions(element);

    var setX = ( my_width  - elementDimensions.width  ) / 2;
    var setY = ( my_height - elementDimensions.height ) / 2 + scrollY;

    setX = ( setX < 0 ) ? 0 : setX;
    setY = ( setY < 0 ) ? 0 : setY;

    element.style.left = setX + "px";
    element.style.top  = setY + "px";
}