(function($){
	var tw_init = function(){
		var w = $(this).width(), h = $(this).height(), tw = $(this);
		var li = $('ul:first li', tw);
		tw.css({ position:'relative' });
		$('ul:first li a', tw).css({ width:'100%' })
		li.css({
			display:'block',
			width:Math.floor(w / li.length)+'px',
			float:'left'
		});
		
		var tp = $('._tab', this).position();
		
		$('._tab', tw).css({
			position:'absolute',
			top:li.outerHeight(true)+'px',
			left:'0px',
			width:'100%',
			height:h-li.outerHeight(true)+'px'
		}).each(function(){
			var pg = false, tab = $(this), pc = 0;
			var cont = $('<div></div>').appendTo(tab).css({ position:'relative', overflow:'hidden', width:'100%', height:'100%' });
			
			tab.append('<div class="_nav"><ul><li><a>a</a></li></ul></div>');
			var ah = h - li.outerHeight(true) - $('._nav', tab).outerHeight(true), th = 0;
			
			$('._row', this).each(function(){
				var rh = $(this).outerHeight(true) + ($.browser.msie && $.browser.version.substring(0, 3) < 8 ? 10 : 0);
				if(!pg || rh + th > ah) {
					pg = $('<div class="_page"></div>').appendTo(cont);
					pg.css({ position:'absolute', left:tab.width()*pc+'px', top:'0', width:tab.width()+'px' });
					th = 0;
					pc++;
				}
				th += rh;
				$(this).detach().appendTo(pg).addClass($('._row', pg).length % 2 ? '_odd' : '_even');
			});
			
			var html = '<ul>';
			html += '<li class="_prev"><a>Prev</a></li>';
			html += '<li class="_pc"></li>';
			for(var i = 1; i <= pc; i++)
				html += '<li class="_pn"><a>' + i + '</a></li>';
			html += '<li class="_next"><a>Next</a></li>';
			html += '</ul>';
			$('._nav', tab).html(html);
			
			$('._nav ._prev a', tab).click(function(){
				var pn = $('._nav ._pn a', tab);
				var cur = pn.index($('._nav ._pn a.current', tab));
				if(--cur >= 0)
					pn.eq(cur).click();
				return false;
			}).eq(0).click();

			$('._nav ._next a', tab).click(function(){
				var pn = $('._nav ._pn a', tab);
				var cur = pn.index($('._nav ._pn a.current', tab));
				if(++cur <= pn.length - 1)
					pn.eq(cur).click();
				return false;
			}).eq(0).click();

			$('._nav ._pn a', tab).click(function(){
				var pn = $('._nav ._pn a', tab);
				var idx = pn.index(this);
				var pg = $('._page', tab).eq(idx);
				$('div:first', tab).stop(true, true);
				var p = pg.position();
				$('div:first', tab).animate({ scrollLeft:'+='+p.left+'px' }, 'slow');
				pn.removeClass('current').eq(idx).addClass('current');
				$('._nav ._pc', tab).html('<span>' + (idx + 1) + ' of ' + pn.length + '</span>');
				if(idx == 0)
					$('._nav ._prev a', tab).addClass('disabled');
				else
					$('._nav ._prev a', tab).removeClass('disabled');
				if(idx == pn.length - 1)
					$('._nav ._next a', tab).addClass('disabled');
				else
					$('._nav ._next a', tab).removeClass('disabled');
				return false;
			}).eq(0).click();
		}).hide();
		
		$('ul:first li a', tw).click(function(){
			var idx = $('ul:first li a', tw).index(this);
			$('._tab:visible', tw).fadeOut();
			var tab = $('._tab', tw).eq(idx);
			tab.stop(true, true).fadeIn('normal');
			$('ul:first li a.current', tw).removeClass('current');
			$(this).addClass('current');
			// below is needed on chrome
			var idx = $('._nav ._pn a', tab).index($('._nav ._pn a.current', tab));
			var pg = $('._page', tab).eq(idx);
			var p = pg.position();
			if($('div:first', tab).length)
				$('div:first', tab)[0].scrollLeft += p.left;
			return false;
		}).eq(0).click();
	};
	
	$.fn.tab_widget = function(){
		this.each(tw_init);
	};
})(jQuery);

