var scrolltimer, contentmaskheight, textheight, dragheight, trackheight, tracktop, tracklength, trackbottom, contentlength;

var scrolldisplayed = false;

var minpageheight = 650;

function scrollinit() {
	if ($ES('div.scrollable').length > 0 && $ES('div#contentmask').length > 0) {
		if ($('maskedcontent').getSize().size.y > $('contentmask').getSize().size.y) {
			scrollspeed = 8;
			
			contentmaskheight = $('contentmask').getSize().size.y;
			contentheight = $('maskedcontent').getSize().size.y;
			
			//$('track').style.height = (contentmaskheight - $('up').getSize().size.y - $('down').getSize().size.y) + 'px';
			//$('down').style.top = ($('up').getSize().size.y + $('track').getSize().size.y) + 'px';
			
			$('maskedcontent').style.top = '0px';
			$('drag').style.top = $('up').getSize().size.y + 'px';
			
			trackheight = $('track').getSize().size.y;
			tracktop = $('up').getSize().size.y; //$('drag').offsetTop;  			** Modified for resize event, but somehow seems funky.
			
			//$('drag').style.height = parseInt((contentmaskheight / contentheight) * trackheight) + 'px';
			//$('drag_img').style.height = parseInt((contentmaskheight / contentheight) * trackheight) + 'px';

			dragheight = $('drag').getSize().size.y;
			tracklength = trackheight - dragheight;
			
			trackbottom = tracktop + tracklength;
			scrolltimer = null;
			
			$('track').onmousedown = scrolljump;
		
			$('up').onmousedown = function() { scroll(scrollspeed); return false; }
			$('up').onmouseup = stopscroll;
			$('up').onmouseout = stopscroll;
			
			$('down').onmousedown = function() { scroll(-scrollspeed); return false; }
			$('down').onmouseup = stopscroll;
			$('down').onmouseout = stopscroll;
			
			$('drag').onmousedown = startdrag;
			$('drag').ondragstart = function() { return false };

			$('track').style.visibility = 'visible';
			$('up').style.visibility = 'visible';
			$('down').style.visibility = 'visible';
			$('drag').style.visibility = 'visible';
			
			scrolldisplayed = true;
		} else {
			//$('track').style.visibility = 'hidden';
			//$('up').style.visibility = 'hidden';
			//$('down').style.visibility = 'hidden';
			$('drag').style.visibility = 'hidden';
			contentheight = $('maskedcontent').getSize().size.y;
			$('maskedcontent').style.top = '0px';
			
			scrolldisplayed = false;
		}

		loadcontent();
	}
}

function loadcontent(){
	contentlength = contentheight - contentmaskheight;
	scrolllength = tracklength / contentlength;
}

function scroll(speed) {
	var contentmovement = $('maskedcontent').offsetTop + speed;
	var dragmovement = tracktop - Math.round($('maskedcontent').offsetTop * (tracklength / contentlength));

	if (contentmovement > 0) {
		contentmovement = 0;
	} else if (contentmovement < -contentlength) {
		contentmovement = -contentlength;
	}
	

	if (dragmovement < tracktop) {
		dragmovement = tracktop;
	} else if (dragmovement > trackbottom) {
		dragmovement = trackbottom;
	}
	
	$('maskedcontent').style.top = contentmovement + 'px';
	$('drag').style.top = dragmovement + 'px';
	scrolltimer = window.setTimeout('scroll(' + speed + ')', 25);
}

function stopscroll() {
	if (scrolltimer) {
		window.clearTimeout(scrolltimer);
		scrolltimer = null;
	}
}

function getmouse(e) {
	return document.all ? event.clientY : e.pageY;
}

function startdrag(e) {
	dragstartmouse = getmouse(e);
	dragstartoffset = $('drag').offsetTop;
	document.onmousemove = drag;
	document.onmouseup = stopdrag;
	return false;
}

function stopdrag(){
	document.onmousemove = null;
	document.onmouseup = null;
}

function drag(e){
	var currentmouse = getmouse(e);
	var mousedifference = currentmouse - dragstartmouse;
	var dragdistance = dragstartoffset + mousedifference;
	var dragmovement = (dragdistance < tracktop) ? tracktop : (dragdistance > trackbottom) ? trackbottom : dragdistance;
	$('drag').style.top = dragmovement + 'px';
	var contentmovement = -(dragmovement - tracktop) * (1 / scrolllength);
	$('maskedcontent').style.top = contentmovement + 'px';
	return false;
}

function scrolljump(e) {
	var currentmouse = getmouse(e);
	var yoffset = $('contentmask') ? gettop($('contentmask')) : 0;
	var scrolloffset = getscrollposition();
	var dragdistance = (currentmouse - yoffset + scrolloffset);// - (dragheight / 2);
	var dragmovement = (dragdistance < tracktop) ? tracktop : (dragdistance > trackbottom) ? trackbottom : dragdistance;

	$('drag').style.top = dragmovement + 'px';
	var contentmovement = -(dragmovement - tracktop) * (1 / scrolllength);
	$('maskedcontent').style.top = contentmovement + 'px';
	return false;
}

function gettop(whichelement) {
    var toppos = whichelement.offsetTop;
    var parentelement = whichelement.offsetParent;
    while (parentelement != null) {
        toppos += parentelement.offsetTop;
        parentelement = parentelement.offsetParent;
    }
    return toppos;
}

function getscrollposition() {
	var x, y;
	if (self.pageYOffset) {
		x = self.pageXOffset;
		y = self.pageYOffset;
		return 0;
	} else if (document.documentElement && document.documentElement.scrollTop) {
		x = document.documentElement.scrollLeft;
		y = document.documentElement.scrollTop;
		return y;
	} else if (document.body) {
		x = document.body.scrollLeft;
		y = document.body.scrollTop;
		return y;
	}
}

function scrollanchor(el) {
	var contentmovement = -el.offsetTop;
	var dragmovement = tracktop - Math.round(-el.offsetTop * (tracklength / contentlength));

	if (contentmovement > 0) {
		contentmovement = 0;
	} else if (contentmovement < -contentlength) {
		contentmovement = -contentlength;
	}

	if (dragmovement < tracktop) {
		dragmovement = tracktop;
	} else if (dragmovement > trackbottom) {
		dragmovement = trackbottom;
	}
	
	$('maskedcontent').style.top = contentmovement + 'px';
	$('drag').style.top = dragmovement + 'px';
}


window.addEvent('load', scrollinit);