function getElementPosition(elemID){
	var offsetTrail = document.getElementById(elemID);
	var offsetLeft = 0;
	var offsetTop = 0;
	while (offsetTrail){
		offsetLeft += offsetTrail.offsetLeft;
		offsetTop += offsetTrail.offsetTop;
		offsetTrail = offsetTrail.offsetParent;
	}
	if (navigator.userAgent.indexOf('Mac') != -1 && typeof document.body.leftMargin != 'undefined'){
		offsetLeft += document.body.leftMargin;
		offsetTop += document.body.topMargin;
	}
	return {left:offsetLeft,top:offsetTop};
}



function gogo(url){
	window.location = url+'?x='+cur_x;
}

window.addEvent('domready', function(){





	var w = $('nav_portfolio').getElement('.container').getSize().x;
	var area = 990;
	var margin = 40;
	var area_real = area - margin*2;
	

	
	$('nav_portfolio').addEvent('mousemove', function(event){
		var x = event.page.x - getElementPosition('nav_portfolio').left;
		var d = (x-margin)/area_real;
		d = d<0 ? 0 : (d>1 ? 1 : d);
		var max_scroll = w - area;
		cur_x = Math.round(max_scroll*d);
	});
	
	var mymove = function(){
		if (Math.abs(cur_x-last_x) > 1){
			last_x = cur_x - (cur_x-last_x)*0.75;
			$('nav_portfolio').getElement('.container').style.left = (-(last_x)) + 'px';					
		}
	};
	mymove.periodical(35);
	
	var p_items = $(document.body).getElements('div.portfolio_item div.portfolio_img');
	for (var i=0; i<p_items.length; i++){
		p_items[i].myfx = new Fx.Tween(p_items[i], {transition: Fx.Transitions.Elastic.easeOut});
		p_items[i].addEvents({
			'mouseenter': function(){
				this.myfx.cancel();
				this.myfx.start('margin', '1px 0 10px');
			},
			'mouseleave': function(){
				this.myfx.cancel();
				this.myfx.start('margin', '5px 0 1px');
			}
		});
	}
	
	$(document.body).getElements('div.portfolio_item').addEvents({
		'mouseenter': function(){
			this.fade(1.0);
			this.getElement('div.portfolio_img').myfx.start('margin', '1px 0 10px');
		},
		'mouseleave': function(){
			this.fade(0.5);
			this.getElement('div.portfolio_img').myfx.start('margin', '5px 0 1px');
		}
	});
	
	$('portfolio_thumbs').getElements('li').addEvents({
		'mouseenter':function(){
			this.fade(1.0);
		},
		'mouseleave':function(){
			this.fade(0.5);
		}
	});

});