// ------------------------------------------------
//      Custom DHTML scrollbar
// ------------------------------------------------
//      (c) 2000 Peter Nederlof
//      http://www.xs4all.nl/~peterned/
//      Last updated: January 26, 2001
// ------------------------------------------------

// Values below are defaults. overwrite in HTML

var barWidth  = 15;
var barHeight = 300;
var barXstart = 100;
var barXfromRight = false;
var barYstart = 100;
var scrollerHeight = 65;
var layerToScroll = "default";
var arrowSpeed = 5;
var clickStepSize = 40;
var extraSpace = 0;

var scrollerBG  = "none";

var upSRC     = "images/default_up.jpg";
var downSRC   = "images/default_down.jpg";
var scrollSRC = "images/default_bar.jpg";

var snapToLayer = "default";
var autoSnap = false;
var snapFullScreen = false;
var disableIEscroll = true;

var autoDisable = true;
var onDisable = "hide";

var arrowControl = true;
var arrowGrouping = false;
var arrowMouseOver = false;

var sizeToContent = false;
var maxScrollerSize = 200;

// ------------------------------------------------
//      Internal value, for IE only
        var scrollback = false;

// ------------------------------------------------
//              I suggest you don't alter anything below

var ie4 = (document.all)? true:false;
var ns6 = (!ie4 && document.getElementById)? true:false;
var ns4 = (!ie4 && !ns6)? true:false;

var loaded = false;
var arrowSize;
var x, y, pageFromTop;
var upIMG, downIMG, scrollIMG;
var pageWidth, pageHeight;

if(!ie4 && navigator.appName != "Netscape")
{       alert('It seems you are using an unsupported browser');
}


// ------------------------------------------------
//              Initializes the scrollbar
//              - called by body onload()

function initScroller()
{       arrowSize  = barWidth;
        pageWidth  = (ie4)? document.body.clientWidth:window.innerWidth;
        pageHeight = (ie4)? document.body.clientHeight:window.innerHeight;
        var tempLyr = getLayer(layerToScroll);

        if(ie4) pageFromTop = tempLyr.style.pixelTop;
        if(ns4) pageFromTop = tempLyr.top;
        if(ns6) pageFromTop = parseInt(tempLyr.style.top);

        upIMG    = '<IMG SRC="'+upSRC     +'" WIDTH="'+barWidth+'" HEIGHT="'+barWidth+'" BORDER="0">';
        downIMG  = '<IMG SRC="'+downSRC   +'" WIDTH="'+barWidth+'" HEIGHT="'+barWidth+'" BORDER="0">';
        scrollIMG = '<IMG name="theScroller" SRC="'+scrollSRC+'" WIDTH="'+barWidth+'" HEIGHT="'+scrollerHeight+'" BORDER="0">';
        
        if(autoSnap) snapPosition();
        else if(snapFullScreen) snapFull();
        else if(barXfromRight)
        {       barXstart = pageWidth - barXstart;              
        }
        
        scrollbar = new Scrollbar(barWidth, barHeight, barXstart, barYstart);
        scrollbar.build();      
        scrollbar.setMaxScroll();
        loaded = true;
        scrollbar.monitor();
        
        if(document.location.search)
        {       var fetch = document.location.search;
                if(fetch.indexOf('?sPage=') != -1)
                {       fetch = fetch.substring(7,fetch.length);
                        if(getLayer(fetch) != null)
                        {       layerToScroll = fetch;
                        }                       
                }               
        }

        scrollbar.setPage(layerToScroll);       
        //if(ie4 && disableIEscroll) document.body.style.cssText="overflow-y:hidden;";    
		// tt: x toegevoegd
        if(ie4 && disableIEscroll) {
			document.body.style.overflow = "hidden";
		}
}


// ------------------------------------------------
//              Scrollbar Object.
//              - defines values and functions

