(function($){
	var subs = null;
	var options = {};
	$.fn.floatNavigator = function(opts) {
		$.extend(options, opts);
		
		subs = $(options.subNavigator);
		
		this
			.each(function(index){
				// init position of subnavigators
				var subNavigator = subs.eq(index);
				var $this = $(this);
				var activeOffset = $this.position().left;
				if (subNavigator.width() + activeOffset > subs.parent().width()) {
					activeOffset = activeOffset - subNavigator.width() + $this.width();
				}
				if (activeOffset < 0) {
					activeOffset = (subs.parent().width() - subNavigator.width()) / 2;
				}
				subNavigator.css('left', activeOffset);
			})
			.mouseover(function(e){
				var $this = $(this);
				$this.addClass(options.activeClass)
					.siblings().removeClass(options.activeClass);
				var index = $this.index();
				// FIXME: test for empty subnavi
				if($this.attr('rel') != 'onelevel'){
					subs.eq(index).addClass(options.activeClass);
				}
				subs.eq(index).siblings(options.subNavigator).removeClass(options.activeClass);
			});
			return this;
	};
	
	$(function(){
		$('ul.main-navigator > li').floatNavigator({
			subNavigator: 'ul.sub-navigator',
			activeClass: 'active'
		});
	});
})(jQuery);