/* Onderstaande functie wordt door de pagina's aangeroepen wanneer zij geladen zijn
   en wanneer de venstergrootte veranderd wordt. Het zorgt ervoor dat het schuifmecha-
   nisme verplaatst wordt van het venster naar de pagina-inhoud, wat mooier oogt. Het
   script is echter een aanvulling: de pagina's zijn ook goed leesbaar als JavaScript
   is uitgeschakeld. 
   Het script is getest in Opera 8.51 en 9.0b1, Internet Explorer 6.0 en Firefox 1.0.7. */

function MakeOverflow(){ 
    /* meet vensterhoogte en -breedte */
    var h, b;
    if (window.innerHeight) { h = window.innerHeight; } 
    else if (document.documentElement.clientHeight) { h = document.documentElement.clientHeight; }
    else if (document.body.clientHeight) { h = document.body.clientHeight; };
    
    if (window.innerWidth) { b = window.innerWidth; } 
    else if (document.documentElement.clientWidth) { b = document.documentElement.clientWidth; }
    else if (document.body.clientWidth) { b = document.body.clientWidth; };
    
    /* als meting mislukt, stopt script */
    if (!h || !b) return;
    
    /* <address> verbergen als hoogte te klein is */
    var a = document.getElementsByTagName('address');
    if (h < 645) { for (var i=0, ai; ai=a[i]; i++) ai.style.display = 'none';
    } else { for (var i=0, ai; ai=a[i]; i++) ai.style.display = 'block'; }
    
    /* logo verkleinen als hoogte te klein is */
    var a = document.getElementsByTagName('h1')[0].childNodes[0];
    if (h < 530 && h > 330) { a.style.width = (h-330) + 'px'; a.style.height = a.style.width; } 
    else { a.style.width = '200px'; a.style.height = '200px'; }
    
    /* selecter element van de klasse "wrapper" */
    if (!document.body.childNodes) return;
    var w = document.body.childNodes[0];
    while (w.nodeType!=1 && w.className!='wrapper' && w.nextSibling) w = w.nextSibling;
        
    if (w.className == 'wrapper') {
        /* pas hoogte "wrapper" aan vensterhoogte aan */
        h = Math.round(0.95 * h);
        w.style.height = h +'px';
        
        /* pas breedte "wrapper" aan vensterbreedte aan */
        if (b < 765)  w.style.width = '700px';
        
        /* pas marges "wrapper" and vensterbreedte aan */
        var t = Math.round(0.02 * h);
        var l = Math.round(0.5 * (b - w.clientWidth));
        if (l<0) l=0;
        w.style.margin = t + 'px auto auto ' + l + 'px';
        
        /* selecteer element met id "content" en id "nav" */
        var c = document.getElementById('content');
        var n = document.getElementById('nav');
        if (!c || !n) return;
        
        /* bepaald hoogte grijze balk */
        var k2 = document.getElementsByTagName('h2')[0].clientHeight;
        var k3 = document.getElementById('header').clientHeight;
        if (!k2 || !k3 || (k2 + k3 == 0)) {k2 = 60; k3 = 0; } /* voor IE */
        
        /* plaats de pagina-inhoud op de juiste positie en schakel schuifbalken in; */
        /* onderstaande wijzigingen maken het noodzakelijk (wegens de dynamische pagina-eigenschappen[1]
           en wegens verschillen tussen browsers) om dit script te gebruiken i.p.v. CSS.
           [1] dynamisch, dat wil zeggen gebruik van lengtematen in percentages en in exacte (px) waarden */
        c.style.height = (h - k2 - k3 - 40) + 'px';
        c.style.overflow = 'auto';
        c.style.width = (w.clientWidth - 220) + 'px'; /* breedte is breedte "wrapper" min breedte zijbalk min padding links en rechts */
        c.style.margin = '0';
        c.style.position = 'absolute';
        c.style.top = (t + k2 + k3 + 30) + 'px';
        c.style.left = (l + 200) + 'px';
        c.style.paddingTop = '0';
        
        n.style.height = '30px';
    };
    
    //alert('page: '+h+'x'+b);
}