/*
Scripts to create interactive scrollbars in SVG using ECMA script
Copyright (C) <2006>  <Andreas Neumann>
Version 0.9.1, 2006-10-30
neumann@karto.baug.ethz.ch
http://www.carto.net/
http://www.carto.net/neumann/

Credits:

----

current version: 0.9.1

version history:
0.9 (2006-10-12)
initial version

0.9.1 (2006-10-30)
added .show(), .hide() and .remove() methods

-------


This ECMA script library is free software; you can redistribute it and/or
modify it under the terms of the GNU Lesser General Public
License as published by the Free Software Foundation; either
version 2.1 of the License, or (at your option) any later version.

This library is distributed in the hope that it will be useful,
but WITHOUT ANY WARRANTY; without even the implied warranty of
MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the GNU
Lesser General Public License for more details.

You should have received a copy of the GNU Lesser General Public
License along with this library (lesser_gpl.txt); if not, write to the Free Software
Foundation, Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301  USA

----

original document site: http://www.carto.net/papers/svg/gui/scrollbar/
Please contact the author in case you want to use code or ideas commercially.
If you use this code, please include this copyright header, the included full
LGPL 2.1 text and read the terms provided in the LGPL 2.1 license
(http://www.gnu.org/copyleft/lesser.txt)

-------------------------------

Please report bugs and send improvements to neumann@karto.baug.ethz.ch
If you use this control, please link to the original (http://www.carto.net/papers/svg/gui/scrollbar/)
somewhere in the source-code-comment or the "about" of your project and give credits, thanks!

*/

function scrollbar(id,parentNode,x,y,width,height,startValue,endValue,initialHeightPerc,initialOffset,scrollStep,scrollButtonLocations,scrollbarStyles,scrollerStyles,triangleStyles,highlightStyles,functionToCall) {
    var nrArguments = 17;
    var createScrollbar = true;
    if (arguments.length == nrArguments) {
        //get constructor variables
        this.id = id;
        this.parentNode = parentNode;
        this.x = x;
        this.y = y;
        this.width = width;
        this.height = height;
        this.startValue = startValue;
        this.endValue = endValue;
        this.initialHeightPerc = initialHeightPerc;
        this.initialOffset = initialOffset;
        this.scrollStep = scrollStep; //this value indicates how much the slider will scroll when the arrow buttons are pressed, values are in percentage
        this.scrollButtonLocations = scrollButtonLocations;
        if (this.scrollButtonLocations != "bottom_bottom" && this.scrollButtonLocations != "top_bottom" && this.scrollButtonLocations && "top_top" && this.scrollButtonLocations != "none_none") {
            createScrollbar = false;
            alert("Error: parameter 'scrollButtonLocations' can only be of the following values: 'bottom_bottom' || 'top_top' || 'top_bottom' || 'none_none'.");        
        }
        this.scrollbarStyles = scrollbarStyles;
        this.scrollerStyles = scrollerStyles;
        this.triangleStyles = triangleStyles;
        this.highlightStyles = highlightStyles;
        this.functionToCall = functionToCall;
        //additional properties to be used later
        this.horizOrVertical = "vertical"; //specifies wether scrollbar is horizontal or vertical
        this.cellHeight = this.width; //the height or width of the buttons on top or bottom of the scrollbar
        this.scrollStatus = false; //indicates whether scrolling is active
        this.buttonScrollActive = false; //indicates whether the scrollbutton is currently being pressed
        this.scrollbarScrollActive = false; //indicates whether the scrollbar is currently being pressed
    }
    else {
        createScrollbar = false;
        alert("Error ("+id+"): wrong nr of arguments! You have to pass over "+nrArguments+" parameters.");
    }
    if (createScrollbar) {
        //create scrollbar
        var result = this.testParent();
        if (result) {
            //timer stuff
            this.timer = new Timer(this); //a Timer instance for calling the functionToCall
            this.timerMs = 200; //a constant of this object that is used in conjunction with the timer - functionToCall is called after 200 ms
            this.createScrollbar();
        }
        else {
            alert("could not create or reference 'parentNode' of scrollbar with id '"+this.id+"'");
        }            
    }
    else {
        alert("Could not create scrollbar with id '"+id+"' due to errors in the constructor parameters");    
    }
}