function Scrollbar(width, height, xPos, yPos)
{       
        // ------------------------------------------------
        //              Values:

        this.width  = width;
        this.height = height;
        this.xPos = xPos;
        this.yPos = yPos;
        this.enabled = true;
        
        this.barString = "";
        this.arrowSize = arrowSize;
        this.arrowUpYstart   = 0;
        this.pageToScroll = layerToScroll;
        this.toScrollHeight = 0;
        this.activePage = layerToScroll;
        this.maxScroll = this.height - this.arrowSize;
        this.scrollerHeight = scrollerHeight;
        this.sbHistory = new Array(layerToScroll);
        this.atHistory = 1;
        
        // ------------------------------------------------
        //              Functions:

        this.build   = build;
        this.monitor = monitor;
        this.setPage = setPage;
        this.toTop   = toTop;
        this.goBack  = goBack;
        this.setMaxScroll = setMaxScroll;
}


// ------------------------------------------------
//              Scrollbar Build function
//              - builds Scrollbar and writes it to page

function build()
{       
        upApos = (arrowGrouping)? (this.height - (2*this.arrowSize)):0;
        scrpos = (arrowGrouping)? 0:this.arrowSize;
                
        // ------------------------------------------------
        //              Internet Explorer 4+

        if(ie4)
        {       this.barString = '<DIV ID="scrollyr" STYLE="position:absolute; left:'+this.xPos+'; top:'+this.yPos+'; '
                + 'z-index:20; width:'+this.width+'; height:'+this.height+';">'
                
                + '<DIV ID="arrowUp" STYLE="position:absolute; left:0; top:'+upApos+'; width:'+this.arrowSize+'; height:'
                + this.arrowSize+'; z-index:30; Clip:rect(0,'+this.arrowSize+','+this.arrowSize
                + ',0); cursor:hand;">'+upIMG+'</DIV>'
                        
                + '<DIV ID="scroller" STYLE="position:absolute; left:0; top:'+scrpos+'; width:'+this.arrowSize
                + '; height:'+scrollerHeight+';' // clip:rect(0,'+this.width+','+scrollerHeight+',0);'
                + ' z-index:25; cursor:hand;">'+scrollIMG+'</DIV>'
                
                + '<DIV ID="arrowDown" STYLE="position:absolute; left:0; top:'+(this.height-this.arrowSize)+'; width:'
                + arrowSize+'; height:'+arrowSize+'; z-index:30; Clip:rect(0,'+this.arrowSize+','+this.arrowSize
                + ',0); cursor:hand;">'+downIMG+'</DIV>'

                + '</DIV>';
                
                document.body.insertAdjacentHTML("BeforeEnd", this.barString);                  
                
                scrollyr.onmousedown = goThere;         
                if(scrollerBG != "none") 
                {       if(scrollerBG.indexOf('.') != -1) scrollyr.style.backgroundImage = "url("+scrollerBG+")";
                        else scrollyr.style.backgroundColor = scrollerBG;
                }
        }       
        

        // ------------------------------------------------
        //              Netscape Navigator 4.x

        if(ns4)
        {       this.barString = '<Layer name="arrowUpF" left="0" top="'+upApos+'" width="'+this.arrowSize+'" height="'
                + this.arrowSize+'" z-index="30">'+upIMG+'</Layer>'
                + '<Layer name="arrowUp" left="0" top="'+upApos+'" width="'+this.arrowSize+'" height="'
                + this.arrowSize+'" z-index="31"></Layer>'
                        
                + '<Layer name="scrollerF" left="0" top="'+scrpos+'" width="'+this.arrowSize
                + '" height="'+scrollerHeight+'" z-index="25">'+scrollIMG+'</Layer>'
                + '<Layer name="scroller" left="0" top="'+scrpos+'" width="'+this.arrowSize
                + '" height="'+scrollerHeight+'" z-index="26"></Layer>'
                
                + '<Layer name="arrowDownF" left="0" top="'+(this.height-this.arrowSize)+'" width="'
                + arrowSize+'" height="'+arrowSize+'" z-index="30">'+downIMG+'</Layer>'
                + '<Layer name="arrowDown" left="0" top="'+(this.height-this.arrowSize)+'" width="'
                + arrowSize+'" height="'+arrowSize+'" z-index="31"></Layer>';

                scrollyr = new Layer(this.width);
                scrollyr.document.write(this.barString);
                scrollyr.document.close();
                scrollyr.visibility = "show";
                scrollyr.moveTo(barXstart, barYstart);
                
                if(scrollerBG!="none") 
                {       if(scrollerBG.indexOf('.') != -1) scrollyr.background.src = scrollerBG;
                        else scrollyr.bgColor = scrollerBG
                }

                scrollyr.document.onmousedown = goThere;
                
                this.pageToScroll = getLayer(layerToScroll);
                scroller  = getLayer('scroller');
                scrollerF = getLayer('scrollerF');
                arrowUp   = getLayer('arrowUp');
                arrowDown = getLayer('arrowDown');
                
                scroller.style = scroller;
                scrollyr.style = scrollyr;
        }


        // ------------------------------------------------
        //              Mozilla - Netscape 5 or 6

        if(ns6)
        {       scrollbarElement = new ns6layer("scrollyr",  this.xPos, this.yPos, this.width, this.height, 20);
                arrowUpElement   = new ns6layer("arrowUp",   0, 0, this.arrowSize, this.arrowSize, 30);
                        arrowUpElement.addImage(upSRC);
                arrowDownElement = new ns6layer("arrowDown", 0, (this.height-this.arrowSize), this.arrowSize, this.arrowSize, 30);
                        arrowDownElement.addImage(downSRC);
                scrollerElement   = new ns6layer("scroller", 0, this.arrowSize, this.arrowSize, scrollerHeight, 25);
                        scrollerElement.addImage(scrollSRC, "theScroller");
                        
                scroller  = getLayer('scroller');
                scrollyr  = getLayer('scrollyr');
                arrowUp   = getLayer('arrowUp');
                arrowDown = getLayer('arrowDown');
                
                scrollyr.onmousedown = goThere;
        }
}


