var in_animated = false;
var pages = new Array('icons', 'os', 'pda', 'manage', 'xhtml', 'web', 'design');

var scroll_speed = 80;

function makeClickable(anchor) {
	var eKey;
	$A(pages).each(function(key) {
		if(anchor.hasClassName(key + '_link')) {
			eKey = key;
			throw $break;
		}
	});
	
	anchor.observe('click', function() {
		showPage(eKey);
	});
	
	anchor.onclick = function() {
		return false;
	}
}

var init = function() {
	$A(pages).each(function(key) {
		$A($$('.' + key + '_link')).collect(makeClickable);
	});
	
	window.onresize = function() {
		$('mwrapper').scrollTop = 0;
	};
}

var showPage = function(page) {
	if(in_animated) {
		return false;
	}

	in_animated = true;

	var offset = $(page).cumulativeOffset();
	var needScroll = offset[1] - $('mwrapper').scrollTop;
	var baseNeedScroll = $('mwrapper').scrollTop + needScroll;
	var timer;
	var i = 0;

	timer = window.setInterval(function() {
		if(baseNeedScroll == $('mwrapper').scrollTop) {
			window.clearTimeout(timer);
			in_animated = false;
			return ;
		}

		var scroll_i = needScroll * 0.10;

		if(i < 30) {
			needScroll -= scroll_i;
		}

		if(i > 40) {
			scroll_i = baseNeedScroll - $('mwrapper').scrollTop;
		}

		$('mwrapper').scrollTop = parseInt($('mwrapper').scrollTop) + scroll_i;
		i ++;

	}, 10);
}

document.observe("dom:loaded", function() {init()});