//test if parent group exists or create a new group at the end of the file
scrollbar.prototype.testParent = function() {
    //test if of type object
    var nodeValid = false;
    this.parentGroup = document.createElementNS(svgNS,"g");
    if (typeof(this.parentNode) == "object") {
        if (this.parentNode.nodeName == "svg" || this.parentNode.nodeName == "g" || this.parentNode.nodeName == "svg:svg" || this.parentNode.nodeName == "svg:g") {
            this.parentNode.appendChild(this.parentGroup);
            nodeValid = true;
        }
    }
    else if (typeof(this.parentNode) == "string") { 
        //first test if button group exists
        if (!document.getElementById(this.parentNode)) {
            this.parentGroup.setAttributeNS(null,"id",this.parentNode);
            document.documentElement.appendChild(this.parentGroup);
            nodeValid = true;
           }
           else {
               document.getElementById(this.parentNode).appendChild(this.parentGroup);
               nodeValid = true;
           }
       }
       return nodeValid;
}

//create scrollbar geometry
scrollbar.prototype.createScrollbar = function() {
    //first determine if vertical of horizontal
    if (this.width > this.height) {
        this.horizOrVertical = "horizontal";
        this.cellHeight = this.height;
    }
    this.triangleFourth = Math.round(this.cellHeight / 4); //this is used to construct the triangles for the buttons

    if (this.scrollButtonLocations != "none_none") {
        this.scrollUpperRect = document.createElementNS(svgNS,"rect");
        this.scrollLowerRect = document.createElementNS(svgNS,"rect");
        this.scrollUpperTriangle = document.createElementNS(svgNS,"path");
        this.scrollLowerTriangle = document.createElementNS(svgNS,"path");
    }
 
    if (this.horizOrVertical == "vertical")  {
        this.scrollUpperRectX = this.x;
        this.scrollLowerRectX = this.x;
        switch (this.scrollButtonLocations)  {
            case "top_top":
                this.scrollbarX = this.x;
                this.scrollbarY = this.y + (2 * this.cellHeight);
                this.scrollbarWidth = this.width;
                this.scrollbarHeight = this.height - (2 * this.cellHeight);
                 this.scrollUpperRectY = this.y;
                 this.scrollLowerRectY = this.y + this.cellHeight;
                break;
            case "bottom_bottom":
                this.scrollbarX = this.x;
                this.scrollbarY = this.y;
                this.scrollbarWidth = this.width;
                this.scrollbarHeight = this.height - (2 * this.cellHeight);
                 this.scrollUpperRectY = this.y + this.height - (2 * this.cellHeight);
                 this.scrollLowerRectY = this.y + this.height - this.cellHeight;
                break;
            case "top_bottom":
                this.scrollbarX = this.x;
                this.scrollbarY = this.y + this.cellHeight;
                this.scrollbarWidth = this.width;
                this.scrollbarHeight = this.height - (2 * this.cellHeight);
                 this.scrollUpperRectY = this.y;
                 this.scrollLowerRectY = this.y + this.height - this.cellHeight;
                break;
            default:
                this.scrollbarX = this.x;
                this.scrollbarY = this.y;
                this.scrollbarWidth = this.width;
                this.scrollbarHeight = this.height;
                break;                
        }
        var myUpperTriPath = "M"+(this.scrollUpperRectX + this.cellHeight * 0.5)+" "+(this.scrollUpperRectY + this.triangleFourth)+" L"+(this.scrollUpperRectX + 3 * this.triangleFourth)+" "+(this.scrollUpperRectY + 3 * this.triangleFourth)+" L"+(this.scrollUpperRectX + this.triangleFourth)+" "+(this.scrollUpperRectY + 3 * this.triangleFourth)+" Z";
        var myLowerTriPath = "M"+(this.scrollLowerRectX + this.cellHeight * 0.5)+" "+(this.scrollLowerRectY + 3 * this.triangleFourth)+" L"+(this.scrollLowerRectX + this.triangleFourth)+" "+(this.scrollLowerRectY + this.triangleFourth)+" L"+(this.scrollLowerRectX + this.triangleFourth * 3)+" "+(this.scrollLowerRectY + this.triangleFourth)+" Z";
    }

    if (this.horizOrVertical == "horizontal")  {
        this.scrollUpperRectY = this.y;
        this.scrollLowerRectY = this.y;
        switch (this.scrollButtonLocations)  {
            case "top_top":
                this.scrollbarX = this.x + (2 * this.cellHeight);
                this.scrollbarY = this.y;
                this.scrollbarWidth = this.width - (2 * this.cellHeight);
                this.scrollbarHeight = this.height;
                this.scrollUpperRectX = this.x;
                 this.scrollLowerRectX = this.x + this.cellHeight;
                break;
            case "bottom_bottom":
                this.scrollbarX = this.x;
                this.scrollbarY = this.y;
                this.scrollbarWidth = this.width - (2 * this.cellHeight);
                this.scrollbarHeight = this.height;
                 this.scrollUpperRectX = this.x + this.width - (2 * this.cellHeight);
                 this.scrollLowerRectX = this.x + this.width - this.cellHeight;
                break;
            case "top_bottom":
                this.scrollbarX = this.x + this.cellHeight;
                this.scrollbarY = this.y;
                this.scrollbarWidth = this.width - (2 * this.cellHeight);
                this.scrollbarHeight = this.height;
                 this.scrollUpperRectX = this.x;
                 this.scrollLowerRectX = this.x + this.width - this.cellHeight;
                break;
            default:
                this.scrollbarX = this.x;
                this.scrollbarY = this.y;
                this.scrollbarWidth = this.width;
                this.scrollbarHeight = this.height;
                break;                
        }
        var myUpperTriPath = "M"+(this.scrollUpperRectX + this.triangleFourth)+" "+(this.scrollUpperRectY + this.triangleFourth * 2)+" L"+(this.scrollUpperRectX + 3 * this.triangleFourth)+" "+(this.scrollUpperRectY + this.triangleFourth)+" L"+(this.scrollUpperRectX + 3 * this.triangleFourth)+" "+(this.scrollUpperRectY + 3 * this.triangleFourth)+" Z";
        var myLowerTriPath = "M"+(this.scrollLowerRectX + this.triangleFourth * 3)+" "+(this.scrollLowerRectY + 2 * this.triangleFourth)+" L"+(this.scrollLowerRectX + this.triangleFourth)+" "+(this.scrollLowerRectY + this.triangleFourth * 3)+" L"+(this.scrollLowerRectX + this.triangleFourth)+" "+(this.scrollLowerRectY + this.triangleFourth)+" Z";
    }

    this.scrollbar = document.createElementNS(svgNS,"rect");
    this.scrollbar.setAttributeNS(null,"x",this.scrollbarX);
    this.scrollbar.setAttributeNS(null,"y",this.scrollbarY);
    this.scrollbar.setAttributeNS(null,"width",this.scrollbarWidth);
    this.scrollbar.setAttributeNS(null,"height",this.scrollbarHeight);
    this.scrollbar.setAttributeNS(null,"id","scrollbar_"+this.id);
    for (var attrib in this.scrollbarStyles) {
        this.scrollbar.setAttributeNS(null,attrib,this.scrollbarStyles[attrib]);
    }
    this.scrollbar.addEventListener("mousedown",this,false);
    this.parentGroup.appendChild(this.scrollbar);
    //now create scroller
    this.scroller = document.createElementNS(svgNS,"rect");
    if (this.horizOrVertical == "vertical")  {
        this.scroller.setAttributeNS(null,"x",this.scrollbarX);
        this.scrollerY = this.scrollbarY + (this.scrollbarHeight - this.scrollbarHeight * this.initialHeightPerc)  * this.initialOffset;
        this.scroller.setAttributeNS(null,"y",this.scrollerY);
        this.scroller.setAttributeNS(null,"width",this.scrollbarWidth);
        this.scrollerHeight = this.scrollbarHeight * this.initialHeightPerc;
        this.scroller.setAttributeNS(null,"height",this.scrollerHeight);
    }
    if (this.horizOrVertical == "horizontal")  {
        this.scrollerX = this.scrollbarX + (this.scrollbarWidth - this.scrollbarWidth * this.initialHeightPerc)  * this.initialOffset;
        this.scroller.setAttributeNS(null,"x",this.scrollerX);
        this.scroller.setAttributeNS(null,"y",this.scrollbarY);
        this.scrollerWidth = this.scrollbarWidth * this.initialHeightPerc;
        this.scroller.setAttributeNS(null,"width",this.scrollerWidth);
        this.scroller.setAttributeNS(null,"height",this.scrollbarHeight);
    }
    for (var attrib in this.scrollerStyles) {
        this.scroller.setAttributeNS(null,attrib,this.scrollerStyles[attrib]);
    }
    //need to add events here
    this.scroller.setAttributeNS(null,"id","scroller_"+this.id);
    this.scroller.addEventListener("mousedown",this,false);
    this.parentGroup.appendChild(this.scroller);
    //append rects and triangles
    if (this.scrollButtonLocations != "none_none") {
        //upper rect
        for (var attrib in this.scrollerStyles) {
            this.scrollUpperRect.setAttributeNS(null,attrib,this.scrollerStyles[attrib]);
        }
        this.scrollUpperRect.setAttributeNS(null,"x",this.scrollUpperRectX);
        this.scrollUpperRect.setAttributeNS(null,"y",this.scrollUpperRectY);
        this.scrollUpperRect.setAttributeNS(null,"width",this.cellHeight);
        this.scrollUpperRect.setAttributeNS(null,"height",this.cellHeight);
        this.scrollUpperRect.addEventListener("mousedown", this, false);
        this.scrollUpperRect.setAttributeNS(null,"id","scrollUpperRect_"+this.id);
        this.parentGroup.appendChild(this.scrollUpperRect);
        //lower rect
        for (var attrib in this.scrollerStyles) {
            this.scrollLowerRect.setAttributeNS(null,attrib,this.scrollerStyles[attrib]);
        }
        this.scrollLowerRect.setAttributeNS(null,"x",this.scrollLowerRectX);
        this.scrollLowerRect.setAttributeNS(null,"y",this.scrollLowerRectY);
        this.scrollLowerRect.setAttributeNS(null,"width",this.cellHeight);
        this.scrollLowerRect.setAttributeNS(null,"height",this.cellHeight);
        this.scrollLowerRect.addEventListener("mousedown", this, false);
        this.scrollLowerRect.setAttributeNS(null,"id","scrollLowerRect_"+this.id);
        this.parentGroup.appendChild(this.scrollLowerRect);
        //upper triangle
        this.scrollUpperTriangle.setAttributeNS(null,"d",myUpperTriPath);
        this.scrollUpperTriangle.setAttributeNS(null,"pointer-events","none");
        for (var attrib in this.triangleStyles) {
            this.scrollUpperTriangle.setAttributeNS(null,attrib,this.triangleStyles[attrib]);
        }
        this.parentGroup.appendChild(this.scrollUpperTriangle);
        //lower triangle
        this.scrollLowerTriangle.setAttributeNS(null,"d",myLowerTriPath);
        this.scrollLowerTriangle.setAttributeNS(null,"pointer-events","none");
        for (var attrib in this.triangleStyles) {
            this.scrollLowerTriangle.setAttributeNS(null,attrib,this.triangleStyles[attrib]);
        }
        this.parentGroup.appendChild(this.scrollLowerTriangle);
    }
 }
 
 scrollbar.prototype.handleEvent = function(evt) {
    var el = evt.target;
    var callerId = el.getAttributeNS(null,"id");
    if (evt.type == "mousedown") {
        if (callerId == "scroller_"+this.id) {
            //case the mouse went down on scroller
            this.scroll(evt);
        }
        if (callerId == "scrollLowerRect_"+this.id || callerId == "scrollUpperRect_"+this.id) {
            //this part is for scrolling per button
            this.buttonScrollActive = true;
            this.scrollDir = "down";
            this.currentScrollButton = evt.target;
            this.currentScrollTriangle = this.scrollLowerTriangle;
            if (callerId == "scrollUpperRect_"+this.id) {
                this.scrollDir = "up";
                this.currentScrollTriangle = this.scrollUpperTriangle;
            }
            document.documentElement.addEventListener("mouseup",this,false);
            //change appearance of button
            for (var attrib in this.scrollerStyles) {
                this.currentScrollButton.removeAttributeNS(null,attrib);
            }
            for (var attrib in this.highlightStyles) {
                this.currentScrollButton.setAttributeNS(null,attrib,this.highlightStyles[attrib]);
            }
            //change appearance of triangle
            for (var attrib in this.triangleStyles) {
                this.currentScrollTriangle.removeAttributeNS(null,attrib);
            }
            for (var attrib in this.scrollerStyles) {
                this.currentScrollTriangle.setAttributeNS(null,attrib,this.scrollerStyles[attrib]);
            }
            this.scrollPercent(this.scrollDir,this.scrollStep);
            this.timer.setTimeout("scrollPerButton",400);
        }
        if (callerId == "scrollbar_"+this.id) {
            //this part is for scrolling when mouse is down on scrollbar
            var coords = myMapApp.calcCoord(evt,this.scrollbar);
            this.scrollbarScrollActive = true;
            this.scrollDir = "down";
            if (this.horizOrVertical == "vertical") {
                if (coords.y < this.scrollerY) {
                    this.scrollDir = "up";
                }
            }
            if (this.horizOrVertical == "horizontal") {
                if (coords.x < this.scrollerX) {
                    this.scrollDir = "up";
                }
            }
            document.documentElement.addEventListener("mouseup",this,false);
            //change styling
            for (var attrib in this.scrollerStyles) {
                this.scroller.removeAttributeNS(null,attrib);
            }
            for (var attrib in this.highlightStyles) {
                this.scroller.setAttributeNS(null,attrib,this.highlightStyles[attrib]);
            }
            this.scrollPercent(this.scrollDir,this.scrollStep*10);
            this.timer.setTimeout("scrollPerScrollbar",400);
        }
    }
    if (evt.type == "mousemove" && this.scrollStatus) {
        //this is for scrolling per scroller
        this.scroll(evt);
    }
    if (evt.type == "mouseup") {
        //this is for finishing the different scroll modi
        if (this.scrollStatus) {
            //finishing scroll per scroller
            this.scroll(evt);
        }
        if (this.buttonScrollActive) {
            //finishing scroll per button
            this.buttonScrollActive = false;
            document.documentElement.removeEventListener("mouseup",this,false);
            //change appearance of button
            for (var attrib in this.highlightStyles) {
                this.currentScrollButton.removeAttributeNS(null,attrib);
            }
            for (var attrib in this.scrollerStyles) {
                this.currentScrollButton.setAttributeNS(null,attrib,this.scrollerStyles[attrib]);
            }
            //change appearance of triangle
            for (var attrib in this.scrollerStyles) {
                this.currentScrollTriangle.removeAttributeNS(null,attrib);
            }
            for (var attrib in this.triangleStyles) {
                this.currentScrollTriangle.setAttributeNS(null,attrib,this.triangleStyles[attrib]);
            }
            this.currentScrollButton = undefined;
            this.currentScrollTriangle = undefined;
        }
        if (this.scrollbarScrollActive) {
            //finishing scroll per scrollbar
            this.scrollbarScrollActive = false;
            document.documentElement.removeEventListener("mouseup",this,false);        
            //change styling
            for (var attrib in this.highlightStyles) {
                this.scroller.removeAttributeNS(null,attrib);
            }
            for (var attrib in this.scrollerStyles) {
                this.scroller.setAttributeNS(null,attrib,this.scrollerStyles[attrib]);
            }
        }
    }
}

