// JavaScript Document
var scrollOffset;
var scrollContentHeight;
var scrollViewerHeight;
var showList;
window.addEvent('domready', function(){
	
});

window.addEvent('load', function(){
	showList = new Fx.Tween('client_list');
	showList.start('opacity', 0, 1);
	scrollContentHeight = $('clients').getHeight();
	//console.log(scrollContentHeight);
	scrollViewerHeight = $('view_area').getHeight();
	//console.log(scrollViewerHeight);
	scrollOffset = 0;
	checkArrowVisibility();
	
	$('scrollUp').addEvent('click', scrollUp);
	$('scrollDown').addEvent('click', scrollDown);
});

function checkArrowVisibility() {
	if (scrollOffset + scrollContentHeight > scrollViewerHeight) {
		$('scrollDown').tween('opacity', 1);
	} else {
		$('scrollDown').tween('opacity', 0);
	}
	if (scrollOffset < 0) {
		$('scrollUp').tween('opacity', 1);
	} else {
		$('scrollUp').tween('opacity', 0);
	}
}

function scrollDown(e) {
	if ((scrollContentHeight + scrollOffset) > scrollViewerHeight) {
		scrollOffset = scrollOffset - scrollViewerHeight;
		//console.log(scrollOffset);
		$('clients').tween('margin-top', scrollOffset);	
		checkArrowVisibility();
	}
	
	return false;
}

function scrollUp(e) {
	if (scrollOffset < 0) {
		scrollOffset = scrollOffset + scrollViewerHeight;
		$('clients').tween('margin-top', scrollOffset);
		checkArrowVisibility();
	}
	return false;
}