// TEXT SCROLLER
var contentY = 0;
var draggerY = 0;
var scrollSpeed = 0;

var maskDiv = document.getElementById("scrollMask");
var maskHeight;
var maskWidth;

var contentDiv = document.getElementById("scrollContent");
var contentHeight;
var contentWidth;
var contentMin;
var contentMax;	

var arrowUp;
var arrowUpHeight;
var arrowDown;
var arrowDownHeight;

var scrollLine;

var draggerDiv;
var draggerDivHeight;
var draggerDivTop;
var dragFactor;
var dragMin;
var dragMax;


function initScroller() {	
	initDrag();
	maskDiv = document.getElementById("scrollMask");	
	maskHeight = maskDiv.offsetHeight;
	maskWidth = maskDiv.offsetWidth;
	
	contentDiv = document.getElementById("scrollContent");
	contentHeight = contentDiv.offsetHeight;
	contentWidth = contentDiv.offsetWidth;
	contentMin = maskHeight - contentHeight;
	contentMax = 0;	
		
	arrowUp = document.getElementById("arrowUp");
	arrowUpHeight = arrowUp.offsetHeight;
	
	arrowDown = document.getElementById("arrowDown");
	arrowDownHeight = arrowDown.offsetHeight;
	
	scrollLine = document.getElementById("scrollLine");
	
	draggerDiv = document.getElementById("draggerDiv");
	draggerDivHeight = draggerDiv.offsetHeight;
	draggerDivTop = draggerDiv.offsetTop;
	
	dragFactor = (maskHeight-arrowUpHeight-arrowDownHeight-draggerDivHeight)/(contentHeight-maskHeight);
	dragMin = arrowUpHeight;
	dragMax = maskHeight - arrowUpHeight - draggerDivHeight;
	
	
	if (contentHeight > maskHeight) {
		//maskDiv.style.borderTop = "#FFFFFF dotted 1px";
		maskDiv.style.borderBottom = "#CCCCCC dotted 1px";		
		//contentDiv.style.width = maskWidth-30 +'px';		
		arrowUp.style.left =  maskWidth-20 +'px';		
		arrowDown.style.left =  maskWidth-20 +'px';
		arrowDown.style.top = maskHeight-20 +'px';		
		scrollLine.style.left =  maskWidth-20 +'px';
		scrollLine.style.height = maskHeight +'px';			
		draggerDiv.style.left =  maskWidth-20 +'px';			
	}
	if (window.addEventListener) window.addEventListener('DOMMouseScroll', wheel, false); window.onmousewheel = document.onmousewheel = wheel;
	
	
}

function scrollDiv() {	
	if (scrollSpeed < 0) {		
		if (contentY > contentMin) {
			var nextY = contentY + scrollSpeed;			
		}else{
			var nextY = contentMin;
		}
	} else  {		
		if (contentY < contentMax) {
			var nextY = contentY + scrollSpeed;
		}else{
			var nextY = contentMax;
		}
	} 	
	
	moveContent(nextY);	
	if (scrollSpeed > 0 || scrollSpeed < 0) setTimeout("scrollDiv();", 1);
}


function moveContent(nextY) {
	contentY = nextY;	
	draggerY = arrowUpHeight - (nextY * dragFactor);
	
	contentDiv.style.top = contentY +'px';
	draggerDiv.style.top = draggerY +'px';
	
	setBorders();
}

function moveDragger(nextY) {
	contentY = - ((nextY - arrowUpHeight)  / dragFactor);	
	contentDiv.style.top = contentY +'px';	
	setBorders();
}


var dragObject = null; // Das Objekt was "gedraggt" wird
var start = [];

function initDrag() {
	
    var all = document.all ? document.all : document.getElementsByTagName('*');
    for(var i = 0; i < all.length; i++)
    if(all[i].className && all[i].className.indexOf('drag') > -1)
    {
         all[i].onmousedown = drag_start;
         all[i].style.cursor = 'move';
    }
}

function drag_start(e) {
    
    start = getPos(this); // Position des Elements    
    var evt_pos = getEvtPos(e);// Position des Events    
    start[0] -= evt_pos[0];// Die realative Startposition
   
    // Die Dragfunktion aktivieren
    dragObject = this;
    document.onmouseup = end_drag;
    document.onmousemove = do_drag;
 
    // ist wichtig, da ansonsten FF nicht draggt.
    return false;
}
 
function do_drag(e) {
    if(!dragObject) return;
 
   // Position des Events
    var pos = getEvtPos(e);
	var nextY = pos[0] + start[0];
	if (nextY < dragMin) nextY = dragMin;
	if (nextY > dragMax) nextY = dragMax;
	
	moveDragger(nextY);
    dragObject.style.top = nextY + 'px'; 
	
	return false;	
}

function end_drag(e) {
    document.onmouseup = null;
    document.onmousemove = null;
    dragObject = null;
	return false;
}


function wheel(event) {
	var safari	= (navigator.userAgent.indexOf('Safari') > 0); 	
	var delta = 0;
	
	if (!event) event = window.event;
	if (event.wheelDelta) { 
		delta = event.wheelDelta/5; // IE
		if (safari) delta = event.wheelDelta/40; //SAFARI
		if (window.opera) delta = event.wheelDelta /2; // OPERA
	} else if (event.detail) { 
		delta = -event.detail* 20; // FIREFOX		
	}
	
	if (delta) {		
		scrollSpeed=delta;
		scrollDiv();
	} 
	if (event.preventDefault) event.preventDefault();
	event.returnValue = false;
	scrollSpeed=0;
}


function setBorders() {
	if (contentY == contentMin) {		
		//maskDiv.style.borderTop = "#CCCCCC dotted 1px";
		maskDiv.style.borderBottom = "#FFFFFF dotted 1px";
	}else if (contentY == contentMax){	
		//maskDiv.style.borderTop = "#FFFFFF dotted 1px";
		maskDiv.style.borderBottom = "#CCCCCC dotted 1px";			
	} else{		
		//maskDiv.style.borderTop = "#CCCCCC dotted 1px";
		maskDiv.style.borderBottom = "#CCCCCC dotted 1px";
	}
}



// Hilfsfunktionen:
function getPos(o) {
    var t = l = 0;
    if(typeof o.offsetTop != 'undefined') {
         t += o.offsetTop;
         l += o.offsetLeft;
    }
    return [t, l];
}

function getEvtPos(e) {
    if(!e) e = window.event;
    var t = e.pageY ? e.pageY : e.clientY + window.document.body.scrollTop;
    var l = e.pageX ? e.pageX : e.clientX + window.document.body.scrollLeft;
    return [t, l];
}