var flowWidth, itemW;
var itemWidth = 781;
var flowItems;
var overFlow, flowTimer;
$(document).ready(function() {
	flowWidth = $(".flow").width();
	flowItems = $(".inflow").children();
	len = flowItems.length;
	itemW = (flowWidth - itemWidth) / (len-1);
	flowItems.css("width", itemW);
	
	flowItems.eq(0).addClass("active");
	flowItems.eq(0).css("width", itemWidth);
	
	flowItems.hover(function() {
		overFlow = true;
		setFlowActive($(this).index());
	}, function () {
		overFlow = false;
		clearTimeout(flowTimer);
		flowTimer = setTimeout("nextFlow()", 3000);
	});
	
	flowTimer = setTimeout("nextFlow()", 3000);
});

function nextFlow() {
	clearTimeout(flowTimer);
	if(overFlow) {
		return false;
	}
	ai = $(".flow").find(".active").index();
	ai++;
	if(ai >= flowItems.length) {
		ai = 0;
	}
	setFlowActive(ai);
	flowTimer = setTimeout("nextFlow()", 3000);
}
function setFlowActive(num) {
	me = flowItems.eq(num);
	if(me.hasClass("active")) {
		return false;
	}
	flowItems.removeClass("active");
	me.addClass("active");
	flowItems.stop().animate({width:itemW}, 500, 'easeInOutQuad');
	me.stop().animate({width:itemWidth}, 400, 'easeInOutQuad');
}