// ------------------------------------------------
//              Mozilla layer function (as Object)
//              - creates and writes layer to page
//              - addImage() writes an image to the layer

        function ns6layer(name, left, top, width, height, z)
        {       this.nameSRC = document.createElement("Div");
                this.nameSRC.id = name;

                if(name == "scrollyr") document.body.appendChild(this.nameSRC);
                else scrollbarElement.nameSRC.appendChild(this.nameSRC);

                this.lyr = document.getElementById(this.nameSRC.id);
                this.lyr.setAttribute("style","position:absolute; left:"+left
                                        +"; top:"+top+"; width:"+width+"; height:"+height+";");
                this.lyr.style.zIndex = z;
                
                if(name == "scrollyr" && scrollerBG != "none")
                {       if(scrollerBG.indexOf('.') != -1) this.lyr.style.backgroundImage = "url("+scrollerBG+")";
                        else this.lyr.style.backgroundColor = scrollerBG;
                }

                this.addImage = addImage;
        }

                function addImage(path, imgName)
                {       this.imgElement = document.createElement("Img");
                        this.imgElement.src = path
                        this.imgElement.width = barWidth;
                        if (imgName != null)
                        {       this.imgElement.id = imgName;
                                this.imgElement.height = scrollerHeight;
                        }
                        this.imgElement.border = 0;

                        this.lyr.appendChild(this.imgElement);
                }


// ------------------------------------------------
//              Built in option to enable page flipping in
//              one document.
//
//              - scrollbar.setPage(arg) with arg as String
//                representing a layername with content,
//                nested in the clipped top level layer

