ScrollableDiv = function(id, upElementId, downElementId, objName) {

    this.timerId = null;
    this.scrollOn = false;
    this.divId = id;
    this.upElementId = upElementId;
	this.downElementId = downElementId;
    this.objName = objName;

	
	this.registerEvents = function () {
		
		var instance = this;
		
	    document.getElementById(this.upElementId).onmouseover = function() {
			instance.startScrollUp();
		}
		document.getElementById(this.upElementId).onmouseout = function() {
	        instance.stopScroll();
	    }
	    document.getElementById(this.downElementId).onmouseover = function() {
			instance.startScrollDown();
	    }
	    document.getElementById(this.downElementId).onmouseout = function() {
	        instance.stopScroll();
	    }
		document.getElementById(this.upElementId).onclick = function() {
            return false;
        }
        document.getElementById(this.downElementId).onclick = function() {
            return false;
        }
	}
	
	
    /**
     * Start scroll (down)
     */
    this.startScrollDown = function() {
        if(!this.scrollOn) {
            var instance = this;
            this.timerId = setInterval(this.objName+".scrollDown()", 100);
            this.scrollOn = true;
        }
    }

    /**
     * Start scroll (up)
     */
    this.startScrollUp = function() {
        if(!this.scrollOn) {
            var instance = this;
            this.timerId = setInterval(this.objName+".scrollUp()", 100);
            this.scrollOn = true;
        }   
    }

    /**
     * Stop scroll
     */
    this.stopScroll = function() {
        if(this.scrollOn) {
            clearInterval(this.timerId);
            this.scrollOn = false;
        }
    }
    
    /**
     * Scrolling up and down
     */
    this.scrollDown = function() {
        document.getElementById(this.divId).scrollTop += 10;
    }
    this.scrollUp = function() {
        document.getElementById(this.divId).scrollTop -= 10;
    }
	
	this.scrollToTop = function () {
		document.getElementById(this.divId).scrollTop = 0;
	}
}


ScrollableHorizontalDiv = function(id, upElementId, downElementId, objName) {

    this.timerId = null;
    this.scrollOn = false;
    this.divId = id;
    this.upElementId = upElementId;
    this.downElementId = downElementId;
    this.objName = objName;

    
    this.registerEvents = function () {
        
        var instance = this;
        
        document.getElementById(this.upElementId).onmouseover = function() {
            instance.startScrollUp();
        }
        document.getElementById(this.upElementId).onmouseout = function() {
            instance.stopScroll();
        }
        document.getElementById(this.downElementId).onmouseover = function() {
            instance.startScrollDown();
        }
        document.getElementById(this.downElementId).onmouseout = function() {
            instance.stopScroll();
        }
        document.getElementById(this.upElementId).onclick = function() {
            return false;
        }
        document.getElementById(this.downElementId).onclick = function() {
            return false;
        }
    }
    
    
    /**
     * Start scroll (down)
     */
    this.startScrollDown = function() {
        if(!this.scrollOn) {
            var instance = this;
            this.timerId = setInterval(this.objName+".scrollDown()", 100);
            this.scrollOn = true;
        }
    }

    /**
     * Start scroll (up)
     */
    this.startScrollUp = function() {
        if(!this.scrollOn) {
            var instance = this;
            this.timerId = setInterval(this.objName+".scrollUp()", 100);
            this.scrollOn = true;
        }   
    }

    /**
     * Stop scroll
     */
    this.stopScroll = function() {
        if(this.scrollOn) {
            clearInterval(this.timerId);
            this.scrollOn = false;
        }
    }
    
    /**
     * Scrolling up and down
     */
    this.scrollDown = function() {
        document.getElementById(this.divId).scrollLeft += 25;
    }
    this.scrollUp = function() {
        document.getElementById(this.divId).scrollLeft -= 25;
    }
    
    this.scrollToTop = function () {
        document.getElementById(this.divId).scrollLeft = 0;
    }
}
