var scrollArea; //define this in the global scope

document.observe("dom:loaded", function() {
	
	$('mainContent').setStyle({
		"font-size": "11px",
		"line-height": parseFloat(11 * 1.45)+"px"
	}); //1.45em
	
	// set block size to line height
	blockSize = 77; //parseFloat($('mainContent').getStyle('lineHeight')); //why +7?
	
	var totalTargetHeight = blockSize;
	$('mainContent').select('.job-list-item').each(function(s) {
		totalTargetHeight += s.getHeight();
	});

	scrollArea = new ScrollArea('mainContent',
		{ 	"blockSize": blockSize,
			"blocksPreservedPerPage": 1,
			"width": 625,
			"height": 310,
			"totalTargetHeight": totalTargetHeight
		});

	listPages();

});

function listPages() {
	$('pagination').update('');
	for(var i=0; i<scrollArea.totalPages; i++) {
		//assumes the existence of a div with id="pagination"
		$('pagination').insert('<a href="javascript:setPage('+i+');">'+(i+1)+'<\/a> ');
	}
	$('pagination').down('a').addClassName('selected');
//	$('pagination').insert('<a href="javascript:scrollArea.gotoNextPage();"><img src="'+HttpRelativeFragmentsRoot+'wbc_js_classes/images/arrows/med_blue_arrow.gif" alt="&gt;" width="8" height="8" border="0" /></a>');
}

function setPage(page) {
	scrollArea.setPage(page);
	$('pagination').select('a.selected').each(function(s) {
		s.removeClassName('selected');
	});
	$('pagination').select('a')[page].addClassName('selected');
}