/****************************************/
/*          SCROLL FUNCTIONS            */
/****************************************/

var scrollTimer = null;
var scrollSpeed = 10;

function InitScrollBar(rooId, containerId, documentId, scrollContainerClassName, resizeRootElement){

    //Get container and document
    var divRoot = document.getElementById(rooId);
    var divContainer = document.getElementById(containerId);
    var divDocument = document.getElementById(documentId);

    //Check if elements exists
    if(divContainer && divDocument){
    
        //Check if document is higher that container
        if(divContainer.offsetHeight < divDocument.offsetHeight){
            
            //Setup mouse wheel
            $('#' + documentId).mousewheel(function(event, delta) {
		        
		        if (delta > 0){
		            
		            scrollSpeed = 30;
			        Scroll(1, containerId, documentId);
			        scrollSpeed = 10;
			    }//if
		        else if (delta < 0){
		        
		            scrollSpeed = 30;
			        Scroll(-1, containerId, documentId);
			        scrollSpeed = 10;
			    }//else if
		        return false; // prevent default
	        });
	        
	        //Create silder and arrows
	        // Get the parent node 
            var c = document.getElementById(rooId); 
            if(!c ) 
                return;
            
            //Remove old
            $("." + scrollContainerClassName).remove();
               
            // Create a new div 
            var d = document.createElement("div"); 
            d.innerHTML = "<div class=\"" + scrollContainerClassName + "\" style=\"height:" + divContainer.offsetHeight  + "px;\">"+
                            "<table cellpadding='0' cellspacing='0' style='height:100%;'>" + 
                                "<tr>"+
                                    "<td style='vertical-align: bottom;height:3%;'>"+
                                        "<img class='overlay interactiveElement' src='gfx/arrow_scroller_up_"+ resValue(0,1,2) +".png' onmouseup='SetScrollSpeed(10);' onmousedown='SetScrollSpeed(15);' onmouseout='StopScroll();' onmouseover='StartScroll(1,\""+containerId+"\",\""+documentId+"\");'/>"+
                                    "</td>"+
                                "</tr>"+
                                "<tr>"+
                                    "<td style='height:94%;'>"+
                                        "<div id='"+containerId+"ScrollbarBackground' style='position:relative;top:0px;left:0px;height:100%;'>"+
                                            "<div style='position:relative;left:" + resValue(4-2, 5-2, 7-3) + "px; margin-top:1px;margin-bottom:1px;height:100%;background-color:#b2cbd8;width:1px;'/>" +
                                            "<div id='" + containerId + "ScrollbarSlider' style='position:absolute;top:0px;left:-" + resValue(2, 2, 3) + "px;width:" + resValue(5, 5, 7) + "px;height:" + resValue(20, 20, 30) + "px;background-color:#b2cbd8;' class='interactiveElement ui-draggable'/>" +
                                        "</div>"+
                                    "</td>"+
                                "</tr>"+
                                "<tr>"+
                                    "<td style='vertical-align: top;height:3%;'>"+
                                        "<img style='padding-top:"+resValue(2,2,2)+"px;' class='overlay interactiveElement' src='gfx/arrow_scroller_down_"+ resValue(0,1,2) +".png' onmouseup='SetScrollSpeed(10);' onmousedown='SetScrollSpeed(15);' onmouseout='StopScroll();' onmouseover='StartScroll(-1,\""+containerId+"\",\""+documentId+"\");'/>"+
                                    "</td>"+
                                "</tr>"+
                             "</table>" +
                            "</div>";
                
            // add the new div to container 
            c.appendChild(d); 
	        
	        //Setup dragable
	        $('#'+containerId+'ScrollbarSlider').draggable({ axis: 'y', containment: 'parent',drag: function(event, ui) { ScrollDraggin(event, ui, containerId, documentId, containerId+'ScrollbarBackground', containerId+'ScrollbarSlider' );} });
        }//if
        else{
        
            //Remove old (if any)
            $("." + scrollContainerClassName).remove();
        
            //Restart top
            divDocument.style.top = "0px";
        
            //Resize root and container
            if(resizeRootElement){
                var diff = divContainer.offsetHeight - (divDocument.offsetHeight + calcValue(25));
                divContainer.style.height = divDocument.offsetHeight + calcValue(25) + "px";
                divRoot.style.height = divRoot.offsetHeight - diff + "px";
            }//if
        }//else
    }//if
}//InitScrollBar