scrollbar.prototype.scroll = function(evt) {
    var coords = myMapApp.calcCoord(evt,this.scrollbar);
    if (evt.type == "mousedown") {
        document.documentElement.addEventListener("mousemove",this,false);
        document.documentElement.addEventListener("mouseup",this,false);
        this.scrollStatus = true;
        this.panCoords = coords;
        this.fireFunction("scrollStart");
        //change styling
        for (var attrib in this.scrollerStyles) {
            this.scroller.removeAttributeNS(null,attrib);
        }
        for (var attrib in this.highlightStyles) {
            this.scroller.setAttributeNS(null,attrib,this.highlightStyles[attrib]);
        }
    }
    if (evt.type == "mousemove") {
        var diffX = coords.x - this.panCoords.x;
        var diffY = coords.y - this.panCoords.y;
        var scrollerDiff = false;
        if (this.horizOrVertical == "vertical") {
            var scrollerOrigY = this.scrollerY;
            this.scrollerY += diffY;
            if (this.scrollerY < this.scrollbarY) {
                this.scrollerY = this.scrollbarY;
            }
            if ((this.scrollerY + this.scrollerHeight) > (this.scrollbarY + this.scrollbarHeight)) {
                this.scrollerY = this.scrollbarY + this.scrollbarHeight - this.scrollerHeight;
            }
            this.scroller.setAttributeNS(null,"y",this.scrollerY);
            if (scrollerOrigY != this.scrollerY) {
                scrollerDiff = true;
            }
        }
        if (this.horizOrVertical == "horizontal") {
            var scrollerOrigX = this.scrollerX;
            this.scrollerX += diffX;
            if (this.scrollerX < this.scrollbarX) {
                this.scrollerX = this.scrollbarX;
            }
            if ((this.scrollerX + this.scrollerWidth) > (this.scrollbarX + this.scrollbarWidth)) {
                this.scrollerX = this.scrollbarX + this.scrollbarWidth - this.scrollerWidth;
            }
            this.scroller.setAttributeNS(null,"x",this.scrollerX);
            if (scrollerOrigX != this.scrollerX) {
                scrollerDiff = true;
            }
        }
        if (scrollerDiff) {
            this.fireFunction("scrollChange");
        }
        this.panCoords = coords;
    }
    if (evt.type == "mouseup") {
        this.scrollStatus = false;
        document.documentElement.removeEventListener("mousemove",this,false);
        document.documentElement.removeEventListener("mouseup",this,false);
        //change styling
        for (var attrib in this.highlightStyles) {
            this.scroller.removeAttributeNS(null,attrib);
        }
        for (var attrib in this.scrollerStyles) {
            this.scroller.setAttributeNS(null,attrib,this.scrollerStyles[attrib]);
        }
        this.fireFunction("scrollEnd");
    }
}