function setPage(toWhat)
{       var hideThis = getLayer(this.activePage);
        if(ns4) hideThis.style = hideThis;
        hideThis.style.visibility = "hidden";

        var showThis = toWhat;
        showThis = getLayer(showThis);
        if(ns4) showThis.style = showThis;
        showThis.style.visibility = "visible";  

        this.pageToScroll = toWhat;
        if(ns4 || ns6) this.pageToScroll = getLayer(this.pageToScroll);
        this.activePage = toWhat;

        if(ie4) this.toScrollHeight = document.all[this.pageToScroll].clientHeight;
        if(ns4) this.toScrollHeight = this.pageToScroll.document.height;
        if(ns6) this.toScrollHeight = this.pageToScroll.offsetHeight;

                if(autoDisable && this.toScrollHeight <= this.height)
                {       scrollbar.enabled = false;

                        if(onDisable == "hide") 
                        {       scrollyr.style.visibility = "hidden";
                        }
                }

                else 
                {       scrollbar.enabled = true;

                        scrollyr.style.visibility = "visible";
                }
        
        // ------------------------------------------------
        //              Experimental resizer of scrollelement.
        //              - IE and NS6 only preview, ugly image resizing.

                if(sizeToContent && !ns4)
                {       if(maxScrollerSize > (this.height - 2*this.arrowSize))
                        {       maxScrollerSize = this.height - 2*this.arrowSize;
                        }
                        
                        var percentage = 100/(this.toScrollHeight/this.height);
                        var adjustedHeight = Math.floor(percentage/100 * maxScrollerSize);
                        
                        if(ie4) document.all.theScroller.style.height = adjustedHeight;
                        if(ns6) document.getElementById('theScroller').style.height = adjustedHeight;
                        
                        this.scrollerHeight = adjustedHeight
                        scrollbar.setMaxScroll();
                }
                
        scroller.style.top = (arrowGrouping)? 0:this.arrowSize;
        scroller.checkPos();

        // ------------------------------------------------
        //              Tracking History

        this.sbHistory[this.atHistory] = toWhat;
        this.atHistory ++;
        
}

function toTop()
{       with(this)
        {       setPage(activePage);
        }
}

function goBack()
{       with(this)
        {       atHistory -= 2;
                if(atHistory < 0)

                {       atHistory = 0;

                        history.go(-1);
                }

                else 
                {       setPage(sbHistory[atHistory]);
                }
        }
}


// ------------------------------------------------
//              Defines the range of the scroll-element,
//              how far you can drag it up and down.

function setMaxScroll()
{       this.maxScroll = this.height - this.arrowSize - this.scrollerHeight;
        scroller.range = this.maxScroll - this.arrowSize;
}


// ------------------------------------------------
//              Sets up mouse event listeners for the
//              elements of the scrollbar.

function monitor()
{       scroller.scrolling = false;

        scroller.moving = false;

        scroller.yStart = this.yPos;

        scroller.difY = 0;

        scroller.checkPos = checkPos;


        if(ns4)
        {       if(arrowMouseOver)
                {       arrowUp.onmouseover = scrollUp;

                        arrowDown.onmouseover = scrollDown;                     
                }

                arrowUp.onmouseout   = stopScroll;

                arrowDown.onmouseout  = stopScroll;

                arrowUp = arrowUp.document;

                arrowDown = arrowDown.document;

                scroller.document.onmousedown = setDrag;

                scroller.document.onmouseup   = stopDrag;

        }
        
        else
        {       scroller.onmousedown = setDrag;

                scroller.onmouseup   = stopDrag;

                arrowUp.onmouseout   = stopScroll;

                arrowDown.onmouseout  = stopScroll;

        }

        arrowUp.onmouseup    = stopScroll;

        arrowDown.onmouseup   = stopScroll;     

        if(arrowMouseOver)
        {       arrowUp.onmouseover = scrollUp;

                arrowDown.onmouseover = scrollDown;

        }
        else
        {       arrowUp.onmousedown  = scrollUp;

                arrowDown.onmousedown = scrollDown;     
        }

        if(arrowControl)
        {       document.onkeydown = doKeyDown;

                document.onkeyup   = doKeyUp;

        }
}


// ------------------------------------------------
//              Maps scroll-element position to the content
//              layer, the heart of the script.