function getPosition(element) {
    //The counters for the total offset values.
    var left = 0;
    var top = 0;
    
    //Loop while this element has a parent.
    while (element.offsetParent) { 
    
        //Sum the current offsets with the total.
        left += element.offsetLeft; 
        top += element.offsetTop; 
        
        //Switch position to this element's parent.
        element = element.offsetParent;
    }
    
    //Do a final increment in case there was no parent or if //the last parent has an offset.
    left += element.offsetLeft;
    top += element.offsetTop;
    //Return the values as x,y.
    return {x:left, y:top};
}
 

function ScrollDraggin(event, ui, containerId, documentId, scrollbarBackgroundId, scrollbarSlider){

    var divContainer = document.getElementById(containerId);
    var divDocument = document.getElementById(documentId);
    
    var total = document.getElementById(scrollbarBackgroundId).offsetHeight - document.getElementById(scrollbarSlider).offsetHeight;
    var percent = (ui.position.top * 100)/total;
    
    divDocument.style.top = ((divDocument.offsetHeight + 10 - divContainer.offsetHeight) / 100 * percent * -1) + "px";
}//ScrollDraggin

function StartScroll(direction,containerId, documentId){

    scrollTimer = setInterval("Scroll(" + direction + ",'"+containerId+"','"+documentId+"')",100);
}//StartScroll

function StopScroll(){
    
    clearInterval ( scrollTimer );
}//StopScroll

function SetScrollSpeed(newSpeed){
    
    scrollSpeed = newSpeed;
}//SetScrollSpeed

function InitScrollPosition(containerId, documentId, topPosition){
    
    var divContainer = document.getElementById(containerId);
    var divDocument = document.getElementById(documentId);
    
    divDocument.style.top = topPosition + "px";
    
    //Move slider
    var total = divDocument.offsetHeight - divContainer.offsetHeight;
    var percent = (parseInt(divDocument.style.top.substring(0,divDocument.style.top.length - 2 )) * 100)/total * -1;
    
    if(percent > 100)
        percent = 100;
    
    //Move slider
    document.getElementById(containerId+'ScrollbarSlider').style.top = ((document.getElementById(containerId+'ScrollbarBackground').offsetHeight - document.getElementById(containerId+'ScrollbarSlider').offsetHeight) / 100 * percent) + "px";
}

function Scroll(direction, containerId, documentId){

    var divContainer = document.getElementById(containerId);
    var divDocument = document.getElementById(documentId);
    
    if(direction == 1){
    
        /*Scroll up.*/
        var maxScrollPosition = 0;
        
        if( OffsetTop(divDocument) + scrollSpeed > maxScrollPosition ){
            divDocument.style.top = maxScrollPosition + "px";
        }//if
        else{
            divDocument.style.top = OffsetTop(divDocument) + scrollSpeed + "px";
        }//else
        
        //Move slider
        var total = divDocument.offsetHeight - divContainer.offsetHeight;
        var percent = (parseInt(divDocument.style.top.substring(0,divDocument.style.top.length - 2 )) * 100)/total * -1;
        
        if(percent > 100)
            percent = 100;
        
        //Move slider
        document.getElementById(containerId+'ScrollbarSlider').style.top = ((document.getElementById(containerId+'ScrollbarBackground').offsetHeight - document.getElementById(containerId+'ScrollbarSlider').offsetHeight) / 100 * percent) + "px";
    }//if
    else if(direction == -1){
    
        /*Scroll down.*/
        var maxScrollPosition = divContainer.offsetHeight - divDocument.offsetHeight - 10;
        
        if( OffsetTop(divDocument) - scrollSpeed < maxScrollPosition ){
            divDocument.style.top = maxScrollPosition + "px";
        }//if
        else{
            divDocument.style.top = OffsetTop(divDocument) - scrollSpeed + "px";
        }//else
        
        //Move slider
        var total = divDocument.offsetHeight - divContainer.offsetHeight;
        var percent = (parseInt(divDocument.style.top.substring(0,divDocument.style.top.length - 2 )) * 100)/total * -1;
        
        if(percent > 100)
            percent = 100;
        
        //Move slider
        document.getElementById(containerId+'ScrollbarSlider').style.top = ((document.getElementById(containerId+'ScrollbarBackground').offsetHeight - document.getElementById(containerId+'ScrollbarSlider').offsetHeight) / 100 * percent) + "px";
    }//else if
}//Scroll

function OffsetTop(element){

    if(element.style.top.length > 2)
        return parseInt(element.style.top.substring(0,element.style.top.length - 2 ));
    else
        return 0;
}//OffsetTop