scrollbar.prototype.scrollPercent = function(direction,increment) {
    var currentValues = this.getValue();
    if (direction == "up") {
        increment = increment * -1;
    }
    var newPercent = currentValues.perc + increment;
    if (newPercent < 0) {
        newPercent = 0;
    }
    if (newPercent > 1) {
        newPercent = 1;
    }
    this.scrollToPercent(newPercent);
}

scrollbar.prototype.scrollToPercent = function(percValue) {
    if (percValue >= 0 && percValue <= 1) {
        if (this.horizOrVertical == "vertical") {
            var newY = this.scrollbarY + (this.scrollbarHeight - this.scrollerHeight) * percValue;
            this.scrollerY = newY;
            this.scroller.setAttributeNS(null,"y",newY);
        }
        if (this.horizOrVertical == "horizontal") {
            var newX = this.scrollbarX + (this.scrollbarWidth - this.scrollerWidth) * percValue;
            this.scrollerX = newX;
            this.scroller.setAttributeNS(null,"x",newX);
        }
        this.fireFunction("scrolledStep");
    }
    else {
        alert("error in method '.scrollToPercent()' of scrollbar with id '"+this.id+"'. Value out of range. Value needs to be in range 0 <= value <= 1.");
    }
}

scrollbar.prototype.scrollPerButton = function() {
    if (this.buttonScrollActive) {
            this.scrollPercent(this.scrollDir,this.scrollStep);
            this.timer.setTimeout("scrollPerButton",150);
    }
}

