// this func allows you to center a div object
//
// in order to use this, you  have to define the "center"
// function as part of your object before you use it.  you can do
// this by using the following code:
// myobject.center = Object.prototype.center;
function center()
{
    var args = center.arguments;
    var obj  = args[0];
    // sanity
    if( !obj ) { return; }

    // center our object on the page
    var w = 0;
    var h = 0;
    var scroll_x = 0;
    var scroll_y = 0;
    //
    // okay... figure out which friggen browser we're using
    // IE is the worst browser ever.
    //
    if( typeof( window.innerWidth ) == 'number' )
    {   // we're using a REAL browser
        //Non-IE
        w = window.innerWidth;
        h = window.innerHeight;
        scroll_x = window.scrollX;
        scroll_y = window.scrollY;
    }
    else if( document.documentElement && (document.documentElement.clientWidth || document.documentElement.clientHeight) )
    {
        //IE 6+ in 'standards compliant mode'
        w = document.documentElement.clientWidth;
        h = document.documentElement.clientHeight;
        scroll_x = document.documentElement.scrollLeft;
        scroll_y = document.documentElement.scrollTop;
//        scroll_x = window.scrollX;
//        scroll_y = window.scrollY;
    }
    else if( document.body && (document.body.clientWidth || document.body.clientHeight) )
    {
        //IE 4 compatible
        w = document.body.clientWidth;
        h = document.body.clientHeight;
        scroll_x = document.body.scrollLeft;
        scroll_y = document.body.scrollTop;
//        scroll_x = document.body.scrollX;
//        scroll_y = document.body.scrollY;
    }

    if( !obj.style.left ) { obj.style.left = 0; }
    if( !obj.style.top ) { obj.style.top = 0; }
    // center our element
    var left = (w / 2) - (obj.offsetWidth / 2);
    var top  = (h / 2) - (obj.offsetHeight / 2);
    // account for scrolling
    obj.style.left = (left + scroll_x) + "px";
    obj.style.top  = (top + (scroll_y - (obj.offsetHeight/2))) + "px";
}


// show/hide the loader
function loading( bool )
{
//    loader.center = Object.prototype.center; loader.center();
center(loader);
    loader.style.visibility = (bool) ? "visible" : "hidden";
}
// show/hide messages
function display_message( msg )
{
loading(false);
//    messenger.center           = Object.prototype.center; messenger.center();
center(messenger);
    msg_text.innerHTML         = msg;
    messenger.style.visibility = "visible";
}
function close_message() { messenger.style.visibility = "hidden"; }

/////////////////////////////////////
// below is the HTML code you'll need to copy
// and paste into every file you want to use
// the loader and message boxes on.
// this will probably reside in a header or footer
// file somewhere.
//
// there is also some sample CSS code to style these boxes
/////////////////////////////////////

// HTML CODE
//
//<div id="loader" style="visibility:hidden;"><img src="images/icons/wait.gif" align="absmiddle"> <b>loading...</b></div>
//<div id="messenger" style="visibility:hidden;">
//    <div id="messenger_bg"></div>
//    <div id="msg_text"> <i>[ no messages ]</i> </div>
//    <div id="msg_close"><a href="javascript:close_message()">[ close ]</a></div>
//</div>
//<script type="text/javascript">var loader = dojo.byId("loader"); var msg_box = dojo.byId("messenger");
//var msg_text = dojo.byId("msg_text");</script>

// CSS CODE
//
//#messenger
//{
//    position: absolute;
//    display:  block;
//    top:      0;
//    left:     0;
//    z-index:  100;
//    width:    320px;
//    height:   140px;
//}
//#messenger_bg
//{
//    position:         absolute;
//    top:              20px;
//    left:             20px;
//    width:            280px;
//    height:           100px;
//    background-color: #999999;
//}
//#msg_close
//{
//    position:         absolute;
//    top:              27px;
//    left:             250px;
//    font-size:        8pt;
//}
//#msg_text
//{
//    position:         absolute;
//    top:              26px;
//    left:             26px;
//    width:            240px;
//    height:           60px;
//    padding:          12px;
//    background-color: #FFFFFF;
//    border:           1px solid #FF6600;
//}
//#loader
//{
//    position:         absolute;
//    z-index:          1000;
//    top:              150px;
//    left:             0px;
//    display:          block;
//    width:            100px;
//    height:           20px;
//    padding:          5px;
//    background-color: #FFFFFF;
//    border:           1px solid black;
//    border-right:     2px solid black;
//    border-bottom:    2px solid black;
//    text-align:       center;
//}