function checkPos()
{       if(arrowGrouping)
        {       scrollbar.maxScroll -= scrollbar.arrowSize;

                scrollbar.arrowSize = 0;                
        }

        if(ns4)
        {       if(this.top < scrollbar.arrowSize) this.top = scrollbar.arrowSize;

                if(this.top > scrollbar.maxScroll) this.top = scrollbar.maxScroll;
                scrollerF.top = scroller.top;
        }

        else
        {       if(parseInt(this.style.top) < scrollbar.arrowSize) this.style.top = scrollbar.arrowSize;

                if(parseInt(this.style.top) > scrollbar.maxScroll) this.style.top = scrollbar.maxScroll;
        }
        
        var position = 0 - scrollbar.arrowSize;

        if(ns4) position += this.top
        else    position += parseInt(this.style.top);

        var amountToDo = (scrollbar.toScrollHeight - scrollbar.height) + pageFromTop + extraSpace;
        if(amountToDo < 0) amountToDo = 0;

        var stepSize = amountToDo/this.range;


        var newPosition = pageFromTop - (position * stepSize);

        if(ie4) document.all[scrollbar.pageToScroll].style.pixelTop = newPosition;

        if(ns4) scrollbar.pageToScroll.top = newPosition;

        if(ns6) scrollbar.pageToScroll.style.top = newPosition;

}


// ------------------------------------------------
//              Mouse event function, enables dragging

function setDrag()
{       scroller.scrolling = true;

        scroller.difY = (y - scroller.yStart);
        
        if(ie4) scroller.difY -= scroller.style.pixelTop;

        if(ns4) scroller.difY -= scroller.top;

        if(ns6) scroller.difY -= parseInt(scroller.style.top);


        scroller.difY += scroller.yStart;

        
}


// ------------------------------------------------
//              Mouse event functions, disables dragging

function stopDrag()
{       if(!loaded) return;
        scroller.scrolling = false;

}

function mouseUp(e)
{       if(!loaded) return;
        scroller.scrolling = false;     
}


// ------------------------------------------------
//              Mouse event function, mouse positions

function mouseMove(e)
{       if(!loaded) return;
        if (ns4) {x=e.pageX; y=e.pageY;}

        if (ns6) {x=e.clientX; y=e.clientY;}

        if (ie4) {x=event.x; y=event.y;}


        if(ie4 && loaded) 
        {       if(event.button == 0) stopDrag();               
        }
        
        if(loaded && scroller.scrolling && scrollbar.enabled)
        {       if(ie4 || ns6) scroller.style.top = (y - scroller.yStart) - (scroller.difY - scroller.yStart);
                if(ns4) scroller.top = (y - scroller.yStart) - (scroller.difY - scroller.yStart);
                
                scroller.checkPos();            
                return false;
        }       
}

function fixIeScroll()
{       window.scrollTo(0,0);
}

function fixNSresize()
{       if(pageWidth != window.innerWidth || pageHeight != window.innerHeight)

        history.go(0);
}

document.onmousemove = mouseMove;

document.onmouseup = mouseUp;

if(ie4 && scrollback) window.onscroll = fixIeScroll

if(ns4) 
{       document.captureEvents(Event.MOUSEMOVE||Event.MOUSEUP||Event.MOUSEDOWN||Event.KEYDOWN||Event.KEYUP);
        window.onresize = fixNSresize;

}

// ------------------------------------------------
//              Arrow Buttons events, up and down functions

var SCmove = null;


function scrollUp()
{       keyLock = true;

        scroller.moving = true;

        if(ns6)  SCmove = setInterval(moveScroller, 25, (0-arrowSpeed));
        else SCmove = setInterval("moveScroller(0-arrowSpeed)",25);

}

function scrollDown()
{       keyLock = true;

        scroller.moving = true;

        if(ns6)  SCmove = setInterval(moveScroller, 25, arrowSpeed);
        else SCmove = setInterval("moveScroller(arrowSpeed)",25);

}

function stopScroll()
{       scroller.moving = false;

        if(SCmove != null) clearInterval(SCmove);
}