scrollbar.prototype.scrollPerScrollbar = function() {
    if (this.scrollbarScrollActive) {
            this.scrollPercent(this.scrollDir,this.scrollStep*5);
            this.timer.setTimeout("scrollPerScrollbar",150);
    }
}

scrollbar.prototype.scrollToValue = function(value) {
    if ((value >= this.startValue && value <= this.endValue) || (value <= this.startValue && value >= this.endValue)) {
        var percValue = value/(this.endValue - this.startValue);
        this.scrollToPercent(percValue);
    }
    else {
        alert("Error in scrollbar with id '"+this.id+"': the provided value '"+value+"' is out of range. The valid range is between '"+this.startValue+"' and '"+this.endValue+"'");
    }
}

scrollbar.prototype.getValue = function() {
    var perc;
    if (this.horizOrVertical == "vertical") {
        perc = (this.scrollerY - this.scrollbarY) / (this.scrollbarHeight - this.scrollerHeight);
    }
    if (this.horizOrVertical == "horizontal") {
        perc = (this.scrollerX - this.scrollbarX) / (this.scrollbarWidth - this.scrollerWidth);
    }
    var abs = this.startValue + (this.endValue - this.startValue) * perc;
    return {"abs":abs,"perc":perc};
}

scrollbar.prototype.fireFunction = function(changeType) {
    var values = this.getValue();
    if (typeof(this.functionToCall) == "function") {
        this.functionToCall(this.id,changeType,values.abs,values.perc);
    }
    if (typeof(this.functionToCall) == "object") {
        this.functionToCall.scrollbarChanged(this.id,changeType,values.abs,values.perc);
    }
    if (typeof(this.functionToCall) == undefined) {
        return;
    }
}

scrollbar.prototype.hide = function() {
    this.parentGroup.setAttributeNS(null,"display","none");
}

scrollbar.prototype.show = function() {
    this.parentGroup.setAttributeNS(null,"display","inherit");
}

scrollbar.prototype.remove = function() {
    this.parentGroup.parentNode.removeChild(this.parentGroup);
}