/*
 Floating help functions
 */

var floatHelp = null;
function showHelp( id ) {
    if ( floatHelp == null ) {
        floatHelp = new HelpFloat();
        floatHelp.init();
    }
    floatHelp.setText( "/help/?id="+ id +"&width=190" );
}
function closeHelp() {
    floatHelp.hide();
    floatHelp = null;
}

function HelpFloat() {
    this.init = init;
    this.setText = setText;
    this.hide = hide;

    var self = this;
    var floatX = 10;
    var floatY = 10;
    var layerwidth  = 190;
    var layerheight = 300;
    var halign = "right";
    var valign = "top";
    var delayspeed = 3;
    var sideMargeX = 13;
    
    var ifloatX = floatX;
    var ifloatY = floatY;
    var lastX = -1;
    var lastY = -1;
    
    var helpTable;
    var helpFrame;
    
    var stopAdjust = false;
    
    function init() {        
        // maak hem ff mooi
        helpTable = document.createElement( "table" );
        helpTable.appendChild( document.createElement( "tbody" ) );
        document.getElementById( "floatlayer" ).appendChild( helpTable );
        
        helpTable.style.width = layerwidth;
        helpTable.style.height = layerheight;
        helpTable.style.backgroundColor = "#336633";
        helpTable.cellpadding = '0';
        helpTable.cellspacing = '0';
        helpTable.border = '0';
        
        var row = helpTable.tBodies[0].insertRow( 0 );
        row.style.height = "10px";
        var cell = row.insertCell( 0 );
        cell.innerHTML = "<table border='0' style='width:100%' cellpadding='0' cellspacing='0'><tr>"+
                         "<td><img src='/images/ipereni.small.jpg'></td>"+
                         "<td style='text-align:center;font-family:Tahoma;font-size:14px;font-weight:bold;vertical-align:middle;color:#FFFFFF'>Helpsysteem</td>"+
                         "<td style='text-align:right'><img onclick='closeHelp();' style='cursor:hand;' src='/images/close.gif'></td>"+
                         "</tr></table>";
        
        var row = helpTable.tBodies[0].insertRow( 1 );
        //row.style.backgroundColor = "#FFFFFF";
        var cell = row.insertCell( 0 );
        
        helpFrame = document.createElement( "iframe" );
        helpFrame.style.width = "100%";
        helpFrame.style.height = "100%";
        helpFrame.setAttribute( "frameBorder", "0" );
        cell.appendChild( helpFrame );
    }
    
    function hide() {
        removeEvent( window, "resize", define );
        stopAdjust = true;
        document.getElementById( "floatlayer" ).removeChild( helpTable );
        setTimeout( hideEnd, 50 );
    }
    function hideEnd() {
        document.all['floatlayer'].style.posLeft = -100;
        document.all['floatlayer'].style.posTop = -100;
        helpTable.style.width = 0;
        helpTable.style.height = 0;
    }
    
    function setText( url ) {
        helpFrame.src = url;

        // onresize ook wat doen
        addEvent( window, "resize", define );
        define();
        
        stopAdjust = false;
    }
    
    function adjust() {
        if (lastX == -1 || delayspeed == 0 ) {
            lastX = document.body.scrollLeft + floatX;
            lastY = document.body.scrollTop + floatY;
        } else {
            var dx = Math.abs( document.body.scrollLeft + floatX - lastX );
            var dy = Math.abs( document.body.scrollTop + floatY - lastY );
            var d = Math.sqrt( dx * dx + dy * dy );
            var c = Math.round( d / 10 );
            if ( document.body.scrollLeft + floatX > lastX ) {
                lastX = lastX + delayspeed + c;
            }
            if ( document.body.scrollLeft + floatX < lastX ) {
                lastX = lastX - delayspeed - c;
            }
            if ( document.body.scrollTop + floatY > lastY ) {
                lastY = lastY + delayspeed + c;
            }
            if ( document.body.scrollTop + floatY < lastY ) {
                lastY = lastY - delayspeed - c;
            }
        }
        document.all['floatlayer'].style.posLeft = lastX;
        document.all['floatlayer'].style.posTop = lastY;
    
        if ( !stopAdjust ) {
            setTimeout( adjust, 50 );
        }
    }
    
    function define() {
        if ( halign == "left") {
            floatX = ifloatX;
        }
        if ( halign == "right" ) {
            floatX = document.body.offsetWidth - ifloatX - layerwidth - sideMargeX;
        }
        if ( halign == "center" ) {
            floatX = Math.round( ( document.body.offsetWidth - 20 ) / 2 ) - Math.round( layerwidth / 2 );
        }
        if ( valign == "top" ) {
            floatY = ifloatY
        };
        if ( valign == "bottom" ) {
            floatY = document.body.offsetHeight - ifloatY - layerheight
        }
        if ( valign == "center" ) {
            floatY = Math.round( ( document.body.offsetHeight - 20 ) / 2 ) - Math.round( layerheight / 2 );
        }
        adjust();
    }
}