var CONST_SECT_NONE = '0';
var CONST_SECT_TOP = '1';
var CONST_SECT_BOT = '2';

var SLEEP_TIME = 30;
var SCROLL_SLOW_RATIO = 5;
var SCROLL_ZONE_HEIGHT = 20;

var CLIENT_SELECT_HEIGHT_OPEN = "100%";
var CLIENT_SELECT_HEIGHT_CLOSED = "20px";

var contentOffsetY = 0;
var sectionIn = CONST_SECT_NONE;

function mouseMoved(e) {

	var posx = 0;
	var posy = 0;

	if (!e) {
		e = window.event;
	}			

	if (e.pageX || e.pageY) {
		posx = e.pageX;
		posy = e.pageY;
	} else if (e.clientX || e.clientY) {
		posx = e.clientX + document.body.scrollLeft	+ document.documentElement.scrollLeft;
		posy = e.clientY + document.body.scrollTop + document.documentElement.scrollTop;
	}

	var boxPos = findPos(document.getElementById('filter_box'));
	posXRelative = posx - boxPos[0]; 
	posYRelative = posy - boxPos[1];

	var viewPortHeight = document.getElementById('filter_box').offsetHeight;
	
	if (posYRelative <= SCROLL_ZONE_HEIGHT && posYRelative > 0 && posXRelative > 0 && posXRelative < 650) {
		sectionIn = CONST_SECT_TOP;
		scrollDiff = SCROLL_ZONE_HEIGHT - posYRelative;
	} else if(posYRelative >= viewPortHeight - SCROLL_ZONE_HEIGHT && posYRelative < viewPortHeight && posXRelative > 0 && posXRelative < 650) {
		sectionIn = CONST_SECT_BOT;
		scrollDiff = posYRelative - (viewPortHeight - SCROLL_ZONE_HEIGHT);
	} else {
		sectionIn = CONST_SECT_NONE;
	}
}

function frameUpdate() {

	var scrollAmt = 0;
	
	bottomLimit = getBottomLimit()
	
	if (sectionIn == CONST_SECT_TOP && contentOffsetY < 0) {
		scrollAmt = Math.min(scrollDiff, -contentOffsetY);
	} else if (sectionIn == CONST_SECT_BOT && contentOffsetY > bottomLimit) {
		scrollAmt = Math.max(-scrollDiff, bottomLimit - contentOffsetY);
	}
	
	contentOffsetY += (scrollAmt / SCROLL_SLOW_RATIO);
	
	// Ensure we can reach the scroll pane limits (to ensure arrows disappear when needed)
	if (contentOffsetY >= -1) {
		contentOffsetY = 0;
	} else if (contentOffsetY <= bottomLimit + 1) {
		contentOffsetY = bottomLimit;
	}
	
	document.getElementById('filter_content').style.top = contentOffsetY + "px";
	
	document.getElementById('filter_arrow_up').style.visibility = 
		(contentOffsetY == 0 ? 'hidden' : 'visible'); 
	
	document.getElementById('filter_arrow_down').style.visibility = 
		(contentOffsetY == bottomLimit ? 'hidden' : 'visible'); 
}

function itemIn(item, id) {

	document.getElementById(item + '_' + id).style.backgroundColor = "#CCCCCC";
}

function itemOut(item, id) {

	var bgColInherit = 
		document.getElementById('filter_content').style.backgroundColor;

	document.getElementById(item + '_' + id).style.backgroundColor = bgColInherit;
}

function setFilterFocus(item, indexSelected) {
	
	contentOffsetY = 
		-document.getElementById(item + '_1').offsetHeight * (indexSelected - 1)
	
	var bottomLimit = getBottomLimit();
	
	if (contentOffsetY < bottomLimit) {
		contentOffsetY = bottomLimit;
	}
}

function openClientFilter() {
	
	var clientSelectStyle = document.getElementById('client_select').style;
	
	clientSelectStyle.height = 
		(clientSelectStyle.height == CLIENT_SELECT_HEIGHT_OPEN ? 
			clientSelectStyle.height = CLIENT_SELECT_HEIGHT_CLOSED :
			clientSelectStyle.height = CLIENT_SELECT_HEIGHT_OPEN);
}

function getBottomLimit() {
	
	var scrollPaneHeight = document.getElementById('filter_content').offsetHeight;
	
	var viewPortHeight = document.getElementById('filter_box').offsetHeight;
	
	if (viewPortHeight > scrollPaneHeight) {
		viewPortHeight = scrollPaneHeight
	}

	var bottomLimit = viewPortHeight - scrollPaneHeight;
	
	return bottomLimit;
}	

function findPos(obj) {

	var curleft = curtop = 0;

	if (obj.offsetParent) {

		do {
			curleft += obj.offsetLeft;
			curtop += obj.offsetTop;

		} while (obj = obj.offsetParent);
	}	
	
	return [curleft, curtop];
}

runloop = true;

setInterval("frameUpdate()", SLEEP_TIME);