;(function($) {
    // requires aria.js
	$(document).ready(function(){
		$(".tabbed").each(function(index){
			// get needed items
			var	_root = $(this),// get root handler
			
				// get count of all available tab roots
				_rootCount = index,
				
				// get items and add id to each item based on rootCount and item count
				_items = $("div.bd",_root).each(function(index){$(this).attr("id","tab_"+_rootCount+"_"+index)}),
				
				// get all possible titles:first-child within items
				_titles = $("h1,h2,h3,h4,h5,h6",_items).filter(":first-child");
			
			// -----------------------------------------------------------------------------------------
			// setup tabs
			var _tabs = "<ul class=\"tabs\"></ul>";
			
			// insert tabs after first title in _root and return tabs as jQuery object
			_tabs = $("> .hd",_root).filter(":first-child").after(_tabs).end().next("ul.tabs");
			
			// loop titles and push title-text into tabs
			_titles.each(function(index){
				// get text
				var _tabtext = $(this).text();
				
				// push text into tabs list and add link to item by id
				_tabs.append("<li><a href=\"#tab_"+_rootCount+"_"+index+"\">"+_tabtext+"</a></li>");
				
				// hide title
				$(this).addClass("hidden");
				
				// get current tab for later manipulation
				var _curtab = $("li",_tabs).eq(index);
				
				// check if current tab is first-child
				if (index===0) {
					_curtab.addClass("first");
				}
				
				// check if item is selected -> set active tab accordingly
				if ($(this).parent("div.bd").hasClass("selected")) {
					_curtab.addClass("selected");
				}
			});
			
			// add click events
			var _tablinks = $("a",_tabs).click(function() {
								toggleTabs(this);
								return false;
							})
							.keypress(function(event) {
								if(event.which === 13 || event.which === 32) {
									toggleTabs(this);
									return false;
								}
							});
			
			// -----------------------------------------------------------------------------------------
			// setup items on load
			if(!_items.hasClass("selected")) {
				_items.each(function(index) {
					// no "selected" item has been set
					// so we show the first child
					if(index===0) {
						$(this).addClass("selected");
						toggleTabs(_tablinks.eq(0));
					}
					else {
						$(this).addClass("hidden");
					}
				});
			}
			// only show the "selected" item
			else {
				_items.each(function(){
						if( !$(this).hasClass("selected") ) {
							$(this).addClass("hidden");
						}
					});
			}
			
			// -----------------------------------------------------------------------------------------
			// toggle function
			function toggleTabs(clicker) {
				// we only need the anchor, ie #tab_id
				// IE < 8 includes the full location in href, even if it's a simple anchor -> trim it!
				var _target = $(clicker).attr("href").substr($(clicker).attr("href").indexOf("#"),$(clicker).attr("href").length);
				
				// the clicked tab
				var _tab = $(clicker).parent("li").eq(0);
				
				// toggle tabs
				if(!_tab.hasClass("selected")) {
					_tablinks.parent("li").removeClass("selected");
					_tab.addClass("selected").find("a").focus();
				}
				
				// toggle items
				_items.addClass("hidden").removeClass("selected");
				$(_target).removeClass("hidden").addClass("selected");
			}
		});
	});
})(jQuery);