function moveScroller(how)
{       if(scroller.moving && scrollbar.enabled)
        {       if(ie4) scroller.style.pixelTop += how;

                if(ns4) scroller.top += how;

                if(ns6) scroller.style.top = parseInt(scroller.style.top) + how;

                scroller.checkPos();            
        }       
}

var keyLock = false;


function doKeyDown(e)
{       thekey = (ie4)? event.keyCode:e.which;
        key = String.fromCharCode(thekey);

        key = key.toLowerCase();

        
        scroller.moving = true;
        if(thekey == 38 || thekey == 33 || key == '0a' && !keyLock) 
        {       if(ns4 || key == '0a') 
                {       scrollUp();
                }
                else moveScroller(-25);
        }
        
        if(thekey == 40 || thekey == 34 || key == '0z' && !keyLock)
        {       if(ns4 || key == '0z')
                {       scrollDown();
                }
                else moveScroller(25);
        }       
}

function doKeyUp(e)
{       stopScroll();
        keyLock = false;

}

// ------------------------------------------------
//              Clicking in the bar causes the scroll
//              element to take a step towards the mouse

function goThere()
{       var where = y - scrollbar.yPos;
        if(!scroller.scrolling && !scroller.moving)
        {       if(where < ((ie4)? scroller.style.pixelTop:((ns6)? parseInt(scroller.style.top):scroller.top)))
                {       if(ie4) scroller.style.pixelTop -= clickStepSize;

                        if(ns4) scroller.top -= clickStepSize;

                        if(ns6) scroller.style.top = parseInt(scroller.style.top) - clickStepSize;
                }

                else
                {       if(ie4) scroller.style.pixelTop += clickStepSize;

                        if(ns4) scroller.top += clickStepSize;

                        if(ns6) scroller.style.top = parseInt(scroller.style.top) + clickStepSize;
                }

                scroller.checkPos();
        }
}


// ------------------------------------------------
//              Snapping function 
//              - Connects the scrollbar to a layer stated
//                in the layout list. for lazy people.

function snapPosition()
{       var snapLayer = getLayer(snapToLayer);

        if(ie4)
        {       barXstart = snapLayer.style.pixelLeft + snapLayer.clientWidth;
                barYstart = snapLayer.style.pixelTop;

                barHeight = snapLayer.clientHeight;

        }

        if(ns4)
        {       barXstart = snapLayer.left + snapLayer.document.width;
                barYstart = snapLayer.top;

                barHeight = snapLayer.document.height;


                if(barXstart == snapLayer.left) barXstart += snapLayer.clip.width;

                if(barHeight == 0) barHeight += snapLayer.clip.height;

        }
        
        if(ns6)
        {       barXstart = parseInt(snapLayer.style.left) + snapLayer.offsetWidth;
                barYstart = parseInt(snapLayer.style.top);

                barHeight = snapLayer.offsetHeight;

        }
}

function snapFull()
{       barYstart = 0;

        
        if(ie4)
        {       document.body.style.cssText="overflow-x:hidden;overflow-y:hidden"
                barXstart = document.body.clientWidth - barWidth;
                barHeight = document.body.clientHeight;

        }

        else
        {       barXstart = window.innerWidth - barWidth;
                barHeight = window.innerHeight;

        }
}


// ------------------------------------------------
//              finds layers within document. Brainjar.
//              -  http://www.brainjar.com. 

function getLayer(name) 
{       if (ns4) return findLayer(name, document);
        if (ie4) return eval('document.all.' + name);
        
        // ------------------------------------------------
        //              added Mozilla support

        if (ns6) return document.getElementById(name);
        
        return null;
}

function findLayer(name, doc) 
{       var i, layer;

        for (i = 0; i < doc.layers.length; i++) 
        {       layer = doc.layers[i];

                if (layer.name == name) return layer;
                if (layer.document.layers.length > 0) 
                {       layer = findLayer(name, layer.document);
                        if (layer != null) return layer;
                }
        }
        return null;
}